:root{font-family:Arial,Helvetica,sans-serif;color:#ede7d3;background:#061318;color-scheme:dark;--amber:#f3b277;--line:#3e5352;--mint:#b4f1d4}*{box-sizing:border-box}body{margin:0;overscroll-behavior:none}button,a,select{touch-action:manipulation}button,select{font:inherit;min-height:44px;border:1px solid #52635c;border-radius:5px;background:#152b30;color:#eee6cf;padding:9px 15px;cursor:pointer}button:hover{border-color:var(--amber);background:#233b3e}button:active,button.pressed{background:#3b5d59;transform:translateY(1px)}button:focus-visible,a:focus-visible,select:focus-visible,canvas:focus-visible{outline:3px solid #b4f1d4;outline-offset:3px}button:disabled{opacity:.46;cursor:default}a{color:#d9ba94}small{font-size:11px;letter-spacing:1.4px;color:#b5c1b9}#app{height:100dvh;display:flex;flex-direction:column;padding:max(0px,env(safe-area-inset-top)) max(0px,env(safe-area-inset-right)) max(0px,env(safe-area-inset-bottom)) max(0px,env(safe-area-inset-left));max-width:1440px;margin:auto;overflow:hidden;position:relative}header{height:58px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 22px;gap:12px}header .brand{font-size:14px;letter-spacing:2px;text-decoration:none;color:#f2e6d0;font-weight:bold}.brand span{font-size:10px;font-weight:normal;color:#99b2ad}.wordmark{font-size:12px;letter-spacing:4px}#menu{padding:7px 14px;min-width:84px}#flight{display:flex;flex-direction:column;min-height:0;flex:1}.telemetry{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 22px 6px;flex-shrink:0}.telemetry strong{display:block;font-size:18px;font-weight:500;margin-top:3px}.readout{display:flex;gap:24px;font:13px monospace;color:#f6c392}#objective{font:13px monospace;padding:5px 22px 8px;color:#beddd2;min-height:29px;flex-shrink:0}.field{position:relative;flex:1;min-height:0;overflow:hidden;background:#08181e}canvas{width:100%;height:100%;display:block;touch-action:none;outline:none}.edgehint{position:absolute;bottom:4px;left:0;right:0;text-align:center;pointer-events:none;font:9px monospace;letter-spacing:2px;color:#b4ccc5}.controls{flex-shrink:0;height:132px;display:flex;justify-content:center;align-items:center;gap:28px;padding:8px 20px;background:#0a1d23;border-top:1px solid var(--line)}#stick{width:112px;height:112px;min-height:112px;flex-shrink:0;border-radius:50%;position:relative;background:radial-gradient(circle,#27464a 0 19%,#142c32 20% 64%,#34504f 65% 66%,#11252c 67%);padding:0;touch-action:none;user-select:none}#stick .deadzone{position:absolute;width:32px;height:32px;border:1px dashed #7a9b96;border-radius:50%;top:39px;left:39px}#knob{display:block;position:absolute;width:34px;height:34px;border-radius:50%;border:2px solid #dfcaa4;background:#657e72;left:38px;top:38px;pointer-events:none;box-shadow:0 3px 9px #0008}.sticklabel{position:absolute;bottom:8px;left:0;right:0;font:8px monospace;pointer-events:none;color:#c8d3bb}.action{width:100px;height:100px;flex-shrink:0;border-radius:50%;border:2px solid #9cbcb0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;background:#193c40;touch-action:none;font:12px monospace}.action b{font-size:31px;font-weight:normal}.action span{font-size:11px}.action.cool{border-style:dashed;color:#b6bdb5}.controltext{font:11px monospace;color:var(--amber);line-height:1.5}.controltext small{font-size:10px;letter-spacing:0;color:#acb9b1}.manual{display:none}body.manualfire .manual{display:flex}body.manualfire .controltext{display:none}footer{padding:6px 10px;text-align:center;font-size:10px;line-height:1.3;flex-shrink:0;color:#99aca4}footer a{display:inline-block;color:#bfcabd;min-height:16px}.overlay{position:absolute;inset:58px 0 28px;background:#020e17b8;z-index:5;display:flex;align-items:center;justify-content:center;padding:18px;backdrop-filter:blur(5px)}.overlay[hidden]{display:none}.panel{background:#0c2027;border:1px solid #55615a;max-width:900px;width:100%;max-height:100%;overflow:auto;border-radius:8px;box-shadow:0 30px 80px #0009;padding:28px;scrollbar-color:#65796d #0c2027}.panel.cover{min-height:min(600px,100%);padding:32px;background:linear-gradient(90deg,#06151af5 3%,#06151aaf 48%,#06151a10),url('assets/cover-wide.webp') center/cover;display:flex;flex-direction:column;justify-content:space-between}.eyebrow{font:11px monospace;letter-spacing:3px;text-transform:uppercase;color:var(--amber)}h1{font-size:clamp(48px,8vw,86px);font-weight:900;line-height:.89;letter-spacing:-3px;margin:17px 0 20px;max-width:500px}h1 span{color:#f0b279}h2{font-size:28px;letter-spacing:-.6px;margin:10px 0 14px}h3{font-size:18px;margin:18px 0 9px}p{font-size:14px;line-height:1.55;margin:10px 0;color:#c0cec5}.lede{max-width:350px;font-size:15px;color:#eee5d3}.primary{background:#f0b279;color:#13282b;border-color:#f0b279;font-weight:bold}.primary:hover{background:#f7c793;color:#13282b}.buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.settings{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:18px 0}.settings label{font-size:12px;color:#c0cec5;display:flex;align-items:center;gap:8px}.settings select{max-width:180px}.tag{display:inline-block;border:1px solid #576d60;padding:5px 9px;font:11px monospace;color:#c8d8cb;border-radius:20px;margin-right:5px}.cover .buttons{max-width:530px}.missionbrief{padding:12px;border-left:2px solid var(--amber);background:#152e32;font:13px/1.5 monospace;color:#e9dbc4}.grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-top:15px}.level{min-height:70px;text-align:left;position:relative;font-size:11px;padding:9px}.level strong{font:17px monospace;display:block;margin-bottom:5px}.level.done{border-color:#8cae88}.level.current{border-color:#f2b77e}.collection{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.card{border:1px solid #425b54;border-radius:5px;padding:14px;background:#102a2e}.card h3{margin-top:0}.card p{font-size:13px}.card img{width:100%;border-radius:3px;aspect-ratio:1.5;object-fit:cover}.source{font-size:11px;color:#d5be9d;line-height:1.5}.source a{display:inline-flex;align-items:center;min-height:44px}.equipment{display:flex;gap:20px;align-items:center;background:#07191e;padding:12px;border:1px solid #36504e;border-radius:6px}.equipment canvas{width:150px;height:110px;flex-shrink:0}.equipment p{font-size:12px}.score{font:30px monospace;color:var(--mint)}.row{display:flex;justify-content:space-between;align-items:center;gap:12px}#storage{position:absolute;bottom:30px;right:10px;left:10px;padding:9px;background:#653a2a;color:#fff;font-size:12px;z-index:10}.guidekeys{display:grid;grid-template-columns:auto 1fr;gap:8px 20px;font-size:13px;color:#d3dfd5}.guidekeys dt{color:#f2b77e}.guidekeys dd{margin:0}.difficultyHelp{font:11px monospace;color:#acc3b7}.assistnote{font-size:11px;max-width:470px;color:#bdcfc7}
@media(max-width:600px){header{height:48px;padding:0 10px}.brand span,.wordmark{display:none}.telemetry{padding:7px 10px 3px}.telemetry strong{font-size:15px}.telemetry small{font-size:9px}.readout{gap:10px;font-size:11px}#objective{font-size:11px;padding:4px 10px 7px;min-height:26px}.controls{height:124px;gap:18px;padding:4px 10px}.controltext{font-size:10px}.controltext small{font-size:9px}.action{width:92px;height:92px}footer{font-size:9px;padding:4px 8px}.overlay{inset:48px 0 23px;padding:9px}.panel{padding:18px}.panel.cover{padding:22px 18px;background-image:linear-gradient(90deg,#06151af2,#06151a99 75%,#06151a66),url('assets/cover-portrait.webp');background-position:center}h1{font-size:58px;margin:12px 0 14px}h2{font-size:23px}.lede{font-size:13px;max-width:270px}.eyebrow{font-size:9px;letter-spacing:2px}.settings{gap:9px;margin:10px 0}.settings label{font-size:11px}.settings select{min-height:44px;padding:6px;max-width:143px}.buttons{gap:8px;margin-top:12px}.buttons button{padding:8px 11px;font-size:12px}.cover .tag{font-size:9px}.assistnote{font-size:10px}.grid{grid-template-columns:repeat(3,1fr);gap:7px}.level{min-height:72px}.collection{grid-template-columns:1fr}.equipment{gap:8px;padding:8px}.equipment canvas{width:110px;height:90px}.equipment p{font-size:11px}.guidekeys{font-size:12px;gap:8px 10px}}
@media(max-height:600px) and (orientation:portrait){.panel.cover{padding:18px}h1{font-size:50px;margin:10px 0}.lede{font-size:12px;margin:6px 0}.panel.cover .settings{margin:9px 0}.cover .assistnote{display:none}.cover .buttons{margin-top:8px}.tag{padding:3px 7px}.controls{height:116px}#stick{width:104px;height:104px;min-height:104px}#knob{left:34px;top:34px}#stick .deadzone{left:35px;top:35px}.controls{gap:14px}.action{width:88px;height:88px}body.manualfire .controls{gap:10px}body.manualfire #fire{width:72px;height:72px}}
@media(max-height:500px) and (orientation:landscape){header{height:44px;padding:0 12px}.brand span{display:none}.wordmark{font-size:10px}.overlay{inset:44px 0 20px;padding:7px}.panel{padding:16px;max-width:850px}.panel.cover{padding:17px 22px;min-height:100%;background-image:linear-gradient(90deg,#06151af2,#06151a99 63%,#06151a00),url('assets/cover-wide.webp');display:block}.cover h1{font-size:46px;margin:7px 0}.cover .lede{font-size:12px;margin:6px 0;max-width:340px}.cover .tag,.cover .assistnote{display:none}.cover .settings{position:absolute;right:30px;top:35px;width:170px;display:flex;flex-direction:column;align-items:stretch;gap:6px;margin:0}.cover .settings label{justify-content:space-between;font-size:11px}.cover .difficultyHelp{font-size:9px}.cover .buttons{margin-top:8px;max-width:100%;gap:7px}.cover .buttons button{font-size:11px;padding:6px 11px}.eyebrow{font-size:9px}.telemetry{height:40px;padding:3px 12px;grid-area:telemetry}.telemetry small{font-size:8px}.telemetry strong{font-size:14px;margin-top:2px}.readout{font-size:11px;gap:12px}#flight{display:grid;grid-template-columns:minmax(0,1fr) 125px;grid-template-rows:40px 25px minmax(0,1fr);grid-template-areas:'telemetry controls' 'objective controls' 'field controls'}#objective{grid-area:objective;font-size:10px;padding:3px 12px}.field{grid-area:field}.controls{grid-area:controls;flex-direction:column;height:auto;border-top:0;border-left:1px solid var(--line);padding:5px;gap:8px}#stick{width:92px;height:92px;min-height:92px}#knob{left:28px;top:28px}#stick .deadzone{left:29px;top:29px}.sticklabel{font-size:7px;bottom:4px}.action{width:78px;height:78px}.action b{font-size:23px}.action span{font-size:10px}.controltext{display:none}body.manualfire .controls{gap:4px}body.manualfire .manual{width:56px;height:44px;border-radius:7px;font-size:10px}body.manualfire .action:not(.manual){width:63px;height:63px}body.manualfire #stick{width:80px;height:80px;min-height:80px}body.manualfire #knob{left:22px;top:22px}body.manualfire #stick .deadzone{left:23px;top:23px}footer{font-size:9px;padding:3px}.edgehint{font-size:7px;letter-spacing:1px}.grid{grid-template-columns:repeat(5,1fr)}h2{font-size:22px;margin:5px 0 8px}.equipment{padding:4px}.equipment canvas{width:110px;height:70px}.equipment p{font-size:11px;margin:4px}.missionbrief{font-size:12px;padding:8px}.score{font-size:22px}.collection{grid-template-columns:repeat(2,1fr)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
header .brand{display:flex;align-items:center;min-height:44px}footer{min-height:44px;display:flex;align-items:center;justify-content:center;gap:3px;padding:0 5px}footer a{display:inline-flex;align-items:center;min-height:44px}.overlay{bottom:44px}#panel:not(.cover)>.buttons{position:sticky;bottom:-28px;background:#0c2027;padding:10px 0 3px;margin-bottom:-4px;z-index:2}details summary{min-height:44px;display:flex;align-items:center;cursor:pointer;color:#e0c6a0;font-size:13px}details summary::before{content:'＋';margin-right:8px}details[open] summary::before{content:'−'}
@media(max-width:600px){#panel:not(.cover)>.buttons{bottom:-18px}footer{font-size:8.5px}.equipment{flex-direction:column;align-items:flex-start}.equipment canvas{height:65px;width:115px}.equipment p{line-height:1.5}.equipment small{font-size:9px;letter-spacing:.5px}}
@media(max-height:500px) and (orientation:landscape){.equipment{flex-direction:row;align-items:center}footer{min-height:44px}.cover .settings{top:23px}.cover h1{font-size:40px}.cover .lede{font-size:11px}.cover .buttons{margin-top:4px}#panel:not(.cover)>.buttons{bottom:-16px}}
.controltext>span{display:block}
@media(max-height:500px) and (orientation:landscape){#flight{grid-template-columns:106px minmax(0,1fr) 116px;grid-template-rows:102px minmax(0,1fr);grid-template-areas:'telemetry field controls' 'objective field controls'}.telemetry{height:auto;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:9px 6px;gap:8px}.telemetry small{font-size:8px;letter-spacing:.6px}.telemetry strong{font-size:12px;line-height:1.25}.readout{font-size:10px;gap:8px}#objective{font-size:10px;line-height:1.6;padding:4px 6px;white-space:normal}.controls{gap:7px;padding:4px}.field{height:100%}.edgehint{font-size:6px;letter-spacing:.4px}}
.edgehint{display:none}
