:root{--action-rail-height:98px}
.resident-pill{min-height:44px;padding:4px 8px;border:0;background:none;box-shadow:none;text-transform:none;letter-spacing:0;font:13px/1.4 var(--font-body);color:#d8d1bf}
.resident-pill:hover{background:none;text-decoration:underline;text-underline-offset:4px}
.resident-pill:focus-visible{outline:1px solid #b89c61;outline-offset:2px}
#action-rail{position:fixed;z-index:25;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(680px,calc(100vw - 32px));min-height:var(--action-rail-height);display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:13px 16px;background:linear-gradient(110deg,#07100ff5,#0a1110ed);border:1px solid #a68b554a;box-shadow:0 8px 35px #0008}
.rail-copy{min-width:0;padding-right:8px}
#chain-note{margin:0;color:#e3d5ba;font:15px/1.45 var(--font-body)}
#next-reason{display:block;font:12px/1.35 var(--font-body);color:#b1aa98;margin-top:6px}
#action-rail button{min-width:105px;min-height:48px;padding:10px 15px;background:#17221b;border:1px solid #ae955e70;color:#ead9b5;font:14px/1.2 var(--font-control);font-weight:var(--weight-control)}
#action-rail button:disabled{opacity:.55;cursor:default}
#action-rail #help-me{background:transparent;border-color:#84704b55}
#inventory{top:76px;bottom:auto;left:24px;transform:none;gap:7px;pointer-events:none;background-image:none}
.inventory-item{width:44px;height:44px;min-width:44px;min-height:44px;pointer-events:auto}
#room-title{bottom:calc(var(--action-rail-height) + 100px)}
.ending-active #action-rail,.ending-active #inventory{display:none}
#puzzle,#clue,#insert,#room-approach,#room-film-dip{display:none!important}
.hotspot.chain-next:after{opacity:.85}
.hotspot.chain-done:after{opacity:.12}
.portrait .portrait-mat video{object-position:var(--face-position,50% 50%);transform:scale(var(--face-zoom,1));transform-origin:var(--face-origin,50% 50%)}
.portrait[data-static="true"] video{visibility:visible}
.portrait[data-static="true"] .portrait-fallback{display:none}
.authored-tombstone{--stone-reveal:0;--stone-shape:polygon(2% 100%,0 38%,5% 22%,9% 17%,11% 12%,24% 5%,40% 1%,57% 0,73% 5%,88% 14%,94% 29%,96% 51%,100% 98%);position:absolute;transform:translate(-50%,-50%) perspective(550px) rotateY(-14deg) rotateZ(1.8deg);pointer-events:none;isolation:isolate;color:#22261f;font:clamp(15px,1.8vw,26px)/1 var(--font-display);letter-spacing:.035em}
.stone-ground-shadow{position:absolute;left:-8%;bottom:-7%;width:154%;height:17%;background:#000b;filter:blur(5px);border-radius:50%;transform:skewX(-35deg) rotate(-5deg)}
.stone-edge,.stone-face{position:absolute;inset:0;clip-path:var(--stone-shape);background-image:linear-gradient(100deg,#8c8a7170,#53574618 30%,#17211abb),url('./rooms/gate/plate.jpg');background-size:100% 100%,2400% 700%;background-position:0 0,23.8% 59%;filter:saturate(.35)}
.stone-edge{transform:translate(5%,1%);filter:brightness(.38) saturate(.2)}
.stone-face{display:grid;place-items:center;box-shadow:inset 3px 1px 3px #c7bb8d99,inset -5px -2px 4px #080e0dcc}
.stone-face:before{content:"";position:absolute;inset:7% 8% 8%;clip-path:var(--stone-shape);border:1px solid #191e1977;box-shadow:0 1px 0 #b4ae834d}
.stone-face:after{content:"";position:absolute;left:0;right:0;bottom:0;height:21%;background:radial-gradient(ellipse at 4% 95%,#314022 0 23%,transparent 28%),radial-gradient(ellipse at 70% 90%,#29361c 0 19%,transparent 26%),radial-gradient(ellipse at 34% 104%,#41492a 0 37%,transparent 42%),linear-gradient(0deg,#1b2518b3,transparent);opacity:.85}
.tombstone-date{padding-top:10%;font-variant-numeric:lining-nums;text-shadow:0 1px 0 #c1b79285,0 -1px 1px #0b110dcc}
.stone-dirt{position:absolute;left:8%;right:8%;top:47%;height:20%;background:linear-gradient(12deg,#333024dd,#454031dd 53%,#27271f55);clip-path:polygon(0 20%,13% 4%,24% 17%,42% 1%,57% 22%,76% 8%,90% 22%,100% 12%,98% 91%,80% 100%,56% 87%,34% 100%,11% 90%);opacity:calc(1 - var(--stone-reveal));transform:translateY(calc(var(--stone-reveal)*48px))}
.authored-tombstone[data-rendered="true"]{transform:translate(-50%,-50%);isolation:auto}
.authored-tombstone[data-rendered="true"] img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.authored-date-lock{--unlock:0;position:absolute;transform:translate(-50%,-50%) perspective(450px) rotateY(-8deg) rotateX(6deg) rotateZ(-1deg);display:flex;align-items:center;justify-content:center;gap:3px;color:#c6c7b5;font:clamp(10px,1.1vw,14px)/1 var(--font-body);font-variant-numeric:var(--figures);pointer-events:none;background:linear-gradient(166deg,#52564b,#212a25 22%,#111a17 72%,#3a4238);border:2px ridge #4d5348;border-radius:4px;box-shadow:inset 0 2px 3px #a8ab8f26,3px 5px 3px #000b}
.authored-date-lock:before{content:"";position:absolute;left:43%;top:-26%;width:16%;height:27%;border:3px solid #51554a;border-bottom:0;border-radius:5px 5px 0 0;box-shadow:2px 0 2px #0009}
.authored-date-lock span{position:relative;display:grid;place-items:center;width:18%;height:69%;background:linear-gradient(#080e0c,#303b32 28%,#687062 48%,#414d40 53%,#111a15 76%,#050907);border:1px solid #66705c88;box-shadow:inset 1px 0 2px #b7bea122,1px 0 2px #000b;text-shadow:0 1px 1px #000}
.lock-bolt{position:absolute;left:-14%;right:90%;top:40%;height:15%;background:linear-gradient(#879083,#29332b 35%,#121b16);border:1px solid #151d18;transform:translateX(calc(var(--unlock)*140%))}
.authored-lantern-shutter{position:absolute;transform:translate(-50%,-50%);pointer-events:none;background:linear-gradient(90deg,#191e1c,#242b25 48%,#111815);border:2px solid #4a4939;clip-path:polygon(15% 0,85% 0,100% 84%,80% 100%,20% 100%,0 84%);box-shadow:inset 0 0 8px #000}
.v3-piano-key{position:absolute;transform:translate(-50%,-50%);min-width:44px;min-height:48px}
.source-popover code{display:none}
#pan-cue{position:absolute;inset:45% 9px auto;height:20px;z-index:8;pointer-events:none}
#pan-cue:before,#pan-cue:after{content:"";position:absolute;top:4px;width:9px;height:9px;border:solid #c6b894;border-width:0 1px 1px 0;opacity:0;transition:opacity .25s}
#pan-cue:before{left:0;transform:rotate(135deg)}
#pan-cue:after{right:0;transform:rotate(-45deg)}
#pan-cue[data-left="true"]:before,#pan-cue[data-right="true"]:after{opacity:.42}
.phone-stage #scene{background:#000;clip-path:inset(0 0 calc(100% - var(--stage-height)) 0)}
.phone-stage #world{height:var(--stage-height);bottom:auto}
.phone-stage #pan-cue{top:calc(var(--stage-height)*.48)}
@media(max-width:700px){
  :root{--action-rail-height:112px}
  #action-rail{grid-template-columns:1fr 1fr;gap:8px;padding:10px 12px;bottom:max(10px,env(safe-area-inset-bottom));width:calc(100vw - 24px)}
  .rail-copy{grid-column:1/-1;padding:0;min-height:34px}
  #chain-note{font-size:13px;line-height:1.35}
  #next-reason{font-size:11px;margin-top:3px}
  #action-rail button{min-height:44px;width:100%}
  #inventory{top:76px;bottom:auto;left:12px;max-width:176px;flex-wrap:wrap;gap:4px}
  .inventory-item{width:44px;height:44px;min-width:44px;min-height:44px}
  .inventory-item svg{width:22px;height:22px}
  .hide-options{bottom:calc(var(--action-rail-height) + 190px)}
  .hold-door{bottom:calc(var(--action-rail-height) + 69px);width:100px;height:100px}
  .escape-exit{bottom:calc(var(--action-rail-height) + 12px)}
  #room-title{bottom:calc(var(--action-rail-height) + 85px)}
}
.character-target{position:absolute;z-index:1;background:transparent;border:0;border-radius:0;padding:0;min-width:44px;min-height:44px;color:transparent;cursor:pointer;touch-action:pan-y}
.character-target:focus-visible{outline:1px solid #c9c0a8;outline-offset:2px}
#find-tally{display:block;font-size:.72rem;color:#a9b8b2;line-height:1.3}
#sound{display:flex;align-items:center;gap:5px;width:auto;padding:0 7px;white-space:nowrap}
#sound svg{width:21px;min-width:21px;height:23px}
.sound-label{font:11px var(--font-control);color:#d6d2c3}
.sound-slash{display:none;stroke:#d6d2c3;stroke-width:1.6}
#sound[data-state="off"] .sound-slash,#sound[data-state="locked"] .sound-slash{display:block}
#sound[data-state="off"] .sound-wave,#sound[data-state="locked"] .sound-wave{display:none}
.world-caption{position:fixed;z-index:26;pointer-events:none;white-space:nowrap;font-family:var(--font-body);line-height:1.4;color:#e1d7be;text-shadow:0 1px 3px #000,0 0 9px #000;letter-spacing:.015em;text-align:center}
.gate-first-step #chain-note{font-size:18px;color:#e5dcc1}
.lantern-invitation:before{content:"";position:absolute;inset:-4px;pointer-events:none;border-radius:48%;box-shadow:0 0 18px 5px #dfb96c33,inset 0 0 12px #ddae6555;animation:lantern-invitation 2.6s ease-in-out infinite}
@keyframes lantern-invitation{0%,100%{opacity:.3;transform:scale(.92)}50%{opacity:1;transform:scale(1.06)}}
.authored-mixture{position:absolute;transform:translate(-50%,-50%);pointer-events:none;opacity:0}
.authored-mixture:after{content:"";position:absolute;left:20%;top:40%;width:62%;height:27%;border-radius:50%;background:radial-gradient(ellipse,#a1b7b18c,#758f8860 70%,#28342c26);box-shadow:inset 0 2px 4px #202c26}
.authored-mixture[data-mixture="1"],.authored-mixture[data-mixture="2"],.authored-mixture[data-mixture="3"]{opacity:.75}
.authored-mixture[data-mixture="2"]:after{background:radial-gradient(ellipse,#b7beb2aa,#6d7a6f90)}
.authored-mixture[data-mixture="3"]:after{background:radial-gradient(ellipse,#a9a99a,#5c655bc9)}
#caught .death-black,#caught .death-vignette{position:absolute;inset:0;pointer-events:none}
#caught .death-black{z-index:2;background:#000}
#caught .death-vignette{z-index:3;background:radial-gradient(ellipse at center,#3b000000 20%,#740c0a99 76%,#210000eb)}
#caught #creature{position:absolute;z-index:1;max-width:none;max-height:none;transform:none}
.death-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;z-index:4;background:#000}
.death-copy[hidden]{display:none}
.death-copy p{font:clamp(24px,5vw,40px)/1.3 var(--font-display);letter-spacing:var(--tracking-display);color:#d2c4aa;margin:0;text-align:center}
.death-copy button{min-width:130px;min-height:48px;padding:12px 24px;background:#141916;border:1px solid #555b4e;color:#ddd3bc;font:16px var(--font-control);font-weight:var(--weight-control);letter-spacing:var(--tracking-control);cursor:pointer}
@media(max-width:700px){.gate-first-step #chain-note{font-size:16px}.sound-label{font-size:10px}#sound{gap:3px;padding:0 4px}}
@media(prefers-reduced-motion:reduce){.lantern-invitation:before{animation:none;opacity:.6}}
.world-brass{position:absolute;inset:0;pointer-events:none;z-index:7}
.world-brass-tray{position:absolute;height:56px;transform:translate(-50%,-50%) perspective(400px) rotateX(22deg);border:3px ridge #82643b;border-radius:50%/22%;background:radial-gradient(ellipse,#554128,#2f251a 70%);box-shadow:0 9px 15px #0008,inset 0 2px 9px #000b;pointer-events:none}
.brass-piece{position:absolute;width:48px!important;height:48px!important;min-width:48px;min-height:48px;padding:4px;pointer-events:auto;touch-action:none;border:0;border-radius:50%;background:radial-gradient(circle at 35% 25%,#b5985e,#69502d 72%,#382b1b);box-shadow:inset 0 0 0 2px #b0925c66,0 3px 5px #000a;transform:translate(-50%,-50%);transition:left .24s ease,top .24s ease,transform .15s ease,box-shadow .15s ease;z-index:6}
.brass-piece:after{display:none}
.brass-piece svg{display:block;width:36px;height:36px;fill:#a78950;stroke:#e3c58a;stroke-width:1.6;filter:drop-shadow(0 2px 1px #1e160d)}
.brass-piece.dragging,.brass-piece.preview{transform:translate(-50%,-50%) scale(1.08);box-shadow:inset 0 0 0 2px #d4b77d99,0 13px 15px #0009;z-index:9}
.brass-piece.dragging{transition:none;cursor:grabbing}
.brass-piece.seated{background:transparent;box-shadow:none;padding:0;display:grid;place-items:center}
.brass-piece.seated svg{width:var(--seat-size,26px);height:var(--seat-size,26px)}
.brass-piece.glint svg{filter:drop-shadow(0 0 6px #ffe6a6) brightness(1.4)}
.brass-piece:focus-visible{outline:2px solid #e4bc77;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.brass-piece{transition:none}}
#lantern-light{position:fixed;left:0;right:0;z-index:4;pointer-events:none;--torch-r:38vw;--torch-x:50vw;--torch-y:45vh;background:radial-gradient(circle var(--torch-r) at var(--torch-x) var(--torch-y),#ffb65d16 0%,#bd864607 35%,#06162373 100%);transition:opacity .4s}
#lantern-light[data-lit="false"]{background:radial-gradient(circle var(--torch-r) at var(--torch-x) var(--torch-y),#b0cbd512 0%,#09162222 45%,#06162373 100%)}
body.character-charge #world{z-index:4}
body.character-charge #lantern-light{clip-path:none!important}
#character-charge-backdrop{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 43%,rgba(2,5,5,.82) 0%,rgba(2,5,5,.94) 58%,#020505 100%);opacity:0}
body.character-charge #foreground{z-index:1!important}
body.character-charge #portrait-line{opacity:0!important;pointer-events:none!important;transition:opacity .1s linear}
body.character-charge #portrait-line,body.character-charge #set-dressing,body.character-charge #hotspots,body.character-charge #films-link,body.character-charge #inventory,body.character-charge #pan-cue,body.character-charge #room-title,body.character-charge #world-caption{visibility:hidden!important;opacity:0!important;pointer-events:none!important;transition:none!important}
