/* Circle HD immersive, v2 motion pass. Tokens carried over from v1: near-black, champagne gold, warm ivory. */
:root{--bg:#08080a;--cream:#fff8ec;--gold:#d9b780;--gold-deep:#a8844a;--soft:#cbbda7;--veil:0;--dim:0;--letterbox:0;--intro:1;
  --display:Impact,'Arial Narrow',sans-serif;color-scheme:dark;font-synthesis:none}
*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:var(--bg);color:var(--cream);font:400 14px/1.55 'Avenir Next','Helvetica Neue',Arial,sans-serif;overflow-x:hidden}
button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.skip-link{position:fixed;z-index:60;top:-80px;left:20px;background:#161514;padding:12px}.skip-link:focus{top:20px}

/* ---------- scene stack: the venue fills the screen ---------- */
.scene-stack,.photographic-backdrop,#render-canvas,#pano-canvas,#fx-canvas,.scene-dim,.color-grade,.transition-curtain,.film-grain{position:fixed;inset:0;width:100%;height:100%}
.scene-stack{z-index:0;pointer-events:none;background:var(--bg)}
.photographic-backdrop{background:#101112 url('../rooms/exterior/media/exterior_0.jpg') no-repeat;background-size:cover;background-position:var(--pan-x,50%) 42%;
  transform:scale(var(--poster-scale,1.08));filter:brightness(.86) saturate(.9);opacity:1;transition:opacity .9s}
body[data-current-scene='bar'] .photographic-backdrop{background-image:url('./rooms-v5/bar_1.jpg');background-position:8% 50%}
body[data-current-scene='speakeasy'] .photographic-backdrop,body[data-current-scene='stairs'] .photographic-backdrop{background-image:url('./rooms-v5/speakeasy-room_0.jpg');background-position:85% 50%}
#render-canvas,#pano-canvas{display:block;opacity:0;transition:opacity 1.1s ease;touch-action:none}
body[data-engine='ready'][data-canvas='splat'] #render-canvas,body[data-engine='ready'][data-canvas='pano-depth'] #pano-canvas{opacity:1}
body[data-engine='ready'] .photographic-backdrop{opacity:0}
body[data-current-scene='entrance'] #render-canvas,body[data-current-scene='entrance'] #pano-canvas{opacity:0}
body[data-current-scene='entrance'] .photographic-backdrop{opacity:1}
.scene-dim{background:#040305;opacity:var(--dim)}
#fx-canvas{pointer-events:none}
.color-grade{background:linear-gradient(0deg,#020304a0 0%,transparent 22%,transparent 86%,#05050660 100%),radial-gradient(ellipse 130% 100% at 50% 45%,transparent 70%,#0006 100%);pointer-events:none}
.letterbox{position:fixed;left:0;right:0;height:calc(var(--letterbox) * 50vh);background:#000;z-index:1}
.letterbox.top{top:0;box-shadow:0 1px 0 rgba(217,183,128,calc(var(--letterbox) * .6))}.letterbox.bottom{bottom:0;box-shadow:0 -1px 0 rgba(217,183,128,calc(var(--letterbox) * .6))}
.transition-curtain{z-index:1;background:#030305;opacity:var(--veil);transition:opacity .6s}
.film-grain{opacity:0;background-image:repeating-linear-gradient(0deg,transparent 0 3px,#d8c6a014 3px 4px)}

/* ---------- intro: black-and-gold reveal ---------- */
.intro{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 55%,#0d0b09,#030304 70%);transition:opacity .9s,visibility .9s}
body[data-intro='off'] .intro{opacity:0;visibility:hidden;pointer-events:none}
.intro-inner{display:grid;justify-items:center;gap:18px;text-align:center;padding:24px}
.intro-rule{display:block;width:min(420px,70vw);height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);transform:scaleX(0);animation:rule 1.6s .2s cubic-bezier(.2,.7,.2,1) forwards}
.intro-mark{display:grid;place-items:center;width:64px;height:64px;border:1.5px solid var(--gold);border-radius:50%;color:var(--gold);font:800 36px/1 Georgia,serif;opacity:0;animation:fade 1.2s .9s forwards}
.intro-title{margin:0;display:grid;gap:10px;opacity:0;animation:rise 1.4s 1.2s cubic-bezier(.2,.7,.2,1) forwards}
.intro-title span{font:900 clamp(48px,10vw,104px)/.9 var(--display);letter-spacing:.14em;color:var(--cream)}
.intro-title small{font-size:10px;letter-spacing:.42em;color:var(--gold);font-weight:700}
.intro-line{margin:0;max-width:420px;color:#e9dcc6;font-size:14px;opacity:0;animation:fade 1s 1.9s forwards}
.intro-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;opacity:0;animation:fade 1s 2.3s forwards}
@keyframes rule{to{transform:scaleX(1)}}@keyframes fade{to{opacity:1}}@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ---------- chrome ---------- */
.masthead{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;gap:16px;align-items:center;justify-content:space-between;padding:20px clamp(18px,4.5vw,72px);background:linear-gradient(#060609c9,transparent)}
.wordmark{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:800;line-height:1;letter-spacing:.17em}
.wordmark small{display:block;font-size:8px;letter-spacing:.27em;margin-top:7px;font-weight:600;color:var(--soft)}
.brand-circle{display:grid;place-items:center;border:1.5px solid var(--gold);border-radius:50%;color:var(--gold);width:34px;height:34px;font:800 20px/1 Georgia,serif}
.masthead nav{display:flex;gap:clamp(12px,2.2vw,32px);align-items:center}
.masthead nav a{font-size:10px;text-transform:uppercase;letter-spacing:.19em;font-weight:800;opacity:.75;padding:6px 0;border-bottom:1px solid transparent}
.masthead nav a[aria-current='page']{color:var(--gold);opacity:1;border-bottom-color:var(--gold)}
.events-trigger{background:#0a0a0b88;border:1px solid #e2c28bb8;color:var(--gold);padding:11px 16px;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}

/* ---------- chapters: tall scroll tracks with a sticky, compact lower-third card ---------- */
#experience{position:relative;z-index:3;pointer-events:none}
.chapter{position:relative}
#entrance{height:230svh}#bar{height:250svh}#stairs{height:120svh}#speakeasy{height:260svh}
.sticky{position:sticky;top:0;height:100svh;overflow:hidden}
.card{position:absolute;left:clamp(18px,4.5vw,72px);bottom:calc(84px + env(safe-area-inset-bottom,0px));max-width:300px;pointer-events:auto;
  padding:11px 14px 10px;background:linear-gradient(135deg,#0a0908e6,#0a0908b3);border-left:1px solid var(--gold);will-change:opacity,transform;
  opacity:var(--card-o,0);visibility:hidden;transform:translateY(var(--card-y,0px))}
/* A chapter can enter the viewport before its scene starts. Reveal only its initialized badge. */
body[data-current-scene='entrance'] .card[data-card='entrance'],
body[data-current-scene='bar'] .card[data-card='bar'],
body[data-current-scene='stairs'] .card[data-card='stairs'],
body[data-current-scene='speakeasy'] .card[data-card='speakeasy']{visibility:visible}
.chapter-id{display:inline-block;font-size:9px;font-weight:700;letter-spacing:.27em;color:var(--gold)}
.card h2{margin:5px 0 4px;font:900 clamp(20px,2.1vw,30px)/.95 var(--display);text-transform:uppercase;letter-spacing:.01em}
.beat-line{margin:0;font-size:12.5px;line-height:1.5;color:#f2e6d3;min-height:1.5em;transition:opacity .45s}
.beat-line.swap{opacity:0}
.source-tag{display:block;margin-top:7px;padding-top:6px;font-size:8px!important;border-top:1px solid #d9b78040;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#d6c5a8b8}
.source-tag.cgi{color:var(--gold)}

/* speakeasy: Campus2Care x Circle treatment + draft event card */
.lockup{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%) scale(calc(.96 + var(--lock,0) * .04));display:flex;align-items:center;gap:clamp(10px,2vw,22px);
  opacity:var(--lock,0);white-space:nowrap;pointer-events:none;text-shadow:0 2px 30px #000}
.lockup span{font:900 clamp(26px,5.4vw,72px)/1 var(--display);letter-spacing:.08em}
.lock-a{color:var(--cream)}.lock-b{color:var(--gold)}.lock-x{color:var(--gold);font-weight:400!important;font-family:Georgia,serif!important}
.lock-rule{display:block;width:clamp(24px,6vw,90px);height:1px;background:var(--gold)}
.draft-event{position:absolute;right:clamp(18px,4.5vw,72px);bottom:calc(92px + env(safe-area-inset-bottom,0px));width:min(300px,calc(100vw - 36px));pointer-events:auto;
  padding:16px 18px;background:#0b0a09e6;border:1px solid #d9b780b0;opacity:var(--draft,0);transform:translateY(calc((1 - var(--draft,0)) * 14px));visibility:hidden}
body[data-draft='on'] .draft-event{visibility:visible}
.draft-badge{display:inline-block;font-size:9px;font-weight:800;letter-spacing:.2em;color:#14110c;background:var(--gold);padding:3px 7px}
.draft-event h3{margin:10px 0 8px;font:900 22px/1 var(--display);letter-spacing:.03em;text-transform:uppercase}
.draft-event dl{margin:0 0 10px;display:grid;gap:4px}.draft-event dl div{display:flex;justify-content:space-between;border-bottom:1px solid #ffffff1a;padding:3px 0;font-size:12px}
.draft-event dt{color:var(--soft)}.draft-event dd{margin:0}
.draft-event .fine{margin:8px 0 0;font-size:11px;color:#bfb7a8}
.action{display:inline-flex;align-items:center;gap:14px;border:1px solid var(--gold);background:var(--gold);color:#12100d;font-size:11px;letter-spacing:.14em;font-weight:800;text-transform:uppercase;padding:14px 20px;min-height:44px}
.action.subtle{background:#0a0908c2;color:var(--cream)}.action:hover:not([disabled]){filter:brightness(1.12)}.action[disabled]{opacity:.55;cursor:not-allowed}

/* ---------- controls ---------- */
.bottom-controls{position:fixed;z-index:20;left:clamp(18px,4.5vw,72px);right:clamp(18px,4.5vw,72px);bottom:max(16px,env(safe-area-inset-bottom));display:flex;gap:12px;align-items:center;padding-top:12px;border-top:1px solid #fff3}
.scene-counter{width:150px;font-size:10px;letter-spacing:.25em;font-weight:800;color:var(--gold)}
.progress-track{position:relative;height:2px;flex:1;background:#ffffff40}.progress-track>div{background:var(--gold);height:100%;width:0}
.progress-track i{position:absolute;top:-3px;width:1px;height:8px;background:#d9b78099}
.bottom-controls button{font-size:9px;letter-spacing:.12em;text-transform:uppercase;padding:7px 10px;background:#0b0a0a8c;border:1px solid #f0e2cf50;color:var(--cream);white-space:nowrap}
.bottom-controls button[aria-pressed='true']{border-color:var(--gold);color:var(--gold)}
.render-status{position:fixed;top:86px;right:clamp(18px,4.5vw,72px);z-index:20;font-size:9px;letter-spacing:.11em;padding:8px 10px;background:#070709ae;border:1px solid #ffffff2a;color:#d7d0c5;max-width:220px;text-align:right}
.cgi-flag{position:fixed;z-index:20;right:clamp(18px,4.5vw,72px);top:128px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);border:1px solid #d9b78070;padding:5px 8px;background:#070709a0}
.review-stamp{position:fixed;z-index:19;left:clamp(18px,4.5vw,72px);top:86px;font-size:9px;letter-spacing:.16em;color:#d5b97e;opacity:.85}
dialog{max-width:min(440px,92vw);width:100%;border:1px solid #c4a36f;background:#111010;color:var(--cream);padding:28px;box-shadow:0 20px 60px #000b}
dialog::backdrop{background:#020202b9;backdrop-filter:blur(5px)}dialog h2{font:900 52px/.93 var(--display);letter-spacing:-.02em}dialog p{line-height:1.65;color:#e7d4be}
.dialog-top{display:flex;justify-content:space-between;align-items:center;letter-spacing:.2em;font-size:10px;color:var(--gold)}
.dialog-top button{background:transparent;color:var(--gold);border:1px solid #b0935b;padding:6px 11px}
.disclaimer{border-top:1px solid #a78a5b62;padding-top:14px;font-size:12px;color:#bfb7a8}

@media(max-width:760px){
  .masthead{padding:15px 16px}.masthead nav{display:none}.wordmark{font-size:14px}.brand-circle{width:30px;height:30px}.events-trigger{padding:9px;font-size:9px}
  .card{left:14px;right:auto;max-width:min(270px,calc(100vw - 28px));bottom:calc(112px + env(safe-area-inset-bottom,0px));padding:9px 12px 8px}
  .card h2{font-size:clamp(18px,5.6vw,24px)}.beat-line{font-size:12px;min-height:1.5em}.source-tag{display:none}
  .draft-event{left:16px;right:16px;width:auto;bottom:calc(118px + env(safe-area-inset-bottom,0px))}
  body[data-draft='on'] .card[data-card='speakeasy']{--card-o:0!important}
  .lockup{top:34%;gap:6px;flex-wrap:nowrap}.lockup span{font-size:6.6vw;letter-spacing:.03em}.lock-rule{display:none}
  .bottom-controls{left:12px;right:12px;gap:6px;flex-wrap:wrap}.scene-counter{width:100%;font-size:8px}.progress-track{flex-basis:100%;order:2}
  .bottom-controls button{flex:1;padding:8px 4px;font-size:8px;order:3}
  .render-status{top:66px;right:14px;max-width:160px;font-size:8px}.cgi-flag{top:104px;right:14px;font-size:8px}.review-stamp{top:70px;left:16px;max-width:120px;font-size:8px}
}
@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-delay:0s!important}}
@media(max-height:520px) and (min-width:500px){.card{bottom:70px;padding:10px 14px}.card h2{font-size:26px;margin:4px 0}.beat-line{min-height:0;font-size:12px}.source-tag{margin-top:6px;padding-top:5px}.review-stamp{display:none}}
/* ---------- entrance v5: one continuous camera move in real 3D space (CSS perspective) ----------
   The plate (entrance/plate.webp) is the real No. 356 storefront: a median of 4 aligned daytime photos, relit for
   night with the venue's own fixtures (tools/build_facade_night.py). JS moves a camera along it from left to right,
   cranes down from the sign and pushes into the open vestibule; the main bar is revealed behind it. */
.facade-stage{position:fixed;inset:0;overflow:hidden;opacity:var(--facade-o,1);pointer-events:none}
body:not([data-current-scene='entrance']) .facade-stage{opacity:0;visibility:hidden}
.world,.plate,.bollard{position:absolute;left:50%;top:50%;transform-style:preserve-3d}
.world{width:0;height:0;will-change:transform}
.plate{width:2880px;height:1512.4px;margin:-756.2px 0 0 -1440px} /* v16: the real night photo IMG_1812 (tools/build_facade_photo.py) */
.plate img{position:absolute;inset:0;width:100%;height:100%;display:block}
.plate .lit{opacity:var(--sign,1)}
/* the building's upper storey isn't photographed: the plate's top falls into the night above it */
.plate-fade{position:absolute;left:0;right:0;top:0;height:8%;background:linear-gradient(#040404,#04040400)}
/* night around the plate: four planes framing it (so the open doorway stays see-through) */
.night{position:absolute;left:50%;top:50%;background:#040404}
.n-top{width:30000px;height:15000px;transform:translate3d(-15000px,-15756px,-2px)}
.n-bot{width:30000px;height:15000px;transform:translate3d(-15000px,756px,-2px);background:#040404}
.n-left{width:14000px;height:1513px;transform:translate3d(-15440px,-756px,-2px)}
.n-right{width:14000px;height:1513px;transform:translate3d(1440px,-756px,-2px)}
/* doorway: x -329.8..-58.5, y -37.5..439.4 in plate units (tools/build_facade_night.py DOOR). v7: shallow 34-unit
   reveal like the real frame, leaves with real thickness, wood grain, glass that reflects the street and lets the bar
   light through, brass hardware, and the bar's light spilling onto the reveal and the pavement as they open. */
.doorway{--dw:198.7px;--dh:337.1px;--lw:99.35px;position:absolute;left:50%;top:50%;transform-style:preserve-3d;transform:translate3d(-288px,-116.7px,0)}
.jamb{position:absolute;left:0;top:0;transform-style:preserve-3d}
.j-left{width:34px;height:var(--dh);transform-origin:0 0;transform:rotateY(90deg);
  background:linear-gradient(90deg,#120d09,#1d1510),linear-gradient(#ffb86a00,#ffb86a00);box-shadow:inset -8px 0 18px rgba(255,190,120,calc(var(--door,0) * .25))}
.j-right{width:34px;height:var(--dh);transform-origin:0 0;transform:translateX(var(--dw)) rotateY(90deg);
  background:linear-gradient(90deg,#120d09,#1d1510);box-shadow:inset -8px 0 18px rgba(255,190,120,calc(var(--door,0) * .25))}
.j-top{width:var(--dw);height:34px;transform-origin:0 0;transform:rotateX(-90deg);background:#0a0806}
.j-floor{width:var(--dw);height:34px;transform-origin:0 0;transform:translateY(var(--dh)) rotateX(-90deg);
  background:linear-gradient(#5a4632,#2a1f16);box-shadow:inset 0 -10px 20px rgba(255,190,120,calc(var(--door,0) * .35))}
.leaf{position:absolute;top:0;width:var(--lw);height:var(--dh);transform-style:preserve-3d;
  --wood:#21160e;
  background:
   linear-gradient(90deg,var(--wood) 0 9%,#0000 9% 35.5%,var(--wood) 35.5% 38.5%,#0000 38.5% 61.5%,var(--wood) 61.5% 64.5%,#0000 64.5% 91%,var(--wood) 91%),
   linear-gradient(180deg,var(--wood) 0 6%,#0000 6% 20%,var(--wood) 20% 21.4%,#0000 21.4% 35.3%,var(--wood) 35.3% 36.7%,#0000 36.7% 50.6%,var(--wood) 50.6% 52%,#0000 52% 66%,var(--wood) 66% 100%),
   linear-gradient(115deg,#ffffff00 30%,#ffffff1f 42%,#ffffff05 48%,#ffffff00 60%),
   linear-gradient(180deg,#ffd8a812,#ffb46a08 60%,#0000);
  box-shadow:inset 0 0 0 1px #000a,inset 0 0 14px #0008}
/* wood grain on the solid parts (very subtle) */
.leaf::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.35;mix-blend-mode:soft-light;
  background:repeating-linear-gradient(90deg,#0000 0 3px,#3a2616 3px 4px,#0000 4px 9px),linear-gradient(180deg,#0000 0 66%,#2a1b10 66%)}
/* raised bottom panel */
.leaf b{position:absolute;left:15%;right:15%;top:71%;bottom:6%;border:2px solid #0d0906;
  box-shadow:inset 1px 1px 0 #3d2b1d,inset -1px -1px 0 #050302,0 0 0 4px #22170e;background:linear-gradient(172deg,#2b1d13,#160f0a)}
/* thickness: the free edge of each leaf, 9 units deep */
.leaf i{position:absolute;top:0;width:9px;height:100%;background:linear-gradient(90deg,#1a110b,#2b1d13);transform-origin:0 0}
.leaf::after{content:'';position:absolute;top:56%;width:5px;height:28px;border-radius:3px;background:linear-gradient(90deg,#7a5a2a,#efcb84,#7a5a2a);box-shadow:0 0 6px #ffcf8a55}
.l-left{left:0;transform-origin:0 50%;transform:translateZ(-30px) rotateY(calc(var(--door,0) * 78deg))}
.l-left::after{right:10%}.l-left i{right:0;transform:rotateY(90deg) translateX(-9px);transform-origin:100% 0}
.l-right{left:var(--lw);transform-origin:100% 50%;transform:translateZ(-30px) rotateY(calc(var(--door,0) * -78deg))}
.l-right::after{left:10%}.l-right i{left:0;transform:rotateY(-90deg)}
/* the bar's light falls out onto the pavement as the doors open */
.ground{--spill:var(--door,0)}
/* film pills (like a title sequence): pause and skip, top right */
.film-pills{position:fixed;z-index:21;top:84px;right:clamp(18px,4.5vw,72px);display:flex;gap:8px}
.film-pills button{border:1px solid #ffffff38;background:#0a0909d0;color:var(--cream);border-radius:999px;padding:9px 15px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:700}
body:not([data-current-scene='entrance']) .film-pills [data-only='intro']{display:none}
.title-card{position:fixed;inset:0;z-index:4;transition:opacity .4s;display:grid;place-items:center;pointer-events:none;opacity:var(--title,1)}
.title-card div{display:grid;justify-items:center;gap:12px;text-shadow:0 2px 30px #000}
.title-card b{font:900 clamp(44px,9vw,110px)/.9 var(--display);letter-spacing:.14em}
.title-card small{font-size:10px;letter-spacing:.42em;color:var(--gold);font-weight:700}
body:not([data-current-scene='entrance']) .title-card{opacity:0}
.render-status{top:130px!important}.cgi-flag{top:172px!important}
@media(max-width:760px){.render-status{top:104px!important}.cgi-flag{top:142px!important}.film-pills{top:64px;right:14px}.film-pills button{padding:7px 11px;font-size:8px}}

/* v16: one caption card per scene. The technical status line is for QA/screen readers only; source notes stay on
   the entrance card (the doors and sign light are added there) */
.render-status{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.card[data-card='bar'] .source-tag,.card[data-card='speakeasy'] .source-tag,.card[data-card='stairs'] .source-tag{display:none}
.mast-actions{display:flex;gap:10px}
/* stairs: the real walk down, scrubbed by the film (immersive/stairs/f001–f152) */
#stairs-canvas{position:fixed;inset:0;width:100%;height:100%;opacity:0;transition:opacity .5s}
body[data-current-scene='stairs'] #stairs-canvas{opacity:var(--stairs-o,1)}
/* menu sheet over the venue */
.menu-sheet{position:fixed;z-index:40;top:0;right:0;bottom:0;width:min(440px,100vw);background:linear-gradient(180deg,#0b0a09f2,#0b0a09e8);
  border-left:1px solid #d9b78066;transform:translateX(102%);transition:transform .55s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column;box-shadow:-30px 0 60px #000a}
body[data-menu='open'] .menu-sheet{transform:none}
.menu-top{display:flex;justify-content:space-between;align-items:center;padding:26px 28px 6px}
.menu-top h2{margin:0;font:900 30px/1 var(--display);letter-spacing:.06em;color:var(--cream)}
.menu-top button{background:transparent;color:var(--gold);border:1px solid #b0935b;padding:6px 11px}
.menu-tabs{display:flex;gap:6px;padding:12px 28px 6px;border-bottom:1px solid #ffffff1a}
.menu-tabs button{background:transparent;border:0;border-bottom:2px solid transparent;color:var(--soft);padding:8px 2px;margin-right:16px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:800}
.menu-tabs button[aria-selected='true']{color:var(--gold);border-bottom-color:var(--gold)}
.menu-body{overflow:auto;padding:8px 28px 40px;-webkit-overflow-scrolling:touch}
.menu-body h3{margin:22px 0 8px;font-size:10px;letter-spacing:.3em;color:var(--gold);font-weight:800;text-transform:uppercase}
.menu-body .item{padding:9px 0;border-bottom:1px solid #ffffff12}
.menu-body .item b{display:block;font:900 17px/1.15 var(--display);letter-spacing:.03em;text-transform:uppercase;color:var(--cream)}
.menu-body .item span{display:block;font-size:12.5px;color:#cfc3ae;margin-top:3px}
.menu-body .note{font-size:12px;color:#bfb7a8;margin:14px 0 0;font-style:italic}
@media(max-width:760px){.mast-actions{gap:6px}.menu-top{padding:20px 18px 4px}.menu-tabs,.menu-body{padding-left:18px;padding-right:18px}}

/* v17: the event promotion is the headline of the speakeasy: a large poster card, centred right, held on screen */
.draft-event{width:min(460px,calc(100vw - 36px))!important;padding:26px 28px 22px!important;top:50%;bottom:auto!important;
  transform:translateY(calc(-50% + (1 - var(--draft,0)) * 18px))!important;background:linear-gradient(160deg,#0d0b09f2,#0b0908e0)!important;
  border:1px solid #d9b780!important;box-shadow:0 30px 80px #000c,0 0 0 1px #d9b78033 inset}
.draft-badge{font-size:11px!important;padding:5px 10px!important}
.draft-event h3{margin:16px 0 14px!important;font-size:clamp(34px,4vw,52px)!important;line-height:.92!important;color:var(--cream)}
.draft-event dl div{font-size:15px!important;padding:7px 0!important}
.draft-event .action{width:100%;justify-content:center;margin-top:8px}
.draft-event .fine{font-size:12.5px!important}
@media(max-width:760px){.draft-event{left:14px;right:14px;width:auto!important;top:auto;bottom:calc(112px + env(safe-area-inset-bottom,0px))!important;transform:translateY(calc((1 - var(--draft,0)) * 14px))!important;padding:18px 18px 16px!important}
  .draft-event h3{font-size:clamp(28px,9vw,38px)!important}}
/* the lockup moves up so the poster card has the stage */
.lockup{top:20%!important}
/* stairs video already fading in over the end of the main bar */
body[data-stairs-in='on'] #stairs-canvas{opacity:var(--stairs-o,0)}
/* the AI label sits bottom-left, clear of the event poster */
.cgi-flag{top:auto!important;right:auto!important;left:clamp(18px,4.5vw,72px);bottom:calc(84px + env(safe-area-inset-bottom,0px))}
@media(max-width:760px){.cgi-flag{bottom:calc(112px + env(safe-area-inset-bottom,0px));left:14px}}
.film-pills .sound-pill{border-color:#d9b780;color:var(--gold)}
.film-pills .sound-pill[aria-pressed='true']{background:var(--gold);color:#120f0b}
a.events-trigger{display:inline-flex;align-items:center;text-decoration:none}
@media(max-width:760px){#inquiry-link{display:none}}
.draft-event a.action{width:100%;justify-content:center;margin-top:8px;text-decoration:none}
.draft-event a.action+a.action{margin-top:8px}
/* venue contact: one quiet line, bottom right, just above the controls */
.venue-contact{position:fixed;z-index:20;right:clamp(18px,4.5vw,72px);bottom:calc(58px + env(safe-area-inset-bottom,0px));font-style:normal;
  display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px 10px;max-width:calc(100% - 36px);
  font-size:12px;line-height:1.5;letter-spacing:.08em;text-transform:uppercase;color:#e6d8c2;text-shadow:0 1px 5px #000;text-align:right;pointer-events:auto}
.venue-contact a{color:inherit;text-decoration:none}.venue-contact a:hover,.venue-contact a:focus-visible{color:var(--gold);text-decoration:underline}
.venue-contact a[data-site='email']{text-transform:none;white-space:nowrap}
.venue-contact span{color:#d9b780}
body[data-menu='open'] .venue-contact{opacity:0}
@media(max-width:760px){.venue-contact{left:12px;right:12px;max-width:none;bottom:calc(92px + env(safe-area-inset-bottom,0px));font-size:11px;letter-spacing:.04em;gap:4px 8px}.venue-contact a[data-site='address']{flex-basis:100%}.venue-contact .address-divider{display:none}}
/* Keep mobile room badges and the event poster above the wrapped contact details. */
@media(max-width:760px){.card,.cgi-flag{bottom:calc(176px + env(safe-area-inset-bottom,0px))}.draft-event{bottom:calc(176px + env(safe-area-inset-bottom,0px))!important}}
.film-pills{display:none!important} /* owner (5 Nov): removed; play/sound live in the bottom bar */
/* v22: room between the lockup and the event poster */
.lockup{top:16%!important}
@media(min-width:761px){.draft-event{top:56%!important}}