@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&display=swap');
:root{font:16px 'DM Sans',sans-serif;color:#edf3ed;background:#101d28;--accent:#def2c5}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}#game{display:block;width:100vw;height:100dvh;touch-action:none;outline:none}#vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse,transparent 52%,#08131c55);opacity:.65}#fade{position:fixed;inset:0;pointer-events:none;background:#08131c;opacity:1;transition:opacity 2.5s}body.loaded #fade{opacity:0}#arrival{position:absolute;left:6vw;bottom:11vh;transition:opacity .6s;max-width:90vw;text-shadow:0 2px 20px #09131d}.eyebrow{font-size:12px;letter-spacing:3px;font-weight:500}h1{font-size:clamp(30px,4.2vw,64px);font-weight:400;letter-spacing:-2px;margin:15px 0}#arrival p{font-size:12px;letter-spacing:2px;color:#d3e1e2}#play{margin-top:22px;background:#11232c70;color:var(--accent);padding:13px 0;border:0;border-bottom:1px solid #d6e6d266;font-size:15px;min-width:245px;text-align:left;backdrop-filter:blur(5px)}#play span{float:right}#arrival small{display:block;font-size:12px;margin-top:15px;color:#d0d9d1a0}.playing #arrival{opacity:0;pointer-events:none}#pause-button{position:absolute;right:28px;top:24px;border:0;background:#12253344;color:#e4ece3aa;width:40px;height:40px;border-radius:50%;font-size:16px}#reticle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:15px;height:15px;border:1px solid #ffffff66;border-radius:50%;pointer-events:none;opacity:0}.playing #reticle{opacity:.7}#reticle i{position:absolute;top:6px;left:6px;width:1px;height:1px;background:white}.target #reticle{border-color:var(--accent);box-shadow:0 0 12px #def2c533}#anchor-label{position:absolute;left:50%;top:23px;transform:translateX(-50%);white-space:nowrap;font-size:12px;text-shadow:0 1px 6px #000;color:#e6f1d5}#tutorial,#toast{position:absolute;left:50%;bottom:12vh;transform:translateX(-50%);font-size:14px;letter-spacing:.3px;text-align:center;background:#14242da6;border-radius:3px;padding:11px 18px;backdrop-filter:blur(8px);pointer-events:none;max-width:85vw;transition:opacity .5s}#tutorial:empty{opacity:0}#toast{top:17vh;bottom:auto;opacity:0}.show#toast{opacity:1}#zone-name{position:absolute;bottom:35px;left:35px;font-size:12px;letter-spacing:2px;color:#ffffff99;text-transform:uppercase;opacity:0;transition:opacity 1s}#zone-name.show{opacity:1}#discovery{position:absolute;left:50%;top:14%;transform:translateX(-50%);text-align:center;pointer-events:none;opacity:0;transition:opacity .7s;text-shadow:0 2px 12px #000}#discovery.show{opacity:1}#discovery small{font-size:12px;letter-spacing:3px;color:var(--accent)}#discovery strong{display:block;font-size:28px;font-weight:400;margin-top:10px}#speed-display{position:absolute;bottom:30px;right:35px;text-shadow:0 2px 6px #000}#speed-display b{font-size:32px;font-weight:400}#speed-display span{font-size:12px;margin-left:9px;opacity:.6}#map-box{position:absolute;bottom:78px;right:30px;border:1px solid #ffffff33;background:#142b36c9}#map{display:block;width:220px;height:160px}#debug{position:absolute;top:15px;left:15px;padding:12px;background:#00131ce6;font:12px/1.6 monospace;white-space:pre;pointer-events:none}dialog{color:#edf3ed;background:#10212ce8;border:1px solid #a9bcc333;border-radius:4px;padding:35px;width:min(760px,94vw);max-height:92dvh;backdrop-filter:blur(22px)}dialog::backdrop{background:#07131c77;backdrop-filter:blur(5px)}.pause-header{display:flex;align-items:center;justify-content:space-between}h2{font-size:54px;letter-spacing:6px;margin:6px 0 22px;font-weight:400}.pause-header button,#reset{color:var(--accent);background:#d6edc40a;border:1px solid #d6edc455;padding:12px 17px;border-radius:2px;font-size:14px}.settings-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:35px}h3{font-weight:500;color:#c7d6da;font-size:12px;text-transform:uppercase;letter-spacing:2px;margin:23px 0 12px}.choices{display:grid;grid-template-columns:1fr 1fr;gap:7px}.choices button{color:#c3d1d7;background:transparent;border:1px solid #ffffff26;padding:10px 6px;font-size:14px}.choices button.selected{color:var(--accent);border-color:#d6edc488;background:#d6edc40c}select{width:100%;background:#1a303d;color:#e3eae7;padding:11px 8px;border:1px solid #ffffff26;font-size:14px}label{display:flex;align-items:center;gap:10px;justify-content:space-between;margin:18px 0;font-size:14px}label span{margin-left:auto;color:#8399a5;font-size:12px}input{accent-color:var(--accent)}input[type=range]{width:120px}dl{display:grid;grid-template-columns:1fr auto;gap:10px;font-size:14px}dt{color:#aebdc4}dd{margin:0}#landmark-list{display:flex;flex-direction:column;gap:7px;font-size:14px}#landmark-list span{color:#758b97}#landmark-list span.found{color:var(--accent)}#reset{width:100%;margin-top:20px}details{margin-top:20px;font-size:14px;color:#c3d0d5}summary{cursor:pointer}details p{font-size:14px;line-height:1.9}dialog footer{font-size:12px;line-height:1.7;color:#8199a7;border-top:1px solid #ffffff16;padding-top:20px;margin-top:25px}a{color:inherit}#loading{position:fixed;inset:0;background:#101d28;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:20}#loading span{font-size:20px;letter-spacing:8px}#loading p{font-size:13px;letter-spacing:1px;color:#8fa5b0}#touch-controls{display:none}@media(max-width:650px){.settings-grid{grid-template-columns:1fr;gap:0}dialog{padding:24px}h2{font-size:40px}#arrival{left:7vw;bottom:13vh}h1{letter-spacing:-1px}#zone-name{bottom:20px;left:20px}.eyebrow{font-size:12px;letter-spacing:2px}}@media(pointer:coarse){.playing #touch-controls{display:block}#joystick{position:absolute;bottom:40px;left:30px;width:105px;height:105px;border:1px solid #ffffff55;border-radius:50%;background:#10253133;touch-action:none}#joystick i{position:absolute;left:33px;top:33px;width:38px;height:38px;border-radius:50%;background:#ffffff44}.touch-buttons{position:absolute;bottom:35px;right:23px;display:flex;gap:8px;align-items:center}.touch-buttons button{border:1px solid #ffffff55;background:#10253177;color:#edf4e9;width:57px;height:57px;border-radius:50%;font-size:12px;touch-action:none}.touch-buttons #touch-web{width:72px;height:72px;color:var(--accent)}#tutorial{bottom:23vh}#speed-display{bottom:160px}#zone-name{bottom:165px}#map-box{bottom:210px}}
/* Operation Free City */
#arrival{top:8vh;bottom:auto;max-width:640px;padding:28px;background:linear-gradient(100deg,#08151de8,#08151d77 75%,transparent);border-left:2px solid var(--accent)}#arrival h1{font-weight:600;font-size:clamp(38px,5vw,72px);line-height:.98;margin:24px 0}#arrival .brief{font-size:15px;line-height:1.65;letter-spacing:0;max-width:440px}.drop-label{margin-top:25px}#drop-options{display:flex;gap:8px;margin:12px 0}#drop-options button{color:#e3eee7;background:#10212cbb;border:1px solid #ffffff33;padding:13px 12px;font-size:12px}#drop-options button.selected{background:var(--accent);color:#15212b;border-color:var(--accent)}#play{background:var(--accent);color:#10212c;padding:15px 18px;font-weight:600;min-width:300px;margin-top:6px}body.started #arrival{display:none}#mission-hud{position:absolute;top:30px;left:30px;width:290px;background:linear-gradient(90deg,#071820d9,transparent);padding:18px;border-left:2px solid var(--accent);display:none;pointer-events:auto}.playing #mission-hud{display:block}#mission-hud h2{font-size:24px;letter-spacing:-.5px;margin:12px 0 20px}#goals p{font-size:13px;color:#e2e9e8;margin:12px 0;display:flex;gap:12px}#goals span{color:var(--accent);font:12px monospace}#goals .done{color:#a4bc93}#mission-count{font:11px monospace;color:#a7bcb9;margin-top:22px}#city-map-button,.radio-controls button,#city-map button{border:1px solid #b8cdbb44;background:#152935;color:#e6f4e2;padding:9px 12px}#waypoint-label{color:#def2c5;font-size:12px;line-height:1.5;margin-top:14px}#radio{position:absolute;bottom:28px;left:30px;background:#081820cc;border:1px solid #c8e4d329;padding:14px 18px;min-width:280px;backdrop-filter:blur(14px);display:none}.playing #radio{display:block}#radio .eyebrow{font-size:9px;color:#b7d095}#track-title{display:block;margin-top:8px;font-size:16px}#track-artist{display:block;color:#a4b8bf;font-size:11px;margin-top:3px}.radio-controls{display:flex;gap:7px;align-items:center;margin-top:12px}.radio-controls button{padding:4px 10px}.radio-controls input{width:90px;margin-left:8px}#zone-name{left:350px}#city-map{width:min(1180px,96vw)}#city-map header{display:flex;align-items:center;justify-content:space-between;gap:20px}#city-map h2{font-size:34px;letter-spacing:-1px;margin:10px 0}#map-summary,.map-key{font-size:12px;color:#a6bdc4;line-height:1.6}.map-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px}#atlas{width:100%;max-height:60vh;object-fit:contain;background:#0a1722;touch-action:none;cursor:grab}#map-destinations{max-height:66vh;overflow:auto}#map-destinations button{display:block;width:100%;text-align:left;font-size:12px;margin-bottom:6px}.map-tools{display:flex;gap:7px;margin-top:8px}#agent-action{position:absolute;left:50%;top:60%;transform:translateX(-50%);background:#131928eb;padding:16px;border:1px solid #ff5789;width:280px;text-align:center}#agent-action span{display:block;font:10px monospace;color:#ff9dbb;margin-bottom:12px}#neutralize{width:100%;padding:12px;background:#ff5789;color:#160e19;border:0;font-weight:bold}#neutralize-progress{width:100%;height:4px;margin-top:8px;accent-color:#ff5789}@media(max-width:700px){#arrival{left:4vw;top:3vh;padding:18px;max-height:90vh;overflow:auto}#arrival h1{font-size:42px}#drop-options{flex-wrap:wrap}#mission-hud{top:14px;left:14px;padding:10px;width:225px}#mission-hud h2{font-size:18px;margin-bottom:10px}#goals p{font-size:11px}#radio{bottom:160px;left:14px;min-width:210px;padding:10px}#radio-volume{display:none}.map-layout{grid-template-columns:1fr}#map-destinations{max-height:180px}#city-map h2{font-size:25px}#atlas{max-height:40vh}.map-tools{flex-wrap:wrap}#zone-name{left:20px}}
#atlas{height:58vh;max-height:none;object-fit:fill}#map-destinations button.selected{border-color:var(--accent);color:var(--accent);background:#2d4034}@media(max-width:700px){#atlas{height:38vh;max-height:none}}
#cinematic{position:fixed;inset:0;z-index:8;background:linear-gradient(#050d18cc,transparent 28%,transparent 55%,#050d18f5);pointer-events:none;border-block:38px solid #030912}#cinematic[hidden]{display:none}.cinema-top{padding:20px 5vw;display:flex;justify-content:space-between;font:11px monospace;letter-spacing:3px}.cinema-top button{pointer-events:auto;background:#132434;color:#e9f2db;border:1px solid #fff5;padding:10px;letter-spacing:0}.cinema-copy{position:absolute;left:7vw;bottom:7vh;max-width:600px}.cinema-copy span{font:12px monospace;color:var(--accent);letter-spacing:3px}.cinema-copy h2{font-size:clamp(30px,5vw,60px);letter-spacing:-2px;line-height:1.05;margin:18px 0}.cinema-copy p{font-size:16px;line-height:1.6;max-width:460px}.in-cinematic #mission-hud,.in-cinematic #radio,.in-cinematic #control-strip,.in-cinematic #flight-instruments{visibility:hidden}#training{display:none;position:absolute;right:26px;top:88px;max-width:295px;background:#091a26e0;border-top:2px solid #aaddff;padding:16px;backdrop-filter:blur(12px)}.playing #training:not([hidden]):not(.dismissed){display:block}#training b{display:block;font-size:15px;margin-top:12px}#training p{font-size:13px;line-height:1.6;color:#c6d8df}#skip-training{font-size:10px;background:none;border:0;color:#a9bec8;padding:0}#perch-marker{position:absolute;transform:translate(-50%,-50%);color:#aaffdc;text-shadow:0 0 12px #07151c;font-size:33px;pointer-events:none}#perch-marker small{font:10px monospace;display:block;white-space:nowrap;position:absolute;left:50%;transform:translateX(-50%)}#flight-instruments{display:none;position:absolute;right:28px;bottom:90px;text-align:right;font:12px monospace;line-height:1.9;text-shadow:0 1px 5px #000}.playing #flight-instruments{display:grid}#flight-mode{color:#dcffb0;font-size:15px}#control-strip{display:none;position:absolute;bottom:0;left:0;right:0;padding:12px 24px;background:#081721e8;justify-content:center;gap:24px;font-size:11px;color:#c7d5da}.playing #control-strip{display:flex}kbd{font:10px monospace;border:1px solid #95b4c166;padding:3px 5px;margin-right:5px;color:#e5f2dc}#perch-button{font:inherit;color:#def2c5;background:none;border:0;padding:0}#perch-button:disabled{opacity:.4}#radio{bottom:65px}#tutorial{display:none}#touch-glide{display:none}#radio-mute{font-size:11px}.radio-controls{flex-wrap:wrap}#arrival small{line-height:1.8;max-width:440px}@media(max-width:760px){#training{top:280px;left:14px;right:auto;max-width:245px;padding:12px}#control-strip{gap:9px;padding:10px 6px;flex-wrap:wrap;font-size:9px}#radio{bottom:75px}#flight-instruments{right:16px;bottom:160px}.radio-controls input{width:60px}}@media(pointer:coarse){.playing #touch-glide{display:block;position:absolute;right:24px;bottom:112px;background:#183141;color:#def2c5;border:1px solid #def2c577;border-radius:50%;width:64px;height:55px;font-size:10px}#radio{bottom:190px}#training{top:265px;max-width:220px}#control-strip{display:none!important}}
.in-cinematic #reticle,.in-cinematic #toast{visibility:hidden}
#dispatch{position:absolute;right:26px;top:300px;width:260px;background:#0a202bdd;border-left:2px solid #5de9db;padding:14px;backdrop-filter:blur(12px)}#dispatch[hidden]{display:none}#dispatch .eyebrow{font-size:9px;color:#5de9db}#dispatch b{display:block;font-size:14px;margin-top:10px}#dispatch p{font-size:12px;line-height:1.5;color:#b9d3d7}#start-pursuit{background:#5de9db;color:#10232b;border:0;padding:9px 12px;font:11px monospace}#flow-score{position:absolute;left:50%;top:20%;transform:translateX(-50%);font:15px monospace;color:#cfff84;text-shadow:0 2px 10px #092326;pointer-events:none}.in-cinematic #dispatch{display:none}@media(max-width:760px){#dispatch{top:auto;right:14px;bottom:235px;width:205px}#dispatch p{font-size:11px}#dispatch .eyebrow{letter-spacing:1px}}@media(max-width:540px){#dispatch{right:10px;top:80px;bottom:auto;width:165px}#dispatch p{display:none}#mission-hud{width:190px}#training{max-width:190px}}
.radio-volume-label{display:grid;grid-template-columns:1fr auto;margin:12px 0 0;font-size:10px;gap:7px;color:#c1d5dd}.radio-volume-label input#radio-volume{display:block;width:100%;grid-column:1/-1;margin:0}.radio-volume-label output{font:11px monospace;color:#e6ffd1}.main-control{color:#e7ffc9;font-weight:600}#control-strip .main-control kbd{background:#dfffad;color:#172330;border-color:#dfffad}#arrival small b{color:#e4ffc5;font-size:14px;letter-spacing:1px}#training{border-top-color:#dcff99}#flow-score{font-size:12px}#radio{min-width:245px}#training-title{color:#e9ffd8}

.distance-setting{flex-wrap:wrap;gap:10px}.distance-setting input[type=range]{width:100%;accent-color:#acd9d3}.distance-setting output{margin-left:auto;color:#bad8d9}.setting-note{font-size:12px;line-height:1.5;color:#a5b9c1;margin:0 0 18px}

#flow-score{max-width:70vw;text-align:center;line-height:1.5}

/* Compact keyboard guide, anchored beside the flight view. */
#control-strip{left:auto;right:24px;bottom:24px;width:440px;padding:18px;gap:20px;align-items:center;justify-content:start;border:1px solid #d6e8ed26;border-radius:8px;background:linear-gradient(120deg,#05121ae8,#0d242de0);backdrop-filter:blur(12px);box-shadow:0 8px 30px #0003;font-size:10px}
#control-strip .movement-keys{flex:0 0 94px;text-align:center}
#control-strip kbd{display:inline-flex;align-items:center;justify-content:center;min-width:27px;height:25px;padding:0 6px;margin:0;color:#1c2633;background:linear-gradient(#fff,#dfe3ec);border:1px solid #f8faff;border-bottom:3px solid #939bac;border-radius:4px;box-shadow:0 2px 0 #5f687b;font:700 10px system-ui;white-space:nowrap;text-shadow:none}
#control-strip .movement-keys kbd{width:27px;height:30px;font-size:17px}
.movement-keys>div{display:flex;justify-content:center;gap:5px;margin-top:6px}.movement-keys small{display:block;margin-top:11px;font-size:9px;letter-spacing:2px;color:#c6d6dc}
.control-bindings{display:grid;grid-template-columns:1.2fr 1fr;gap:10px 13px;flex:1}.control-bindings>span,#control-strip #perch-button{display:flex;align-items:center;gap:7px;text-align:left;white-space:nowrap;color:#e2edf0;font-size:10px}#control-strip .main-control{color:#e5ffc5}
@media(pointer:fine){#flight-instruments{bottom:220px}#speed-display{bottom:295px}#map-box{bottom:355px}#radio{bottom:24px}}
@media(max-width:760px) and (pointer:fine){#control-strip{right:14px;bottom:14px;width:365px;padding:13px;gap:10px}.control-bindings{gap:9px 8px}.control-bindings>span,#control-strip #perch-button{font-size:9px;gap:5px}#control-strip .movement-keys{flex-basis:85px}#flight-instruments{bottom:220px}}
@media(max-width:650px) and (pointer:fine){#radio{bottom:235px;left:14px}#control-strip{max-width:calc(100vw - 28px)}}
