@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--ink:#081d2b;--line:#294351;--yellow:#ffd75c;--muted:#91a9b6}*{box-sizing:border-box}body{margin:0;background:#081722;color:#f2f7f8;font-family:'DM Sans',system-ui,sans-serif;font-size:16px}main{max-width:1440px;margin:auto;padding:26px 48px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button *,.touch{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button:focus-visible,a:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}button:disabled{opacity:.4;cursor:default}header{display:flex;align-items:center;gap:24px;padding-bottom:24px;border-bottom:1px solid var(--line)}.brand{text-decoration:none;color:white;display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:2px;font-size:21px}.mark{background:var(--yellow);color:var(--ink);width:35px;height:35px;display:grid;place-items:center;font-size:28px;border-radius:3px}.edition{font-size:12px;letter-spacing:1px;font-weight:500;border-left:1px solid var(--line);padding-left:16px;color:var(--muted)}.location{margin-left:auto;font-size:13px;letter-spacing:1.3px;font-weight:700}.location span{color:var(--muted);margin-left:18px;font-weight:400}.small{color:#d2e1e7;background:#19313f;padding:10px 16px;border-radius:4px;font-size:14px;border:1px solid #3a5260}.command{display:flex;justify-content:space-between;align-items:center;padding:29px 0 24px}.eyebrow{color:var(--yellow);font-size:12px;letter-spacing:2px;font-weight:700}h1,h2{font-family:'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:-.5px}h1{font-size:42px;margin:8px 0 0;line-height:1.05}.mission{display:flex;flex-direction:column;text-align:right;gap:6px}.mission span{font-size:12px;color:var(--muted);letter-spacing:1.7px}.mission strong{font-size:18px}.game{border:1px solid #36505e;border-radius:8px;overflow:hidden;background:#102b3b;box-shadow:0 20px 60px #0003}.hud{display:flex;align-items:center;gap:46px;padding:18px 26px;background:#122c3b}.hud>div{min-width:104px;position:relative}.hud span{font-size:11px;letter-spacing:1.5px;color:#a0b5be;font-weight:700;display:block;margin-bottom:5px}.hud strong{font-size:26px;font-weight:600;font-variant-numeric:tabular-nums}.hud small{font-size:17px;color:var(--muted);font-weight:400}.hud button{margin-left:auto}.meter{position:absolute;width:53px;height:5px;background:#304c59;left:74px;bottom:11px;overflow:hidden}.meter i{height:100%;background:var(--yellow);display:block}.viewport{position:relative;aspect-ratio:1200/650;min-height:350px;overflow:hidden}canvas{width:100%;height:100%;display:block;object-fit:fill}.mapLabel{position:absolute;left:22px;top:20px;display:flex;flex-direction:column;gap:4px;pointer-events:none}.mapLabel b{font-size:12px;letter-spacing:2px}.mapLabel span{font-size:10px;color:inherit;letter-spacing:1.5px}.radio{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);background:#071c2be8;border:1px solid #547888;border-radius:4px;padding:12px 20px;font-size:14px;max-width:80%;text-align:center;pointer-events:none}.compass{position:absolute;right:24px;top:23px;line-height:1.2;color:#d6e8ea;text-align:center;font-size:13px;pointer-events:none}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#04172496;backdrop-filter:blur(3px);padding:24px}.overlay.hidden{display:none}.brief{max-width:490px;text-align:center;background:#0b2432f5;border:1px solid #59707b;padding:32px;border-radius:8px;box-shadow:0 24px 60px #0005}h2{font-size:48px;line-height:1;margin:13px 0 16px}.brief p{color:#bbd0da;line-height:1.6;margin:0 0 23px}.steps{text-align:left;border-top:1px solid #314b59;padding-top:16px;margin-bottom:25px;display:grid;gap:11px;font-size:14px}.steps div{display:flex;gap:17px}.steps b{font-size:12px;color:var(--yellow)}.primary{background:var(--yellow);color:#10222c;padding:14px 30px;font-weight:800;border-radius:4px;min-height:48px;box-shadow:0 3px 0 #c69d35}.primary:hover{background:#ffe28b}.note{display:block;margin-top:17px;font-size:12px;color:#8da6b4}.controls{padding:16px 24px;display:flex;gap:24px;align-items:center;background:#112a38;font-size:12px;color:#b5c6ce}.controls>div{display:flex;align-items:center;gap:8px}kbd{font-family:inherit;font-size:12px;border:1px solid #526775;border-radius:3px;padding:4px 7px;color:#f2f7f8;background:#1e3746;white-space:nowrap}.dockKey{background:var(--yellow);width:10px;height:10px}.tip{margin-left:auto;color:#90abb9}footer{display:flex;justify-content:space-between;gap:20px;color:#7995a5;font-size:12px;padding-top:21px}footer b{color:#b8ced8;font-size:10px;letter-spacing:1.3px;margin-right:15px}.touch{display:none;padding:14px 20px;justify-content:space-between;border-top:1px solid var(--line);background:#102735}.touch button{background:#294654;border:1px solid #60808e;color:white;min-width:48px;min-height:48px;border-radius:5px;touch-action:none;user-select:none;font-weight:700}.pad{text-align:center}.pad div{display:flex;gap:4px;margin-top:4px}.actions{display:flex;align-items:center;gap:10px}.actions button{background:#ffd75c;color:#0e2736;min-width:66px;font-size:12px;height:60px}@media(pointer:coarse){.touch{display:flex}}@media(max-width:800px){main{padding:18px 16px}.edition,.location,.tip{display:none}header{gap:10px;padding-bottom:18px}header .small{margin-left:auto}.brand{font-size:17px;letter-spacing:1px}.command{padding:23px 0 20px}h1{font-size:31px}.mission strong{font-size:14px}.mission span{font-size:10px}.eyebrow{font-size:10px}.hud{gap:14px;padding:14px}.hud>div{min-width:0;flex:1}.hud span{font-size:9px;letter-spacing:.6px}.hud strong{font-size:21px}.hud small{font-size:13px}.hud .small{font-size:12px;padding:8px}.meter{display:none}.viewport{aspect-ratio:auto;height:420px;min-height:0}.brief{padding:24px;max-width:390px}h2{font-size:38px}.brief p{font-size:14px;margin-bottom:15px}.steps{gap:9px;margin-bottom:20px}.controls{flex-wrap:wrap;gap:10px 16px;padding:12px;font-size:11px}.controls>div:last-of-type{display:none}footer{font-size:11px}footer>span:last-child{display:none}.radio{bottom:14px;max-width:90%;width:max-content;padding:10px 14px;font-size:12px}.mapLabel{left:14px;top:14px}.touch{display:flex}}

