@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--accent:#ffb15f;--blue:#71d7ff;--bg:#11141a;--edge:#ffffff22;--ink:#fff0dc;--muted:#c2c1bc}*{box-sizing:border-box}body,html{margin:0;width:100%;height:100%;overflow:hidden;background:#10141b;color:var(--ink);font-family:'DM Sans',Arial,sans-serif}button{font:inherit;cursor:pointer}button:focus-visible{outline:2px solid #ffd8aa;outline-offset:3px}#render-root,#render-root canvas{width:100%;height:100%;display:block}#reticle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#ffecce7d;font-size:21px;pointer-events:none;text-shadow:0 0 20px #000}.hud{position:absolute;z-index:4}.hidden{display:none!important}header.hud{top:0;left:0;right:0;display:flex;align-items:flex-start;justify-content:space-between;padding:22px 34px;gap:14px;pointer-events:none}.brand{display:flex;flex-direction:column;gap:3px;text-shadow:0 1px 15px #050609}.brand strong{font-family:'Barlow Condensed',Impact,sans-serif;font-size:32px;font-weight:800;letter-spacing:2px;line-height:1}.brand strong b{color:var(--accent)}.brand span{font-size:10px;letter-spacing:2.8px;font-weight:700;color:#d6d3ce}.brand span i{color:var(--accent)}.hud-right{display:flex;align-items:center;gap:13px;pointer-events:auto}.clock{display:flex;flex-direction:column;align-items:flex-end;font-size:9px;letter-spacing:2px;color:#f9cb9a}.clock strong{font-size:14px;letter-spacing:1px;color:white;margin-top:3px}.world-badge{font-family:'Barlow Condensed';font-size:15px;letter-spacing:2px;border:1px solid #f6b36b80;padding:7px 13px;background:#382114a8}.world-badge span{display:block;font-size:10px;color:#f7b667}.icon-btn{height:32px;width:34px;border:1px solid #ffffff44;background:#0008;color:white}.card{background:linear-gradient(135deg,#0b1016eb,#151720d9);border:1px solid #ffffff26;box-shadow:0 12px 40px #0007;backdrop-filter:blur(12px)}.mission{left:32px;top:110px;width:min(318px,calc(100% - 64px));padding:20px 21px}.micro,.chapter-label{font-size:10px;font-weight:800;letter-spacing:3px;color:var(--accent)}.micro{display:flex;justify-content:space-between}.micro span{color:#afafaf}.mission h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:29px;letter-spacing:.6px;line-height:1.1;margin:12px 0}.mission p{font-size:12px;line-height:1.6;color:#c2c6cd;min-height:38px}.track{height:3px;background:#4d4c4c;margin:17px 0 11px}.track>div{height:100%;background:linear-gradient(90deg,#d77e36,#ffd5a0);width:12.5%;transition:width .3s}.mission-footer{display:flex;justify-content:space-between;align-items:center;gap:8px}.mission-footer span{font-size:10px;color:#d3a77d;letter-spacing:1px}.link-btn{border:none;color:#eee;background:transparent;font-size:9px;font-weight:800;letter-spacing:1px;padding:5px 0}.inventory{right:33px;top:106px;display:flex;gap:9px}.inventory>div{display:flex;flex-direction:column;align-items:flex-end;gap:4px;padding:9px 13px;background:#121215ba;border:1px solid #ffffff29;min-width:82px}.inventory small{color:#c8c4c1;font-size:9px;letter-spacing:1.2px}.inventory strong{font-size:14px;color:#ffc079}.controls{bottom:24px;left:50%;transform:translateX(-50%);display:flex;gap:17px;align-items:center;padding:10px 16px;background:#080b10b8;border:1px solid #ffffff1b;white-space:nowrap;font-size:10px;color:#d4d6d8;letter-spacing:1px}.controls span{display:flex;align-items:center;gap:4px}kbd{display:inline-grid;place-items:center;font-family:'Barlow Condensed';font-weight:700;font-size:12px;min-width:19px;height:19px;padding:0 5px;border:1px solid #ffffff51;border-bottom:2px solid #ffffff65;color:#fff;background:#131c26}.prompt{bottom:100px;left:50%;transform:translateX(-50%);padding:13px 20px;display:flex;align-items:center;gap:12px;background:#101318e9;border:1px solid #f9af6f94;box-shadow:0 0 38px #fca45b18;letter-spacing:1px;font-size:11px}.prompt kbd{border-color:#ffbc78;color:#f7bd79}.notify{top:90px;left:50%;transform:translateX(-50%) translateY(-10px);opacity:0;transition:opacity .2s,transform .2s;background:#131920dc;border:1px solid #eaaa6887;font-size:12px;padding:12px 19px;pointer-events:none;text-align:center;max-width:520px}.notify.on{opacity:1;transform:translateX(-50%) translateY(0)}.dialogue{bottom:84px;left:50%;transform:translateX(-50%);min-width:min(560px,90%);max-width:720px;background:#0b1119e8;padding:13px 22px 16px;border-left:2px solid var(--accent);box-shadow:0 13px 35px #000a}.dialogue span{font-family:'Barlow Condensed';font-size:12px;letter-spacing:2px;color:var(--accent)}.dialogue p{font-size:16px;line-height:1.5;margin:4px 0 0}.overlay{position:absolute;z-index:8;inset:0;background:linear-gradient(90deg,#090d12fc 0%,#0d1119ed 44%,#10151dcc 100%);overflow-y:auto;display:flex;align-items:center;justify-content:center}.title-sky{position:absolute;inset:0;background:radial-gradient(ellipse at 78% 45%,#ba562a27,transparent 47%),radial-gradient(ellipse at 90% 0%,#183a5688,transparent 48%),linear-gradient(120deg,#0a1118,#0c1118);pointer-events:none}.title-sky:after{content:'';position:absolute;inset:0;opacity:.22;background:repeating-linear-gradient(90deg,transparent 0 3px,#ffffff08 4px)}.start-inner{width:min(790px,90vw);position:relative;padding:40px 0}.start-inner h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(88px,15vw,170px);font-weight:800;line-height:.9;letter-spacing:5px;margin:30px 0 0;text-shadow:3px 5px 0 #712b23,0 0 50px #e66a3440}.start-inner h1 em{font-style:normal;color:#e99d50}.start-inner h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(24px,4vw,43px);letter-spacing:8px;margin:9px 0 0;font-weight:500}.title-rule{height:2px;width:75px;background:var(--accent);margin:26px 0 22px}.tagline{font-family:'Barlow Condensed';font-size:clamp(19px,3vw,29px);line-height:1.25;letter-spacing:1.1px;margin:0;color:#f9dbb6}.intro{font-size:13px;color:#c0c3ca;line-height:1.9;max-width:640px;margin:20px 0 25px}.start-actions{display:flex;gap:12px;flex-wrap:wrap}.primary-btn,.secondary-btn{border:1px solid #c07c43;background:#cf813c;color:#14100a;font-weight:800;font-size:12px;letter-spacing:1.6px;padding:14px 24px;transition:background .2s}.primary-btn:hover{background:#ffb45e}.secondary-btn{background:#080b1163;border-color:#ffffff69;color:#e9e8e7}.secondary-btn:hover{background:#39404c}.primary-btn span{margin-left:35px}.start-bottom{margin-top:48px;font-size:9px;letter-spacing:2px;color:#989da3}.cinematic-bars{position:absolute;inset:0;z-index:5;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between}.cinematic-bars>div{height:0;background:#08080c;transition:height .5s ease}.cinematic-bars.on>div{height:7%}.cinematic{z-index:7;inset:0;pointer-events:none}.cinematic-top{display:flex;justify-content:space-between;padding:23px 38px;font-size:11px;letter-spacing:3px;color:#f3d2b0}.cinematic-content{position:absolute;bottom:11%;left:10%;width:min(630px,80vw);pointer-events:auto}.cinematic-content>div{font-size:11px;color:#f9bb79;letter-spacing:3px;font-weight:800}.cinematic-content>p{font-family:'Barlow Condensed';font-weight:500;font-size:clamp(25px,3.2vw,41px);line-height:1.13;text-shadow:0 3px 14px black;margin:8px 0 23px}.cinematic-content small{margin-left:13px;font-size:9px;letter-spacing:1px;color:#eee}.journal-shell{width:min(1030px,94vw);padding:30px;background:#121923f9;border:1px solid #ffffff31;box-shadow:0 15px 70px #000b}.journal-header{display:flex;justify-content:space-between}.journal-header h2{font-family:'Barlow Condensed';font-size:49px;margin:6px 0 18px}.journal-columns{display:grid;grid-template-columns:1fr 1fr;gap:38px}.journal-left{max-width:450px}.journal-left h3{color:#fbc089;font-size:10px;letter-spacing:2px;margin:16px 0 8px}.journal-left p{font-size:13px;line-height:1.8;color:#d8d6d3}.journal-objective{padding:14px;background:#202c37;border-left:2px solid #f2a75b;font-size:13px;line-height:1.8}.fine{color:#a8b2bd!important}.chapter{padding:12px 16px;border:1px solid #ffffff18;background:#0c1119;margin-bottom:8px;display:flex;flex-direction:column;gap:4px;opacity:.6}.chapter.active{opacity:1;border-color:#d38b4f94;background:#302015}.chapter span{font-size:10px;letter-spacing:1.5px;color:#ffc28a}.chapter strong{font-family:'Barlow Condensed';font-size:21px;letter-spacing:1.1px}.chapter small{font-size:11px;color:#ced1d4}.journal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.end-card{padding:45px;width:min(720px,90vw);background:#12161de9;border:1px solid #dba2667d}.end-card h1{font-family:'Barlow Condensed';font-size:clamp(38px,5vw,65px);line-height:1.05;letter-spacing:1px;margin:16px 0}.end-card h1 span{color:#f1ad72}.end-card p{max-width:620px;font-size:14px;line-height:1.8;color:#d4d1ce}.end-card blockquote{font-size:21px;font-style:italic;color:#ffdbb8;border-left:2px solid #e9a568;padding-left:17px;margin:24px 0}.end-note{color:#a1bddd!important}.end-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}.end-card>small{font-size:10px;letter-spacing:2px;color:#b8c2c7}#screen-fade{position:absolute;inset:0;background:#f5c99d;z-index:6;pointer-events:none;opacity:0;transition:opacity .3s}#mobile-ui{display:none}@media(max-width:850px){.mission{top:95px;left:13px;width:min(286px,calc(100% - 26px));padding:12px}.mission h2{font-size:23px}.inventory{right:12px;top:82px;gap:3px}.inventory>div{padding:5px;min-width:63px}.inventory small{font-size:7px}.inventory strong{font-size:11px}.controls{display:none}.hud-right .clock{display:none}.brand strong{font-size:23px}.brand span{font-size:8px}.world-badge{font-size:12px}.dialogue{bottom:135px}.prompt{bottom:159px}#mobile-ui{display:flex;justify-content:space-between;align-items:end;left:15px;right:15px;bottom:15px;pointer-events:none}.touch-pad,.touch-actions{pointer-events:auto}.touch-pad{text-align:center}.touch-pad button,.touch-actions button{width:47px;height:45px;background:#14202acb;border:1px solid #ffffff44;color:white}.touch-actions{display:flex;gap:6px}.touch-actions button{border-color:#f3a7658a}.journal-columns{grid-template-columns:1fr;gap:4px}.journal-shell{height:90vh;overflow-y:auto;padding:19px}.journal-header h2{font-size:31px}.start-inner h1{font-size:90px}}@media(max-height:570px){.mission{top:65px}.inventory{top:65px}.controls{bottom:6px}.dialogue{bottom:57px}} 

