/* Flight-recorder UI: cool metal and amber over the original ink-on-paper world. */
.play-page{--paper:#101f2a;--light:#19323f;--ink:#dce8e8;--muted:#a0b6be;--line:#3b5661;--cyan:#79ced0;--red:#ef997f;background:#101f2a;color:var(--ink)}
.play-page main{max-width:1700px;padding:10px 14px;gap:6px}
.play-page header{min-height:40px}.play-page h1{font-size:22px;letter-spacing:.06em}.play-page h1 span{font-size:13px;letter-spacing:.14em}.play-page header p{display:none}
.play-page nav button{padding:8px 11px;min-height:36px;font-size:12px}.play-page nav{gap:6px}
.play-page .game-shell{border-color:#46616b}.play-page .hud{background:#19323f;min-height:42px}.play-page .vitals>span{font-size:12px;letter-spacing:.12em}.play-page #health{background:#3b4b53}.play-page #health i{background:#8bcdca}.play-page #kills{font-size:12px;color:#9db9c2}.play-page .objective{gap:14px}.play-page .objective strong{font-size:12px;color:#7cc3c8;letter-spacing:.08em}.play-page .objective span{font-size:13px;color:#e3eded}
.play-page .stage{background:#dae3dc}.play-page .loadout{background:#19323f}.play-page .weapon-slot{background:#142b38;border-color:#3f5b66}.play-page .weapon-slot[aria-pressed=true]{background:#315562;border-color:#a4e0db}.play-page .weapon-slot img{filter:brightness(0) invert(.9) sepia(.08)}.play-page .weapon-slot .key{color:#8fa9b4}.play-page .weapon-slot .name{color:#d3e4e5}.play-page .weapon-slot[aria-pressed=true] .key{color:#a4e0db}.play-page .weapon-info{font-size:12px}.play-page #weapon-pros{color:#8dd3c9}.play-page footer{font-size:12px}.play-page .touch-controls button{background:#19323f}.play-page .touch-controls button:last-child{background:#8e3e3b;color:#fff}
.world-ui{position:absolute;inset:0;pointer-events:none;color:#173b49;font-size:12px;font-weight:700;letter-spacing:.08em}.world-ui #sector-label{position:absolute;left:16px;top:16px;max-width:65%;background:#ecf1e8dc;padding:8px 12px}.world-ui #compass{position:absolute;right:16px;top:16px;background:#173b49;color:#e1ece9;padding:8px 12px;letter-spacing:.04em}.world-ui #circuit-hud{position:absolute;left:16px;top:58px;background:#193b49;color:#b4e8d7;padding:8px 12px;font-size:12px;letter-spacing:.04em}
#boss-hud{position:absolute;top:16px;left:50%;transform:translateX(-50%);width:250px;padding:8px 12px;background:#19323f;color:#f3d0cd;text-align:center;font-size:12px;letter-spacing:.05em}#boss-hud>div{height:5px;background:#425260;margin-top:6px}#boss-health{display:block;height:100%;background:#cf6e7b}
#mission-hint{position:absolute;bottom:12px;left:16px;max-width:calc(100% - 32px);color:#183b48;background:#eaf0e5e8;font-size:12px;line-height:1.4;padding:8px 12px;pointer-events:none}
#interact{position:absolute;bottom:55px;left:50%;transform:translateX(-50%);max-width:calc(100% - 24px);background:#153846;color:#e5efea;border-color:#7bb9bf;box-shadow:0 2px 12px #00000030;font-size:13px;padding:10px 16px;min-height:40px}#interact:disabled{opacity:1;color:#d6caa8;cursor:default}
#radio{position:absolute;left:16px;bottom:60px;max-width:440px;width:calc(100% - 32px);padding:14px 36px 14px 16px;background:#17333ff5;color:#dfebea;border-left:3px solid #81ccca;box-shadow:0 4px 16px #00000030}#radio strong{font-size:12px;letter-spacing:.07em;color:#88cdca}#radio p{font-size:13px;line-height:1.55;margin:7px 0 0}#radio-close{position:absolute;top:5px;right:5px;min-height:28px;padding:2px 8px;font-size:20px;background:transparent;border:0;color:#c7d9df}
#radio:not([hidden])~.toast{top:60px}.play-page .toast{background:#193c49f5;border-left:3px solid #edc584;color:#e1eeeb;font-size:12px;z-index:5}
.play-page .mission{inset:0;width:auto;max-width:none;max-height:none;border:0;box-shadow:none;background:linear-gradient(90deg,#102735f5 0%,#102735ee 42%,#10273522 100%);padding:clamp(18px,4vw,64px);color:#e2eceb;overflow:auto;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;z-index:6}.play-page .mission[hidden]{display:none}.play-page .mission h2{font-size:clamp(36px,7vw,92px);letter-spacing:.035em;line-height:1;margin:12px 0 16px}.play-page .mission #menu-copy{font-size:clamp(14px,1.5vw,20px);line-height:1.45;max-width:480px;color:#b3d4d6;margin:0 0 12px}.play-page .mission #menu-detail{font-size:13px;color:#c9dcde;line-height:1.6;max-width:440px;margin:0 0 18px}.play-page .mission #menu-eyebrow{font-size:12px;letter-spacing:.18em;color:#b2cccb;line-height:1.5}.play-page .mission .primary{width:auto;min-width:230px;padding:12px 22px;min-height:44px;color:#122f3d;background:#e7c483;border:1px solid #f1d9b0;letter-spacing:.04em;margin:0}.play-page #new-mission{background:none;color:#c9dcde;border:0;padding:10px 0;min-height:36px;font-size:12px}.title-caption{font-size:12px;letter-spacing:.13em;color:#9cb7bd;margin-top:20px}
.play-page dialog{color:#deebeb;background:#152f3d;border:1px solid #557380;padding:24px;width:min(900px,calc(100vw - 24px));max-height:calc(100dvh - 24px);line-height:1.5}.play-page dialog::backdrop{background:#081820ba}.play-page dialog h2{font-size:22px;margin:0 0 16px;letter-spacing:.04em}.play-page dialog .primary{background:#75c2c5;color:#14323f;border-color:#9cd7d8}.play-page dialog p{color:#b9ced2;font-size:13px}.play-page #controls-dialog{background:#152f3d;color:#deebeb}.play-page #controls-dialog p{color:#b9ced2}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}.dialog-head h2{margin:0!important}.dialog-actions{display:flex;gap:12px;justify-content:flex-end}.play-page #restart-dialog{width:min(460px,calc(100vw - 24px))}#map-tabs{display:flex;gap:8px;margin:0 0 16px}#map-tabs button{flex:1;font-size:12px}#map-tabs [aria-pressed=true]{border-color:#8ed6d3;background:#29515d}#map-area{font-size:12px;letter-spacing:.06em}#map-image{border:1px solid #45606d;margin-top:8px;background:#132d39}#map-image svg{display:block;width:100%;max-height:280px}#map-dialog .map-legend{font-size:12px;margin:8px 0 16px}#map-objective{font-size:16px;color:#d4e9e8;margin-bottom:4px}#map-detail{margin-top:0}#journal{border-top:1px solid #45606d;padding-top:8px}#map-progress{font-size:12px!important;color:#85b6be!important}.play-page #controls-dialog{width:min(660px,calc(100vw - 24px))}
[hidden]{display:none!important}
@media(max-width:850px){.play-page .objective span{display:block;font-size:12px}.play-page .objective strong{display:none}.play-page .objective{justify-content:flex-start}.play-page .hud{gap:10px}.play-page #kills{font-size:12px}.play-page #health{width:90px}.play-page .vitals>span{display:none}}
@media(max-width:600px){.play-page main{padding:6px;gap:5px}.play-page header{min-height:32px;flex-wrap:nowrap;gap:5px}.play-page h1{font-size:16px}.play-page h1 span{display:none}.play-page nav{gap:4px}.play-page nav button{padding:8px 6px;min-height:32px;font-size:12px}.play-page .hud{padding:8px}.play-page #health{width:54px}.play-page #kills{font-size:12px}.play-page .objective span{font-size:12px}.play-page #hp{font-size:12px;min-width:20px}.play-page .mission{padding:20px}.play-page .mission h2{font-size:42px;margin:8px 0}.play-page .mission #menu-copy{font-size:14px;max-width:300px;margin:0 0 8px}.play-page .mission #menu-detail{font-size:12px;max-width:290px;margin-bottom:12px;line-height:1.4}.title-caption{margin-top:12px;font-size:12px}.play-page .mission .primary{min-height:40px;min-width:200px;padding:10px 16px}.world-ui #sector-label{left:8px;top:8px;font-size:12px;padding:8px}.world-ui #compass{right:8px;top:8px;padding:8px;font-size:12px}.world-ui #circuit-hud{left:8px;top:46px;padding:8px;font-size:12px}#mission-hint{left:8px;bottom:8px;font-size:12px;padding:8px;max-width:calc(100% - 16px)}#interact{bottom:56px;font-size:12px;padding:8px;line-height:1.4}#radio{left:8px;bottom:56px;padding:10px 30px 10px 12px;width:calc(100% - 16px)}#radio p{font-size:12px;line-height:1.4}#radio strong{font-size:12px}#boss-hud{top:45px;width:220px;padding:8px;font-size:12px}.play-page footer{font-size:12px}.play-page dialog{padding:16px}#map-tabs{gap:4px}#map-tabs button{padding:8px;font-size:12px}.dialog-head{gap:8px}.dialog-head h2{font-size:18px!important}.dialog-head button{font-size:12px}}
@container(max-height:290px){.play-page .mission #menu-detail{display:none}.play-page .mission h2{font-size:38px;margin:8px 0}.play-page .mission #menu-copy{font-size:13px;margin-bottom:10px}.play-page .title-caption{display:none}.play-page .mission{padding:16px}.play-page .mission .primary{padding:8px 18px;min-height:36px}.play-page #menu-eyebrow{font-size:12px}.play-page .mission #new-mission{padding:6px 0;min-height:30px}}
@container(max-height:190px){.play-page .mission{justify-content:center;flex-direction:row;align-items:center;flex-wrap:wrap;gap:10px}.play-page .mission #menu-copy,.play-page .mission #menu-eyebrow{display:none}.play-page .mission h2{font-size:28px;margin:0}.play-page .mission .primary{min-width:160px}.world-ui #sector-label{display:none}#mission-hint{display:none}}
@media(prefers-reduced-motion:reduce){.play-page #health i{transition:none}}
.ammo-count{position:absolute;right:8px;top:8px;color:#eccb90;font-size:12px;font-variant-numeric:tabular-nums;line-height:1}
@media(max-width:600px){.ammo-count{right:6px;top:auto;bottom:8px;font-size:12px;background:#142b38e6;padding-left:3px}.play-page .weapon-slot:has(.ammo-count) .name{justify-self:start;max-width:calc(100% - 16px)}}
@media(max-width:600px){.play-page nav{flex-shrink:1;min-width:0;flex-wrap:wrap}.play-page header{align-items:center}.play-page .objective{min-width:0}.play-page .objective span{overflow-wrap:break-word}.play-page #map-image{overflow-x:auto}.play-page #map-image svg{min-width:660px;max-height:none}.play-page #map-dialog .map-legend::after{content:' · Swipe the map to explore.'}}