footer,footer *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
@media(pointer:coarse),(max-width:800px){.controls{display:none}}

.compass,.compass *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}

.touch{position:absolute;inset:0;z-index:1;align-items:flex-end;padding:12px;border:0;background:none;pointer-events:none}.touch .pad,.touch .actions{pointer-events:auto}.overlay{z-index:3}
@media(pointer:coarse),(max-width:800px){.radio{bottom:124px;z-index:2}}
@media(max-width:380px){.touch .actions{flex-direction:column;gap:6px}.touch .actions button{height:48px}}

.actionGroup{display:flex;flex-direction:column;align-items:center;gap:8px}.mobileScanStatus{font-size:12px;font-weight:600;color:#d4f5e0;text-align:center;white-space:nowrap;-webkit-user-select:none;user-select:none}
@media(pointer:coarse),(max-width:800px){.radio{bottom:12px;left:176px;right:166px;transform:none;width:auto;max-width:none;padding:10px 12px;overflow-wrap:anywhere}}
@media(max-width:600px){.touch .actions{flex-direction:column;gap:6px}.touch .actions button{height:48px}.radio{right:90px}}
@media(max-width:380px){.touch .pad{display:flex;flex-direction:column;gap:4px}.touch .pad div{flex-direction:column;margin:0}.radio{left:72px}}

.radio,.radio *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}

.viewport,.viewport *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}

html,body,body *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}

@media(pointer:coarse) and (max-width:600px),(pointer:coarse) and (max-height:500px){.touch button{background:rgb(41 70 84 / 70%)}.touch .actions button{background:rgb(255 215 92 / 70%)}}

@media(pointer:coarse) and (max-width:600px),(pointer:coarse) and (max-height:500px){.radio{background:rgb(7 28 43 / 70%)}}