*{box-sizing:border-box}body{margin:0;background:#100b17;color:#fff0d7;font:14px Arial,sans-serif;background-image:radial-gradient(ellipse at 60% 0,#49205d66,transparent 60%)}button,a{touch-action:manipulation}button{font:800 10px Arial;letter-spacing:1px;cursor:pointer;background:#301a40;border:1px solid #8c5da455;border-radius:7px;color:#efdcf7;padding:12px 15px}button:hover{background:#4d2862}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #d7ff80;outline-offset:4px}main{max-width:1480px;margin:auto;padding:25px 32px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #71448555;padding-bottom:20px;gap:15px}header>div{display:flex;gap:8px}.brand{color:#fff0d7;text-decoration:none;letter-spacing:3px;font-size:24px;font-weight:900}.brand span{display:block;font-size:7px;letter-spacing:2px;margin-top:6px;color:#c3a5d2}.heading{display:flex;justify-content:space-between;align-items:center;padding:26px 0}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:800;color:#d7ff80}h1{font-size:clamp(25px,4vw,49px);letter-spacing:-2px;margin:9px 0}em{font-style:normal;color:#f4bd69}.progress{text-align:right}.progress span{font-size:9px;color:#d7ff80;letter-spacing:2px}.progress b{display:block;font-size:25px;margin-top:8px;font-variant-numeric:tabular-nums}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:22px}.scene{position:relative;aspect-ratio:1.32;overflow:hidden;border:1px solid #ac7cba66;border-radius:15px;background:#21102e;box-shadow:0 20px 70px #0008}.hall{width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(.8) saturate(.9)}.vignette{position:absolute;inset:0;background:radial-gradient(ellipse,transparent 35%,#120919c9);pointer-events:none}.scene-caption{position:absolute;top:0;left:0;right:0;padding:18px;background:linear-gradient(#13091fe8,transparent);font-size:10px;letter-spacing:.4px;display:flex;align-items:center;gap:10px}.live-dot{width:6px;height:6px;border-radius:50%;background:#d7ff80;box-shadow:0 0 15px #d7ff80}.hotspot{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:flex;align-items:center;gap:7px;font-size:7px;letter-spacing:.6px;padding:7px 10px;background:#13091edb;border:1px solid #ffc97688;border-radius:24px;box-shadow:0 0 22px #ffc97622;white-space:nowrap;min-height:38px}.hotspot>span{font-size:19px;color:#f4bd69}.hotspot:hover{background:#57305ee8;border-color:#d7ff80;box-shadow:0 0 25px #d7ff8055}.room-label{position:absolute;bottom:15px;left:20px;font-size:8px;letter-spacing:2px;color:#f4d5ac}.story-card{border:1px solid #9256a555;background:#32173b;border-radius:12px;padding:18px;display:flex;gap:13px;align-items:center}.story-card img{width:63px;align-self:flex-start}.story-card p{font-size:12px;line-height:1.7;margin:0;color:#e6cee9}.inventory,.journal{margin-top:20px;border:1px solid #9256a544;border-radius:12px;padding:18px;background:#21112b}h2{margin:0;font-size:11px;letter-spacing:1px}.inventory h2{display:flex;justify-content:space-between;gap:5px}.inventory h2 span{font-size:7px;color:#a68ab3}.empty{color:#b69bc3;font-size:11px;line-height:1.7}.item{margin-top:10px;display:block;width:100%;text-align:left;font-size:10px;background:#42214e;border-color:#f4bd6955;color:#f4d5ac}.journal ul{padding-left:16px;margin-bottom:0;color:#cdb2d7;font-size:11px;line-height:1.8}.journal li+li{margin-top:10px}.hint-button{margin-top:18px;width:100%;background:#d7ff80;color:#25132d;border:0;font-size:9px;letter-spacing:.5px}.hint-button:hover{background:#e7ffaf}.hint-note{font-size:9px;color:#a68ab3;text-align:center;line-height:1.6}.text-button{width:100%;border:0;background:none;font-size:8px;color:#bba1c8}footer{display:flex;justify-content:space-between;gap:15px;margin-top:25px;font-size:8px;letter-spacing:1px;color:#a889b7;line-height:1.8}dialog{border:1px solid #be82cf88;background:linear-gradient(150deg,#32183f,#180e23);color:#fff0d7;border-radius:18px;padding:35px;max-width:580px;width:calc(100% - 30px);max-height:88svh;box-shadow:0 25px 140px #000a}dialog::backdrop{background:#090511c9;backdrop-filter:blur(7px)}dialog h2{font-size:28px;letter-spacing:-.5px;margin:12px 0 18px}.close{position:absolute;right:12px;top:12px;border:0;background:none;padding:8px}.copy{font-size:14px;line-height:1.8;color:#dec9e5}.clue{border:1px dashed #c69a6399;border-radius:8px;padding:20px;color:#f4d5ac;background:#f4bd6908;font:italic 18px/1.8 Georgia,serif}.puzzle-row{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 12px}.symbol-button{font-size:26px;min-width:60px;min-height:62px;border-color:#c799d2}.symbol-button[aria-pressed=true]{background:#8c4aa5;box-shadow:0 0 0 2px #f4bd69}.gold{background:#f4bd69;color:#271630;border:0;font-size:11px;padding:15px 23px}.gold:hover{background:#ffda9f}.clue-tag{display:block;color:#d7ff80;font-size:10px;letter-spacing:1px;margin:10px 0}.code-input{background:#140b20;border:1px solid #a976bb;color:#fff0d7;font:30px monospace;letter-spacing:15px;padding:15px;width:100%;max-width:250px;text-align:center;border-radius:8px}#feedback{min-height:20px;font-size:12px;line-height:1.6;color:#d7ff80;margin:18px 0 0}.pages-art{font-size:50px;color:#f4bd69;text-align:center;margin:22px 0}.intro-overlay{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:linear-gradient(90deg,#12091ef5,#12091ed9),url('assets/hall.png') center/cover;overflow:auto;padding:25px}.intro-card{max-width:620px;text-align:center}.intro-card h2{font-size:clamp(30px,5vw,59px);line-height:1.04;letter-spacing:-1.7px;margin:22px 0}.intro-card p:not(.eyebrow){font-size:14px;line-height:1.9;color:#cfb8d7;max-width:510px;margin:20px auto}.intro-card small{display:block;font-size:8px;letter-spacing:1.5px;color:#ad90b9;margin-top:23px;line-height:2}[hidden]{display:none!important}.page-select{flex:1;font-size:14px;min-width:95px}.badge{display:inline-block;padding:8px 12px;background:#d7ff8017;color:#d7ff80;border:1px solid #d7ff8044;border-radius:20px;font-size:10px}.item-description{font-size:12px;line-height:1.8;color:#d8bddf}.final-word{font-size:24px;letter-spacing:10px;padding:20px;text-align:center;color:#f4bd69;border:1px solid #a976bb55}@media(max-width:900px){main{padding:18px}.game-layout{grid-template-columns:1fr}.scene{aspect-ratio:1.2}aside{display:grid;grid-template-columns:1fr 1fr;gap:15px}.story-card{grid-column:1/-1}.inventory,.journal{margin-top:0}.hint-button{margin:0}.hint-note{margin:0;align-self:center}.text-button{grid-column:1/-1}.heading{padding:21px 0}.hotspot{font-size:7px;padding:7px;min-height:40px}.room-label{font-size:7px}.scene-caption{font-size:9px}}@media(max-width:480px){main{padding:14px 10px}.brand{font-size:18px;letter-spacing:2px}.brand span{font-size:5px}header button{font-size:7px;padding:10px 8px}.heading h1{font-size:27px;letter-spacing:-1px}.heading .eyebrow{font-size:6px;letter-spacing:1px}.progress span{font-size:7px;letter-spacing:1px}.progress b{font-size:21px}.scene{aspect-ratio:.84}.hall{object-fit:cover;object-position:51% center}.hotspot{font-size:6px;gap:4px;padding:6px;min-height:40px}.hotspot>span{font-size:15px}.hotspot[data-object=portrait]{--x:17%!important}.hotspot[data-object=door]{--x:85%!important}.hotspot[data-object=candles]{--x:16%!important}.hotspot[data-object=chest]{--x:80%!important}.scene-caption{padding:14px 10px;font-size:8px}.room-label{left:12px;font-size:6px}aside{gap:10px}.inventory,.journal{padding:13px}.journal ul{font-size:10px}.inventory h2{font-size:9px}.inventory h2 span{font-size:6px}.hint-button{font-size:8px;padding:13px 8px}.hint-note{font-size:8px}footer{flex-direction:column;gap:5px;font-size:7px}dialog{padding:28px 22px}dialog h2{font-size:26px}.copy{font-size:13px}.clue{font-size:16px}.symbol-button{font-size:23px;min-width:48px;min-height:54px;padding:10px}.puzzle-row{gap:8px}.intro-card h2{font-size:39px}.intro-card p:not(.eyebrow){font-size:13px}}@media(prefers-reduced-motion:no-preference){.hotspot>span{animation:glimmer 3s ease-in-out infinite}@keyframes glimmer{50%{filter:drop-shadow(0 0 7px #f4bd69)}}}

.volume-control{display:flex;gap:8px;align-items:center;font-size:8px;letter-spacing:1px;color:#ccb0d5}.volume-control input{width:85px;accent-color:#f4bd69}.volume-control span{min-width:27px}header>div{flex-wrap:wrap;justify-content:flex-end}@media(max-width:600px){header{align-items:flex-start}.volume-control{order:3;width:100%;justify-content:flex-end;font-size:7px}.volume-control input{width:95px}header>div{max-width:200px}}
