*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-sans);font-size:1.125rem;line-height:1.6;
  color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--font-serif);font-weight:500;line-height:1.25;margin:0 0 var(--space-2)}
h1{font-size:clamp(2.25rem,5vw + 1rem,3.75rem);line-height:1.2}
h2{font-size:clamp(1.5rem,2.5vw + .75rem,2.4rem)}
h3{font-size:clamp(1.25rem,1.5vw + .75rem,1.6rem)}
p{margin:0 0 var(--space-2)}
a{color:var(--color-accent)}
small,.small{font-size:.875rem;line-height:1.5;font-weight:500}
img,video{max-width:100%;height:auto}
:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}
main{display:block}

.shell-bar{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;
  justify-content:space-between;gap:var(--space-2);padding:0 var(--space-2);height:60px;
  background:transparent;border:0}

.shell-bar::before{content:"";position:absolute;inset:0 0 -34px;z-index:-1;pointer-events:none;
  backdrop-filter:blur(14px) saturate(1.06) brightness(1.03);
  -webkit-backdrop-filter:blur(14px) saturate(1.06) brightness(1.03);
  background:url(../assets/cloud3.webp?v=1786426043) 0 60% / 64% 190% repeat-x,
    url(../assets/cloud1.webp?v=1784710734) 28% 28% / 52% 170% repeat-x,
    linear-gradient(180deg, rgb(255 253 248 / .5), rgb(255 253 248 / .28) 55%, rgb(255 253 248 / 0));
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 60%,transparent);
  mask-image:linear-gradient(180deg,#000 0,#000 60%,transparent);
  animation:cloudmorph 40s ease-in-out infinite alternate}
@keyframes cloudmorph{
  from{background-position:0 60%, 28% 28%, 0 0; background-size:64% 190%, 52% 170%, 100% 100%}
  to{  background-position:16% 54%, 18% 34%, 0 0; background-size:74% 212%, 60% 188%, 100% 100%}}
@media (prefers-reduced-motion: reduce){.shell-bar::before{animation:none}}
.shell-bar::after{content:"";position:absolute;inset:0 0 auto;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent 4%,rgb(255 255 255 / .8),transparent 96%)}
.shell-bar.transparent{position:fixed}

.shell-actions .btn{border-radius:999px;min-height:38px;padding:.35rem 1.15rem;font-size:.82rem;
  letter-spacing:.05em;color:#5a4a2a;border:1px solid rgb(217 182 98 / .45);
  background:linear-gradient(180deg, rgb(255 255 255 / .85), rgb(255 250 236 / .5));
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .9), 0 2px 12px rgb(150 110 40 / .10);
  transition:box-shadow .4s var(--ease-veil),border-color .4s ease}
.shell-actions .btn:hover,.shell-actions .btn:focus-visible{border-color:#d9b662;
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .95), 0 0 24px rgb(231 207 141 / .55)}
.shell-actions .btn-primary{color:#3a3040;border-color:rgb(217 182 98 / .8);
  background:linear-gradient(180deg,#f3e0b0,#dfc077)}
.wordmark{font-family:var(--font-serif);font-size:1.05rem;color:var(--color-text);text-decoration:none;
  display:flex;align-items:center;min-height:44px}
.shell-room{font-size:.875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-muted)}
.shell-actions{display:flex;gap:var(--space-1);align-items:center}
.wrap{max-width:44rem;margin:0 auto;padding:0 var(--space-2)}
.wrap-wide{max-width:64rem;margin:0 auto;padding:0 var(--space-2)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:44px;
  padding:var(--space-1) var(--space-3);border-radius:var(--radius-md);border:1px solid transparent;
  font-family:var(--font-sans);font-size:.9rem;font-weight:500;letter-spacing:.02em;cursor:pointer;
  text-decoration:none;transition:box-shadow var(--t-move) var(--ease-veil),transform var(--t-touch)}
.btn:active{transform:scale(.98)}
.btn{white-space:nowrap}
.btn-primary{background:linear-gradient(180deg,var(--gold),var(--color-primary));color:var(--on-primary);
  border-color:var(--color-primary)}

@media (hover:hover){.btn-primary:hover{box-shadow:var(--shadow-lifted);filter:brightness(1.05)}}
.btn-secondary{background:transparent;border-color:var(--color-border);color:var(--color-text)}
@media (hover:hover){.btn-secondary:hover{border-color:var(--color-accent)}}
.btn-destructive{background:var(--color-error);color:#fff}

.ceremony{position:relative;min-height:100svh;overflow:hidden;
  background:linear-gradient(rgb(255 255 255 / .28), rgb(255 253 248 / .10) 40%, rgb(255 255 255 / .20)),
  url(../assets/temple-entrance.webp?v=1784710734) center bottom/cover no-repeat}

.ceremony video.hero-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center bottom;z-index:0;pointer-events:none}
@media (prefers-reduced-motion: reduce){.ceremony video.hero-loop{display:none}}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .ceremony{background:linear-gradient(rgb(255 255 255 / .28), rgb(255 253 248 / .10) 40%, rgb(255 255 255 / .20)),
    url(../assets/temple-entrance-portrait.webp?v=1784710734) center bottom/cover no-repeat}
}
.ceremony::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(ellipse 70% 55% at 50% 44%, rgb(255 255 255 / .10), rgb(255 253 245 / .05) 45%, rgb(255 255 255 / 0) 70%)}
.ceremony > *{position:relative;z-index:2}

