@font-face{font-family:"Cormorant Garamond";src:url(/lives/fonts/cormorant-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(/lives/fonts/cormorant-400i.woff) format("woff");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(/lives/fonts/cormorant-500.woff) format("woff");font-weight:500;font-display:swap}
:root{--gold:#d4a537;--gold2:#ffe08a;--ink:#f1e9d6;--mute:#b3a686;--ember:#e0705a}
html,body{margin:0;height:100%;background:#000;color:var(--ink);overflow:hidden;-webkit-tap-highlight-color:transparent}
body{font-family:"Cormorant Garamond",Garamond,Georgia,serif}
*{box-sizing:border-box}
button{font:inherit;color:inherit}
.room{position:fixed;inset:0;opacity:0;visibility:hidden;transition:opacity 1.2s ease,visibility 0s 1.2s;overflow:hidden}
.room.on{opacity:1;visibility:visible;transition:opacity 1.2s ease,visibility 0s}
.stage{position:absolute;inset:0;overflow:hidden;background:#000}
.frame{position:absolute;will-change:transform}
.kb{position:absolute;inset:0;transform-origin:50% 50%;will-change:transform}
.kb.push{animation:kb 60s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.07) translate(-.6%,-.4%)}}
.lay,.lay img{position:absolute;inset:0;width:100%;height:100%;display:block;user-select:none;-webkit-user-drag:none;pointer-events:none}
picture.lay{display:block}
canvas.fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;transform:translate3d(calc(var(--px,0)*-6px),calc(var(--py,0)*-4px),0)}
.vig{position:absolute;inset:-2px;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.35),transparent 12%,transparent 80%,#000 100%),linear-gradient(to right,rgba(0,0,0,.5),transparent 10%,transparent 90%,rgba(0,0,0,.5)),radial-gradient(ellipse 75% 78% at 50% 45%,transparent 60%,rgba(0,0,0,.4) 100%)}
.bd{position:absolute;inset:-60px;background-size:cover;background-position:center;filter:blur(30px) brightness(.38) saturate(.85);transform:scale(1.08);pointer-events:none}
.ui{position:absolute;inset:0;pointer-events:none;display:flex;flex-direction:column;align-items:center;padding:calc(60px + env(safe-area-inset-top)) 22px calc(28px + env(safe-area-inset-bottom))}
.ui>*{pointer-events:auto}
.shade{position:absolute;left:0;right:0;bottom:0;height:62%;pointer-events:none;background:linear-gradient(to bottom,transparent,rgba(0,0,0,.72) 34%,rgba(0,0,0,.9) 70%,#000);opacity:0;transition:opacity 1.4s}
.room.reading .shade{opacity:1}
.room.land .shade{top:0;height:auto;width:62%;right:auto;background:linear-gradient(to right,rgba(0,0,0,.9),rgba(0,0,0,.78) 52%,transparent)}
.room.land .scroll{right:auto;width:46%;top:0;padding:calc(64px + env(safe-area-inset-top)) 34px 30px 4vw;justify-content:safe center}
.room:not(.land) .scroll{padding-top:6px;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 22px);mask-image:linear-gradient(to bottom,transparent,#000 22px)}
.room:not(.land) .shade{height:auto;top:calc(var(--uiTop,0px) - 90px);background:linear-gradient(to bottom,transparent,rgba(0,0,0,.82) 90px,rgba(0,0,0,.92))}
.lbl2{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:rgba(212,165,55,.75);margin:14px 0 2px}
.top{position:absolute;left:calc(10px + env(safe-area-inset-left));top:calc(8px + env(safe-area-inset-top));display:flex;align-items:center;gap:12px;z-index:5}
.back{background:none;border:0;padding:8px 6px;font-size:15px;letter-spacing:.18em;text-transform:uppercase;color:rgba(212,165,55,.78);cursor:pointer;text-decoration:none;text-shadow:0 0 8px #000}
.back:hover,.back:focus-visible{color:var(--gold2);outline:none}
.rname{font-size:13px;letter-spacing:.3em;text-transform:uppercase;color:rgba(241,233,214,.5);text-shadow:0 0 8px #000}
/* cinematic text */
.t{opacity:0;transform:translateY(8px);transition:opacity 1.3s ease,transform 1.3s ease;text-shadow:0 0 18px #000,0 0 6px #000,0 0 2px #000}
.t.in{opacity:1;transform:none}
h1.t,h2.t{font-weight:400;margin:0;text-align:center}
.title{font-size:clamp(44px,9vw,86px);letter-spacing:.06em;color:#f6ecd2;text-shadow:0 0 30px rgba(212,165,55,.35),0 0 8px #000}
.sub{font-style:italic;font-size:clamp(19px,4.6vw,26px);color:var(--gold2);letter-spacing:.08em;margin-top:4px}
.lead,.body,.small{margin-left:auto;margin-right:auto}
.lead{font-style:italic;font-size:clamp(21px,5.2vw,30px);line-height:1.3;text-align:center;max-width:680px;color:#f6ecd2}
.body{font-size:clamp(18px,4.4vw,22px);line-height:1.42;text-align:center;max-width:640px;color:var(--ink)}
.small{font-size:clamp(14px,3.6vw,16px);line-height:1.45;color:var(--mute);text-align:center;max-width:560px;letter-spacing:.02em}
.small a{color:var(--gold)}
.ar{font-size:clamp(24px,6vw,32px);direction:rtl;color:var(--gold2);text-align:center;line-height:1.7;font-family:"Amiri","Scheherazade New","Noto Naskh Arabic","Geeza Pro",serif}
.go{background:none;border:0;cursor:pointer;padding:12px 18px;min-height:44px;font-size:clamp(16px,4vw,18px);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);text-shadow:0 0 10px #000,0 0 3px #000;transition:color .3s,letter-spacing .4s}
.go:hover,.go:focus-visible{color:var(--gold2);letter-spacing:.28em;outline:none}
.go.quiet{color:rgba(212,165,55,.6);font-size:14px}
.row{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 18px}
.opts{display:flex;flex-direction:column;align-items:stretch;gap:2px;width:min(640px,100%);margin-top:14px}
.opt{background:none;border:0;text-align:left;cursor:pointer;padding:10px 4px 10px 30px;min-height:44px;font-size:clamp(17px,4.2vw,20.5px);line-height:1.32;color:#efe6d0;position:relative;text-shadow:0 0 12px #000,0 0 4px #000,0 0 2px #000;transition:color .35s,opacity .8s,transform .35s;border-bottom:1px solid rgba(212,165,55,.0)}
.opt::before{content:"";position:absolute;left:8px;top:22px;width:9px;height:1px;background:var(--gold);opacity:.7;transition:width .35s,opacity .35s}
.opt:hover,.opt:focus-visible{color:#fff6dc;outline:none;transform:translateX(3px)}
.opt:hover::before,.opt:focus-visible::before{width:16px;opacity:1}
.opts.done .opt{opacity:.14;pointer-events:none}
.opts.done .opt.pick{opacity:.8}
.opts.done .opt.pick::before{width:16px;opacity:1}
.reveal{max-width:640px;text-align:center;margin-top:12px;min-height:3em}
.reveal p{margin:6px 0}
.drv{font-size:clamp(18px,4.4vw,21px);line-height:1.4;color:#f6ecd2}
.drv b{font-weight:500;color:var(--gold2)}
.oth{font-style:italic;font-size:clamp(16.5px,4vw,19px);line-height:1.4;color:#d9cba6}
.count{font-size:12.5px;letter-spacing:.3em;color:rgba(212,165,55,.6);text-transform:uppercase;text-shadow:0 0 6px #000}
.scroll{position:absolute;left:0;right:0;bottom:0;top:var(--uiTop,0px);overflow-y:auto;justify-content:safe center;-webkit-overflow-scrolling:touch;padding:0 22px calc(26px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;pointer-events:auto;scrollbar-width:none}
.scroll::-webkit-scrollbar{display:none}
.center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:70px 22px calc(40px + env(safe-area-inset-bottom));pointer-events:none}
.center>*{pointer-events:auto}
[hidden]{display:none!important}
/* lobby */
.lobby-bg{position:absolute;inset:0;background:radial-gradient(ellipse 70% 55% at 50% 38%,#2a2010 0%,#0d0a07 45%,#000 80%)}
.lobby-bg::after{content:"";position:absolute;left:0;right:0;bottom:0;height:34%;background:linear-gradient(to bottom,transparent,rgba(212,165,55,.05) 30%,rgba(0,0,0,.6));}
.doors{position:absolute;left:0;right:0;top:50%;transform:translateY(-46%);display:flex;justify-content:center;gap:clamp(10px,2.2vw,30px);padding:0 16px;flex-wrap:wrap;align-items:flex-start}
.door{position:relative;display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--ink);width:clamp(120px,15vw,200px);cursor:pointer;opacity:0;transform:translateY(14px);transition:opacity 1.2s ease,transform 1.2s ease}
.door.in{opacity:1;transform:none}
.arch{position:relative;width:100%;aspect-ratio:3/5;border-radius:999px 999px 4px 4px;overflow:hidden;box-shadow:0 0 0 1px rgba(212,165,55,.45),0 0 26px rgba(212,165,55,.12),inset 0 0 40px rgba(0,0,0,.7);transition:box-shadow .5s,transform .6s}
.arch img{position:absolute;height:100%;width:auto;top:0;left:50%;transform:translateX(-50%) scale(1.04);filter:brightness(.62) saturate(.9);transition:filter .7s,transform 8s ease-out;max-width:none}
.arch::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.05),rgba(0,0,0,.55));pointer-events:none}
.door:hover .arch,.door:focus-visible .arch{box-shadow:0 0 0 1px rgba(255,224,138,.9),0 0 40px rgba(255,214,140,.35),inset 0 0 30px rgba(0,0,0,.5)}
.door:hover .arch img,.door:focus-visible .arch img{filter:brightness(.95) saturate(1);transform:translateX(-50%) scale(1.12)}
.door:focus-visible{outline:none}
.door b{display:block;margin-top:12px;font-weight:400;font-size:clamp(18px,2vw,22px);letter-spacing:.06em;color:#f6ecd2;text-shadow:0 0 10px #000}
.door small{display:block;font-style:italic;font-size:clamp(13.5px,1.4vw,15.5px);color:var(--mute);text-align:center;margin-top:2px;line-height:1.25}
.lobby-h{position:absolute;left:0;right:0;top:calc(9% + env(safe-area-inset-top));text-align:center}
@media (max-width:760px){.doors{top:auto;bottom:calc(16px + env(safe-area-inset-bottom));transform:none;gap:14px 12px;align-items:flex-start}.door{width:calc(33.3% - 10px);max-width:150px}.door small{font-size:12.5px}.door b{font-size:17px;margin-top:8px}.lobby-h{top:calc(64px + env(safe-area-inset-top))}}
@media (max-width:760px) and (max-height:700px){.door{width:calc(20% - 10px)}.door small{display:none}}
/* scale & weights extras */
.meter{position:absolute;right:calc(14px + env(safe-area-inset-right));top:calc(12px + env(safe-area-inset-top));text-align:right;z-index:4}
.meter .lbl{font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;color:rgba(241,233,214,.55);text-shadow:0 0 6px #000;margin-right:36px}
.meter .num{font-size:28px;color:var(--gold2);text-shadow:0 0 14px rgba(255,214,140,.5),0 0 4px #000;margin-right:36px;line-height:1.1}
.meter .bar{width:150px;height:2px;margin:6px 36px 0 auto;background:rgba(212,165,55,.18);position:relative;overflow:hidden}
.meter .bar i{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#b8862b,#ffe08a);box-shadow:0 0 10px #ffe08a;transition:width 1.6s ease}
.plates{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 6px;max-width:720px;margin-top:10px}
.plate{background:none;border:0;cursor:pointer;padding:8px 10px;min-height:40px;font-size:clamp(16px,4vw,19px);color:#efe6d0;letter-spacing:.04em;text-shadow:0 0 10px #000,0 0 3px #000;transition:color .3s}
.plate small{font-size:12px;color:var(--gold);letter-spacing:.12em;margin-left:4px}
.plate:hover,.plate:focus-visible{color:var(--gold2);outline:none}
.platebig{font-size:clamp(30px,7vw,52px);letter-spacing:.32em;color:rgba(241,233,214,.85);text-shadow:0 0 24px rgba(0,0,0,.9),0 0 8px #000;text-align:center;margin-left:.32em}
.reps{display:flex;gap:10px;justify-content:center;margin:8px 0 2px}
.reps i{width:26px;height:2px;background:rgba(212,165,55,.22);transition:background .8s,box-shadow .8s}
.reps i.on{background:var(--gold2);box-shadow:0 0 10px var(--gold2)}
/* stretch */
.hold{position:relative;width:112px;height:112px;border-radius:50%;border:0;background:none;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;margin:10px auto 0;display:block}
.hold svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.hold circle{fill:none;stroke-width:1.5}
.hold .bg{stroke:rgba(212,165,55,.25)}
.hold .fg{stroke:var(--gold2);stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(255,224,138,.8))}
.hold span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);line-height:1.3;padding:14px;text-shadow:0 0 8px #000}
.hold:focus-visible{outline:1px solid var(--gold2)}
.mono{max-width:600px;text-align:center;font-style:italic;font-size:clamp(18.5px,4.6vw,23px);line-height:1.38;color:#f6ecd2}
.mono p{margin:6px 0}
.who{font-size:13px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);text-shadow:0 0 8px #000}
textarea.mine{width:min(560px,100%);min-height:70px;margin-top:10px;background:rgba(0,0,0,.35);border:0;border-bottom:1px solid rgba(212,165,55,.45);color:var(--ink);font:italic 18px/1.4 "Cormorant Garamond",Georgia,serif;padding:8px 6px;resize:vertical;outline:none}
textarea.mine:focus{border-bottom-color:var(--gold2)}
input.mine{width:min(520px,100%);background:rgba(0,0,0,.35);border:0;border-bottom:1px solid rgba(212,165,55,.45);color:var(--ink);font:italic 20px/1.4 "Cormorant Garamond",Georgia,serif;padding:8px 6px;outline:none;text-align:center}
.sil{position:absolute;pointer-events:none;transform-origin:50% 100%;background-repeat:no-repeat;-webkit-mask-image:radial-gradient(ellipse 48% 52% at 50% 50%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 48% 52% at 50% 50%,#000 55%,transparent 100%);transition:filter 1.2s ease,opacity 1.2s;animation:sway 7s ease-in-out infinite alternate;opacity:.85}
@keyframes sway{0%{transform:rotate(-.5deg) translateX(-.3px)}50%{transform:rotate(.25deg) translateX(.4px) scaleY(1.004)}100%{transform:rotate(.55deg) translateX(.2px)}}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 4px;max-width:640px;margin-top:6px}
.chip{background:none;border:0;cursor:pointer;padding:8px 10px;min-height:40px;font-size:clamp(16px,4vw,19px);font-style:italic;color:#e9dfc6;text-shadow:0 0 10px #000,0 0 3px #000}
.chip:hover,.chip:focus-visible,.chip.sel{color:var(--gold2);outline:none}
/* ring */
.critic{font-style:italic;font-size:clamp(24px,6vw,36px);line-height:1.25;color:#f0b8a6;text-align:center;max-width:620px;text-shadow:0 0 22px rgba(160,30,10,.65),0 0 6px #000,0 0 2px #000}
.smoke{transform-origin:66% 78%;transition:transform 2.4s cubic-bezier(.3,.7,.2,1),opacity 2.4s ease}
.ropes2{mix-blend-mode:screen;opacity:.15;filter:brightness(1.5);will-change:opacity;animation:ropeglint 4.7s ease-in-out infinite alternate}
@keyframes ropeglint{0%{opacity:.08}60%{opacity:.42}100%{opacity:.2}}
.flash{position:fixed;inset:0;background:radial-gradient(circle at 55% 52%,#fff6e0,#d4a537 45%,#000 100%);opacity:0;pointer-events:none;z-index:50;transition:opacity .9s ease}
.flash.on{opacity:1}
.sitting .ui{opacity:0;transition:opacity 2s}
.sitting .top{opacity:.25}
@media (prefers-reduced-motion:reduce){.kb.push,.sil,.ropes2{animation:none}.t,.room,.door{transition-duration:.01s}}
@media (max-width:600px){.meter .num{font-size:22px}.meter .bar{width:110px}.ui{padding-left:16px;padding-right:16px}}

.ext{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:calc(11vh + env(safe-area-inset-top)) 22px calc(9vh + env(safe-area-inset-bottom));pointer-events:none}.ext>*{pointer-events:auto;text-align:center}

@media (max-width:520px){.rname{display:none}}

.smokewrap{transform-origin:66% 80%;will-change:transform;animation:smokebreath 11.3s ease-in-out infinite alternate}
@keyframes smokebreath{from{transform:scale(.988)}to{transform:scale(1.012)}}
@media (prefers-reduced-motion:reduce){.smokewrap{animation:none}}