:root{color-scheme:dark;--bg: #04070b;--panel: rgba(10, 14, 18, .82);--panel-strong: rgba(13, 18, 24, .94);--text: #dce6f4;--muted: #7f8da1;--accent: #88b7e5;--danger: #c74b4b;--border: rgba(131, 155, 181, .2);--brightness: 1;--subtitle-scale: 1;font-family:Inter,Arial,Helvetica,sans-serif}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;background:var(--bg);overflow:hidden}body{color:var(--text)}canvas{display:block}button,input,select,a{font:inherit}button{cursor:pointer;background:linear-gradient(180deg,#5c6e822e,#5c6e8214);color:var(--text);border:1px solid var(--border);padding:.75rem 1rem;letter-spacing:.08em;text-transform:uppercase;transition:background .16s ease,border-color .16s ease,transform .16s ease}button:hover,a:hover{background:#7392b229;border-color:#91b9dc73}button:active{transform:translateY(1px)}input,select{width:100%;padding:.7rem .8rem;background:#060a0ef2;color:var(--text);border:1px solid rgba(114,132,152,.3)}a{color:var(--text);text-decoration:none}.app-root{position:relative;width:100%;height:100%;overflow:hidden;filter:brightness(var(--brightness))}#game-viewport,#overlay,#film-grain,#vignette{position:absolute;inset:0}#game-viewport canvas{width:100%!important;height:100%!important}#overlay{pointer-events:none}#overlay>*{pointer-events:auto}#film-grain{pointer-events:none;mix-blend-mode:screen;opacity:.08;background-image:radial-gradient(circle at 20% 20%,rgba(255,255,255,.08) 0,transparent 22%),radial-gradient(circle at 70% 70%,rgba(255,255,255,.05) 0,transparent 18%),repeating-radial-gradient(circle at center,rgba(255,255,255,.03) 0 1px,transparent 1px 3px);background-size:200px 200px,300px 300px,4px 4px}#vignette{pointer-events:none;background:radial-gradient(circle at center,transparent 52%,rgba(0,0,0,.72) 100%);opacity:.4}.hidden{display:none!important}.screen-panel,.modal{position:absolute;inset:0}.screen-panel{display:flex;flex-direction:column;justify-content:center;align-items:center;background:#02040875;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}.modal{display:grid;place-items:center;background:#0204089e}.title-block,.menu-center{text-align:center}.eyebrow,.label,.footer-link span,#loading-warning,#loading-label,.inventory-type,.subtitle #subtitle-speaker{letter-spacing:.2em;text-transform:uppercase}h1,h2,h3,h4,p{margin:0}h1{font-size:clamp(2.2rem,5vw,4.9rem);letter-spacing:.38em;text-transform:uppercase}h2{font-size:clamp(1.5rem,3vw,2.2rem);letter-spacing:.18em}h3{font-size:1.05rem;letter-spacing:.12em}.main-nav{display:flex;flex-direction:column;gap:.7rem;margin-top:2rem;min-width:min(24rem,75vw)}.main-nav button{padding:.9rem 1.2rem;background:#080c12a8}.menu-footer{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;padding:1.5rem 2rem;color:var(--muted)}.footer-link{display:flex;flex-direction:column;gap:.22rem}.footer-link.left{align-items:flex-start}.footer-link.right{align-items:flex-end;text-align:right}.footer-link a{font-size:.92rem;letter-spacing:.18em}.footer-credit{text-align:center;opacity:.72;font-size:.85rem}.loading-bar{width:min(28rem,82vw);height:1.2rem;margin-top:1.8rem;border:1px solid rgba(176,190,212,.35);background:#ffffff0a}#loading-progress-fill{width:0;height:100%;background:linear-gradient(90deg,#4c6c87,#9ab6d2)}#loading-label{margin-top:.8rem;color:var(--muted)}#loading-warning{margin-top:1rem;color:#c77b7b}.panel{width:min(48rem,calc(100vw - 2rem));max-height:calc(100vh - 3rem);overflow:hidden;display:flex;flex-direction:column;gap:1rem;padding:1.4rem;background:var(--panel-strong);border:1px solid var(--border);box-shadow:0 1.4rem 4rem #00000073}.panel.narrow{width:min(26rem,calc(100vw - 2rem))}.panel.wide{width:min(78rem,calc(100vw - 2rem))}.panel-scroll{overflow:auto;padding-right:.6rem}.panel-buttons{display:flex;flex-direction:column;gap:.75rem}.panel-buttons.horizontal{flex-direction:row;justify-content:flex-end}.credit-copy{display:grid;gap:.4rem;justify-items:center;text-align:center;padding:1rem 0 1.5rem}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 1.2rem;overflow:auto}.setting-row{display:grid;grid-template-columns:1.4fr 1fr auto;gap:.8rem;align-items:center;margin-bottom:.7rem;color:var(--muted)}.setting-row.toggle,.setting-row.binding{grid-template-columns:1.4fr auto}.settings-subtitle{margin:1rem 0 .5rem;color:var(--text);letter-spacing:.16em;text-transform:uppercase;font-size:.88rem}.setting-note{margin:-.15rem 0 .8rem;color:var(--accent);font-size:.78rem;line-height:1.5;letter-spacing:.03em}.setting-note.muted{color:var(--muted);font-size:.74rem;opacity:.85}.hud-top-left,.hud-top-right{position:absolute;top:1rem;display:flex;gap:.75rem}.hud-top-left{left:1rem}.hud-top-right{right:1rem}.hud-block,.hud-objective,.interaction-prompt,.notice,#debug-overlay{background:var(--panel);border:1px solid var(--border);padding:.72rem .9rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.hud-block{min-width:8rem}.hud-block strong{display:block;margin-top:.15rem;letter-spacing:.08em}.hud-top-right{flex-wrap:wrap;justify-content:flex-end;max-width:min(30rem,46vw)}.coords-block strong{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.78rem;letter-spacing:.05em;color:#b9cbe4}.hint-block{min-width:13rem;max-width:20rem;text-align:right}.hint-block ul{list-style:none;margin:.2rem 0 0;padding:0;display:flex;flex-direction:column;gap:.3rem}.hint-block li{font-size:.76rem;line-height:1.35;color:#e0eaf7db;text-shadow:0 1px 2px rgba(0,0,0,.85)}.hint-block li:before{content:"› ";color:#7fb2ff}#ending-panel p{white-space:pre-line}.flashlight-block em{display:block;margin-top:.4rem;color:#d19779;font-style:normal;letter-spacing:.12em}.hud-objective{position:absolute;left:50%;bottom:4.4rem;transform:translate(-50%);min-width:min(38rem,calc(100vw - 2rem));text-align:center}.interaction-prompt{position:absolute;left:50%;bottom:8.5rem;transform:translate(-50%);text-align:center;letter-spacing:.14em}#crosshair{position:absolute;left:50%;top:50%;width:.6rem;height:.6rem;margin-left:-.3rem;margin-top:-.3rem;border:1px solid rgba(210,220,236,.65);border-radius:999px}.inventory-item,.objective-entry,.slot-button,.terminal-action-btn,.terminal-tab,.terminal-camera-btn{background:#080c12bf;border:1px solid var(--border)}.inventory-item{padding:.9rem;margin-bottom:.8rem}.inventory-item header{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.45rem}.inventory-item p,.document-body,.terminal-file-body,.slot-button small{color:var(--muted);line-height:1.6;white-space:pre-wrap}.objective-entry{display:flex;gap:.8rem;align-items:flex-start;margin-bottom:.7rem;padding:.8rem .9rem}.objective-entry.complete{opacity:.55}.document-panel .document-body{min-height:16rem}.terminal-shell{gap:1rem}.terminal-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:1rem;min-height:0}.terminal-tabs,.terminal-actions,.slot-list{display:grid;gap:.5rem}.terminal-tab,.terminal-camera-btn,.slot-button,.terminal-action-btn{width:100%;text-align:left}.terminal-tab.active,.terminal-camera-btn.active{border-color:#93c6f68c;background:#435f7c47}.terminal-file-body{min-height:16rem;padding:.85rem}.terminal-login{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}.camera-panel{position:relative;border:1px solid var(--border);min-height:15rem;background:#020406;overflow:hidden}#terminal-camera-canvas{width:100%;height:auto;aspect-ratio:16 / 9}.camera-label{position:absolute;left:.75rem;bottom:.75rem;padding:.35rem .5rem;background:#020406ad;letter-spacing:.14em;font-size:.78rem}.terminal-action-btn{display:flex;flex-direction:column;gap:.25rem}.terminal-action-btn span{color:var(--muted);font-size:.84rem;text-transform:none;letter-spacing:normal}.terminal-header{display:flex;justify-content:space-between;align-items:center;gap:1rem}.slot-button{display:grid;gap:.25rem;padding:.9rem}.subtitle{position:absolute;left:50%;bottom:1.2rem;transform:translate(-50%) scale(var(--subtitle-scale));min-width:min(42rem,calc(100vw - 2rem));max-width:min(42rem,calc(100vw - 2rem));text-align:center;padding:.75rem 1rem;background:#020408c7;border:1px solid rgba(142,170,198,.24)}#subtitle-speaker{margin-bottom:.28rem;color:#8eb3d6}.notice{position:absolute;right:1rem;bottom:1rem;max-width:min(24rem,calc(100vw - 2rem));color:var(--text)}#debug-overlay{position:absolute;left:1rem;bottom:1rem;display:grid;gap:.2rem;min-width:16rem;font-size:.82rem;color:#cdd8e9}.death-panel p{color:var(--muted);text-align:center}@media(max-width:900px){.settings-grid,.terminal-grid{grid-template-columns:1fr}.menu-footer{flex-direction:column;align-items:center;text-align:center}.footer-link.left,.footer-link.right{align-items:center;text-align:center}.hud-objective{min-width:calc(100vw - 2rem);bottom:5rem}}:root{--accent: #b9d8d8;--border: rgba(167,210,211,.23);--panel-strong: rgba(8,19,23,.97)}.screen-panel,.modal{background:radial-gradient(ellipse at 70% 20%,rgba(39,87,91,.22),transparent 60%),#02090dc7;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.menu-center{position:relative;padding:3rem;border-left:1px solid rgba(183,225,225,.22);text-align:left;width:min(650px,90vw);background:linear-gradient(90deg,rgba(8,23,27,.8),transparent)}.menu-center:before{content:"SCP / CONTAINMENT INTERFACE   •   001";display:block;color:#78a9a9;letter-spacing:.25em;font-size:.7rem;margin-bottom:3rem}.menu-center h1{font-weight:300;line-height:.95;letter-spacing:.12em;text-shadow:0 0 35px rgba(104,196,200,.4)}.menu-center .eyebrow{color:#a2b9b9;margin-bottom:1rem}.main-nav{margin-top:3rem;width:min(410px,100%);gap:0}.main-nav button{text-align:left;border:0;border-bottom:1px solid rgba(160,201,203,.18);background:transparent;padding:1rem .5rem;font-size:.84rem;letter-spacing:.22em}.main-nav button:before{content:"◈";margin-right:1rem;color:#649499}.main-nav button:hover,.main-nav button:focus-visible{background:#68b5ba24;padding-left:1.2rem;color:#fff;outline:none}.main-nav button span{float:right}.panel{border:1px solid rgba(143,203,204,.3);border-top:2px solid #83b8b8;box-shadow:0 30px 90px #000b;padding:clamp(1.3rem,3vw,2.5rem)}.panel h2{font-weight:400;text-transform:uppercase;border-bottom:1px solid var(--border);padding-bottom:1rem}.panel button{background:#589aa017}.panel button:hover{background:#589aa040}.menu-help{color:#aabfc0;line-height:1.6;font-size:.85rem}.connection-status{padding:1rem;border:1px solid var(--border);color:#a9d0d0;background:#0b2024;font-size:.8rem;letter-spacing:.06em}.join-form{display:flex;gap:.5rem}.join-form input{min-width:0;text-transform:uppercase;letter-spacing:.2em}.join-form button{flex-shrink:0}#chat-panel{position:absolute;bottom:1rem;left:1rem;width:min(370px,calc(100vw - 2rem));background:#051216e0;border:1px solid var(--border);padding:.8rem;z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.chat-heading{font-size:.75rem;letter-spacing:.18em;color:#aad7d7;display:flex;justify-content:space-between;gap:.5rem}#chat-status{font-size:.65rem;letter-spacing:0;color:#92aeb0;text-align:right}#chat-messages{height:110px;overflow-y:auto;font-size:.8rem;line-height:1.5;margin:.6rem 0;overflow-wrap:anywhere}#chat-messages strong{color:#9ec9cf}#chat-form{display:flex;gap:.4rem}#chat-form input{min-width:0}@media(max-height:700px){.menu-center{padding:1rem 2rem}.menu-center:before{margin-bottom:1rem}.main-nav{margin-top:1rem}.main-nav button{padding:.55rem}.menu-footer{display:none}}.gun-status{position:absolute;bottom:13%;left:50%;transform:translate(-50%);text-align:center;padding:.55rem 1rem;border:1px solid var(--border);background:#081a1dcc;color:#bde4e4;font-size:.75rem;letter-spacing:.12em;white-space:nowrap}.invite-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;color:#a9d0d0;font-size:.72rem;letter-spacing:.15em}.invite-row strong{display:block;font-size:1.5rem;letter-spacing:.3em;color:#f1ffff;margin-top:.3rem}.connection-tabs{display:flex;gap:.5rem}.connection-tabs button{flex:1}.connection-tabs button.selected{border-color:#b0e5e5;background:#6fced34d}#multiplayer-panel .panel{overflow-y:auto}#relay-controls,#direct-controls{display:flex;flex-direction:column;gap:.75rem}#direct-controls label{font-size:.72rem;letter-spacing:.13em;color:#add0d1}#direct-controls textarea{width:100%;resize:vertical;min-height:4rem;background:#061418;border:1px solid var(--border);color:#d9f6f6;padding:.7rem;font-size:.72rem;overflow-wrap:anywhere}.direct-actions{display:flex;gap:.5rem}.direct-actions button{flex:1;font-size:.75rem}