.ceremony .hero-white::before{content:"";position:absolute;inset:-18% -28%;z-index:-1;pointer-events:none;
  backdrop-filter:blur(12px) brightness(1.04) saturate(1.05);
  -webkit-backdrop-filter:blur(12px) brightness(1.04) saturate(1.05);
  -webkit-mask-image:radial-gradient(ellipse 58% 54% at 50% 46%, #000 34%, transparent 74%);
  mask-image:radial-gradient(ellipse 58% 54% at 50% 46%, #000 34%, transparent 74%)}
.ceremony .hero-white .kicker{color:rgb(255 252 244 / .95);
  text-shadow:0 1px 2px rgb(110 90 55 / .32), 0 1px 10px rgb(110 90 55 / .18)}
.ceremony .hero-white h1.v1-title{color:#fff;letter-spacing:1px;text-wrap:balance;font-weight:500;
  font-size:clamp(2.4rem,4.5vw + 1rem,5rem);line-height:1.15;
  text-shadow:0 1px 2px rgb(110 90 55 / .32), 0 2px 18px rgb(110 90 55 / .16), 0 0 40px rgba(255,255,255,.35)}
.v1-enter{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-serif);
  background:rgb(255 253 246 / .82);color:#5a4a2a;padding:17px 54px;font-size:1.02rem;
  letter-spacing:.22em;text-indent:.22em;text-decoration:none;border-radius:3px;
  border:1px solid rgb(217 182 98 / .75);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  box-shadow:inset 0 0 0 3px rgb(255 255 255 / .45), 0 4px 24px rgb(160 120 40 / .14),
    0 0 30px rgb(255 244 210 / .35);
  transition:all .5s var(--ease-veil)}
.v1-enter:hover,.v1-enter:focus-visible{background:linear-gradient(180deg,#efd9a4,#d9b662);
  color:#3a3040;border-color:#d9b662;
  box-shadow:0 0 46px rgb(231 207 141 / .85), inset 0 1px 0 rgb(255 255 255 / .55)}
.ceremony .hero-white .lead{color:rgb(255 252 244 / .98);
  text-shadow:0 1px 2px rgb(110 90 55 / .32), 0 1px 10px rgb(110 90 55 / .18)}
.btn-white{background:rgb(255 255 255 / .96);color:var(--color-text);border-color:rgb(255 255 255 / .96);
  letter-spacing:.14em}
.btn-white:hover{box-shadow:0 0 40px rgb(255 246 214 / .8)}

#gold-flash{position:fixed;inset:0;z-index:65;pointer-events:none;opacity:0;
  background:radial-gradient(ellipse 110% 100% at 50% 45%, #ffffff, #ffffff 46%, #fffef9 66%, #fdf8ea 82%, #f6e9cd 96%, #e2c894 120%);
  transition:opacity var(--t-breath) var(--ease-veil)}
#gold-flash.on{opacity:1}

html.from-light::after{content:"";position:fixed;inset:0;z-index:70;pointer-events:none;
  background:radial-gradient(ellipse 110% 100% at 50% 45%, #ffffff, #ffffff 46%, #fffef9 66%, #fdf8ea 82%, #f6e9cd 96%, #e2c894 120%);
  animation:lightdissolve 1400ms var(--ease-veil) forwards}
.porch{position:relative;text-align:center;padding:calc(56px + var(--space-2)) var(--space-2) var(--space-2);max-width:40rem}
.porch .kicker{letter-spacing:.22em;text-transform:uppercase;font-size:.875rem;color:var(--color-text-muted)}
.porch h1{margin-top:var(--space-2)}
.porch .lead{font-size:1.15rem;color:var(--color-text-muted)}
.skip-intro{position:absolute;top:calc(56px + var(--space-1));right:var(--space-2);z-index:50;
  min-height:44px;min-width:44px;display:none;align-items:center;padding:0 var(--space-2);
  background:rgb(255 255 255 / .7);border:1px solid var(--color-border);border-radius:var(--radius-sm);
  color:var(--color-text);text-decoration:none;font-size:.875rem;backdrop-filter:blur(4px)}

.ceremony > #skip-intro{z-index:61}

.veil-video{position:fixed;inset:0;z-index:60;width:100%;height:100%;object-fit:cover;
  object-position:center bottom;background:#fff;
  opacity:0;pointer-events:none;transition:opacity .16s linear}
.veil-video.playing{opacity:1;pointer-events:auto}
.fade-in{animation:fadein var(--t-breath) var(--ease-veil)}

html.seamless-arrive body.fade-in{animation:none}
html.seamless-arrive .shell-bar{opacity:0;animation:barbreathe 1.4s var(--ease-veil) 1.1s forwards}
@keyframes barbreathe{to{opacity:1}}
@keyframes fadein{from{opacity:0}}

@media (prefers-reduced-motion: reduce){
  .fade-in{animation:none}
}

.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);
  box-shadow:var(--shadow-veil);padding:var(--space-3);margin-bottom:var(--space-2)}
.card h3{margin-bottom:var(--space-1)}
.stack{display:grid;gap:var(--space-2);padding:var(--space-3) 0}
.row{display:flex;justify-content:space-between;gap:var(--space-2);padding:var(--space-1) 0;
  border-bottom:1px solid var(--color-border)}
.row:last-child{border-bottom:none}
.pill{display:inline-block;padding:.15em .8em;border-radius:999px;font-size:.875rem;font-weight:500}
.pill--active{background:var(--color-success);color:#fff}
.pill--off{background:var(--color-border);color:var(--color-text-muted)}

.book-panel{max-width:26rem;margin:8vh auto;background:var(--color-surface);border-radius:var(--radius-md);
  box-shadow:var(--shadow-sanctum);padding:calc(var(--space-3)*1.2);border:1px solid var(--color-border)}

.book-panel .field{display:block;margin-bottom:.9rem}
.book-panel .field span{display:block;font-size:.85rem;font-weight:500;margin-bottom:.3rem;
  color:var(--color-text)}
.book-panel .field input{width:100%;min-height:44px;font:inherit;padding:.6rem;
  color:var(--color-text);background:var(--color-bg);
  border:1px solid var(--color-border);border-radius:var(--radius-sm)}
.book-panel .field input:focus-visible{outline:2px solid #8a6f2e;outline-offset:1px;
  border-color:#8a6f2e}
.book-panel .field textarea{min-height:44px}

.book-room{position:relative;min-height:100svh;display:grid;place-items:center;padding:4vh var(--space-2);overflow:clip;
  background:#dfeefa}

.v1-sky{position:fixed;inset:0;pointer-events:none}
.v1-sky .bg{position:absolute;inset:0;background:url(../assets/home-bg.webp?v=1784710734) center/cover no-repeat}
.v1-sky .cloud-track{position:absolute;inset:0 0 auto;height:88%;opacity:.85;overflow:hidden}
.v1-sky .cloud-list{position:absolute;top:0;left:0;height:100%;display:flex;flex:none;
  
  will-change:transform;animation:marquee 96s linear infinite reverse}
.v1-sky .cloud-list img{height:100%;width:auto;aspect-ratio:140/19;display:block;flex:none}
@keyframes marquee{from{transform:translateX(-50%)}to{transform:translateX(0%)}}
.v1-sky .grad{position:absolute;inset:auto 0 0;height:50%;
  background:linear-gradient(180deg,rgb(255 255 255 / 0) 0%,rgb(255 255 255 / .5) 60%,rgb(255 255 255 / .92) 100%)}

.v1-sky .interior{position:absolute;inset:0;background-image:url(../assets/temple-interior.webp?v=1785136000);
  background-size:cover;background-position:center}
@media (prefers-reduced-motion: reduce){.v1-sky .cloud-list{animation:none}}

.auth-panel.dissolve{opacity:0;transform:scale(.96);filter:blur(8px);
  transition:opacity .44s var(--ease-veil),transform .44s var(--ease-veil),filter .44s var(--ease-veil)}
.auth-brand.dissolve{opacity:0;transition:opacity .44s var(--ease-veil)}

.brand-logo{display:inline-flex;align-items:center;min-height:44px;flex:0 0 auto}

.brand-logo img{height:30px;width:auto;display:block}
.shell-tabs{display:flex;gap:clamp(.5rem,2.2vw,1.8rem);overflow-x:auto;scrollbar-width:none}
.shell-tabs a{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--color-text);
  text-decoration:none;padding:.3rem .1rem;border-bottom:2px solid transparent;min-height:44px;
  display:inline-flex;align-items:center;white-space:nowrap}
.shell-tabs a:hover{color:var(--color-accent)}
.shell-tabs a.active{border-bottom-color:#d9b662;color:var(--color-text)}
.shell-bar.transparent .shell-tabs a{text-shadow:0 1px 8px rgb(255 255 255 / .9)}

.tab-out{display:inline-flex;align-items:center;gap:.4rem}
.tab-out svg{width:.62em;height:.62em;flex:0 0 auto;opacity:.5;transform:translateY(-.18em);
  transition:opacity .2s var(--ease-veil)}
.tab-out:hover svg,.tab-out:focus-visible svg{opacity:1}
@media (prefers-reduced-motion:reduce){.tab-out svg{transition:none}}

.lobby-return{position:fixed;right:1.4rem;bottom:1.2rem;z-index:40;font-family:var(--font-serif);
  font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;
  color:rgb(90 74 42 / .62);background:rgb(255 253 246 / .55);border:1px solid rgb(217 182 98 / .35);
  border-radius:999px;padding:.55rem 1.1rem;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:color .5s var(--ease-veil),background .5s var(--ease-veil),border-color .5s var(--ease-veil),box-shadow .5s var(--ease-veil)}
.lobby-return:hover,.lobby-return:focus-visible{color:#5a4a2a;background:rgb(255 253 246 / .9);
  border-color:rgb(217 182 98 / .75);box-shadow:0 0 30px rgb(255 244 210 / .5)}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  
  .lobby-return{position:fixed;right:auto;bottom:auto;left:8px;z-index:41;
    top:calc(env(safe-area-inset-top,0px) + 8px);
    min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;
    padding:0 .9rem;font-size:0;letter-spacing:0;pointer-events:auto}
  .lobby-return span{font-size:1.4rem;line-height:1}   
  body:has(.lobby-return) .shell-bar .brand-logo{margin-left:50px}}

@media (max-width:1319px) and (min-width:1025px){
  .shell-bar .brand-logo img{content:url(../assets/logo-mark.svg?v=1786426043)}
  .shell-tabs{gap:.75rem}
  .shell-tabs a{letter-spacing:.12em}
}

.menu-btn,.mobile-menu{display:none}
@media (max-width:1024px){
  
  :root{--bar-h:calc(60px + env(safe-area-inset-top))}
  
  .shell-bar{flex-wrap:nowrap;height:var(--bar-h);
    padding:env(safe-area-inset-top) calc(var(--space-2) + env(safe-area-inset-right))
            0 calc(var(--space-2) + env(safe-area-inset-left))}
  .shell-tabs,.shell-actions{display:none}
  
  .shell-bar:not(:has(.menu-btn)) .shell-actions{display:flex}
  
  .shell-bar:not(:has(.menu-btn)) .shell-actions .btn{min-height:44px}
  
  body{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}
  .music-toggle:hover:not(:focus-visible){box-shadow:none}
  .shell-bar .shell-actions .btn:hover:not(:focus-visible){border-color:rgb(217 182 98 / .45);
    box-shadow:inset 0 1px 0 rgb(255 255 255 / .9), 0 2px 12px rgb(150 110 40 / .10)}
  .gl-rail a:hover:not(:focus-visible){background:none;color:#6f5a26}
  .shell-bar .menu-btn{display:flex;flex-direction:column;gap:5px;justify-content:center;align-items:center;
    width:44px;height:44px;flex:none;border:1px solid rgb(217 182 98 / .45);border-radius:50%;cursor:pointer;
    background:linear-gradient(180deg, rgb(255 255 255 / .85), rgb(255 250 236 / .5));
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
  .menu-btn span{display:block;width:18px;height:1.5px;background:#5a4a2a;border-radius:1px;
    transition:transform .35s var(--ease-veil),opacity .25s}
  .menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  .menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0}
  .menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
  .mobile-menu{position:fixed;inset:var(--bar-h) 0 0;z-index:39;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:.9rem;overscroll-behavior:contain;
    background:rgb(255 253 246 / .55);backdrop-filter:blur(30px) saturate(1.5);
    -webkit-backdrop-filter:blur(30px) saturate(1.5)}
  
  html:has(.menu-btn[aria-expanded="true"]){overflow:hidden}
  .mobile-menu>a{font-family:var(--font-serif);font-size:1.3rem;letter-spacing:.14em;text-transform:uppercase;
    color:var(--color-text);text-decoration:none;padding:.4rem 1rem;min-height:44px;display:flex;align-items:center}
  .mobile-menu-actions{display:flex;gap:1rem;margin-top:1.8rem}
  .mobile-menu-actions .btn{min-width:8.2rem;min-height:44px;display:inline-flex;
    align-items:center;justify-content:center;font-size:.9rem;letter-spacing:.05em}
  .mobile-menu[hidden]{display:none}
}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){

  .deck-cue{position:fixed;left:50%;transform:translateX(-50%);
    bottom:calc(3.5svh + env(safe-area-inset-bottom));z-index:5;
    display:flex;flex-direction:column;align-items:center;gap:.1rem;pointer-events:none;
    color:#4a3a1c;opacity:.9;text-shadow:0 1px 8px rgb(255 255 255 / .9),0 0 18px rgb(255 255 255 / .7);
    transition:opacity .8s ease}
  .deck-cue span{font-size:.6rem;letter-spacing:.34em;text-transform:uppercase}
  .deck-cue .arr{font-size:1.1rem;animation:hintbob 2.6s ease-in-out infinite}
  @keyframes hintbob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
  .deck-cue.off{opacity:0}
}
@media (min-width:821px) and (min-height:501px){.deck-cue{display:none}}

.temple-scene{position:relative;min-height:100svh;overflow:clip;background:#f6efdf}
body:has(.temple-scene){background:#f6efdf}
body:has(.book-room){background:#dfeefa}

.scene-frame{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:0;
  aspect-ratio:1561/1008;min-width:100vw;min-height:100vh;
  min-width:100lvw;min-height:100lvh}
.scene-zoom{position:absolute;inset:0;transition:transform 1.6s cubic-bezier(.6,.05,.35,1)}
.scene-zoom.push{transform:scale(2.8)}

.scene-zoom .stage{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;user-select:none;pointer-events:none}

.stage-live{opacity:0;transition:opacity 2s var(--ease-veil)}
.stage-live.on{opacity:1}

.stage-ambient{opacity:0;transition:opacity .5s var(--ease-veil);pointer-events:none;z-index:1}
.stage-ambient.on{opacity:1}
@media (prefers-reduced-motion: reduce){.stage-ambient{display:none}}
.stage-ajar{opacity:0;transition:opacity .7s var(--ease-veil)}
.temple-scene.opening .stage-ajar.on{opacity:1}
.arch{position:absolute;display:block;text-decoration:none;cursor:pointer;outline-offset:4px;
  border-radius:46% 46% 6px 6px / 30% 30% 6px 6px}
.arch .halo{position:absolute;inset:-14% -20%;border-radius:inherit;opacity:0;transition:opacity .5s ease;
  background:radial-gradient(ellipse 62% 58% at 50% 62%, rgb(255 240 198 / .6), rgb(255 240 198 / 0) 72%);
  filter:blur(5px);pointer-events:none}
.arch:focus-visible .halo{opacity:1}
@media (hover:hover){.arch:hover .halo{opacity:1}}
.arch:active .halo{opacity:1}   
.arch .plate{position:absolute;left:50%;top:calc(100% + .5rem);transform:translateX(-50%);white-space:nowrap;
  font-family:var(--font-serif);font-size:clamp(.72rem,1vw,.95rem);letter-spacing:.2em;text-transform:uppercase;
  color:#565073;text-shadow:0 1px 10px rgb(255 255 255 / .95),0 0 24px rgb(255 255 255 / .8);
  opacity:.85;transition:opacity .3s;text-align:center}
.arch--soon{cursor:default}
.arch--soon .halo{background:radial-gradient(ellipse 62% 58% at 50% 62%, rgb(205 218 240 / .45), transparent 72%)}
.arch--soon .plate small{display:block;font-size:.78em;letter-spacing:.3em;color:#565073;text-transform:uppercase}
.scene-greeting{position:absolute;top:5%;left:0;right:0;text-align:center;pointer-events:none;
  font-family:var(--font-serif);font-weight:500;font-size:clamp(1.2rem,1.6vw + .6rem,1.9rem);letter-spacing:.14em;
  text-transform:uppercase;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.22),0 0 30px rgba(255,255,255,.3)}
.scene-flash{position:absolute;inset:0;z-index:6;pointer-events:none;opacity:0;transition:opacity .9s ease;
  background:radial-gradient(ellipse 85% 75% at 50% 55%, #ffffff, #fcfcf9 35%, #faf9e7 60%, #f0e2c0 85%, #d9b662 120%)}
.temple-scene.flash .scene-flash{opacity:1}

.door-film{position:absolute;left:0;width:100%;top:5.5556%;height:88.8889%;
  object-fit:fill;z-index:5;pointer-events:none;opacity:0;transition:opacity .18s linear}
.door-film.on{opacity:1}

.door-film-stage{position:fixed;inset:0;overflow:hidden;z-index:5;pointer-events:none}

.door-film--full{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:calc(100svh * 9 / 16);height:100svh;max-width:none;max-height:none;object-fit:fill}
@media (prefers-reduced-motion:reduce){.door-film{display:none}}

.room-panel{position:relative;z-index:4;width:min(92vw,44rem);margin:0 auto;
  padding:calc(56px + 6svh) 0 12svh}

.room-panel .pane{background:rgb(255 253 246 / .3);backdrop-filter:blur(22px) saturate(1.5);
  -webkit-backdrop-filter:blur(22px) saturate(1.5);
  border:1px solid rgb(255 255 255 / .5);border-radius:10px;
  box-shadow:0 16px 44px rgb(120 90 30 / .16);padding:clamp(1.4rem,3vw,2.4rem);
  margin-bottom:1.2rem}
.room-panel h1{font-size:clamp(1.5rem,2vw + .6rem,2.1rem);margin:0 0 .5rem}
.room-panel h2{font-size:clamp(1.1rem,1.2vw + .5rem,1.4rem);margin:0 0 .6rem}
.room-panel .pane .small{color:#55506b}

.scene-frame--med{aspect-ratio:3/2}

.stage-dim{opacity:0;transition:opacity 2.4s var(--ease-veil)}
.room-scene.dimmed .stage-dim{opacity:1}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .room-scene .scene-frame{position:fixed;left:0;top:0;transform:none;min-width:0;width:100vw;
    aspect-ratio:auto;min-height:0;height:100lvh}
  .room-scene .stage{object-fit:cover;object-position:center 30%}
  .room-panel{padding-top:calc(var(--bar-h) + 3svh)}
}

.door-deck,.pan-plate{display:none}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  
  .temple-scene:has(.door-deck){height:100svh;min-height:0;overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x mandatory;overscroll-behavior:contain;touch-action:pan-x;
    scrollbar-width:none;
    
    display:flex;align-items:center}
  .temple-scene:has(.door-deck)::-webkit-scrollbar{display:none}
  
  .temple-scene:has(.door-deck) .scene-frame{display:block;position:relative;left:auto;top:auto;
    transform:none;height:max(100lvh, 100vw * 1008 / 1561);
    width:max(100vw, 100lvh * 1561 / 1008);min-width:0;min-height:0;
    aspect-ratio:auto;flex:none}
  
  .temple-scene:has(.door-deck) .arch{scroll-snap-align:center;scroll-snap-stop:always}
  
  .temple-scene:has(.door-deck) .arch.locked .halo{opacity:1}
  .temple-scene:has(.door-deck) .stage-ajar.ajar{opacity:1}
  
  .temple-scene:has(.door-deck) .scene-flash{position:fixed}
  
  .temple-scene:has(.door-deck) .door-deck{display:none!important}
  
  .pan-plate{position:fixed;left:50%;transform:translateX(-50%);bottom:3.2svh;z-index:7;
    display:flex;align-items:center;justify-content:center;min-height:44px;
    padding:.5rem 1.6rem;text-decoration:none;border-radius:999px;
    background:rgb(255 253 246 / .5);border:1px solid rgb(217 182 98 / .42);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    box-shadow:0 2px 20px rgb(255 244 210 / .5);
    transition:opacity .45s var(--ease-veil)}
  .pan-plate .pan-name{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .pan-plate .pan-step{font-family:var(--font-serif);font-size:.72rem;letter-spacing:.3em;
    text-transform:uppercase;color:#5a4a2a;line-height:1}
  .temple-scene.opening .pan-plate{opacity:0}
  
  .deck-cue--pan{bottom:calc(3.2svh + 62px)}
  .deck-cue--pan .arr{animation:hintsway 2.8s ease-in-out infinite}
  @keyframes hintsway{0%,100%{transform:translateX(-7px)}50%{transform:translateX(7px)}}
  .door-deck{display:block;position:relative;z-index:2;height:100svh;overflow-y:auto;
    scroll-snap-type:y mandatory;padding:0;scrollbar-width:none}
  .door-deck::-webkit-scrollbar{display:none}
  .door-card{display:block;position:relative;scroll-snap-align:start;scroll-snap-stop:always;
    width:100vw;height:100svh;margin:0;border-radius:0;border:0;box-shadow:none;overflow:hidden;
    cursor:pointer;transition:transform 1.1s var(--ease-veil),opacity 1.1s var(--ease-veil)}
  .door-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .door-card img.open{opacity:0;transition:opacity .7s var(--ease-veil)}
  .door-card.opening img.open{opacity:1}
  .door-card.opening{transform:scale(1.45);z-index:6}
  .door-card--soon{cursor:default}
  .door-card--soon::after{content:attr(data-soon);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    padding:.45em 1.1em;border-radius:999px;background:rgb(250 246 236 / .82);color:#6b6483;
    font-family:var(--font-serif);font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;white-space:nowrap}
  .door-deck.opening .door-card:not(.opening){opacity:0}
  .temple-scene:has(.door-deck) .scene-doorlist{display:none!important}
}
@media (max-width:820px) and (prefers-reduced-motion:reduce),(max-height:500px) and (orientation:landscape) and (prefers-reduced-motion:reduce){

  .temple-scene:has(.door-deck){height:auto;min-height:100svh;overflow-x:visible;scroll-snap-type:none}
  .temple-scene:has(.door-deck) .scene-frame{display:none}
  .temple-scene:has(.door-deck) .door-deck{display:block!important}
  .pan-plate,.deck-cue--pan{display:none!important}
}
.scene-doorlist{display:none}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .arch .plate{display:none}
  .scene-doorlist{position:absolute;left:0;right:0;bottom:0;z-index:5;display:flex;flex-wrap:wrap;gap:.5rem;
    justify-content:center;padding:1rem;background:linear-gradient(transparent, rgb(255 255 255 / .92) 40%)}
  .scene-doorlist a,.scene-doorlist span{font-family:var(--font-serif);font-size:.85rem;letter-spacing:.12em;
    text-transform:uppercase;padding:.6rem 1rem;min-height:44px;display:inline-flex;align-items:center}
  .scene-doorlist a{color:var(--color-text);background:rgb(255 255 255 / .9);border:1px solid var(--color-border);
    border-radius:var(--radius-sm);text-decoration:none}
  .scene-doorlist span{color:var(--color-text-muted)}
}
@media (prefers-reduced-motion: reduce){
  .scene-zoom{transition:none}
  .stage-ajar{transition:opacity .2s linear}
}
.field .err{display:none;color:var(--color-error);font-size:.8rem;margin-top:.3rem;text-transform:none;letter-spacing:0}
.field.invalid input{border-bottom-color:var(--color-error)!important}
.field.invalid .err{display:block}

.auth-panel{position:relative;max-width:26rem;width:100%;margin:0 auto;background:rgb(255 255 255 / .92);
  border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sanctum);
  padding:clamp(2rem,4vw,3rem);backdrop-filter:blur(4px)}

.auth-card{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(21rem,24rem);
  width:100%;max-width:62rem;margin:0 auto;background:rgb(255 251 241 / .80);
  border:1px solid rgb(255 255 255 / .55);border-radius:var(--radius-md);
  box-shadow:var(--shadow-sanctum);backdrop-filter:blur(26px) saturate(1.5);
  -webkit-backdrop-filter:blur(26px) saturate(1.5);overflow:hidden;
  transition:opacity .44s var(--ease-veil),transform .44s var(--ease-veil),filter .44s var(--ease-veil)}
.auth-card.dissolve{opacity:0;transform:scale(.96);filter:blur(8px)}
.auth-card .card-primer{position:relative;padding:clamp(1.8rem,3.2vw,2.8rem);
  border-right:1px solid rgb(217 182 98 / .4);
  background:linear-gradient(165deg, rgb(250 246 236 / .55), rgb(255 255 255 / .3))}
.auth-card .card-primer::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:url(../assets/temple-entrance.webp?v=1784710734) center bottom/cover no-repeat;opacity:.07}
.auth-card .card-primer>*{position:relative}
.card-primer .lead-line{font-family:var(--font-serif);font-size:clamp(1rem,.6vw + .85rem,1.18rem);
  line-height:1.65;margin:0 0 1.15rem;color:var(--color-text)}
.card-primer h3{font-family:var(--font-serif);font-weight:500;font-size:1.02rem;
  color:#7a6a3a;margin:1.05rem 0 .3rem}
.card-primer p{margin:.2rem 0;font-size:.9rem;line-height:1.62;color:var(--color-text)}
.auth-card .auth-panel{max-width:none;background:transparent;border:0;border-radius:0;
  box-shadow:none;backdrop-filter:none;padding:clamp(1.8rem,3.2vw,2.8rem);align-self:center}
.auth-face{animation:facein .45s var(--ease-veil)}
@keyframes facein{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.auth-face{animation:none}}
@media (max-width:920px){
  .auth-card{grid-template-columns:1fr;max-width:28rem}
  .auth-card .card-primer{order:2;border-right:0;border-top:1px solid rgb(217 182 98 / .4)}
  .card-primer .lead-line br{display:none}
}

.auth-brand{display:block;text-decoration:none;
  font-family:var(--font-serif);font-weight:500;line-height:1.18;
  font-size:clamp(1.35rem,1.5vw + .75rem,1.95rem);
  color:var(--color-text);letter-spacing:.5px;
  margin:0 0 1.15rem;padding:0 0 .9rem;
  border-bottom:1px solid rgb(217 182 98 / .45)}
.auth-brand:hover{color:#7a6a3a}
.auth-brand:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:3px}

@media (max-width:920px){
  .book-room{align-content:center;grid-template-rows:auto auto}
}
@media (max-height:760px){
  .book-room{padding-top:2vh;padding-bottom:2vh}
}
.auth-panel h1{font-size:clamp(1.6rem,2vw + .8rem,2rem);text-align:center;margin-bottom:var(--space-1)}
.auth-panel .sub{text-align:center;color:var(--color-text-muted);font-size:.98rem;margin-bottom:var(--space-3)}
.auth-panel .field{margin-bottom:var(--space-2)}
.auth-panel .field span{display:block;font-size:.85rem;font-weight:500;margin-bottom:.3rem;color:var(--color-text)}
.auth-panel .field .err{display:none;color:var(--color-error);font-weight:400;margin-top:.3rem}
.auth-panel .field.invalid .err{display:block}
.auth-panel .field.invalid input{border-color:var(--color-error)}
.auth-panel .field input{width:100%;min-height:44px;padding:var(--space-1) var(--space-2);font:inherit;
  color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm)}

.auth-panel .field input:focus-visible{outline:2px solid #8a6f2e;outline-offset:1px;border-color:#8a6f2e}
.auth-panel .btn-primary{width:100%;margin-top:var(--space-1)}
.auth-panel .under-note{text-align:center;font-size:.875rem;color:var(--color-text-muted);margin:var(--space-2) 0 0}

.notice{border:1px solid var(--color-border);border-left-width:1px;background:var(--color-surface);
  border-radius:var(--radius-sm);padding:var(--space-2);margin:var(--space-2) 0}
.notice--error{border-left-color:var(--color-error)}
.veil-shimmer{border-radius:var(--radius-md);background:var(--color-surface);
  animation:shimmer var(--t-breath) ease-in-out infinite alternate;min-height:5.5rem;margin-bottom:var(--space-2)}
@keyframes shimmer{from{opacity:.55}to{opacity:1}}
.empty{color:var(--color-text-muted);text-align:center;padding:calc(var(--space-3)*2) var(--space-2)}

[data-state-panel]{display:none}
[data-state-panel="populated"],[data-state-panel].on{display:block}
html.qa-state [data-state-panel="populated"]:not(.on){display:none}

.paywall{border:1px solid var(--gold);}
.paywall .doctrine{color:var(--color-text-muted);font-size:.875rem}

body[data-protected="1"]:not(.authed) main{visibility:hidden}

html.seamless-arrive, html.seamless-arrive body{background:#cfb799}

.onboard{position:fixed;inset:0;z-index:60;display:grid;place-items:safe center;overflow-y:auto;
  padding:1.2rem;background:rgb(30 26 18 / .34);
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
  opacity:0;transition:opacity .3s var(--ease-veil)}
.onboard.on{opacity:1}
.onboard[hidden]{display:none}

.onboard-card{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(23rem,26rem);
  width:100%;max-width:60rem;background:rgb(255 255 255 / .82);
  border:1px solid rgb(255 255 255 / .6);border-radius:var(--radius-md);
  box-shadow:var(--shadow-sanctum);overflow:hidden;
  backdrop-filter:blur(24px) saturate(1.45);-webkit-backdrop-filter:blur(24px) saturate(1.45);
  transform:translateY(10px) scale(.99);transition:transform .34s var(--ease-veil)}
.onboard.on .onboard-card{transform:none}

.onboard-say{padding:clamp(1.7rem,3vw,2.6rem);
  display:flex;flex-direction:column;justify-content:center;
  background:linear-gradient(165deg, rgb(250 246 236 / .5), rgb(255 255 255 / .25))}
.onboard-kicker{font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:#9a854a;margin:0 0 .5rem}
.onboard-card h2{font-family:var(--font-serif);font-weight:500;
  font-size:clamp(1.7rem,2.2vw + .5rem,2.3rem);line-height:1.15;margin:0 0 .9rem}
.onboard-lead{color:var(--color-text);line-height:1.68;font-size:1rem;margin:0 0 .85rem;max-width:34rem}
.onboard-lead-2{color:var(--color-text-muted)}

.onboard-go{margin-top:.5rem;align-self:flex-start}

.onboard-doors{padding:clamp(1.4rem,2.4vw,2rem);border-left:1px solid rgb(217 182 98 / .4);
  background:rgb(255 255 255 / .3)}
.onboard-doorlead{font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--color-text-muted);margin:0 0 .9rem;text-align:center}
.onboard-rooms{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin:0;padding:0;list-style:none}
.onboard-room{display:grid;gap:.15rem;text-decoration:none;color:var(--color-text);
  padding:.55rem .55rem .7rem;border:1px solid var(--color-border);border-radius:var(--radius-md);
  background:rgb(255 255 255 / .62);text-align:center;
  transition:border-color var(--t-move) var(--ease-veil),transform var(--t-move) var(--ease-veil),
             box-shadow var(--t-move) var(--ease-veil)}
.onboard-room img{width:100%;aspect-ratio:3 / 4;object-fit:cover;border-radius:var(--radius-sm);
  margin-bottom:.45rem;display:block}
.onboard-room .or-name{font-family:var(--font-serif);font-weight:500;font-size:1rem;line-height:1.2}
.onboard-room .or-line{font-size:.78rem;line-height:1.35;color:var(--color-text-muted)}
.onboard-room:hover,.onboard-room:focus-visible{border-color:var(--color-primary);
  transform:translateY(-2px);box-shadow:0 10px 26px rgb(120 90 30 / .16)}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){ .onboard-card{grid-template-columns:1fr} .onboard-doors{border-left:0} }
@media (prefers-reduced-motion: reduce){.onboard,.onboard-card,.onboard-room{transition:none}}

.auth-error{color:var(--color-error);text-align:center;font-size:.9rem;margin:0 0 var(--space-2);
  background:rgb(160 69 69 / .08);border:1px solid rgb(160 69 69 / .28);border-radius:var(--radius-sm);padding:.5rem .7rem}

.remember{display:flex;align-items:center;justify-content:center;gap:.55rem;font-size:.85rem;
  color:var(--color-text-muted);margin:0 0 var(--space-2);min-height:44px;cursor:pointer}
.remember input{width:18px;height:18px;min-height:0;margin:0;flex:none;
  accent-color:var(--color-primary);cursor:pointer}

.acct{max-width:74rem;margin:0 auto;padding:var(--space-2) var(--space-2) var(--space-3);
  display:grid;grid-template-columns:18rem 1fr;column-gap:var(--space-3);align-items:start}

.acct-title{grid-column:1/-1;font-size:2.25rem;margin:var(--space-2) 0 var(--space-3)}

.acct-rail{position:sticky;top:76px;display:flex;flex-direction:column;gap:var(--space-2)}
.acct-me{background:var(--color-surface);border:1px solid var(--color-border);
  border-radius:var(--radius-md);box-shadow:var(--shadow-veil);padding:var(--space-3)}

.account-key-badge{width:3.3rem;height:3.3rem;display:grid;place-items:center;
  margin-bottom:.9rem}
.account-key-badge img{width:100%;height:100%;object-fit:contain;display:block}

.key-emblem{width:2.5rem;height:2.5rem;object-fit:contain;display:block;
  margin:0 auto .5rem;opacity:.92}
.account-key-label{font-size:.76rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--color-text-muted);margin:0}
.account-key-name{font-family:var(--font-serif);font-size:1.35rem;margin:.2rem 0 0;
  display:flex;align-items:center;gap:.55rem;flex-wrap:wrap}
.acct-who{margin:.75rem 0 0;font-size:.9rem;line-height:1.5;color:var(--color-text-muted);
  overflow-wrap:anywhere}
.acct-who strong{display:block;font-size:1rem;font-weight:500;color:var(--color-text)}
.acct-renew{margin:.6rem 0 0;color:var(--color-text-muted)}

.acct-nav{display:flex;flex-direction:column;gap:2px}
.acct-nav a{display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  min-height:44px;padding:.6rem .9rem;border-radius:var(--radius-md);
  border:1px solid transparent;background:transparent;color:var(--color-text);
  text-decoration:none;font-size:.95rem;font-weight:500;
  transition:background var(--t-touch) ease,border-color var(--t-touch) ease}
@media (hover:hover){.acct-nav a:hover{background:var(--color-surface);border-color:var(--color-border)}}
.acct-chev{display:none;width:7px;height:12px;flex:none;color:var(--color-text-muted)}

.acct:has(#keys:target) [href="#keys"],
.acct:has(#billing:target) [href="#billing"],
.acct:has(#settings:target) [href="#settings"],
.acct:has(#help:target) [href="#help"],
.acct:has(#keys.acct-open) [href="#keys"],
.acct:has(#billing.acct-open) [href="#billing"],
.acct:has(#settings.acct-open) [href="#settings"],
.acct:has(#help.acct-open) [href="#help"]{
  background:linear-gradient(180deg,#fffdf6,rgb(255 250 236 / .75));
  border-color:rgb(217 182 98 / .75);color:#5a4a2a;
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .9),0 2px 10px rgb(150 110 40 / .10)}

.acct-signout{appearance:none;width:100%;min-height:44px;padding:.6rem .9rem;
  border-radius:var(--radius-md);border:1px solid var(--color-border);background:transparent;
  color:var(--color-error);font-family:var(--font-sans);font-size:.95rem;font-weight:500;
  cursor:pointer;transition:border-color var(--t-touch) ease,background var(--t-touch) ease}
@media (hover:hover){.acct-signout:hover{border-color:var(--color-error);background:rgb(160 69 69 / .05)}}
.acct-signout:active{border-color:var(--color-error);background:rgb(160 69 69 / .05)}
.acct-signout-note{margin:.55rem 0 0;font-size:.8rem;line-height:1.5;color:var(--color-text-muted)}

.acct-panel{display:none;scroll-margin-top:76px}
.acct-panel:target{display:block}
/* A panel opened from a link that CARRIED a fragment (account.html#keys).
   The page strips the fragment on arrival for scroll control (see the top of
   js/temple.js), so :target never matches and a member sent to the Keys landed
   on the account menu instead. Mirrors every :target rule below, exactly. */
.acct-panel.acct-open{display:block}

.acct-panel:target{animation:acctpanel 160ms var(--ease-veil)}
@keyframes acctpanel{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.acct-panel:target{animation:none}}
.acct-panel h2{font-size:1.5rem;margin:0 0 var(--space-1)}
.acct-panel .card:last-child{margin-bottom:0}

#billing .card,#settings .card,#help .card{max-width:36rem}
.acct-lede{color:var(--color-text-muted);margin:0 0 var(--space-3);max-width:38rem}
.acct-note{color:var(--color-text-muted);margin:0 0 .8rem}
.acct-back{display:none}
.acct-rows .row:first-child{padding-top:0}
.acct-rows .row span:last-child{text-align:right;font-weight:500;color:var(--color-text)}
.acct-empty{margin:0;color:var(--color-text-muted)}

@media (min-width:821px) and (min-height:501px){
  .acct:not(:has(:target)):not(:has(.acct-open)) #keys{display:block}
  .acct:not(:has(:target)):not(:has(.acct-open)) [href="#keys"]{
    background:linear-gradient(180deg,#fffdf6,rgb(255 250 236 / .75));
    border-color:rgb(217 182 98 / .75);color:#5a4a2a;
    box-shadow:inset 0 1px 0 rgb(255 255 255 / .9),0 2px 10px rgb(150 110 40 / .10)}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .acct{display:block;padding-bottom:var(--space-3)}
  .acct-title{font-size:1.9rem;margin:var(--space-1) 0 var(--space-2)}
  .acct-rail{position:static}
  .acct-chev{display:block}
  .acct:has(:target) .acct-rail,
  .acct:has(:target) .acct-title,
  .acct:has(.acct-open) .acct-rail,
  .acct:has(.acct-open) .acct-title{display:none}
  .acct-nav{background:var(--color-surface);border:1px solid var(--color-border);
    border-radius:var(--radius-md);box-shadow:var(--shadow-veil);gap:0;overflow:hidden}
  .acct-nav a{min-height:52px;padding:.85rem var(--space-2);border-radius:0;
    border:0;border-bottom:1px solid var(--color-border)}
  .acct-nav a:last-child{border-bottom:0}
  .acct-nav a:hover{background:transparent}
  .acct-nav a:active{background:rgb(217 182 98 / .14)}
  
  .acct-back{display:inline-flex;align-items:center;gap:.45rem;min-height:44px;
    margin:0 0 .2rem -.35rem;padding:.3rem .35rem;color:#8a6b3a;
    text-decoration:none;font-size:.95rem;font-weight:500}
  .acct-back svg{width:7px;height:12px;flex:none}
}

.keys-grid{display:block;max-width:47rem;margin:0;
  background:var(--color-bg);border:1px solid var(--color-border);
  border-radius:var(--radius-md);box-shadow:var(--shadow-veil);overflow:hidden}
.key-card{background:none;border:0;border-radius:0;box-shadow:none;margin:0;
  padding:1.4rem var(--space-3);
  display:grid;grid-template-columns:2.6rem minmax(0,1fr) minmax(0,13rem);
  gap:0 1.15rem;align-items:start;text-align:left}
.key-card + .key-card{border-top:1px solid var(--color-border)}

.key-card.current{background:#fdfaf1;box-shadow:inset 3px 0 0 var(--color-primary)}
.key-body{min-width:0}
.key-card h2{margin:0;font-size:1.35rem;line-height:1.25;
  display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.key-chip{font-size:.75rem;padding:.1em .7em;flex:none}
.key-price{font-family:var(--font-sans);font-size:.95rem;color:var(--color-text-muted);
  margin:.2rem 0 0}
.key-blurb{color:var(--color-text-muted);margin:.5rem 0 0}
.key-unlocks{list-style:none;padding:0;margin:.6rem 0 0;font-size:.9rem;color:var(--color-text)}
.key-unlocks li{padding:.18rem 0 .18rem 1.3rem;position:relative}

.key-unlocks li::before{content:"";position:absolute;left:0;top:.5em;
  width:.7rem;height:.7rem;transform:translateY(-50%);
  background:no-repeat center/contain
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none" stroke="%23b9a06a" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="5.5" cy="5.5" r="3.2"/><path d="M7.9 7.9L14 14M11.4 11.4l-1.6 1.6M13 13l-1.4 1.4"/></svg>')}

.key-emblem{width:2.6rem;height:2.6rem;object-fit:contain;display:block;margin:0;
  opacity:.95;align-self:start}
.key-card--bronze .key-emblem{filter:sepia(.5) saturate(1.6) hue-rotate(-16deg) brightness(.78)}
.key-card--silver .key-emblem{filter:grayscale(1) brightness(1.06)}
.key-card--soon .key-emblem{opacity:.35;filter:grayscale(1)}

.key-card--soon .key-unlocks{margin-top:.35rem}
.key-card--soon .key-unlocks li{padding-left:0;color:var(--color-text-muted);
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase}
.key-card--soon .key-unlocks li::before{display:none}
.key-card--soon h2{color:var(--color-text-muted)}

.key-action{display:flex;flex-direction:column;gap:.5rem;align-items:stretch;
  justify-self:end;align-self:start;width:100%}
.key-action:empty{display:none}
.key-soon{color:var(--color-text-muted);margin:.45rem 0 0;text-align:center}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .keys-grid{border-radius:var(--radius-md)}
  .key-card{grid-template-columns:2.2rem minmax(0,1fr);gap:0 .9rem;padding:1.15rem var(--space-2)}
  .key-emblem{width:2.2rem;height:2.2rem}
  .key-action{grid-column:1 / -1;margin-top:.9rem;justify-self:stretch}
}
.key-devcancel{margin-top:.5rem;font-size:.82rem;padding:.3rem .7rem}
.keys-demo-note{text-align:center;color:#9a854a;font-size:.85rem;letter-spacing:.02em;
  margin:0 auto var(--space-2);max-width:40rem;background:rgb(217 182 98 / .1);
  border:1px solid rgb(217 182 98 / .3);border-radius:var(--radius-sm);padding:.5rem .8rem}

dialog{border:none;border-radius:var(--radius-md);box-shadow:var(--shadow-sanctum);
  padding:var(--space-3);max-width:24rem;background:var(--color-bg);color:var(--color-text)}
dialog::backdrop{background:rgb(38 33 31 / .5)}

html.js .reveal{opacity:1;transform:none;transition:opacity 900ms var(--ease-veil),transform 900ms var(--ease-veil)}
html.js .reveal:not(.seen){opacity:.001;transform:translateY(14px)}
@media (prefers-reduced-motion: reduce){html.js .reveal:not(.seen){opacity:1;transform:none}}

.porch-footer{padding:calc(var(--space-3)*2) var(--space-2);text-align:center;color:var(--color-text-muted);
  font-size:.875rem}
.porch-footer a{margin:0 var(--space-1)}

.wall-projection{display:none}   
.cinema{display:flex;flex-direction:column;z-index:6;opacity:1;pointer-events:auto;
  transition:opacity 1.1s var(--ease-veil)}
.cinema.mode-wall{position:absolute;left:31.2%;top:24.5%;width:37.6%}
.room-scene.dimmed .cinema.mode-wall{opacity:1;pointer-events:auto}
.cinema.mode-big,.cinema:fullscreen{opacity:1;pointer-events:auto}
.cinema-screen{position:relative;width:100%;aspect-ratio:16/9;background:#05040a;overflow:hidden;
  border-radius:7px;box-shadow:0 0 0 1px rgb(255 255 255 /.1),0 24px 60px rgb(0 0 0 /.6),0 0 70px rgb(120 96 210 /.28)}
.cinema-video{width:100%;height:100%;object-fit:contain;background:#05040a;display:block}
.cinema-video.is-audio{visibility:hidden}
.cinema-art{position:absolute;inset:0;background-size:cover;background-position:center;display:none}
.cinema-art.show{display:block}
.cinema-art::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgb(0 0 0 /.05),rgb(0 0 0 /.6))}
.cinema-art .aura{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;width:76px;height:76px;
  border-radius:50%;background:rgb(255 255 255 /.16);display:grid;place-items:center;color:#fff;font-size:1.5rem;
  animation:aura-pulse 3.6s ease-in-out infinite}
@keyframes aura-pulse{0%,100%{box-shadow:0 0 0 0 rgb(255 255 255 /.16)}50%{box-shadow:0 0 0 24px rgb(255 255 255 /0)}}
.cinema-title{position:absolute;left:0;right:0;bottom:0;padding:.5rem .7rem;color:#fff;font-size:.82rem;
  background:linear-gradient(transparent,rgb(0 0 0 /.55));pointer-events:none}
.cinema-title:empty{display:none}
.cinema-bar{display:flex;align-items:center;gap:.5rem;margin-top:.5rem;padding:.45rem .6rem;color:#fff;
  background:rgb(20 16 30 /.72);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border:1px solid rgb(255 255 255 /.16);border-radius:11px}
.cinema-bar button{background:none;border:0;color:#fff;cursor:pointer;font-size:.95rem;line-height:1;padding:.3rem .4rem;border-radius:7px;transition:background .15s}
@media (hover:hover){.cinema-bar button:hover{background:rgb(255 255 255 /.18)}}
.cinema-bar button:active{background:rgb(255 255 255 /.18)}
.cinema-seek{flex:1;height:4px;accent-color:#fff;cursor:pointer;min-width:40px}
.cinema-time{font-size:.72rem;font-variant-numeric:tabular-nums;white-space:nowrap;color:rgb(255 255 255 /.85)}
.cinema.mode-big{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(940px,88vw);z-index:65}
.cinema.mode-big .cinema-screen{box-shadow:0 0 0 1px rgb(255 255 255 /.12),0 30px 90px rgb(0 0 0 /.7),0 0 0 100vmax rgb(6 4 10 /.86)}
.cinema:fullscreen{width:100vw;height:100vh;left:0;top:0;transform:none;background:#000;justify-content:center;padding:0}
.cinema:fullscreen .cinema-screen{aspect-ratio:auto;flex:1;min-height:0;border-radius:0;box-shadow:none}
.cinema:fullscreen .cinema-bar{position:fixed;left:50%;bottom:3vh;transform:translateX(-50%);width:min(940px,92vw)}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .cinema.mode-wall{left:7vw;width:86vw;top:calc(var(--bar-h) + 4svh)}
  .cinema.mode-big{width:94vw}
}

.playlist.glass{position:fixed;left:max(3.4vw,22px);top:50%;transform:translateY(-50%);z-index:8;
  width:min(300px,82vw);max-height:80svh;overflow-y:auto;padding:.85rem;border-radius:20px;
  background:rgb(255 255 255 /.07);-webkit-backdrop-filter:blur(24px) saturate(1.5);backdrop-filter:blur(24px) saturate(1.5);
  border:1px solid rgb(255 255 255 /.22);
  box-shadow:0 22px 60px rgb(0 0 0 /.4),inset 0 1px 0 rgb(255 255 255 /.3),inset 0 0 40px rgb(255 255 255 /.04);
  scrollbar-width:thin}
.playlist.glass::-webkit-scrollbar{width:6px}
.playlist.glass::-webkit-scrollbar-thumb{background:rgb(255 255 255 /.25);border-radius:3px}
.pl-head{margin:.1rem .2rem .7rem;color:#fff;font-size:1rem;letter-spacing:.01em;text-shadow:0 1px 10px rgb(0 0 0 /.45)}
.pl-group{margin-bottom:.7rem}
.pl-tier{font-size:.64rem;text-transform:uppercase;letter-spacing:.14em;margin:.35rem .1rem;color:#fff;
  display:inline-block;padding:.16rem .55rem;border-radius:999px;background:rgb(255 255 255 /.14);border:1px solid rgb(255 255 255 /.2)}
.pl-tier--gold{color:#ffe7a6;background:rgb(255 208 120 /.16);border-color:rgb(255 208 120 /.34)}
.pl-tier--silver{color:#eef2f8;background:rgb(215 225 245 /.14);border-color:rgb(215 225 245 /.28)}
.pl-item{font-family:inherit;display:flex;align-items:center;gap:.6rem;width:100%;text-align:left;margin:.28rem 0;padding:.5rem .55rem;
  border-radius:13px;border:1px solid transparent;background:rgb(255 255 255 /.06);color:#fff;cursor:pointer;
  transition:background .15s,border-color .15s,transform .1s}
.pl-item:hover:not(.locked){background:rgb(255 255 255 /.17);border-color:rgb(255 255 255 /.24)}
.pl-item:active:not(.locked){transform:scale(.99)}
.pl-item.active{background:rgb(255 255 255 /.24);border-color:rgb(255 255 255 /.42)}
.pl-item.locked{opacity:.55;cursor:not-allowed}
.pl-play{width:26px;height:26px;flex:none;display:grid;place-items:center;border-radius:50%;
  background:rgb(255 255 255 /.2);font-size:.68rem}
.pl-meta{display:flex;flex-direction:column;min-width:0}
.pl-title{font-size:.85rem;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pl-sub{font-size:.66rem;color:rgb(255 255 255 /.72)}

@media (min-width:821px) and (min-height:501px){ .playlist.glass{left:max(5vw,30px)} }
.video-info.glass{position:fixed;right:max(5vw,30px);top:50%;transform:translateY(-50%);z-index:8;
  width:min(300px,82vw);max-height:80svh;overflow-y:auto;padding:.95rem 1rem;border-radius:20px;scrollbar-width:thin}
.video-info.glass::-webkit-scrollbar{width:6px}
.video-info.glass::-webkit-scrollbar-thumb{background:rgb(255 255 255 /.28);border-radius:3px}
.vi-head{margin:.1rem 0 .7rem;color:#fff;font-size:.66rem;text-transform:uppercase;letter-spacing:.14em;opacity:.85}
.vi-title{color:#fff;font-size:1.05rem;font-weight:600;line-height:1.3;margin-bottom:.55rem;text-shadow:0 1px 10px rgb(0 0 0 /.4)}
.vi-tier{margin-bottom:.75rem}
.vi-desc{color:rgb(255 255 255 /.9);font-size:.85rem;line-height:1.6;margin:0}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){.video-info.glass{display:none}}

.pl-title{font-weight:600}

.circle-head{font-size:1.15rem;margin:0 0 .8rem}

#zoom-live .gathering .g-what{display:flex;flex-direction:column;gap:.15rem}
#zoom-live .gathering .g-when{font-family:var(--font-serif);font-size:1.05rem;
  letter-spacing:.03em;color:var(--color-text)}
#zoom-live .gathering .g-title{font-weight:400;font-size:.72rem;letter-spacing:.22em;
  text-transform:uppercase;color:#8a7a4e}
#zoom-live .gathering .g-wall,#zoom-live .gathering .g-yours{color:var(--color-text-muted)}

.course-doc{max-width:44rem;margin:0 auto;padding:calc(56px + 6svh) 0 10svh;color:var(--color-text);
  position:relative;z-index:1}

body:has(.course-doc){background:#f6efdf}
body:has(.course-doc)::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(120% 70% at 50% -10%, rgb(255 252 244 / .95), rgb(255 250 238 / 0) 60%),
             linear-gradient(180deg, rgb(255 253 247 / .8), rgb(246 239 223 / 0) 34%)}

.course-doc::before{content:"";position:fixed;z-index:0;pointer-events:none;
  right:max(0.5rem, calc(50vw - 31rem));bottom:0;width:20rem;height:min(82vh, 48rem);
  background-image:var(--statue);background-repeat:no-repeat;background-position:bottom right;
  background-size:contain;opacity:0;
  
  -webkit-mask-image:linear-gradient(90deg, rgb(0 0 0 / 0) 0, rgb(0 0 0 / 1) 34%);
  mask-image:linear-gradient(90deg, rgb(0 0 0 / 0) 0, rgb(0 0 0 / 1) 34%);
  animation:statue-rise 1.6s var(--ease-veil) .25s forwards}
@keyframes statue-rise{from{opacity:0;transform:translateY(14px)}to{opacity:.52;transform:none}}
@media (prefers-reduced-motion: reduce){
  .course-doc::before{animation:none;opacity:.52}}
@media (max-width:1180px){.course-doc::before{opacity:0;animation:statue-rise-faint 1.6s var(--ease-veil) .25s forwards;
  width:15rem;right:-2rem}}
@keyframes statue-rise-faint{from{opacity:0}to{opacity:.17}}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .course-doc::before{width:12rem;right:-3rem;height:56vh}}

.course-doc .kicker{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:#8a7a4e;margin:0 0 .7rem}
.course-doc h1{margin:0 0 .8rem;font-size:clamp(1.9rem,1.2rem + 2.4vw,2.7rem);line-height:1.14;
  letter-spacing:-.005em;text-wrap:balance}
.course-doc>.lede{font-size:1.14rem;line-height:1.62;color:#4b4460;max-width:34rem;
  padding-bottom:1.6rem;border-bottom:1px solid rgb(184 145 47 / .35)}
.course-doc h2{font-family:var(--font-serif);font-weight:500;font-size:1.42rem;line-height:1.25;
  margin:2.9rem 0 .6rem;text-wrap:balance}
.course-doc h3{font-family:var(--font-serif);font-weight:500;font-size:1.06rem;margin:1.8rem 0 .35rem}
.course-doc p{line-height:1.78;margin:0 0 1.05rem;max-width:36rem}
.course-doc .lede{font-size:1.05rem}
.course-doc ul{margin:0 0 1.3rem;padding-left:1.1rem;line-height:1.74}
.course-doc li{margin:0 0 .35rem}
.course-doc .teaching{font-style:italic;color:var(--color-text-muted)}
.course-doc .collection{margin:1.3rem 0}
.course-doc .collection h3{margin-top:1.3rem}

.course-doc .energy{margin:0 0 1.6rem;position:relative;min-height:4.4rem}
.course-doc .energy:has(.energy-plate){padding-left:6.2rem;min-height:6rem}
.course-doc .energy strong{display:block;margin-bottom:.15rem}
.course-doc .energy-plate{position:absolute;left:0;top:.1rem;width:4.4rem;height:5.9rem;
  display:grid;place-items:center;border-radius:2px;
  background:radial-gradient(60% 60% at 50% 55%, rgb(255 252 244 / .9), rgb(255 252 244 / 0) 72%);
  transition:transform .4s var(--ease-veil),filter .4s var(--ease-veil)}
.course-doc .energy-plate img{width:100%;height:100%;object-fit:contain;display:block}
@media (hover:hover){.course-doc .energy-plate:hover{transform:scale(1.06);filter:saturate(1.08)}}
.course-doc .energy-plate:focus-visible{outline:2px solid #8a6f2e;outline-offset:3px}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .course-doc .energy:has(.energy-plate){padding-left:0}
  .course-doc .energy-plate{position:static;width:3.4rem;height:4.6rem;margin:0 0 .55rem}}
.course-doc .practical{margin-top:2.8rem}

.course-doc .outline{list-style:none;margin:1.6rem 0 0;padding:0}
.course-doc .outline li{position:relative;margin:0;padding:.85rem 0 .85rem 1.5rem;
  border-bottom:1px solid rgb(184 145 47 / .22);line-height:1.62}
.course-doc .outline li:first-child{border-top:1px solid rgb(184 145 47 / .22)}
.course-doc .outline li::before{content:"";position:absolute;left:.25rem;top:1.45rem;
  width:6px;height:6px;transform:rotate(45deg);background:rgb(184 145 47 / .75)}
.course-doc .outline strong{font-family:var(--font-serif);font-weight:500}

.course-doc .week{border-top:0;padding-top:2.2rem;margin-top:2.6rem;position:relative}
.course-doc .week::before{content:"";position:absolute;top:0;left:0;width:4.5rem;height:1px;
  background:linear-gradient(90deg, rgb(184 145 47 / .85), rgb(184 145 47 / 0))}
.course-doc .week:first-of-type{margin-top:2.2rem}
.course-doc .week .kicker{color:#8a7a4e;margin-bottom:.35rem}

.course-doc .book{max-width:26rem;margin-top:2rem;position:relative;overflow:hidden;
  background:rgb(255 252 245 / .92);border-color:rgb(184 145 47 / .38)}
.course-doc .book::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg, rgb(184 145 47 / .9), rgb(184 145 47 / .15))}
.course-doc .book .dates{margin:0 0 1rem;font-family:var(--font-serif);font-size:1.06rem;
  line-height:1.6;color:var(--color-text)}
.course-doc .book .book-said{margin:0;max-width:none}
.paypal-book-slot{max-width:20rem}

.paypal-book-slot>.btn{width:100%}

.course-doc .book .addons{margin:0 0 1rem;padding:0;border:0;min-width:0}
.course-doc .book .addons[hidden]{display:none}
.course-doc .book .addons legend{padding:0;margin:0 0 .35rem}
.addon{display:flex;align-items:center;gap:.7rem;min-height:44px;padding:.3rem 0;
  border-top:1px solid rgb(140 120 70 / .18);cursor:pointer;line-height:1.35}
.addon input{width:22px;height:22px;min-height:0;margin:0;flex:none;accent-color:#8a6f2e}
.addon input:focus-visible{outline:2px solid #8a6f2e;outline-offset:2px}
.addon-name{flex:1}
.addon-price,.addons-total strong{font-family:var(--font-serif);white-space:nowrap}
.addon-price{color:var(--color-text-muted)}
.course-doc .book .addons-total{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  margin:0;padding-top:.6rem;border-top:1px solid rgb(140 120 70 / .28);max-width:none}
@media (hover:none){.addon:active{background:rgb(140 120 70 / .06)}}

.notify form{margin-top:.9rem;display:grid;gap:.6rem;max-width:22rem}
.notify form[hidden]{display:none}
.notify .field span{display:block;font-size:.8rem;margin-bottom:.25rem}

.notify .field .err{display:none}
.notify .field.invalid .err{display:block}
.notify input[type=email]{font:inherit;width:100%;padding:.55rem .7rem;border-radius:3px;
  border:1px solid rgb(140 120 70 / .35);background:rgb(255 255 255 / .6);color:var(--color-text)}
.notify .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.notify .notify-status{margin:.2rem 0 0;font-size:.85rem;color:var(--color-text-muted);min-height:1.2em}
.notify.done .notify-status{color:var(--color-text)}

.course-card .weeks{list-style:none;padding:0;margin:.6rem 0 1rem;font-size:.9rem}
.course-card .weeks li{margin:0 0 .25rem;color:var(--color-text-muted)}
.course-card .dates{font-size:.85rem;color:var(--color-text-muted);margin:0 0 .9rem}

.music-toggle{position:fixed;right:1rem;bottom:1rem;z-index:66;width:44px;height:44px;
  display:grid;place-items:center;padding:0;cursor:pointer;
  background:rgb(255 255 255 / .7);border:1px solid var(--color-border);border-radius:50%;
  color:var(--color-text);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  transition:box-shadow var(--t-move) var(--ease-veil)}

.music-toggle[hidden]{display:none}
.music-toggle:hover,.music-toggle:focus-visible{box-shadow:0 0 24px rgb(231 207 141 / .6)}
.music-toggle svg{width:20px;height:20px;display:block;fill:none;stroke:currentColor;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.music-toggle .off-slash{opacity:0}
.music-toggle.is-off .wave{opacity:0}
.music-toggle.is-off .off-slash{opacity:1}
@media (prefers-reduced-motion: reduce){.music-toggle{transition:none}}

.plate.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

.threshold-over{position:fixed;inset:0;z-index:58;display:grid;place-items:safe center;
  overflow-y:auto;padding:1.2rem;
  
  background:rgb(96 74 38 / .20);
  backdrop-filter:blur(6px) saturate(1.15);-webkit-backdrop-filter:blur(6px) saturate(1.15)}
.threshold-over[hidden]{display:none}

.threshold-over .book-room{min-height:0;background:none;padding:0;display:block;overflow:visible}
.threshold-over .v1-sky{display:none}

body.awaiting-threshold .arch,
body.awaiting-threshold .door-card,
body.awaiting-threshold .scene-doorlist{pointer-events:none}
body.awaiting-threshold .shell-bar{opacity:0;pointer-events:none}

.shell-bar{transition:opacity .9s var(--ease-veil)}

.onboard-again{display:flex;align-items:center;justify-content:flex-start;gap:.55rem;
  font-size:.85rem;color:var(--color-text-muted);margin:.9rem 0 0;
  min-height:44px;align-self:flex-start;cursor:pointer}
.onboard-again input{width:20px;height:20px;accent-color:var(--color-primary);flex:none;cursor:pointer}

html.signing-out, html.signing-out body{background:#cfb799}
html.signing-out .temple-scene,
html.signing-out main{
  animation:leaveroom 560ms var(--ease-veil) forwards}
@keyframes leaveroom{
  from{opacity:1;transform:none;filter:none}
  to{opacity:0;transform:scale(1.035);filter:blur(3px)}
}

html.signing-out::after{content:"";position:fixed;inset:0;z-index:80;pointer-events:none;
  background:radial-gradient(ellipse 110% 100% at 50% 45%, #fffdf7, #fdf7ea 55%, #f2e6cd 100%);
  opacity:0;animation:leavelight 560ms var(--ease-veil) forwards}
@keyframes leavelight{from{opacity:0}to{opacity:1}}
html.signing-out .shell-bar,
html.signing-out .onboard,
html.signing-out .threshold-over{opacity:0;transition:opacity 240ms var(--ease-veil)}
@media (prefers-reduced-motion: reduce){
  html.signing-out .temple-scene,html.signing-out main,html.signing-out::after{animation:none}
}

html.from-leaving .porch{animation:porchopen 700ms var(--ease-veil) 60ms backwards}
@keyframes porchopen{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@media (min-width:821px) and (min-height:501px){
  .cinema.mode-wall{left:27%;top:19%;width:46%}

  .playlist.glass,.video-info.glass{
    width:clamp(240px,22vw,360px);
    height:var(--pl-h,420px);
    max-height:none;
    padding:1rem;
    border-radius:22px}
  .playlist.glass{left:max(2.2vw,20px)}
  .video-info.glass{right:max(2.2vw,20px)}

  .pl-head{font-size:1.1rem;margin-bottom:.45rem}
  
  .pl-group{margin-bottom:.3rem}
  .pl-tier{margin:.18rem .1rem}
  .pl-title{font-size:.9rem}
  .vi-title{font-size:1.12rem}
  .vi-desc{font-size:.88rem;line-height:1.65}
}

.pl-item--ghost{background:rgb(255 255 255 /.045);border:1px dashed rgb(255 255 255 /.3);
  cursor:pointer;opacity:1;padding:.3rem .55rem;margin:.14rem 0}
.pl-item--ghost:hover{background:rgb(255 255 255 /.11);border-color:rgb(255 255 255 /.5)}
.pl-item--ghost .pl-play{background:rgb(255 255 255 /.16);color:rgb(255 255 255 /.7)}
.pl-ghost-bar{display:block;height:.62rem;border-radius:999px;
  background:linear-gradient(90deg,rgb(255 255 255 /.3),rgb(255 255 255 /.14));
  filter:blur(.6px)}
.pl-ghost-bar--sub{height:.42rem;margin-top:.34rem;width:52%;
  background:linear-gradient(90deg,rgb(255 255 255 /.2),rgb(255 255 255 /.08))}
.pl-item--ghost .pl-meta{flex:1;min-width:0}
.pl-ghost-note{margin:.3rem .2rem 0;font-size:.68rem;letter-spacing:.06em;
  color:rgb(255 255 255 /.68);text-shadow:0 1px 6px rgb(0 0 0 /.4)}
.pl-item--ghost .pl-play{width:22px;height:22px;font-size:.6rem}
.pl-item--ghost .pl-ghost-bar{height:.55rem}
.pl-item--ghost .pl-ghost-bar--sub{height:.36rem;margin-top:.28rem}

.stage-ajar{transition:opacity .45s var(--ease-veil)}
.scene-zoom{transition:transform 1.15s cubic-bezier(.5,.03,.3,1)}
.scene-flash{transition:opacity .62s ease-in}
html.from-light::after{animation:lightdissolve 900ms var(--ease-veil) forwards}
@keyframes lightdissolve{0%{opacity:1}8%{opacity:1}100%{opacity:0}}

.tab-group{position:relative;display:inline-flex;align-items:center;gap:.15rem}

@media (min-width:901px){.shell-tabs{overflow:visible}}

.tab-caret{display:inline-flex;align-items:center;justify-content:center;width:20px;height:44px;
  padding:0;border:0;background:none;cursor:pointer;color:var(--color-text);opacity:.55;
  transition:opacity .3s var(--ease-veil),color .3s var(--ease-veil)}
.tab-caret svg{width:9px;height:auto;display:block;
  transition:transform .38s var(--ease-veil)}
.tab-caret:hover,.tab-caret:focus-visible{opacity:1;color:var(--color-accent)}
.shell-bar.transparent .tab-caret{filter:drop-shadow(0 1px 8px rgb(255 255 255 / .9))}
.tab-group:hover .tab-caret,.tab-group.open .tab-caret{opacity:1}
.tab-group:hover .tab-caret svg,.tab-group.open .tab-caret svg{transform:rotate(180deg)}

.tab-menu{position:absolute;top:calc(100% - .15rem);left:-.85rem;z-index:60;
  min-width:14.5rem;max-width:min(20rem,calc(100vw - 2rem));
  display:flex;flex-direction:column;padding:.55rem .45rem;
  background:rgb(255 253 246 / .82);border:1px solid rgb(217 182 98 / .38);border-radius:14px;
  box-shadow:0 18px 46px rgb(90 74 42 / .18),0 0 40px rgb(255 244 210 / .35);
  backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);
  opacity:0;visibility:hidden;transform:translateY(-7px);pointer-events:none;
  transition:opacity .34s var(--ease-veil),transform .34s var(--ease-veil),visibility 0s linear .34s}

.tab-menu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}

.tab-group:hover .tab-menu,.tab-group:focus-within .tab-menu,.tab-group.open .tab-menu{
  opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}

.shell-tabs .tab-menu a{display:flex;align-items:center;gap:.5rem;min-height:38px;
  padding:.34rem .7rem;border:0;border-radius:9px;white-space:normal;
  font-family:var(--font-serif);font-size:.82rem;letter-spacing:.02em;text-transform:none;
  color:#4a3f2a;text-shadow:none;text-decoration:none;
  transition:background .28s var(--ease-veil),color .28s var(--ease-veil)}
.shell-tabs .tab-menu a:hover,.shell-tabs .tab-menu a:focus-visible{
  background:rgb(255 244 210 / .72);color:#3a3040}
.shell-tabs .tab-menu a[aria-current="page"]{background:rgb(217 182 98 / .2);color:#3a3040}
.tab-menu a em{font-style:normal;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;
  color:rgb(90 74 42 / .55);margin-left:auto;padding-left:.5rem}

@media (prefers-reduced-motion: reduce){
  .tab-menu{transition:opacity .01s,visibility 0s}
  .tab-caret svg{transition:none}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){

  .mobile-menu{overflow-y:auto;padding:1.5rem 0 calc(1.5rem + env(safe-area-inset-bottom));
    justify-content:flex-start;justify-content:safe center}
  .mobile-menu>*{flex:none}
  .m-group{display:flex;flex-direction:column;align-items:center;width:100%}
  .m-row{position:relative;display:flex;align-items:center;justify-content:center}
  .m-row>a{font-family:var(--font-serif);font-size:1.3rem;letter-spacing:.14em;text-transform:uppercase;
    color:var(--color-text);text-decoration:none;padding:.4rem;min-height:44px;
    display:flex;align-items:center}
  
  .m-caret{position:absolute;left:100%;top:50%;transform:translateY(-50%);
    display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
    padding:0;border:0;background:none;cursor:pointer;color:var(--color-text);opacity:.6}
  .m-caret svg{width:12px;height:auto;display:block;transition:transform .38s var(--ease-veil)}
  .m-caret[aria-expanded="true"]{opacity:1}
  .m-caret[aria-expanded="true"] svg{transform:rotate(180deg)}
  .m-sub{display:flex;flex-direction:column;align-items:center;gap:.1rem;
    margin:.15rem 0 .5rem;padding:.4rem 0;width:min(20rem,84%);
    border-top:1px solid rgb(217 182 98 / .3);border-bottom:1px solid rgb(217 182 98 / .3)}
  .m-sub[hidden]{display:none}
  .m-sub>a{font-family:var(--font-serif);font-size:.95rem;letter-spacing:.04em;
    color:rgb(63 58 85 / .85);text-decoration:none;min-height:44px;padding:.2rem 1rem;
    display:flex;align-items:center;gap:.5rem;text-align:center}
  .m-sub>a[aria-current="page"]{color:#3a3040}
  .m-sub>a em{font-style:normal;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;
    color:rgb(90 74 42 / .55)}
}

.shell-bar::before,.shell-bar::after,
.shell-bar .shell-tabs a,.shell-bar .brand-logo img,.shell-bar .tab-caret,
.shell-bar .shell-actions .btn,.shell-bar .menu-btn span{
  transition:opacity 1.8s var(--ease-veil),color 1.8s var(--ease-veil),
    background-color 1.8s var(--ease-veil),border-color 1.8s var(--ease-veil),
    filter 1.8s var(--ease-veil),text-shadow 1.8s var(--ease-veil)}
body:has(.room-scene.dimmed) .shell-bar::before,
body:has(.room-scene.dimmed) .shell-bar::after{opacity:0}
body:has(.room-scene.dimmed) .shell-bar .shell-tabs a{
  color:rgb(255 250 240 / .84);text-shadow:0 1px 12px rgb(0 0 0 / .6)}

body:has(.room-scene.dimmed) .shell-bar .tab-caret{
  color:rgb(255 250 240 / .84);filter:drop-shadow(0 1px 8px rgb(0 0 0 / .6))}
body:has(.room-scene.dimmed) .shell-bar .shell-tabs a.active{color:#f4e3b6}
body:has(.room-scene.dimmed) .shell-bar .brand-logo img{filter:brightness(0) invert(1);opacity:.82}
body:has(.room-scene.dimmed) .shell-bar .shell-actions .btn{
  color:rgb(255 250 240 / .9);border-color:rgb(217 182 98 / .5);
  background:linear-gradient(180deg,rgb(255 255 255 / .14),rgb(255 250 236 / .06));
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .22),0 2px 12px rgb(0 0 0 / .25)}
body:has(.room-scene.dimmed) .shell-bar .menu-btn span{background:rgb(255 250 240 / .88)}

.mroom{display:none}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  
  .room-scene:has(.mroom) .scene-frame::after{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg, rgb(250 246 237 / .72), rgb(250 246 237 / .93) 46%, rgb(248 244 236 / .97));
    pointer-events:none}
  
  body:has(.mroom) .wall-deck,
  body:has(.mroom) .deck-nav,
  body:has(.mroom) .deck-hint,
  body:has(.mroom) .playlist,
  body:has(.mroom) .video-info{display:none!important}

  .mroom{display:flex;flex-direction:column;gap:.86rem;position:relative;z-index:4;
    padding:calc(var(--bar-h) + 1.4svh) 18px 2svh;min-height:100svh}
  .mroom-head h1{margin:0;font-family:var(--font-serif);font-weight:500;
    font-size:1.62rem;letter-spacing:.02em;color:var(--color-text);text-wrap:balance}
  .mroom-head p{margin:.3rem 0 0;font-size:.88rem;line-height:1.5;color:#575072;max-width:34ch}

  .practice{background:var(--color-surface);border:1px solid rgb(217 182 98 / .42);
    border-radius:16px;overflow:hidden;box-shadow:0 10px 34px rgb(63 58 85 / .11)}
  .practice .cinema{position:static;left:auto;top:auto;width:auto;margin:0}
  .practice .cinema-screen{border-radius:0;box-shadow:none;background:#141119}
  .practice .cinema-title{display:none}          
  
  .practice .cinema-bar{margin:0;border-radius:0;border:0;border-bottom:1px solid rgb(217 182 98 / .3);
    background:rgb(255 253 246 / .96);backdrop-filter:none;-webkit-backdrop-filter:none;
    color:var(--color-text);gap:.55rem;padding:.5rem .7rem}
  .practice .cinema-bar button{color:#5a4a2a;min-width:38px;min-height:38px;font-size:1rem;
    display:grid;place-items:center;border-radius:50%}
  .practice .cinema-bar button:active{background:rgb(217 182 98 / .18)}
  @media (hover:hover){.practice .cinema-bar button:hover{background:rgb(217 182 98 / .18)}}
  .practice .cinema-seek{accent-color:#c9a94e;height:3px}
  .practice .cinema-time{color:#575072;font-size:.72rem}
  .practice-body{padding:.85rem 1rem 1.05rem}
  .practice-title{margin:0;font-family:var(--font-serif);font-weight:500;font-size:1.02rem;
    line-height:1.32;color:var(--color-text);text-wrap:pretty}
  .practice-desc{margin:.45rem 0 0;font-size:.83rem;line-height:1.6;color:#575072;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .practice-desc.open{-webkit-line-clamp:unset}
  .practice-more{margin:.5rem 0 0;padding:0;border:0;background:none;color:#8a6b28;
    font-family:var(--font-sans);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;
    cursor:pointer;min-height:44px}

  .keyrow{display:flex;align-items:center;gap:.9rem;text-decoration:none;
    padding:.85rem 1rem;border-radius:14px;min-height:60px;
    border:1px solid rgb(217 182 98 / .34);background:rgb(255 253 246 / .82);
    transition:transform var(--t-touch) var(--ease-veil),box-shadow var(--t-move) var(--ease-veil)}
  .keyrow:active{transform:scale(.988)}
  .keyrow-name{font-family:var(--font-serif);font-size:.98rem;color:var(--color-text);line-height:1.2}
  .keyrow-count{display:block;font-family:var(--font-sans);font-size:.75rem;color:#575072;margin-top:.15rem}
  .keyrow-text{flex:1;min-width:0}
  .keyrow-go{flex:none;font-size:1.25rem;color:#8a6b28;line-height:1}
  .mroom-foot{margin:.1rem 0 0;font-size:.76rem;line-height:1.5;color:#5f5980;text-align:center}
  .mroom-foot a{color:#8a6b28}

  .mroom>*{animation:mroom-rise 520ms var(--ease-veil) backwards}
  .mroom>*:nth-child(2){animation-delay:60ms}
  .mroom>*:nth-child(3){animation-delay:120ms}
  .mroom>*:nth-child(4){animation-delay:170ms}
  .mroom>*:nth-child(5){animation-delay:210ms}
  @keyframes mroom-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
}
@media (max-width:820px) and (prefers-reduced-motion:reduce),(max-height:500px) and (orientation:landscape) and (prefers-reduced-motion:reduce){
  .mroom>*{animation:none}
  .practice .cinema-bar button{transition:none}
}

.shell-bar::before{
  background:linear-gradient(180deg, rgb(255 253 248 / .2), rgb(255 253 248 / .07) 60%, rgb(255 253 248 / 0));
  backdrop-filter:blur(10px) saturate(1.04) brightness(1.02);
  -webkit-backdrop-filter:blur(10px) saturate(1.04) brightness(1.02);
  animation:none}
.shell-bar::after{display:none}   

.notify-status--on{display:block;margin-top:.6rem;padding:.7rem .9rem;
  border:1px solid rgb(180 142 58 / .38);border-radius:.7rem;
  background:rgb(247 240 224 / .72);color:#3f3757;font-size:.86rem;line-height:1.45}

.join-pop{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:1rem;
  background:rgb(30 26 16 / .5);opacity:0;transition:opacity .24s var(--ease-veil,ease)}
.join-pop.on{opacity:1}
.join-pop[hidden]{display:none}
.join-pop .join-box{width:min(92vw,26rem);padding:1.15rem 1.25rem 1rem;
  background:var(--color-surface,#faf6ee);border:1px solid rgb(217 182 98 / .5);
  border-radius:var(--radius-md,14px);box-shadow:0 24px 70px rgb(0 0 0 / .4)}
.join-pop .join-box h3{margin:0 0 .5rem}
.join-pop .join-box p{margin:0 0 .7rem}
.join-pop .join-box p:last-child{margin:0;display:flex;gap:.5rem;flex-wrap:wrap}
.join-pop .join-box .btn{min-height:44px;display:inline-flex;align-items:center}

body:has(#join-dialog:not([hidden])) .exhibit-veil{pointer-events:none}

body:not(:has(.temple-scene)) .shell-bar::before{
  backdrop-filter:none;-webkit-backdrop-filter:none;
  
  -webkit-mask-image:none;mask-image:none;inset:0;
  background:linear-gradient(180deg,
    rgb(250 246 237 / .98), rgb(250 246 237 / .92) 58%, rgb(250 246 237 / 0))}

.shell-bar .brand-logo img{filter:drop-shadow(0 1px 3px rgb(255 255 255 / .95))
  drop-shadow(0 0 12px rgb(255 255 255 / .85))}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  
  .practice .cinema-video{object-fit:cover;background:#141119}
  
  .practice-tap{position:absolute;inset:0;z-index:3;display:grid;place-items:center;
    border:0;background:none;cursor:pointer;padding:0;
    -webkit-tap-highlight-color:transparent}
  .practice-tap .pt-seal{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;
    font-size:1.45rem;color:#4a3a1c;padding-left:5px;
    background:rgb(255 253 246 / .9);border:1px solid rgb(217 182 98 / .7);
    box-shadow:0 6px 26px rgb(0 0 0 / .3), 0 0 40px rgb(255 244 210 / .35);
    
    transition:opacity .9s var(--ease-veil),transform .9s var(--ease-veil)}
  .practice-tap.playing .pt-seal{opacity:0;transform:scale(.82)}
  .practice-tap:active .pt-seal{transform:scale(.94)}

  .practice:has(.practice-tap.playing) .cinema-bar{background:transparent}
  
  .practice .cinema-bar,.practice .cinema-bar button{
    transition:background .9s var(--ease-veil),color .9s var(--ease-veil),
      border-color .9s var(--ease-veil)}
}
@media (max-width:820px) and (prefers-reduced-motion:reduce),(max-height:500px) and (orientation:landscape) and (prefers-reduced-motion:reduce){
  .practice-tap .pt-seal{transition:none}
}

@media (max-width:820px) and (max-height:700px),(max-height:500px) and (orientation:landscape){
  .mroom{gap:.7rem;padding:calc(var(--bar-h) + 1.6svh) 14px 2svh}
  .mroom-head h1{font-size:1.36rem}
  .mroom-head p{font-size:.82rem}
  .practice-body{padding:.7rem .85rem .85rem}
  .practice-desc{-webkit-line-clamp:2}
  .keyrow{min-height:54px;padding:.7rem .85rem}
  .practice-tap .pt-seal{width:62px;height:62px;font-size:1.2rem}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){

  .mroom{padding-bottom:calc(2.4svh + env(safe-area-inset-bottom) + 8px);
    padding-left:calc(18px + env(safe-area-inset-left));
    padding-right:calc(18px + env(safe-area-inset-right))}
  .pan-plate{bottom:calc(3.2svh + env(safe-area-inset-bottom))}
  .deck-cue--pan{bottom:calc(3.2svh + env(safe-area-inset-bottom) + 62px)}

  .practice .cinema-bar{padding:.4rem .6rem}
  .practice .cinema-bar button{min-width:44px;min-height:44px}
  .keyrow{min-height:64px}

  .mroom a,.mroom button,.practice .cinema-bar button,.pan-plate,.arch{
    -webkit-tap-highlight-color:transparent}
  .practice .cinema-bar button:hover{background:none}
  .practice .cinema-bar button:active{background:rgb(217 182 98 / .22);transform:scale(.94)}
  .practice-more:active{opacity:.55}

  .mroom-head,.keyrow,.mroom-foot{transition:opacity 1.6s var(--ease-veil)}
  .room-scene:has(.mroom) .scene-frame::after{transition:background 2.2s var(--ease-veil)}
  .room-scene.dimmed:has(.mroom) .scene-frame::after{
    background:linear-gradient(180deg, rgb(30 23 40 / .84), rgb(19 14 27 / .94) 55%, rgb(14 10 21 / .96))}
  .room-scene.dimmed .mroom-head,
  .room-scene.dimmed .keyrow,
  .room-scene.dimmed .mroom-foot{opacity:0;pointer-events:none}

  
  .keyset,.practice,.practice .cinema-bar{
    transition:opacity 1.6s var(--ease-veil), background 1.6s var(--ease-veil),
      border-color 1.6s var(--ease-veil), box-shadow 1.6s var(--ease-veil)}
  .room-scene.dimmed .keyset{opacity:0;pointer-events:none}
  .room-scene.dimmed .practice{box-shadow:0 22px 70px rgb(0 0 0 / .55), 0 0 90px rgb(255 236 190 / .1)}
  
  body:has(.room-scene.dimmed .mroom) .shell-bar{opacity:.45;transition:opacity 1.6s var(--ease-veil)}
}
@media (max-width:820px) and (prefers-reduced-motion:reduce),(max-height:500px) and (orientation:landscape) and (prefers-reduced-motion:reduce){
  .mroom-head,.keyrow,.mroom-foot,
  .room-scene:has(.mroom) .scene-frame::after{transition-duration:.2s}
  .practice .cinema-bar button:active{transform:none}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .keyset{border-radius:14px;overflow:hidden;border:1px solid rgb(217 182 98 / .34)}
  .keyset--silver{border-color:rgb(150 165 195 / .42)}
  .keyset--gold{border-color:rgb(201 169 78 / .5)}
  
  .keyset .keyrow{width:100%;border:0;border-radius:0;text-align:left;cursor:pointer;
    font-family:inherit;background:rgb(255 253 246 / .82)}
  .keyset--silver .keyrow{background:linear-gradient(180deg, rgb(247 249 253 / .96), rgb(238 243 250 / .9))}
  .keyset--gold .keyrow{background:linear-gradient(180deg, rgb(255 246 224 / .96), rgb(252 240 209 / .9))}
  .keyset .keyrow-go{transition:transform .32s var(--ease-veil)}
  .keyset .keyrow[aria-expanded="true"] .keyrow-go{transform:rotate(90deg)}
  
  .keyslots{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s var(--ease-veil)}
  .keyrow[aria-expanded="true"] + .keyslots{grid-template-rows:1fr}
  .keyslots-in{overflow:hidden;min-height:0}
  .keyrow[aria-expanded="true"] + .keyslots .keyslots-in{border-top:1px solid rgb(217 182 98 / .28)}
  .keyslot{display:flex;align-items:center;gap:.8rem;padding:.72rem .95rem;min-height:56px;
    border-bottom:1px solid rgb(217 182 98 / .16);background:rgb(255 253 246 / .5)}
  .keyslot:last-child{border-bottom:0}
  .keyslot-lock{width:19px;height:19px;flex:none;color:#8a7a52}
  .keyslot-lines{flex:1;min-width:0;display:block}
  .keyslot-bar{display:block;height:.62rem;border-radius:999px;max-width:15rem;
    background:linear-gradient(90deg, rgb(63 58 85 / .13), rgb(63 58 85 / .05))}
  .keyslot-bar--sub{height:.42rem;margin-top:.4rem;width:46%}
  
  .keyslot--named{width:100%;font:inherit;text-align:left;cursor:pointer;border:0;
    border-bottom:1px solid rgb(217 182 98 / .16);color:inherit;
    -webkit-tap-highlight-color:transparent}
  .keyslot--named:last-child{border-bottom:0}
  .keyslot--named:active{background:rgb(255 244 210 / .72)}
  .keyslot-name{flex:1;min-width:0;font-family:var(--font-serif);font-size:.94rem;
    line-height:1.28;color:#3a3040}
  
  .keyslot-play{width:19px;height:19px;flex:none;display:none;place-items:center;
    color:#8a7a52;font-size:.82rem;line-height:1}
  .keyslot--named.unlocked .keyslot-lock{display:none}
  .keyslot--named.unlocked .keyslot-play{display:grid}
}
@media (max-width:820px) and (prefers-reduced-motion:reduce),(max-height:500px) and (orientation:landscape) and (prefers-reduced-motion:reduce){
  .keyslots{transition-duration:.01s}
  .keyset .keyrow-go{transition:none}
}

.exhibit-scene .scene-frame{aspect-ratio:1536/1024}

.exhibit{position:absolute;display:block;text-decoration:none;cursor:pointer;
  outline-offset:4px;border-radius:14px;z-index:3}

.exhibit .halo{position:absolute;inset:var(--halo-bleed,-10%) calc(var(--halo-bleed,-10%) * 1.2);border-radius:inherit;opacity:0;
  transition:opacity .5s ease;filter:blur(5px);pointer-events:none;
  background:radial-gradient(ellipse 60% 58% at 50% 55%, rgb(255 244 214 / .72), rgb(255 240 198 / 0) 70%)}
.exhibit:hover .halo,.exhibit:focus-visible .halo{opacity:1}
.exhibit .plate{display:none}   
.exhibit--soon{cursor:pointer}
.exhibit--soon .halo{background:radial-gradient(ellipse 60% 58% at 50% 55%, rgb(205 218 240 / .5), transparent 70%)}

.exhibit[data-exhibit="hos"] .plate,.exhibit--labelled .plate,.exhibit--soon .plate,.exhibit[data-gate] .plate{display:block;position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);width:max-content;max-width:14rem;pointer-events:none;
  font-family:var(--font-serif);font-size:clamp(.82rem,1.05vw,1rem);letter-spacing:.2em;
  text-transform:uppercase;text-align:center;line-height:1.35;color:#3f3757;
  opacity:0;transition:opacity .5s ease;
  text-shadow:0 1px 9px rgb(255 253 246 / .95),0 0 22px rgb(255 253 246 / .9)}
.exhibit[data-exhibit="hos"]:hover .plate,
.exhibit[data-exhibit="hos"]:focus-visible .plate,
.exhibit--labelled:hover .plate,
.exhibit--labelled:focus-visible .plate{opacity:1}

.arch--soon .plate,.exhibit--soon .plate,.exhibit[data-gate] .plate{top:62%;transform:translate(-50%,-50%);opacity:1;
  padding:.55em 1.2em;border-radius:999px;background:rgb(250 246 236 / .84);
  box-shadow:0 2px 14px rgb(60 45 25 / .12);text-shadow:none;color:#565073}

.temple-scene.opening .arch--soon .plate,
.temple-scene.opening .exhibit--soon .plate,
.temple-scene.opening .exhibit[data-gate] .plate{opacity:0;transition:opacity .14s linear}

.exhibit.is-demo .halo{opacity:1}
.guide{position:absolute;inset:0;z-index:6;pointer-events:none}
.guide[hidden]{display:none}

.guide-ghost{position:absolute;left:0;top:0;width:0;height:0;opacity:0;
  transition:opacity .45s ease, transform 0ms cubic-bezier(.76,0,.24,1)}
.guide-ghost.in{opacity:1}
.guide-dot,.guide-ring{position:absolute;left:-13px;top:-13px;width:26px;height:26px;border-radius:50%}

.guide-dot{background:radial-gradient(circle at 38% 34%, rgb(101 94 133 / .96) 0%, rgb(63 58 85 / .94) 60%);
  box-shadow:0 0 0 2px rgb(217 182 98 / .92), 0 8px 20px rgb(63 58 85 / .42)}
.guide-ring{border:2px solid rgb(63 58 85 / .5);opacity:0}
.guide-ghost.press .guide-dot{animation:guide-press .52s var(--ease-veil)}
.guide-ghost.press .guide-ring{animation:guide-ping .72s var(--ease-veil)}
@keyframes guide-press{0%{transform:scale(1)}28%{transform:scale(.58)}100%{transform:scale(1)}}
@keyframes guide-ping{0%{opacity:.9;transform:scale(.55)}100%{opacity:0;transform:scale(3.4)}}

.guide-say{position:absolute;left:50%;bottom:5svh;z-index:7;transform:translateX(-50%);
  display:flex;align-items:center;justify-content:center;gap:.9rem 1.4rem;flex-wrap:wrap;
  width:max-content;max-width:min(44rem,92vw);padding:.8rem 1.3rem;
  background:rgb(255 251 241 / .93);border:1px solid rgb(255 255 255 / .55);
  border-radius:var(--radius-md);box-shadow:var(--shadow-lifted);
  backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);
  opacity:0;transition:opacity .5s var(--ease-veil)}
.guide-say.on{opacity:1}
.guide-say[hidden]{display:none}
.guide-say p{margin:0;font-family:var(--font-serif);font-size:.95rem;line-height:1.5;
  color:var(--color-text);text-wrap:pretty}
.guide-say-row{display:flex;align-items:center;gap:1.1rem}
.guide-say .onboard-again{margin:0;white-space:nowrap}
@media (prefers-reduced-motion: reduce){
  .guide-dot,.guide-ring{animation:none}
  .guide-say{transition:none}
}

.exhibit-veil{position:fixed;inset:0;z-index:40;display:grid;place-items:center;
  padding:clamp(1rem,4vw,3rem);background:rgb(30 26 16 / 0);
  transition:background .42s var(--ease-veil);pointer-events:none}
.exhibit-veil.on{background:rgb(30 26 16 / .34);pointer-events:auto;
  backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.exhibit-card{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(25rem,30rem);
  width:100%;max-width:78rem;background:rgb(255 251 241 / .92);
  border:1px solid rgb(255 255 255 / .55);border-radius:var(--radius-md);
  box-shadow:var(--shadow-sanctum);backdrop-filter:blur(26px) saturate(1.5);
  -webkit-backdrop-filter:blur(26px) saturate(1.5);overflow:hidden;
  
  transform:translate(var(--dx,0px),var(--dy,0px)) scale(.10);opacity:0;
  
  transition:transform .52s cubic-bezier(.22,1,.36,1),opacity .5s linear}

.exhibit-veil.on .exhibit-card{transform:translate(0,0) scale(1);opacity:1;
  transition:transform .52s cubic-bezier(.22,1,.36,1),opacity .34s var(--ease-veil)}
@media (prefers-reduced-motion: reduce){
  .exhibit-card{transition-duration:.01s;transform:none;opacity:0}
  .exhibit-veil.on .exhibit-card{transform:none}
}
.exhibit-card .shot{position:relative;margin:0;min-height:32rem;background:#efe7d5;
  border-right:1px solid rgb(217 182 98 / .4);overflow:hidden}
.exhibit-card .shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.exhibit-card .shot.is-soon{display:grid;place-items:center;padding:2rem;
  background:linear-gradient(165deg,rgb(250 246 236 / .8),rgb(238 240 248 / .6))}
.exhibit-card .shot.is-soon p{font-family:var(--font-serif);letter-spacing:.3em;text-transform:uppercase;
  font-size:.8rem;color:#9b95b3;margin:0;text-align:center}
.exhibit-body{padding:clamp(2rem,3.4vw,3rem);align-self:center}
.exhibit-body .kicker{font-family:var(--font-serif);font-size:.72rem;letter-spacing:.3em;
  text-transform:uppercase;color:#9a8a54;margin:0 0 .5rem}
.exhibit-body h2{font-family:var(--font-serif);font-weight:500;font-size:clamp(1.6rem,2vw,2.1rem);
  margin:0 0 .8rem;color:var(--color-text)}
.exhibit-body p{margin:0 0 .95rem;font-size:.97rem;line-height:1.7;color:var(--color-text)}
.exhibit-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.4rem}
.exhibit-actions .small{flex-basis:100%;margin:.2rem 0 0;font-size:.78rem;color:#8a8272}

@media (min-width:921px){
  .exhibit-body{max-height:min(84vh,52rem);overflow-y:auto;overscroll-behavior:contain}
}

.exhibit-body .weeks{list-style:none;padding:0;margin:.2rem 0 .95rem}
.exhibit-body .weeks li{margin:0 0 .45rem;font-size:.92rem;line-height:1.65;color:var(--color-text-muted)}
.exhibit-body .dates{font-size:.88rem;color:var(--color-text-muted)}

.exhibit-body .dates,.course-card .dates,.course-doc .dates{font-family:var(--font-serif);
  font-size:1.02rem;line-height:1.55;color:#8a6b28;margin:0 0 1rem}

@media (max-width:920px){
  .exhibit-card{grid-template-columns:1fr;max-width:30rem}
  .exhibit-card .shot{order:2;border-right:0;border-top:1px solid rgb(217 182 98 / .4);aspect-ratio:16/10}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .exhibit-veil{padding:0;place-items:end stretch}
  .exhibit-card{max-width:100%;width:100%;
    max-height:92svh;grid-template-rows:auto minmax(0,1fr);
    border-radius:18px 18px 0 0;border-bottom:0;
    
    transform:translateY(14%);}
  .exhibit-veil.on .exhibit-card{transform:translateY(0)}
  .exhibit-card .shot{order:0;min-height:0;aspect-ratio:16/9;
    border-top:0;border-bottom:1px solid rgb(217 182 98 / .4)}
  
  .exhibit-card .shot:not(:has(img)){aspect-ratio:auto;order:2;
    border-bottom:0;border-top:1px solid rgb(217 182 98 / .4)}
  .exhibit-card:has(.shot:not(:has(img))){grid-template-rows:minmax(0,1fr) auto}
  
  .exhibit-body{padding:1.15rem 1.15rem calc(1.15rem + env(safe-area-inset-bottom));
    align-self:stretch;overflow-y:auto;overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch}
  .exhibit-body h2{font-size:1.35rem}
  .exhibit-body p{font-size:.95rem;line-height:1.6}
  
  .exhibit-actions{margin-top:1.1rem;gap:.55rem}
  .exhibit-actions .btn{flex:1 1 100%;min-height:44px;display:inline-flex;
    align-items:center;justify-content:center}
  
  .exhibit-card:not(:has(.shot)){grid-template-rows:minmax(0,1fr)}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  [data-state-panel="populated"]:has(> .exhibit-scene){
    height:100svh;overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x mandatory;overscroll-behavior:contain;touch-action:pan-x;
    scrollbar-width:none;display:flex;align-items:center}
  [data-state-panel="populated"]:has(> .exhibit-scene)::-webkit-scrollbar{display:none}
  
  .exhibit-scene{position:relative;flex:none;
    height:max(100lvh, 100vw * 1024 / 1536);
    width:max(100vw, 100lvh * 1536 / 1024);
    min-height:0;min-width:0;padding:0}
  .exhibit-scene .scene-frame{position:absolute;inset:0;left:0;top:0;
    width:100%;height:100%;transform:none;aspect-ratio:auto;min-width:0;min-height:0}
  .exhibit-scene .stage{object-fit:fill;object-position:center}
  
  .exhibit-scene .exhibit{display:block;
    scroll-snap-align:center;scroll-snap-stop:always}
  .exhibit-scene .exhibit.locked .halo{opacity:1}
  
  .exhibit-scene .scene-flash{position:fixed}
  
  .temple-scene.exhibit-scene .room-panel{display:none}
  
  .gathering-panel{display:none}
  
  .exhibit-scene .guide,
  .exhibit-scene .guide-say{display:none!important}
  
  .map-name,.map-call{display:none}
  
  .pan-plate--named{flex-direction:column;gap:.15rem;padding:.5rem 1.25rem;
    max-width:min(84vw,22rem)}
  .pan-plate--named .pan-name{position:static;width:auto;height:auto;overflow:visible;
    clip-path:none;font-family:var(--font-serif);font-size:.9rem;line-height:1.2;
    color:#3f3757;text-align:center;text-wrap:balance}

  .pan-plate--named .pan-step{font-size:.6rem;opacity:.72;line-height:1.45;
    text-align:center;text-wrap:balance}
}

@media (max-width:820px) and (prefers-reduced-motion:reduce),(max-height:500px) and (orientation:landscape) and (prefers-reduced-motion:reduce){
  [data-state-panel="populated"]:has(> .exhibit-scene){
    height:auto;overflow-x:visible;scroll-snap-type:none;display:block}
  .exhibit-scene{width:auto;height:auto;min-height:100svh}
  .exhibit-scene .scene-frame{position:fixed;width:100vw;height:100lvh}
  .exhibit-scene .stage{object-fit:cover;object-position:center 30%}
  .exhibit-scene .exhibit{display:none}
  .temple-scene.exhibit-scene .room-panel{display:block}
  .gathering-panel{display:block}
}

/* THE PHONE READS THE ROOM AS A LIST (2026-09-04, Director: "on mobile like the
   meditation and practitioners screen ... with the countries being expandable").
   The map stays as the backdrop it is good at being, and the gatherings become
   expandable rows underneath it, the same shape the Practitioners room uses.
   These are the rules the reduced-motion variant already proved; they now run for
   every phone rather than only for a phone that asked for less movement. */
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  [data-state-panel="populated"]:has(> .exhibit-scene.map-scene){
    height:auto;overflow-x:visible;scroll-snap-type:none;display:block;
    /* The map design made this a horizontal scroller: overflow-y hidden and
       touch-action pan-x. Both have to go or the page cannot be scrolled with a
       finger, which a mouse wheel hides completely. */
    overflow-y:visible;touch-action:auto;overscroll-behavior:auto}
  .exhibit-scene.map-scene{width:auto;height:auto;min-height:100svh}
  .exhibit-scene.map-scene .scene-frame{position:fixed;width:100vw;height:100lvh}
  .exhibit-scene.map-scene .stage{object-fit:cover;object-position:center 30%}
  .map-scene .exhibit{display:none}
  /* An earlier rule hides every .room-panel on the phone. Un-hide the LIST only:
     Kirra's welcome card is a screenful before the first country, so on the phone
     the room opens on the switch and the countries, the way Practitioners does.
     The welcome still reads on the desktop. */
  .temple-scene.map-scene #zoom-live.room-panel{display:block}
  .map-scene ~ .gathering-panel,.gathering-panel{display:block}
  .gathering-panel{padding-top:calc(var(--bar-h, 56px) + 1.2rem)}
  /* One line of state, not three and a card. */
  .map-scene .paywall{padding:.85rem .95rem}
  .map-scene .paywall p{margin:0 0 .6rem}
  .map-scene .paywall p.small{display:none}
  .map-scene .circle-head{margin:0 0 .7rem;font-size:1.5rem}

  /* The map's own furniture goes with the map interaction: the region plate and
     the swipe hint belong to a map you tap, and this one you read. */
  .map-scene .pan-plate,.map-scene .deck-cue--pan{display:none}
  /* The count is in the panel now, where the choice is made. */
  .free-count--map{display:none}
  /* The two cues stay, as the switch between the weekly circles and Heart of
     Space, and the list keeps clear of them. The rows carry a backdrop-filter,
     which makes each one its own stacking context, so the cues have to be lifted
     above the panel or the list quietly eats the taps meant for them. */
  .gathering-panel{padding-bottom:calc(9rem + env(safe-area-inset-bottom,0px))}
  /* Moved into the panel by inlineCuesOnPhone(), where it becomes the segmented
     switch at the head of the list rather than furniture floating on the map. */
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .map-scene .exhibit:not(.map-region){display:none}

  .map-scene .map-cues{display:flex;position:fixed;left:50%;
    top:calc(var(--bar-h, 56px) + max(env(safe-area-inset-top, 0px), 8px));
    transform:translateX(-50%);
    z-index:6;gap:.5rem;flex-wrap:wrap;justify-content:center;
    width:max-content;max-width:calc(100vw - 1rem)}
  
  .map-scene .exhibit.map-cue{position:static;display:inline-flex;align-items:center;
    justify-content:center;gap:.4rem;min-height:44px;padding:.55rem 1.05rem;
    border-radius:999px;background:rgb(255 253 246 / .85);color:#3f3757;
    text-decoration:none;box-shadow:0 2px 12px rgb(0 0 0 / .2)}
  .map-scene .map-cue span{font-family:var(--font-serif);font-size:.6rem;
    letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
  .map-scene .map-cue .arr{display:none}
  .map-scene .map-cue:active{background:rgb(255 253 246 / .98)}
  .map-scene.opened .map-cues{opacity:0;pointer-events:none}
}
@media (min-width:821px) and (min-height:501px){
  .exhibit-scene .room-panel{display:none}
}

.linkish{background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;
  text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.linkish:hover{color:var(--color-text)}
.linkish:focus-visible{outline:2px solid #8a6f2e;outline-offset:2px;border-radius:3px}

.auth-panel .under-note:has(.linkish){min-height:44px;display:flex;align-items:center;
  justify-content:center;margin-top:.35rem}

.auth-said{color:#2f6b4a;text-align:center;font-size:.9rem;margin:0 0 var(--space-2);
  background:rgb(47 107 74 / .08);border:1px solid rgb(47 107 74 / .26);
  border-radius:var(--radius-sm);padding:.5rem .7rem}

.auth-card.is-signin .primer-more{display:none}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .onboard-rooms{grid-template-columns:1fr;gap:.45rem}
  .onboard-room{grid-template-columns:52px 1fr;grid-template-rows:auto auto;
    grid-template-areas:"img name" "img line";
    align-items:center;column-gap:.75rem;row-gap:.1rem;
    text-align:left;padding:.45rem;min-height:64px}
  .onboard-room img{grid-area:img;width:52px;height:52px;aspect-ratio:1;
    margin:0;object-position:center 34%}
  .onboard-room .or-name{grid-area:name;align-self:end;font-size:.98rem}
  .onboard-room .or-line{grid-area:line;align-self:start}
  .onboard-room:hover,.onboard-room:focus-visible{transform:none}
  .onboard-doors{border-top:1px solid rgb(217 182 98 / .4);padding:1rem}
  .onboard-doorlead{text-align:left;margin-bottom:.6rem}
  
  .onboard{padding:.8rem}
  .onboard-say{padding:1.15rem 1.15rem 1rem}
  .onboard-card h2{font-size:1.6rem;margin-bottom:.6rem}
  .onboard-lead{line-height:1.58;margin-bottom:.6rem}
  
  .onboard-again{margin-top:.4rem}
}

.onboard-room img{object-position:center 38%}

.auth-panel h1{text-wrap:balance}
.onboard-card h2{text-wrap:balance}

.playlist.glass,.video-info.glass{
  --pl-ink:var(--color-text);
  --pl-ink-soft:var(--color-text-muted);
  --pl-row:rgb(255 255 255 / .58);
  --pl-line:rgb(217 182 98 / .5);
  --pl-row-hover:rgb(255 255 255 / .82);
  --pl-row-active:rgb(255 252 242 / .95);
  --pl-shade:rgb(63 58 85 / .16);
  
  background:linear-gradient(180deg,rgb(255 252 246 / .74),rgb(251 245 233 / .68));
  -webkit-backdrop-filter:blur(26px) saturate(1.14);
  backdrop-filter:blur(26px) saturate(1.14);
  border:1px solid var(--pl-line);
  box-shadow:0 24px 56px rgb(63 48 30 / .24),0 2px 8px rgb(63 48 30 / .1),
    inset 0 1px 0 rgb(255 255 255 / .9);
  color:var(--pl-ink);
  transition:background 1.8s var(--ease-veil),border-color 1.8s var(--ease-veil),
    box-shadow 1.8s var(--ease-veil),color 1.8s var(--ease-veil)}

.pl-head,.pl-title,.vi-title{color:var(--pl-ink);text-shadow:none}
.pl-sub,.vi-desc,.pl-ghost-note{color:var(--pl-ink-soft);text-shadow:none}
.vi-head{color:var(--pl-ink-soft);opacity:1}
.vi-desc{color:var(--pl-ink)}
.pl-item{background:var(--pl-row);border:1px solid var(--pl-line);color:var(--pl-ink)}
.pl-item:hover:not(.locked){background:var(--pl-row-hover);border-color:rgb(217 182 98 / .7)}
.pl-item.active{background:var(--pl-row-active);border-color:rgb(217 182 98 / .85);
  box-shadow:0 4px 14px rgb(63 48 30 / .16)}
.pl-play{background:rgb(217 182 98 / .3);color:var(--pl-ink)}
.pl-tier{background:rgb(217 182 98 / .18);border-color:var(--pl-line);color:var(--pl-ink)}
.pl-tier--gold{color:#7d5c12;background:rgb(217 182 98 / .26);border-color:rgb(217 182 98 / .6)}
.pl-tier--silver{color:#4e5464;background:rgb(120 135 165 / .16);border-color:rgb(120 135 165 / .38)}

.pl-item--ghost{background:rgb(255 255 255 / .34);border:1px solid rgb(217 182 98 / .45)}
.pl-item--ghost:hover{background:rgb(255 255 255 / .6);border-color:rgb(217 182 98 / .8)}
.pl-item--ghost .pl-play{background:rgb(217 182 98 / .22);color:var(--pl-ink-soft)}
.pl-ghost-bar{background:linear-gradient(90deg,var(--pl-shade),rgb(63 58 85 / .07))}
.playlist.glass::-webkit-scrollbar-thumb,
.video-info.glass::-webkit-scrollbar-thumb{background:rgb(63 58 85 / .28)}

body:has(.room-scene.dimmed) .playlist.glass,
body:has(.room-scene.dimmed) .video-info.glass{
  --pl-ink:rgb(255 250 240 / .95);
  --pl-ink-soft:rgb(255 250 240 / .7);
  --pl-row:rgb(255 255 255 / .1);
  --pl-line:rgb(217 182 98 / .34);
  --pl-row-hover:rgb(255 255 255 / .2);
  --pl-row-active:rgb(255 255 255 / .3);
  --pl-shade:rgb(255 255 255 / .28);
  background:linear-gradient(180deg,rgb(38 30 22 / .56),rgb(26 21 15 / .48));
  box-shadow:0 24px 60px rgb(0 0 0 / .5),inset 0 1px 0 rgb(255 255 255 / .14)}
body:has(.room-scene.dimmed) .pl-tier--gold{color:#ffe7a6;background:rgb(255 208 120 / .18);
  border-color:rgb(255 208 120 / .4)}
body:has(.room-scene.dimmed) .pl-tier--silver{color:#eef2f8;background:rgb(215 225 245 / .16);
  border-color:rgb(215 225 245 / .32)}
body:has(.room-scene.dimmed) .pl-item--ghost{background:rgb(255 255 255 / .07);
  border-color:rgb(255 255 255 / .26)}
body:has(.room-scene.dimmed) .playlist.glass::-webkit-scrollbar-thumb,
body:has(.room-scene.dimmed) .video-info.glass::-webkit-scrollbar-thumb{background:rgb(255 255 255 / .28)}
@media (prefers-reduced-motion:reduce){
  .playlist.glass,.video-info.glass{transition:none}}

.plate{
  --plate-ink:var(--color-text);
  --plate-ink-soft:var(--color-text-muted);
  position:relative;isolation:isolate;
  display:flex;flex-direction:column;align-items:flex-start;
  padding:1.5rem 1.6rem 1.6rem;border-radius:20px;
  
  background:linear-gradient(168deg,rgb(255 253 248 / .52),rgb(252 246 235 / .72));
  -webkit-backdrop-filter:blur(30px) saturate(1.2) brightness(1.03);
  backdrop-filter:blur(30px) saturate(1.2) brightness(1.03);
  border:1px solid rgb(217 182 98 / .55);
  box-shadow:0 26px 60px rgb(63 48 30 / .26),0 2px 10px rgb(63 48 30 / .12),
    inset 0 1px 0 rgb(255 255 255 / .95),inset 0 -1px 0 rgb(217 182 98 / .18);
  color:var(--plate-ink)}

.plate::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;
  pointer-events:none;
  background:radial-gradient(120% 90% at 8% -10%,rgb(255 255 255 / .5),transparent 58%)}
.plate h1,.plate h2{font-family:var(--font-serif);font-weight:500;
  margin:0;line-height:1.22;letter-spacing:-.005em;text-wrap:balance}
.plate h1{font-size:clamp(1.55rem,1.5vw + .9rem,2rem)}
.plate h2{font-size:clamp(1.15rem,.7vw + .85rem,1.35rem)}
.plate p{margin:.55rem 0 0;font-size:.94rem;line-height:1.62;max-width:38ch;text-wrap:pretty}
.plate .btn{margin-top:1.25rem}

.plate p.plate-note{margin-top:1.1rem;font-size:.86rem;line-height:1.55;color:var(--plate-ink)}
.plate-note a{color:#6a4a06}
.plate-note a:hover{color:#4d3503}

@media (min-width:821px) and (min-height:501px){
  
  .room-plates{display:contents}
  .plate{position:fixed;z-index:8;max-height:78svh;overflow-y:auto;scrollbar-width:none}
  .plate::-webkit-scrollbar{display:none}
  
  .plate--say{left:max(4.5vw,26px);top:53%;transform:translateY(-50%);
    width:clamp(19rem,29vw,25rem)}
  .plate--ask{right:max(6.5vw,30px);top:33%;transform:translateY(-50%);
    width:clamp(17rem,24vw,20.5rem)}
  
  .plate{animation:plate-settle 900ms cubic-bezier(.16,1,.3,1) backwards}
  .plate--ask{animation-delay:130ms}
}
@keyframes plate-settle{
  from{opacity:0;transform:translateY(calc(-50% + 16px));filter:blur(7px)}
  to{opacity:1;transform:translateY(-50%);filter:none}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  
  .room-plates{position:relative;z-index:4;display:flex;flex-direction:column;gap:1rem;
    width:min(92vw,34rem);margin:0 auto;
    padding:calc(var(--bar-h) + 3svh) 0 calc(9svh + env(safe-area-inset-bottom))}
  .plate{width:100%;animation:plate-rise 760ms cubic-bezier(.16,1,.3,1) backwards}
  .plate p{max-width:none}
  .plate--ask{animation-delay:110ms}
}
@keyframes plate-rise{
  from{opacity:0;transform:translateY(16px);filter:blur(6px)}
  to{opacity:1;transform:none;filter:none}
}
@media (prefers-reduced-motion:reduce){.plate{animation:none}}

.exhibit[hidden]{display:none}

.exhibit-card:not(:has(.shot)){grid-template-columns:minmax(0,1fr);max-width:38rem}

.gathering-panel{position:relative;z-index:4;padding:calc(56px + 5svh) 0 11svh}
.map-cue,.map-cues,.map-call{display:none}
@media (min-width:821px) and (min-height:501px){

  .gathering-panel{display:none}
  
  .map-call{position:absolute;left:50%;top:21.4%;z-index:4;margin:0;
    transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;
    gap:.45rem;pointer-events:none;text-align:center;
    text-shadow:0 1px 10px rgb(255 253 246 / .95),0 0 26px rgb(255 253 246 / .85);
    transition:opacity .5s var(--ease-veil)}
  .map-call-kicker{font-family:var(--font-serif);font-size:.62rem;letter-spacing:.36em;
    text-transform:uppercase;color:#6f5a26}
  .map-call-line{font-family:var(--font-serif);font-size:clamp(1.05rem,1.5vw,1.45rem);
    letter-spacing:.06em;color:#3f3757}
  .exhibit-scene.opened .map-call{opacity:0}
  
  .map-name{position:absolute;left:var(--name-x,50%);top:var(--name-y,50%);transform:translate(-50%,-50%);
    font-family:var(--font-serif);font-size:clamp(.82rem,1.05vw,1rem);letter-spacing:.2em;
    text-transform:uppercase;color:#3f3757;pointer-events:none;

    
    width:max-content;max-width:13rem;line-height:1.35;text-align:center;
    opacity:0;transition:opacity .38s var(--ease-veil);
    text-shadow:0 1px 9px rgb(255 253 246 / .95),0 0 22px rgb(255 253 246 / .9)}
  .exhibit:hover .map-name,.exhibit:focus-visible .map-name{opacity:1}

  
  .map-scene .exhibit[data-exhibit="ausnz"] .map-name{--name-x:32%}
  .map-scene .exhibit .halo{opacity:.42}
  
  @media (max-width:1000px){
    .map-scene .map-name{font-size:.74rem;max-width:10rem;letter-spacing:.14em}
  }
  .map-scene .exhibit:hover .halo,.map-scene .exhibit:focus-visible .halo{opacity:1}
  .map-scene .map-name{opacity:.82;transition:opacity .38s var(--ease-veil),
    letter-spacing .38s var(--ease-veil)}
  .map-scene .exhibit:hover .map-name,.map-scene .exhibit:focus-visible .map-name{
    opacity:1;letter-spacing:.26em}
  
  .map-cues{position:absolute;left:50%;top:80.4%;transform:translateX(-50%);z-index:5;
    display:flex;align-items:center;gap:1.4rem}
  .map-cue{position:relative;z-index:5;
    display:flex;flex-direction:column;align-items:center;gap:.1rem;pointer-events:none;
    color:#5a4a2a;text-shadow:0 1px 8px rgb(255 253 246 / .95),0 0 18px rgb(255 253 246 / .8);
    text-decoration:none;cursor:pointer;padding:.55rem 1.1rem;min-height:44px;
    justify-content:center;border-radius:999px;pointer-events:auto;
    transition:opacity .6s ease,color .35s ease,background .35s ease}
  .map-cue:hover,.map-cue:focus-visible{color:#3f3757;background:rgb(255 253 246 / .5)}
  .map-cue span{font-family:var(--font-serif);font-size:.6rem;letter-spacing:.32em;
    text-transform:uppercase}
  .map-cue .arr{font-size:1rem;animation:map-cue-bob 2.6s ease-in-out infinite}
  
  .exhibit-scene.opened .map-cue{opacity:0}
  @keyframes map-cue-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
}
@media (min-width:821px) and (min-height:501px) and (prefers-reduced-motion:reduce){
  .map-cue .arr{animation:none}
}

.library-scene:has(.ex-founder:hover) .ex-founder .halo,
.library-scene:has(.ex-founder:focus-visible) .ex-founder .halo{opacity:1}

.library-scene .exhibit[data-gate] .halo{opacity:.3}
.library-scene .exhibit[data-gate]:hover .halo,
.library-scene .exhibit[data-gate]:focus-visible .halo{opacity:1}

.rope{position:absolute;inset:0;width:100%;height:100%;z-index:2;
  pointer-events:none;overflow:visible}

.ex-shelf .plate{left:calc(100% + .7rem);transform:translateY(-50%);text-align:center;max-width:15rem}
.ex-shelf .plate small{display:block;margin-top:.3em;font-size:.74em;letter-spacing:.06em;
  text-transform:none;color:#5c5375}

svg[hidden]{display:none}

.exhibit-card:has(.gl-rail){grid-template-columns:auto minmax(0,1fr);
  max-width:min(52rem,94vw);width:52rem;height:min(84svh,54rem)}
.gl-rail{display:flex;flex-direction:column;justify-content:center;gap:.06rem;
  padding:1.4rem .85rem;border-right:1px solid rgb(217 182 98 / .4);
  background:linear-gradient(180deg,#fdfaf2,#f7f0e0)}
.gl-rail a{display:grid;place-items:center;width:2rem;height:1.62rem;
  border-radius:6px;text-decoration:none;font-family:var(--font-serif);
  font-size:.82rem;letter-spacing:.04em;color:#6f5a26;
  transition:background .18s ease,color .18s ease}
.gl-rail a:hover,.gl-rail a:focus-visible{background:rgb(217 182 98 / .26);color:#3f3757}
.gl-rail .is-empty{color:#c9bfa6;pointer-events:none}

.gl-body{display:flex;flex-direction:column;min-height:0;align-self:stretch;
  padding:clamp(1.5rem,2.4vw,2.2rem) clamp(1.2rem,2.4vw,2.2rem) 0}

a[href^="mailto:"]{overflow-wrap:anywhere}

.gl-search{flex:0 0 auto;position:relative;padding:0 1.1rem .55rem 0}
.gl-search .gl-q{width:100%;box-sizing:border-box;
  font-family:var(--font-sans);font-size:16px;letter-spacing:.01em;color:#3f3757;
  padding:.5rem .8rem .5rem 2rem;border:1px solid rgb(217 182 98 / .5);border-radius:var(--radius-sm);
  background:rgb(255 253 247 / .9) no-repeat left .62rem center/.92rem .92rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23a08a4e' stroke-width='1.7'%3E%3Ccircle cx='7' cy='7' r='4.6'/%3E%3Cpath d='M10.4 10.4 14 14' stroke-linecap='round'/%3E%3C/svg%3E");
  outline:none;transition:border-color .25s,box-shadow .25s}
.gl-search .gl-q::placeholder{color:#9a9080}
.gl-search .gl-q:focus-visible{border-color:rgb(217 182 98 / .95);
  box-shadow:0 0 0 3px rgb(217 182 98 / .2)}
.gl-search .gl-q::-webkit-search-cancel-button{cursor:pointer}
.gl-count{margin:.3rem 0 0;min-height:1em;color:var(--color-text-muted)}
.gl-count:empty{display:none}

.gl-rail a.is-filtered{color:#c9bfa6;pointer-events:none}
.gl-entries{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  padding:.2rem 1.1rem .4rem 0;scrollbar-width:thin}

.gl-entry{scroll-margin-top:0;padding:0 0 1.15rem;border-bottom:1px solid #f0e9d8}
.gl-entry:last-child{border-bottom:0}
.gl-entry h3{font-family:var(--font-serif);font-weight:500;font-size:1.02rem;
  color:#3f3757;margin:1.15rem 0 .4rem;letter-spacing:.01em}
.gl-entry p{margin:0 0 .7rem;font-size:.93rem;line-height:1.72;color:var(--color-text)}
.gl-entry a[data-xref]{color:#8a6d1f;text-underline-offset:3px}
.gl-body .exhibit-actions{margin:0;padding:.9rem 0 1.1rem;
  border-top:1px solid rgb(217 182 98 / .34)}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  
  .exhibit-veil:has(.gl-rail){padding:0}
  .exhibit-card:has(.gl-rail){grid-template-columns:1fr;width:100%;max-width:100%;
    height:100svh;border-radius:0}
  .gl-rail{flex-direction:row;justify-content:flex-start;overflow-x:auto;
    padding:calc(env(safe-area-inset-top) + .5rem) .6rem .5rem;
    border-right:0;border-bottom:1px solid rgb(217 182 98 / .4);
    scrollbar-width:none;position:sticky;top:0;z-index:2}
  .gl-rail::-webkit-scrollbar{display:none}
  .gl-rail a{flex:0 0 auto;width:2.75rem;height:2.75rem;font-size:.95rem}
  .gl-body{padding:1rem 1.1rem 0}
  .gl-body .exhibit-actions{padding-bottom:calc(env(safe-area-inset-bottom) + 1rem)}
}

@keyframes halo-breath{0%,100%{opacity:.11}50%{opacity:.40}}
.exhibit:not(.is-demo):not(:hover):not(:focus-visible):not(:active) .halo{
  animation:halo-breath 5.5s ease-in-out infinite}

.map-scene .exhibit .halo,
.library-scene .exhibit[data-gate] .halo{animation:none}

@keyframes shard-rise-a{to{transform:translateY(-104px)}}
@keyframes shard-rise-b{to{transform:translateY(-146px)}}

@keyframes shard-twinkle-a{
  0%,100%{opacity:.28}14%{opacity:1}27%{opacity:.42}44%{opacity:.9}
  58%{opacity:.34}72%{opacity:.98}88%{opacity:.46}}
@keyframes shard-twinkle-b{
  0%,100%{opacity:.4}19%{opacity:.92}33%{opacity:.3}51%{opacity:1}
  66%{opacity:.38}81%{opacity:.86}}

.exhibit::before,.exhibit::after{
  content:"";position:absolute;left:27%;right:27%;bottom:0;height:132%;
  pointer-events:none;z-index:2;
  background-repeat:repeat;
  
  -webkit-mask-image:linear-gradient(to top,transparent 0,#000 16%,#000 58%,transparent 93%);
  mask-image:linear-gradient(to top,transparent 0,#000 16%,#000 58%,transparent 93%)}

.exhibit::before{
  background-image:
    radial-gradient(ellipse 1.9px 17px at 50% 18%,rgb(255 250 238 / .95),rgb(246 224 172 / .38) 34%,rgb(226 190 120 / 0) 78%),
    radial-gradient(ellipse 1.5px 5px  at 50% 44%,rgb(255 248 232 / .9),rgb(244 220 166 / .34) 36%,rgb(226 190 120 / 0) 80%),
    radial-gradient(ellipse 2.2px 22px at 50% 68%,rgb(255 252 244 / .8),rgb(248 228 180 / .32) 32%,rgb(226 190 120 / 0) 76%),
    radial-gradient(ellipse 1.6px 7px  at 50% 88%,rgb(255 246 226 / .92),rgb(244 218 162 / .36) 35%,rgb(226 190 120 / 0) 79%),
    radial-gradient(ellipse 1.3px 4px  at 50% 6%, rgb(255 252 242 / .85),rgb(246 224 172 / 0) 74%);
  
  background-size:47px 104px,58px 104px,71px 104px,41px 104px,83px 104px;
  background-position:0 0,17px 0,31px 0,8px 0,38px 0;
  animation:shard-rise-a 6.5s linear infinite,shard-twinkle-a 2.3s ease-in-out infinite}

.exhibit::after{
  background-image:
    radial-gradient(ellipse 1.4px 6px  at 50% 30%,rgb(255 250 236 / .92),rgb(246 224 172 / .35) 35%,rgb(226 190 120 / 0) 78%),
    radial-gradient(ellipse 2.1px 20px at 50% 58%,rgb(255 252 244 / .82),rgb(248 228 180 / .3) 33%,rgb(226 190 120 / 0) 77%),
    radial-gradient(ellipse 1.6px 9px  at 50% 82%,rgb(255 248 230 / .88),rgb(244 220 166 / .34) 34%,rgb(226 190 120 / 0) 79%),
    radial-gradient(ellipse 1.2px 4px  at 50% 12%,rgb(255 253 246 / .8),rgb(246 224 172 / 0) 76%),
    radial-gradient(ellipse 1.8px 14px at 50% 70%,rgb(255 250 238 / .78),rgb(246 222 170 / .3) 34%,rgb(226 190 120 / 0) 78%);
  background-size:53px 146px,64px 146px,44px 146px,76px 146px,61px 146px;
  background-position:24px 0,6px 0,35px 0,18px 0,46px 0;
  animation:shard-rise-b 9.5s linear infinite,shard-twinkle-b 3.1s ease-in-out infinite}

.exhibit:nth-of-type(4n+2) .halo{animation-delay:-1.3s}
.exhibit:nth-of-type(4n+3) .halo{animation-delay:-2.7s}
.exhibit:nth-of-type(4n+4) .halo{animation-delay:-4.1s}
.exhibit:nth-of-type(4n+2)::before{animation-delay:-2.1s,-.7s}
.exhibit:nth-of-type(4n+3)::before{animation-delay:-4.3s,-1.4s}
.exhibit:nth-of-type(4n+4)::before{animation-delay:-5.6s,-1.9s}
.exhibit:nth-of-type(4n+2)::after{animation-delay:-3.4s,-1.1s}
.exhibit:nth-of-type(4n+3)::after{animation-delay:-6.2s,-2.2s}
.exhibit:nth-of-type(4n+4)::after{animation-delay:-8.1s,-2.8s}

@media (prefers-reduced-motion:reduce){
  .exhibit:not(.is-demo):not(:hover):not(:focus-visible):not(:active) .halo{
    animation:none;opacity:.2}
  .exhibit::before,.exhibit::after{animation:none}
}

html.shards-off .exhibit::before,
html.shards-off .exhibit::after{display:none}

.acct-panel .card{background:var(--color-bg);box-shadow:none;margin:0;
  border:1px solid var(--color-border);border-bottom-width:0;border-radius:0;
  padding:1.25rem var(--space-3)}
.acct-panel .card:first-of-type{border-radius:var(--radius-md) var(--radius-md) 0 0}
.acct-panel .card:last-of-type{border-bottom-width:1px;
  border-radius:0 0 var(--radius-md) var(--radius-md)}
.acct-panel .card h3{font-size:1.05rem;margin:0 0 .3rem}
.acct-panel .card .acct-note{margin:0 0 .75rem;max-width:52ch}
.acct-panel .card > :last-child{margin-bottom:0}

.acct-panel .card:has(.onboard-again),
.acct-panel .card:has(> .btn){display:grid;
  grid-template-columns:minmax(0,1fr) 15rem;gap:0 var(--space-3);align-items:start}
.acct-panel .card:has(.onboard-again) h3,
.acct-panel .card:has(.onboard-again) .acct-note,
.acct-panel .card:has(> .btn) h3,
.acct-panel .card:has(> .btn) .acct-note{grid-column:1}
.acct-panel .card:has(.onboard-again) .acct-note,
.acct-panel .card:has(> .btn) .acct-note{margin-bottom:0}
.acct-panel .card .onboard-again,
.acct-panel .card > .btn{grid-column:2;grid-row:1 / span 2;
  align-self:center;justify-self:start;margin:0;white-space:nowrap}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .acct-panel .card{padding:1.1rem var(--space-2)}
  .acct-panel .card:has(.onboard-again),
  .acct-panel .card:has(> .btn){grid-template-columns:1fr}
  .acct-panel .card .onboard-again,
  .acct-panel .card > .btn{grid-column:1;grid-row:auto;margin-top:.85rem}
}

/* THE CIRCLE PASS on the Bronze card. It was a one-line placeholder with a
   disabled button; it is now the only thing the School actually sells, so it
   reads as a block within the card: its own name, what it opens, a price per
   cycle and a real button. Set apart by a rule above it rather than a box, so a
   free key does not look like it costs something. */
.key-addon{margin:1rem 0 0;padding:.95rem 0 0;border-top:1px solid var(--color-border)}
.key-addon-name{margin:0 0 .15rem;font-weight:600}
.key-addon-blurb{margin:0 0 .5rem;color:var(--color-text-muted)}
.key-addon .key-unlocks{margin:0 0 .8rem}
.key-addon .key-choices{margin:0}
.key-addon-price{margin:0;font-size:.95rem;color:var(--color-text-muted);white-space:nowrap}
.key-addon-btn{padding:.35rem 1.1rem;font-size:.88rem}
.key-addon-note{margin:.35rem 0 0;color:var(--color-text-muted)}

html:has(.acct),body:has(.acct){
  min-height:100%;
  background:
    radial-gradient(120% 62% at 50% -8%, rgb(255 252 244 / .95), rgb(255 252 244 / 0) 60%) fixed,
    linear-gradient(180deg,#f7f1e6 0%,#fbf7f0 38%,#f5eee2 100%) fixed}
body:has(.acct){background-color:#f7f1e6}
.acct{max-width:66rem}

.acct-panel .keys-grid{max-width:none}
.acct-panel .card{max-width:none}

.keys-grid,.acct-panel .card:first-of-type,.acct-panel .card{background:#fffdf9}
.keys-grid{border-color:rgb(200 178 130 / .5);box-shadow:0 10px 34px rgb(120 90 30 / .09)}
.acct-panel .card{border-color:rgb(200 178 130 / .45)}

.key-action{max-width:11.5rem}
.paypal-slot{max-width:11.5rem}

.key-card h2{font-size:1.55rem;letter-spacing:-.01em}
.key-card{padding:1.6rem var(--space-3)}
.key-card.current{background:linear-gradient(90deg,rgb(247 236 205 / .55),rgb(255 253 249 / .5) 60%);
  box-shadow:inset 3px 0 0 var(--color-primary)}

.acct-me{background:linear-gradient(165deg,#fdf6e6,#f6ecd9 60%,#f1e4cd);
  border-color:rgb(196 168 108 / .55);
  box-shadow:0 8px 26px rgb(120 90 30 / .1),inset 0 1px 0 rgb(255 255 255 / .7)}
.account-key-badge{width:4rem;height:4rem;margin-bottom:1rem}
.account-key-name{font-size:1.45rem}
.acct-nav a{border-radius:var(--radius-sm)}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){

  .room-panel:has(.pane){
    
    width:auto;max-width:none;margin:0;height:100svh;
    
    display:flex;align-items:stretch;gap:.7rem;
    
    padding:calc(var(--bar-h) + 1.6svh) 7vw calc(2.4svh + env(safe-area-inset-bottom));
    overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x mandatory;overscroll-behavior-x:contain;
    scrollbar-width:none}
  .room-panel:has(.pane)::-webkit-scrollbar{display:none}

  .room-panel:has(.pane) .pane-shot{margin:0 0 1rem;aspect-ratio:16/10;overflow:hidden;
    border-radius:var(--radius-sm);background:#efe7d5;
    border:1px solid rgb(217 182 98 / .4)}
  .room-panel:has(.pane) .pane-shot img{display:block;width:100%;height:100%;
    object-fit:cover;object-position:top center}
  .room-panel:has(.pane)>.pane{
    
    flex:0 0 86vw;height:100%;margin:0;
    scroll-snap-align:center;scroll-snap-stop:always;
    overflow-y:auto;overscroll-behavior-y:contain;
    
    background:rgb(255 253 246 / .88);
    
    backdrop-filter:none;-webkit-backdrop-filter:none;
    
    mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 1.4rem),transparent);
    -webkit-mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 1.4rem),transparent)}

  
  .room-panel.card{padding:var(--space-3)}
  .gathering-panel{padding-top:calc(var(--bar-h) + 3svh);
    padding-bottom:calc(9svh + env(safe-area-inset-bottom))}
  #zoom-live{padding-top:0;padding-bottom:0}

  #zoom-live .gathering .row{flex-direction:column;align-items:stretch}
  #zoom-live .gathering .btn{width:100%;margin-top:.6rem}

  .music-toggle{bottom:calc(1rem + env(safe-area-inset-bottom));
    right:calc(1rem + env(safe-area-inset-right))}
  
  .acct{padding-top:calc(var(--space-2) + env(safe-area-inset-top));
    padding-bottom:calc(var(--space-3) + env(safe-area-inset-bottom))}

  .threshold-over{align-items:flex-start;overscroll-behavior:contain;
    padding:var(--bar-h) 1.2rem calc(4svh + env(safe-area-inset-bottom))}
  
  .threshold-over .book-panel{margin-top:0;margin-bottom:0}
  
  body:has(.threshold-over:not([hidden])) .deck-cue,
  body:has(.threshold-over:not([hidden])) .pan-plate{display:none}

  .porch-footer a{display:inline-flex;align-items:center;min-height:44px;padding:0 .55rem}
  
  .cinema-seek,.practice .cinema-seek{height:44px;background:none;
    -webkit-appearance:none;appearance:none}
  .cinema-seek::-webkit-slider-runnable-track{height:3px;border-radius:2px;
    background:rgb(201 169 78 / .32)}
  .cinema-seek::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;
    margin-top:-6.5px;border-radius:50%;background:#c9a94e;border:0}
  .cinema-seek::-moz-range-track{height:3px;border-radius:2px;background:rgb(201 169 78 / .32)}
  .cinema-seek::-moz-range-thumb{width:16px;height:16px;border-radius:50%;
    background:#c9a94e;border:0}

  
  .room-scene>.wrap-wide{padding-left:var(--space-2)!important;
    padding-right:var(--space-2)!important}

  .course-doc .kicker{font-size:.85rem}
  .course-doc{padding-top:calc(var(--bar-h) + 4svh)}

  .onboard-room:hover{border-color:var(--color-border);box-shadow:none}
}

@media (prefers-reduced-motion:reduce){
  .door-card{transition-property:opacity}
  .scene-zoom{transition:none}
}

.exhibit--soon .plate{top:calc(100% + .4rem);transform:translateX(-50%);max-width:18rem}
[data-exhibit="writeups"] .plate{left:auto;right:.5rem;transform:translateY(-50%)}
.onboard .btn:focus-visible,.guide-say .btn:focus-visible{outline-color:#8a6f2e}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .library-scene .ex-shelf{min-height:44px}   
  .map-scene .map-cue{font-size:.72rem}}
.map-scene .map-cue{font-size:.72rem}

.library-scene .shelf-heading{position:absolute;left:3.4%;top:10.2%;
  margin:0;z-index:6;pointer-events:none;opacity:0;transition:opacity .35s var(--ease-veil);
  padding:.55em 1.2em;border-radius:999px;background:rgb(250 246 236 / .88);
  box-shadow:0 2px 14px rgb(60 45 25 / .12);color:#565073;
  font-family:var(--font-serif);font-size:.68rem;letter-spacing:.12em;
  text-transform:uppercase;white-space:nowrap}

.library-scene:has(.ex-shelf:hover) .lib-welcome{opacity:.3}
.library-scene:has(.ex-shelf:hover) .shelf-heading,
.library-scene:has(.ex-shelf:focus-visible) .shelf-heading{opacity:1}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .library-scene .shelf-heading{display:none}}   

.library-scene .ex-shelf .plate{left:100%;top:50%;transform:translateY(-50%);margin-left:.7rem;
  max-width:20rem;white-space:normal;text-align:center}

.door-film--full{aspect-ratio:9/16}

.arch .plate,.exhibit .plate{animation:none}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .exhibit--labelled:not(.ex-shelf) .plate,
  .exhibit[data-exhibit="hos"] .plate{
    opacity:.62;top:auto;bottom:-.55rem;transform:translate(-50%,100%);
    width:max-content;max-width:min(44vw,12rem);
    padding:.42em 1em;border-radius:999px;
    background:rgb(250 246 236 / .84);box-shadow:0 2px 14px rgb(60 45 25 / .12);
    text-shadow:none;color:#565073;font-size:.6rem;letter-spacing:.16em;
    
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
    overflow:hidden;
    transition:opacity .38s var(--ease-veil)}
  
  .exhibit--labelled:not(.ex-shelf).locked .plate,
  .exhibit[data-exhibit="hos"].locked .plate{opacity:0}
  
  .exhibit-scene.opened .exhibit--labelled .plate,
  .exhibit-scene.opened .exhibit[data-exhibit="hos"] .plate{opacity:0}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .ex-shelf .halo{opacity:.5}
  .ex-shelf:active .halo{opacity:1}
  
  .ex-shelf::after{content:"";position:absolute;left:6%;right:6%;bottom:0;height:1px;
    background:linear-gradient(90deg,transparent,rgb(255 236 187 / .85),transparent);
    pointer-events:none}
  
  .shelf-mark{position:absolute;left:calc(100% + .18rem);top:50%;
    transform:translateY(-50%);z-index:3;
    font-family:var(--font-serif);font-size:1.15rem;line-height:1;font-style:normal;
    color:rgb(255 240 205 / .92);
    text-shadow:0 0 7px rgb(150 112 40 / .75),0 1px 2px rgb(60 44 18 / .55);
    pointer-events:none}
  .ex-shelf:active .shelf-mark{color:#fff8e8;text-shadow:0 0 12px rgb(255 226 150 / .95)}

  
  .library-scene .ex-shelf .plate{
    opacity:0;transition:opacity .5s var(--ease-veil,ease);
    margin-left:1.15rem;max-width:min(58vw,13rem);
    padding:.3rem .62rem;border-radius:999px;
    font-size:.6rem;letter-spacing:.055em;line-height:1.25;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    background:linear-gradient(180deg,rgb(255 253 246 / .8),rgb(252 246 232 / .68));
    border:1px solid rgb(217 182 98 / .5);
    box-shadow:0 1px 10px rgb(60 44 18 / .28),inset 0 1px 0 rgb(255 255 255 / .7);
    -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
    color:#4a3f66;text-transform:none}
  
  .library-scene:has(.ex-shelf.locked) .ex-shelf .plate{opacity:1;pointer-events:auto}
  .library-scene .ex-shelf .plate::after{content:"";position:absolute;inset:-10px -6px}
  .ex-shelf:active .plate{background:linear-gradient(180deg,rgb(255 247 226 / .95),rgb(248 234 200 / .9));
    border-color:rgb(190 152 62 / .75)}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .exhibit-card .shot.sess-plate{aspect-ratio:auto;order:2;min-height:0;
    border-bottom:0;border-top:1px solid rgb(217 182 98 / .4)}
  .exhibit-card:has(.shot.sess-plate){grid-template-rows:minmax(0,1fr) auto}
  
  .sess-plate .sp-faces{flex-wrap:wrap;gap:.35rem .7rem}
  .sess-plate .sp-act{margin-top:.85rem}
}

@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .map-scene .map-name{display:block;position:absolute;
    left:var(--name-x,50%);top:var(--name-y,50%);transform:translate(-50%,-50%);
    width:max-content;max-width:9rem;
    font-family:var(--font-serif);font-size:.66rem;letter-spacing:.14em;
    text-transform:uppercase;text-align:center;line-height:1.3;
    color:#3f3757;pointer-events:none;opacity:.9;
    text-shadow:0 1px 9px rgb(255 253 246 / .95),0 0 22px rgb(255 253 246 / .9)}
  
  .map-scene .exhibit[data-exhibit="ausnz"] .map-name{--name-x:32%}
  .map-scene.opened .map-name{opacity:0}

  .map-scene .map-cues{top:auto;
    bottom:calc(3.2svh + env(safe-area-inset-bottom, 0px))}
  .map-scene .pan-plate{
    bottom:calc(3.2svh + env(safe-area-inset-bottom, 0px) + 54px)}
  .map-scene .deck-cue--pan{
    bottom:calc(3.2svh + env(safe-area-inset-bottom, 0px) + 106px)}
}

.room-scene .scene-frame,.room-scene .stage-dim{transition:opacity .9s var(--ease-veil,ease)}
.deck-card .poster,.deck-card .poster .play{transition:opacity .32s ease,transform .32s ease}
.deck-card .poster:active .play{transform:scale(.92)}

.map-scene .exhibit.map-cue--on{
  background:linear-gradient(180deg,rgb(238 214 150 / .97),rgb(222 190 112 / .97));
  color:#3a3050;border-color:rgb(180 142 58 / .75);
  box-shadow:0 2px 16px rgb(150 116 40 / .3)}
.map-scene .exhibit.map-cue--on .arr{opacity:.5}
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .map-scene .map-cues{gap:.4rem;flex-wrap:nowrap}
}

/* Money: the buy-button disclosure, the cancel button and the receipt list.
   Added 2026-09-03 with the paid Zoom membership. Nothing here is decorative:
   the price, the renewal and the receipt have to be legible before a member
   pays and after, so they take the body colour, not the muted one. */
.key-terms{margin:.7rem 0 0;color:var(--color-text-muted);line-height:1.45}
.key-terms a{color:inherit;text-decoration:underline}
.btn-danger{border-color:rgb(160 60 50 / .55);color:#8c3a30}
@media (hover:hover){.btn-danger:hover{border-color:rgb(160 60 50 / .9);background:rgb(160 60 50 / .06)}}
.pay-rows{margin-top:.4rem}
.pay-rows .pay-row{align-items:flex-start}
.pay-rows .pay-row span:first-child{padding-right:1rem}
.pay-rows .pay-row .small{color:var(--color-text-muted);font-weight:400}

/* The Circle Pass popup: what it opens on the left, how often you pay on the
   right. Reuses .join-pop, so open, close, backdrop and Escape are the handlers
   the rooms already use; only the box is wider than a join link needs. */
.join-pop:has(.pass-pop) .join-box{width:min(94vw,46rem);max-height:min(88vh,52rem);
  overflow:auto;padding:1.5rem 1.6rem 1.4rem;
  padding-bottom:calc(1.4rem + env(safe-area-inset-bottom))}
.pass-pop{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:1.8rem}
.pass-pop h3{margin:0 0 .5rem;font-size:1.45rem}
.pass-pop .pass-pop-said > p{margin:0 0 .8rem;max-width:34ch}
.pass-pop .key-unlocks{margin:0 0 .9rem}

/* The two capsules. One choice, made once, before the buttons appear: which is
   why they read as a pair and the unchosen one recedes rather than disappears. */
.pass-caps{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:0 0 1rem}
.pass-cap{appearance:none;display:flex;flex-direction:column;gap:.1rem;
  min-height:5.5rem;padding:.75rem .85rem;cursor:pointer;text-align:left;
  border:1px solid var(--color-border);border-radius:var(--radius-md);
  background:var(--color-bg);color:var(--color-text);font-family:inherit;
  transition:border-color var(--t-touch) ease,background var(--t-touch) ease,
    box-shadow var(--t-touch) ease}
.pass-cap-cycle{font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--color-text-muted)}
.pass-cap-price{font-size:1.5rem;font-weight:600;line-height:1.1}
.pass-cap-unit{font-size:.85rem;color:var(--color-text-muted)}
.pass-cap-note{margin-top:.15rem;font-size:.75rem;color:var(--color-text-muted)}
.pass-cap[aria-checked="true"]{border-color:rgb(217 182 98 / .85);
  background:linear-gradient(180deg,#fffdf6,rgb(255 250 236 / .8));
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .9),0 2px 12px rgb(150 110 40 / .14)}
.pass-cap[aria-checked="true"] .pass-cap-cycle{color:#7a6535}
@media (hover:hover){.pass-cap:hover{border-color:rgb(217 182 98 / .6)}}
.pass-cap:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}

.pass-pop-pay .key-terms{margin:.9rem 0 1rem}
.pass-close{width:100%;min-height:44px}

@media (max-width:820px),(max-height:560px){
  .join-pop:has(.pass-pop) .join-box{width:min(96vw,30rem);padding:1.15rem 1.15rem 1.1rem;
    padding-bottom:calc(1.1rem + env(safe-area-inset-bottom))}
  .pass-pop{grid-template-columns:1fr;gap:1rem}
  .pass-pop h3{font-size:1.25rem}
  .pass-pop .key-unlocks{margin-bottom:.5rem}
  .pass-cap{min-height:4.6rem}
}

/* The free gathering count, wherever it is shown. It is a standing fact about
   this member's month, so it reads as a statement in the body colour, not as a
   muted footnote under something else. */
.free-count{margin:.6rem 0 0;font-weight:500}
.key-card .free-count{margin:.5rem 0 0;font-size:.95rem}
/* On the phone the Gathering Room IS the map, and the panel opens on a tap, so
   the count belongs on the map beside the two cues rather than inside the panel
   nobody has opened yet. */
/* The bottom of the map is a stack of fixed furniture: the two cue pills, the
   region plate above them, and the swipe hint above that. The count is floated
   clear of all three rather than added to the cue row, where the plate landed
   straight on top of it. .map-cues is positioned, so it is the containing block
   for both offsets below. */
.free-count--map{position:absolute;left:50%;transform:translateX(-50%);
  bottom:calc(100% + 118px);width:calc(100vw - 1.5rem);max-width:26rem;
  margin:0;text-align:center;font-size:.9rem;
  padding:.4rem .8rem;border-radius:var(--radius-md);
  background:rgb(255 253 246 / .94);border:1px solid rgb(217 182 98 / .55);
  color:var(--color-text);box-shadow:0 2px 10px rgb(150 110 40 / .12)}
/* On the phone the cue group is anchored to the BOTTOM, so the count sitting in
   the flow above the pills lifts the group and everything stays clear of the
   edge. On the desktop the group is anchored by its TOP, at 80.4% of the scene,
   tuned to where the cushions are: a row added in the flow there pushes the
   pills down into the bottom edge instead. So on desktop the count floats above
   the anchor and leaves the pills exactly where the artwork wants them. */
@media (min-width:821px) and (min-height:501px){
  .free-count--map{bottom:calc(100% + .6rem);width:max-content;max-width:min(90vw,34rem)}
}
/* The saving on the monthly capsule is a number, not a badge: it earns its
   emphasis from being true, and PRODUCT.md rules out ribbon grammar. */
.pass-cap-note--save{color:#6b5a2e;font-weight:500}

/* The Gathering Room's country rows. Same expandable shape as the Practitioners
   room, so a phone shows five names and five local times, and the detail of any
   one of them is a tap away rather than five cards deep. */
.zoom-file{margin:0 0 .6rem;border:1px solid rgb(217 182 98 / .38);border-radius:12px;
  background:rgb(255 253 246 / .82);
  backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);
  box-shadow:0 10px 30px rgb(120 90 30 / .10);
  transition:border-color var(--t-move),box-shadow var(--t-move),background var(--t-move)}
@media (hover:hover){.zoom-file:hover{border-color:rgb(217 182 98 / .55)}}
.zoom-file:active{border-color:rgb(217 182 98 / .55)}
.zoom-file[open]{background:rgb(255 253 246 / .94);border-color:rgb(217 182 98 / .6);
  box-shadow:0 16px 44px rgb(120 90 30 / .16)}
.zoom-file>summary{display:flex;align-items:center;gap:.8rem;min-height:56px;
  padding:.7rem .95rem;list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.zoom-file>summary::-webkit-details-marker{display:none}
.zoom-file>summary::marker{content:""}
.zoom-file>summary:focus-visible{outline:2px solid var(--color-accent);outline-offset:-3px;
  border-radius:11px}
.zf-head{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.zf-region{font-family:var(--font-serif);font-size:1.05rem;line-height:1.2;
  color:var(--color-text)}
.zf-when{font-size:.82rem;color:#5b430f}
.zf-chip{margin-left:auto;flex:none;font-size:.66rem;letter-spacing:.08em;
  text-transform:uppercase;white-space:nowrap}
.zoom-file .prac-cue{margin-left:.2rem;flex:0 0 auto;display:grid;place-items:center;
  width:30px;height:30px;color:#5b430f;transition:transform var(--t-move) var(--ease-veil)}
.zoom-file .prac-cue svg{width:13px;height:8px;display:block}
.zoom-file[open]>summary .prac-cue{transform:rotate(180deg)}
.zoom-file-body{margin:0 .95rem;padding:.9rem 0 1.05rem;
  border-top:1px solid rgb(217 182 98 / .3);display:flex;flex-direction:column;gap:.45rem}
.zf-title{margin:0;font-family:var(--font-serif);font-size:1rem;line-height:1.35;
  color:var(--color-text)}
.zf-wall{margin:0;color:var(--color-text-muted)}
.zf-action{margin:.5rem 0 0}
.zf-action .btn{min-height:44px;display:inline-flex;align-items:center}
@media (max-width:820px){.zf-action .btn{width:100%;justify-content:center}}

/* The cue pair, moved into the list on the phone by inlineCuesOnPhone(). It
   lands LAST in this file on purpose: three earlier rules pin .map-scene .map-cues
   to the bottom of the viewport, and the panel it moves into is itself inside the
   scene, so those selectors keep matching the moved node. */
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  .map-scene .map-cues--inline{position:static;transform:none;left:auto;top:auto;
    bottom:auto;width:auto;max-width:none;display:flex;gap:.5rem;flex-wrap:nowrap;
    justify-content:center;margin:0 1rem .9rem;z-index:auto;opacity:1;
    pointer-events:auto}
  .map-scene .map-cues--inline .exhibit.map-cue{flex:1 1 0;min-width:0;
    box-shadow:0 4px 18px rgb(90 70 25 / .18)}
  .map-scene .map-cues--inline .map-cue span{white-space:nowrap;overflow:hidden;
    text-overflow:ellipsis}
  /* Nothing floats at the bottom any more, so the list needs no landing strip. */
  .gathering-panel{padding-bottom:calc(3rem + env(safe-area-inset-bottom,0px))}
}
.zf-why{margin:.2rem 0 0;color:#7a5a12}

/* The reading pages (privacy, terms, refunds) carry the same back control as the
   rooms. Their bar uses .wordmark rather than .brand-logo, so it needs the same
   shove the rooms give their logo or the chevron lands on top of the name. */
@media (max-width:820px),(max-height:500px) and (orientation:landscape){
  body:has(.lobby-return) .shell-bar .wordmark{margin-left:52px}
}

/* The member area had no footer, so terms and refunds were reachable only from
   a sentence inside Billing, and only for someone who already had a
   subscription. They are standing documents; they get a standing place. */
.acct-footer{margin-top:var(--space-4);padding-bottom:calc(4rem + env(safe-area-inset-bottom,0px))}