@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&family=Manrope:wght@400;600;800&display=swap";:root{--ink:#eee9dc;--muted:#8e9298;--red:#e45745;--gold:#e0b66d;--cyan:#75c9c4;--line:rgba(238,233,220,.16);font-family:Manrope,sans-serif;color:var(--ink);background:#090b10}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{background:#090b10}button,input{font:inherit}button{color:inherit;cursor:pointer}#app{position:relative;isolation:isolate}#game-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.vignette{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(circle at 50% 42%,transparent 32%,rgba(3,4,7,.38) 75%,rgba(3,4,7,.86)),linear-gradient(180deg,rgba(4,5,8,.5),transparent 25%,transparent 75%,rgba(4,5,8,.72))}.topbar{position:absolute;z-index:5;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:22px 28px;pointer-events:none}.brand{display:flex;gap:11px;align-items:center;font:800 12px DM Mono;letter-spacing:.16em}.brand>span{display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--gold);color:var(--gold);font-size:10px}.brand div{line-height:1.35}.brand small{display:block;color:var(--muted);font-size:8px;letter-spacing:.18em}.actions{display:flex;gap:7px;pointer-events:auto}.actions button,.secondary{border:1px solid var(--line);background:#080a0eb8;padding:9px 11px;color:var(--muted);font:9px DM Mono;letter-spacing:.12em}.actions button:hover,.secondary:hover{border-color:var(--gold);color:var(--ink)}.objective-card{position:absolute;z-index:3;left:28px;top:88px;width:min(340px,calc(100vw - 56px));padding:17px 18px;background:linear-gradient(100deg,#080a0edb,#080a0e5c);border-left:2px solid var(--gold);backdrop-filter:blur(8px)}.eyebrow{color:var(--gold);font:9px DM Mono;letter-spacing:.2em;text-transform:uppercase}.objective-card h1{margin:10px 0 5px;font-size:20px;letter-spacing:-.04em}.objective-card p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}.facts{display:flex;gap:24px;margin-top:15px;padding-top:12px;border-top:1px solid var(--line);color:var(--muted);font:8px DM Mono;letter-spacing:.12em}.facts b{color:var(--ink);font-weight:400}.threat-card{position:absolute;z-index:4;right:28px;top:88px;width:220px;padding:13px 15px;background:#0d0708d4;border:1px solid rgba(228,87,69,.35);font:9px DM Mono;letter-spacing:.13em}.threat-card[hidden]{display:none}.threat-card span{color:#c99a91}.threat-card div{height:3px;margin:9px 0;background:#ffffff17}.threat-card i{display:block;width:0;height:100%;background:var(--red);box-shadow:0 0 12px var(--red);transition:width .15s}.threat-card b{font-weight:400}.threat-card[data-state=hunting]{animation:danger .7s infinite alternate}@keyframes danger{to{border-color:var(--red);box-shadow:0 0 25px #e4574529}}.event-log{position:absolute;z-index:3;left:28px;bottom:25px;color:#d2d3cf8f;font:9px/1.7 DM Mono;pointer-events:none}.event-log div+div{margin-top:2px}#prompt{position:absolute;z-index:5;left:50%;bottom:50px;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:10px 14px;background:#07090ce0;border:1px solid var(--line);font-size:11px}#prompt[hidden],#dialogue[hidden],#toast[hidden]{display:none}kbd{display:grid;place-items:center;width:26px;height:26px;border:1px solid var(--gold);color:var(--gold);font:10px DM Mono}#toast{position:absolute;z-index:12;left:50%;top:84px;transform:translate(-50%);padding:10px 15px;background:#0b0d11;border:1px solid var(--line);font:10px DM Mono;white-space:nowrap}.dialogue{position:absolute;z-index:10;left:50%;bottom:5.5%;transform:translate(-50%);display:grid;grid-template-columns:125px 1fr;width:min(720px,calc(100vw - 40px));min-height:245px;background:#07090cf5;border:1px solid rgba(224,182,109,.38);box-shadow:0 30px 90px #000}.portrait{display:grid;place-items:end center;padding:20px;background:linear-gradient(160deg,#2d2524,#0c0c10);border-right:1px solid var(--line);color:var(--gold);font:10px DM Mono;letter-spacing:.25em;writing-mode:vertical-rl;transform:rotate(180deg)}.dialogue-copy{padding:24px}.dialogue-copy>span{color:var(--gold);font:8px DM Mono;letter-spacing:.18em}.dialogue-copy h2{margin:9px 0 8px;font-size:22px}.dialogue-copy p{margin:0 0 17px;color:#b8b5ae;font-size:12px;line-height:1.6}.choices{display:grid;gap:7px}.choice{padding:11px 12px;text-align:left;border:1px solid var(--line);background:#121419;font-size:10px}.choice:hover{border-color:var(--gold);background:#1b1b1d}.screen{position:absolute;z-index:20;inset:0;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 52% 40%,#12101159,#030407eb)}.screen[hidden]{display:none}.title-card{width:min(580px,100%);padding:38px 42px;background:linear-gradient(145deg,#0b0d11ed,#050609e6);border:1px solid rgba(224,182,109,.3);border-top:3px solid var(--gold);box-shadow:0 30px 100px #000}.title-card h1{margin:20px 0 15px;font-size:clamp(58px,10vw,94px);line-height:.78;letter-spacing:-.09em}.title-card h1 em{color:var(--gold);font-style:normal}.title-card p{max-width:430px;color:#aaa8a2;font-size:13px;line-height:1.7}.controls{display:flex;flex-wrap:wrap;gap:10px 17px;margin:24px 0;color:var(--muted);font:8px DM Mono;letter-spacing:.1em}.controls b{color:var(--ink);font-weight:400}.primary{width:100%;padding:14px 16px;border:1px solid var(--gold);background:var(--gold);color:#12100c;text-align:left;font:10px DM Mono;letter-spacing:.14em}.primary:hover{background:#f1ca82}.title-card>small{display:block;margin-top:12px;color:var(--muted);font:8px DM Mono;letter-spacing:.1em}.modal-card{width:min(460px,100%);padding:34px;background:#0b0d11;border:1px solid var(--line);box-shadow:0 25px 80px #000}.modal-card h2{margin:12px 0;font-size:34px;letter-spacing:-.05em}.modal-card p{margin:0 0 24px;color:var(--muted);font-size:12px;line-height:1.6}.secondary{width:100%;margin-top:9px;text-align:left}.modal-card label{display:grid;grid-template-columns:1fr 160px;gap:15px;align-items:center;margin:17px 0;color:#b8b5ae;font:10px DM Mono}.modal-card input[type=range]{accent-color:var(--gold)}.modal-card .check{display:flex}.result{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 20px;margin:20px 0;color:var(--muted);font:9px DM Mono}.result>span{min-width:0}.result b{display:block;margin-bottom:4px;color:var(--gold);font-size:16px;font-weight:400;line-height:1.3;overflow-wrap:anywhere}@media(max-width:700px){.topbar{padding:14px}.brand small,.actions #audio-toggle{display:none}.objective-card{left:14px;top:76px;width:260px}.threat-card{right:14px;top:76px;width:160px}.dialogue{grid-template-columns:1fr;bottom:14px}.portrait{display:none}.title-card,.modal-card{padding:27px 22px}.event-log{left:14px;bottom:14px}.objective-card p{display:none}}@media(max-width:700px){html,body,#app{overflow-x:clip}.topbar{min-height:56px;padding:14px;overflow:hidden}.brand,.actions,.brand div{min-width:0}.actions{gap:4px;flex-wrap:nowrap}.actions button,.secondary{white-space:nowrap}.objective-card{top:72px;left:14px;width:calc(100% - 28px);max-height:30vh;overflow-y:auto;overscroll-behavior:contain}.threat-card{top:204px;right:14px;width:min(170px,calc(100% - 28px))}#toast{inset:auto 14px 150px;width:auto;max-width:none;transform:none;white-space:normal;text-align:center}.event-log{right:14px;bottom:14px;left:14px;width:auto;max-height:42px;overflow:hidden;font-size:9px}#prompt{right:14px;bottom:78px;left:14px;width:auto;max-width:none;transform:none;white-space:normal;text-align:center}.dialogue{right:14px;bottom:14px;left:14px;width:auto;min-height:0;max-height:calc(100dvh - 96px);grid-template-columns:1fr;overflow-y:auto}.portrait{display:none}.screen{padding:12px;overflow-y:auto}.title-card,.modal-card{width:min(580px,100%);max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}.title-card{padding:27px 22px}.title-card h1{font-size:clamp(52px,16vw,76px)}.controls{gap:7px 10px;font-size:9px}.result{gap:12px 16px}.modal-card label{grid-template-columns:1fr;gap:8px}}@media(min-width:701px){.screen,.dialogue{overflow-y:auto}.title-card,.modal-card{max-height:calc(100dvh - 48px)}}@media(min-width:701px){.objective-card,.threat-card{max-height:calc(100dvh - 150px);overflow-y:auto;overscroll-behavior:contain}.event-log{max-width:360px}.result{gap:16px 20px}.result b{font-size:18px}}
