/* Fly me to the moon v0.4.1 | 2026-10-22 */
:root{color-scheme:dark;font-family:'Noto Sans JP',sans-serif;background:#080e1c;color:#e7f4ff}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 90% 0,#123337 0,transparent 45%),#080e1c}button,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;border:1px solid #354658;border-radius:12px;background:#142133;padding:12px 14px;font-weight:600}button:active{transform:scale(.97)}button:focus-visible,summary:focus-visible{outline:2px solid #73f3cd;outline-offset:3px}[hidden]{display:none!important}.app{max-width:480px;margin:auto;padding:max(20px,env(safe-area-inset-top)) 16px max(18px,env(safe-area-inset-bottom))}.eyebrow{font-size:9px;letter-spacing:2px;color:#76ddc7}.heading{display:flex;align-items:center;justify-content:space-between}h1{font-size:28px;margin:5px 0 0;letter-spacing:2px}h1 span{display:block;font-size:11px;letter-spacing:6px;color:#8698b0;margin-top:2px}.version{font-size:10px;color:#7b8da3}header p{font-size:12px;color:#a6b8ca;margin:12px 0 18px}nav{display:grid;grid-template-columns:1fr 1fr;gap:8px}nav button{font-size:13px;padding:10px 5px;background:#0e1928}nav span{display:block;font-size:9px;color:#8ca2b4;margin-top:4px}nav .selected{border-color:#64e6c3;background:#12342f;color:#9affdc}.dashboard{display:flex;align-items:center;justify-content:space-between;margin:18px 0 10px;font-size:10px;color:#90a8c3}.dashboard strong{font-size:13px;color:#eaf7ff}#clock{font-variant-numeric:tabular-nums;min-width:54px;text-align:right}.arena{position:relative;aspect-ratio:1;background:#0d1726;border:1px solid #2d4255;border-radius:20px;overflow:hidden;box-shadow:0 15px 50px #0005}canvas{width:100%;height:100%;display:block;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#banner{position:absolute;inset:40% 0 auto;text-align:center;font-size:25px;font-weight:800;letter-spacing:4px;pointer-events:none;text-shadow:0 3px 15px #000;background:#081322b0;padding:14px}#message{min-height:42px;font-size:12px;line-height:1.7;color:#b5c9db;margin:14px 3px 10px}.actions{display:flex;gap:8px;flex-wrap:wrap}.actions button{flex:1;font-size:12px;white-space:nowrap}#next{background:#65e7c2;color:#05231c;border-color:#65e7c2}details{margin-top:18px;padding:12px 14px;border:1px solid #223347;border-radius:12px;font-size:11px;color:#9bb0c7}summary{cursor:pointer;color:#c6d9e9}details p{line-height:1.9}footer{text-align:center;color:#526a80;letter-spacing:3px;font-size:8px;margin-top:20px}dialog{background:#111e30;color:#edfaff;border:1px solid #4a6b83;border-radius:16px;width:min(90vw,420px)}dialog::backdrop{background:#000a}dialog h2{font-size:16px}textarea{width:100%;height:140px;background:#091321;color:#e5f3ff;border:1px solid #426079;padding:12px;border-radius:8px}dialog p{font-size:12px}@media(max-height:740px){.app{padding-top:12px}header p{margin:8px 0 12px}h1{font-size:24px}.dashboard{margin-top:12px}#message{margin-top:10px}details{margin-top:12px}}

/* v0.4.1: extended campaign, replay and assistance */
.level-info{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#86b4c5;margin:0 3px 8px;min-height:16px}#assist{color:#082c22;background:#7ef0bc;padding:2px 8px;border-radius:6px;font-size:9px;letter-spacing:1px}.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}#replay{border-color:#508b9e;color:#a9e9ee}#banner{font-size:clamp(17px,5.5vw,25px)}

.route-result{margin-top:18px;border:1px solid #30465b;border-radius:14px;padding:14px;text-align:center;background:#101d2b}.route-result h2{font-size:13px;margin:0 0 12px;color:#cee9e9}.route-result canvas,.route-result img{display:block;width:min(100%,260px);height:auto;margin:0 auto;border-radius:8px}.route-result p{font-size:10px;color:#91adbf;line-height:1.6}.save-route{display:inline-block;padding:9px 14px;border:1px solid #4b777f;border-radius:8px;color:#b4f1df;font-size:12px;text-decoration:none}

/* v0.4.1: earth → moon space theme */
:root{background:#080b1b}body{background:radial-gradient(ellipse at 95% 0,#252b52 0,transparent 48%),#080b1b}.app{padding-top:max(14px,env(safe-area-inset-top))}.eyebrow{color:#c0c8ff;letter-spacing:2.6px}.heading{gap:8px}h1{font-family:Georgia,serif;font-weight:500;font-size:clamp(24px,6.8vw,32px);letter-spacing:-.8px}h1 span{font-family:sans-serif;font-size:9px;letter-spacing:1.4px;color:#9caec8;margin-top:8px}.version{flex-shrink:0}.arena{background:#080c20;border-color:#3b456b;box-shadow:0 15px 50px #03050e88}nav .selected{border-color:#a8b6f5;background:#252b4c;color:#e1e6ff}header p{color:#b3bdd5;font-size:11px}#next{background:#bec8ff;color:#1e2540;border-color:#bec8ff}.route-result{background:#141b32;border-color:#3d4969}.save-route{color:#d2d9ff;border-color:#7381af}footer{color:#6e7ba2}button:focus-visible,summary:focus-visible{outline-color:#b3c1ff}

/* v0.4.1: all 22 stages are selectable from the beginning */
.stage-picker{display:flex;align-items:center;gap:12px;margin-top:12px;color:#bfcbe4;font-size:11px}.stage-picker span{flex-shrink:0}.stage-picker select{flex:1;min-width:0;background:#171e36;color:#e5eaff;border:1px solid #52618b;border-radius:10px;padding:10px 8px;font:inherit;font-size:16px;touch-action:manipulation}.stage-picker select:focus-visible{outline:2px solid #b3c1ff;outline-offset:2px}