/* v1.1 objective widget: compact, draggable and collapsible. */
.mission{position:fixed;left:18px;top:108px;width:min(264px,calc(100vw - 32px));padding:0 12px 10px;z-index:6;max-height:calc(100dvh - 15px)}
.mission-grip{display:flex;align-items:center;gap:8px;margin:0 -12px;padding:9px 9px 8px 11px;cursor:grab;user-select:none;touch-action:none;border-bottom:1px solid #ffffff18;min-height:38px}
.mission.dragging .mission-grip{cursor:grabbing}
.mission-grip .micro{flex:1;letter-spacing:1.5px;font-size:9px;white-space:nowrap}
.grip-dots{font-size:15px;letter-spacing:-5px;color:#a9acb2;margin-right:5px;opacity:.9}
.mission-actions{display:flex;align-items:center;gap:10px;font-size:10px;color:#bcc3ce;white-space:nowrap}
#mission-toggle{height:25px;width:26px;display:grid;place-items:center;font-size:17px;color:#f7cc99;background:#27303b;border:1px solid #ffffff27;padding:0;cursor:pointer}
.mission h2{font-size:22px;line-height:1.05;margin:9px 0 6px;letter-spacing:.2px}
.mission p{font-size:11px;line-height:1.45;min-height:unset;margin:6px 0 8px}
.mission .track{margin:10px 0 9px;height:2px}
.mission-footer span{font-size:9px;letter-spacing:.5px}
.mission-footer .link-btn{font-size:9px}
.mission.collapsed{padding-bottom:8px}
.mission.collapsed h2{margin-bottom:0;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mission.collapsed p,.mission.collapsed .track,.mission.collapsed .mission-footer{display:none}
@media(max-width:850px){.mission{width:min(240px,calc(100vw - 24px));left:12px;top:88px;padding:0 10px 8px}.mission-grip{margin:0 -10px}.mission h2{font-size:19px}}

/* Story shots retain only their cinematic captions and controls. */
body.in-cinematic .hud:not(.cinematic){visibility:hidden}
body.in-cinematic #reticle{visibility:hidden}
.cinematic-content{background:linear-gradient(90deg,#090d14dc,#090d1466,transparent);padding:18px 22px;border-left:2px solid #f9bb79}
#load-error{z-index:20}
button:disabled{opacity:.45;cursor:wait}

.voice-btn{font:inherit;font-size:9px;letter-spacing:.7px;color:#dcecff;background:#1b3047;border:1px solid #77b3e366;padding:8px;cursor:pointer}.voice-btn[aria-pressed="false"]{opacity:.65}

/* ---- Level 1 revamp: minimap, spark chip, recording indicator, screen grade ---- */
.side-hud{right:33px;top:106px;display:flex;flex-direction:column;gap:9px;align-items:flex-end}
#minimap{display:block;border:1px solid #ffffff2e;background:#0b121cc9;box-shadow:0 12px 36px #0008;border-radius:3px}
.spark-chip{font-family:'Barlow Condensed',Impact,sans-serif;font-size:14px;letter-spacing:2px;color:#ffd9a0;background:#3c2412d9;border:1px solid #f6b36b80;padding:7px 12px;text-shadow:0 0 12px #ff9c3c}
.rec{top:72px;left:50%;transform:translateX(-50%);font-family:'Barlow Condensed',Impact,sans-serif;font-size:17px;letter-spacing:3px;color:#ff9598;background:#2a0d12cc;border:1px solid #ff5c6477;padding:7px 16px;animation:recblink 1s steps(2) infinite}
@keyframes recblink{50%{color:#ffd7d8;border-color:#ff5c64cc}}
#grade{position:fixed;inset:0;z-index:3;pointer-events:none;background:radial-gradient(ellipse at center,transparent 52%,rgba(4,6,11,.62) 100%)}
#grade::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.016) 0 1px,transparent 1px 3px);mix-blend-mode:overlay}
@media(max-width:650px){#minimap{width:108px;height:119px}.side-hud{top:150px;right:12px}}

/* ---- Objective banner: big, top-center, readable at a glance ---- */
.ob-hidden{display:none}
.objective-banner{top:78px;left:50%;transform:translateX(-50%);width:min(640px,94vw);text-align:center;padding:14px 28px 12px;background:linear-gradient(180deg,#0c1118ee,#10141cd0);border:1px solid #ffffff22;border-top:2px solid var(--accent);box-shadow:0 16px 48px #0009;backdrop-filter:blur(10px)}
.ob-top{display:flex;align-items:center;justify-content:center;gap:14px}
.ob-step{font-family:'Barlow Condensed',Impact,sans-serif;font-weight:800;font-size:14px;letter-spacing:3px;color:var(--accent);border:1px solid #f6b36b66;padding:3px 10px;white-space:nowrap}
.objective-banner h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:34px;font-weight:800;letter-spacing:1.4px;line-height:1.05;margin:4px 0;text-transform:uppercase;text-shadow:0 2px 20px #000}
.objective-banner p{font-size:14.5px;line-height:1.55;color:#dde1e8;margin:3px 0 10px;text-shadow:0 1px 8px #000}
.ob-meta{display:flex;align-items:center;justify-content:center;gap:14px}
.ob-meta .track{flex:1;max-width:230px;margin:0}
.objective-banner #target-distance{font-family:'Barlow Condensed',Impact,sans-serif;font-weight:700;font-size:13px;letter-spacing:2px;color:#ffca92;white-space:nowrap}
.objective-banner.pop{animation:obpop .5s cubic-bezier(.2,1.5,.4,1)}
@keyframes obpop{0%{transform:translateX(-50%) scale(.9);filter:brightness(1.8)}100%{transform:translateX(-50%) scale(1);filter:brightness(1)}}
.rec{top:210px}
.notify{top:224px}
@media(max-width:650px){.objective-banner{top:64px;padding:10px 14px 9px}.objective-banner h2{font-size:23px}.objective-banner p{font-size:12.5px}.rec{top:168px}.notify{top:180px}}
.inventory-embed{position:static;right:auto;top:auto}

/* ---- Action prompt: the KEY is the message ---- */
.prompt{flex-direction:column;gap:8px;background:transparent;border:none;box-shadow:none;padding:0}
.prompt kbd{display:flex;align-items:center;justify-content:center;width:66px;height:66px;font-size:36px;font-weight:800;font-family:'Barlow Condensed',Impact,sans-serif;color:#17110a;background:linear-gradient(180deg,#ffd9a2,#f6a94f);border:2px solid #fff3dd;border-radius:11px;box-shadow:0 0 0 3px #00000066,0 0 36px #ffac4e99,0 12px 26px #000a;animation:keypulse 1.1s ease-in-out infinite}
.prompt[data-key="Z"] kbd{background:linear-gradient(180deg,#c9e8ff,#58b2f0);border-color:#ecf7ff;box-shadow:0 0 0 3px #00000066,0 0 36px #58b2f0aa,0 12px 26px #000a}
.prompt[data-key="F"] kbd{background:linear-gradient(180deg,#ffb9b0,#f25c5c);border-color:#ffe9e5;box-shadow:0 0 0 3px #00000066,0 0 36px #f25c5caa,0 12px 26px #000a}
.prompt span{font-family:'Barlow Condensed',Impact,sans-serif;font-size:14px;font-weight:800;letter-spacing:3px;color:#ffeedb;text-shadow:0 2px 10px #000;background:#0d1016d2;padding:5px 14px;border:1px solid #ffffff28}
@keyframes keypulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
.prompt{bottom:238px}
@media(max-width:650px){.prompt{bottom:208px}}