:root{font-family:system-ui,-apple-system,sans-serif;color:#e8eee4;background:#0b2831;color-scheme:dark;--orange:#ffbc70;--paper:#f1ecd9}*{box-sizing:border-box}body{margin:0;overscroll-behavior:none}button,a,select{touch-action:manipulation}button,select{font:inherit}button{border:1px solid #7aa0a7;border-radius:9px;color:var(--paper);background:#214f5a;min-height:44px;padding:8px 15px;font-weight:700;cursor:pointer}button:hover{background:#366672}button:active,.pressed{background:#ffbc70!important;color:#152e36!important;transform:translateY(1px)}:focus-visible{outline:3px solid #ffbd70;outline-offset:3px}button:disabled{opacity:.42;cursor:default}a{color:inherit}#app{height:100dvh;max-width:1080px;margin:auto;padding:max(6px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:5px}header{display:flex;align-items:center;gap:12px;min-height:44px}header a{font-size:11px;letter-spacing:1.8px;text-decoration:none;font-weight:800}header #saveStatus{font-size:11px;color:#aac4c7;margin-left:auto}header button{font-size:12px;padding:6px 12px}#game{min-height:0;flex:1;display:grid;grid-template-columns:minmax(0,1fr) 230px;grid-template-rows:auto auto minmax(0,1fr) auto;gap:5px 14px}#brief{display:flex;align-items:center;justify-content:space-between;grid-column:1/-1}small{font-size:10px;text-transform:uppercase;letter-spacing:1.8px;color:#a6c6c5}h1{font:800 24px/1.1 Georgia,serif;margin:2px 0;color:var(--paper)}#counter{font:700 13px ui-monospace,monospace;color:var(--orange)}#objective{grid-column:1/-1;font-size:13px;color:#d1dfd8;min-height:30px}#field{position:relative;min-height:0;background:#174653;border:1px solid #568089;border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center}canvas{max-width:100%;max-height:100%;aspect-ratio:800/660;object-fit:contain;touch-action:none;display:block}#gate{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0b2831e8;padding:22px;text-align:center;gap:8px}#gate h2{font:700 27px Georgia,serif;color:var(--paper);margin:0}#gate p{max-width:360px;font-size:15px;line-height:1.5;margin:5px 0}#gate button,.primary{background:#e9a658;color:#152e36;border-color:#ffc784}#readout{grid-column:1;font-size:12px;display:flex;justify-content:space-between;gap:10px;min-height:20px}#cargo{color:#ffca88;font-weight:700}#clock{color:#bcd1ce;font-variant-numeric:tabular-nums}#controls{grid-column:2;grid-row:3/5;align-self:center;display:flex;align-items:center;flex-direction:column;gap:16px}#pad{display:grid;grid-template:repeat(3,58px)/repeat(3,58px);gap:4px;touch-action:none}#pad button{font:700 27px/1 system-ui;padding:0;min-width:0}#pad [data-dir=up]{grid-area:1/2}#pad [data-dir=left]{grid-area:2/1}#pad [data-dir=right]{grid-area:2/3}#pad [data-dir=down]{grid-area:3/2}.padCenter{grid-area:2/2;display:grid;place-items:center;font-size:10px;letter-spacing:2px;color:#9ebdbd}#actions{display:grid;width:100%;gap:8px}#tow{border-color:#e9a658;min-height:53px}#tow span{font-size:11px;display:block;font-weight:400}#gear{font-size:11px;line-height:1.5;color:#afc8c8;text-align:center}footer{text-align:center;font-size:10px;color:#93b1b6;padding:2px;line-height:1.4}dialog{border:1px solid #6e8f93;border-radius:16px;background:#123641;color:#e8eee4;width:min(650px,94vw);padding:22px;max-height:90dvh;box-shadow:0 30px 100px #001a}dialog::backdrop{background:#001c27ca}dialog h2{font:800 31px Georgia,serif;margin:0 0 12px;color:#f1ecd9}dialog p{line-height:1.6;margin:10px 0}dialog .row{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0}dialog .row>*{flex:1}dialog label{display:block;font-size:13px;margin:14px 0 5px}dialog select{width:100%;min-height:44px;background:#214f5a;border:1px solid #71999d;border-radius:8px;padding:8px;color:inherit}dialog .cover{width:100%;max-height:225px;object-fit:cover;border-radius:9px}.eyebrow{font:700 11px system-ui;letter-spacing:2px;color:#c4d6cc}.stages{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.stages button{min-height:48px}.lore{border-top:1px solid #4a727c;margin-top:18px;padding-top:15px}.lore small{color:#ffbc70}.lore h3{margin:6px 0}.subtle{font-size:12px;color:#adc7c7}.danger{color:#ffcb92}.won{color:#ffce8e}#panelBody{min-width:0}#panelBody a{color:#ffca88}.hidden{display:none!important}
@media(max-width:700px) and (orientation:portrait){#game{grid-template-columns:1fr;grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:4px}#brief{grid-column:1}#objective{grid-column:1;font-size:12px;min-height:28px}#controls{grid-column:1;grid-row:5;flex-direction:row;justify-content:space-evenly;gap:12px}#pad{grid-template:repeat(3,52px)/repeat(3,52px);gap:3px}#actions{width:110px;gap:6px}#actions button{font-size:12px;padding:5px}#gear{font-size:10px}#readout{font-size:10px;min-height:18px}h1{font-size:21px}#gate h2{font-size:23px}#gate p{font-size:13px}header #saveStatus{font-size:9px}footer{font-size:9px}dialog{padding:18px}}
@media(max-height:650px) and (orientation:portrait){#pad{grid-template:repeat(3,48px)/repeat(3,48px)}#gear{display:none}header{min-height:44px}#objective{min-height:28px}#app{gap:2px}#game{gap:3px}footer{font-size:8px}}
@media(orientation:landscape) and (max-height:500px){#app{padding:4px 8px;gap:2px}header{min-height:44px;height:44px}header button{min-height:44px}#saveStatus{display:none}#game{grid-template-columns:minmax(0,1fr) 176px;grid-template-rows:31px minmax(0,1fr) 18px;gap:3px 9px}#brief{grid-column:1;grid-row:1}#brief small{display:none}h1{font-size:18px}#objective{grid-column:2;grid-row:1/2;font-size:10px;line-height:1.2;align-self:center}#field{grid-column:1;grid-row:2}#controls{grid-column:2;grid-row:2/4;gap:4px}#readout{grid-column:1;grid-row:3;font-size:10px}#pad{grid-template:repeat(3,46px)/repeat(3,46px);gap:3px}#pad button{font-size:23px}#actions{display:flex;gap:4px}#actions button{min-height:44px;font-size:10px;padding:4px;flex:1}#tow span{font-size:9px}#gear{display:none}footer{font-size:8px;padding:0}#gate{padding:8px;gap:2px}#gate h2{font-size:20px}#gate p{font-size:12px;margin:2px;line-height:1.3}#gate button{min-height:44px;padding:4px 12px}dialog{max-height:96dvh}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}button:active{transform:none}}
#gate.ready{inset:auto 8px 8px;flex-direction:row;flex-wrap:wrap;justify-content:space-between;padding:7px 10px;background:#102e38f0;border:1px solid #93b3af;border-radius:9px;text-align:left;gap:3px}#gate.ready h2{font:700 12px system-ui}#gate.ready p{display:none}#gate.ready button{font-size:12px;min-height:44px;padding:4px 10px}
#closePanel{position:sticky;top:0;float:right;z-index:5;min-width:76px;min-height:44px;background:#e4b36f;color:#123641;box-shadow:0 2px 8px #06232b80;margin:0 0 8px 10px}dialog .cover{clear:both}