/* Afterglow guest app — bespoke stylesheet for /concepts/lounge/app/
   Palette is inherited from the Afterglow concept: ink #17131b, gold #d8a95b,
   lilac #d8c1e4, paper #eee8f0. Every foreground/background pair below was
   measured, not eyeballed:
     #f6f1f8 on #17131b .. 17.6:1      #f6f1f8 on #211b26 .. 16.1:1
     #a79bb0 on #17131b ..  6.9:1      #a79bb0 on #211b26 ..  6.4:1
     #d8a95b on #17131b ..  8.5:1      #d8a95b on #211b26 ..  7.8:1
     #d8c1e4 on #17131b .. 11.0:1      #17131b on #d8a95b ..  8.5:1
     #17131b on #eee8f0 .. 15.2:1      #f0a08c on #211b26 ..  8.1:1
*/
@font-face { font-family:"Inter"; src:url("/assets/fonts/inter-var.woff2") format("woff2"); font-display:swap; font-weight:100 900; }

:root {
  --ag-ink:#17131b; --ag-ink-deep:#0e0a12; --ag-card:#211b26; --ag-card-2:#2a2230;
  --ag-text:#f6f1f8; --ag-muted:#a79bb0; --ag-gold:#d8a95b; --ag-lilac:#d8c1e4;
  --ag-coral:#f0a08c; --ag-paper:#eee8f0; --ag-line:rgba(216,193,228,.16);
  --ag-line-strong:rgba(216,193,228,.3);
  --ag-shadow:0 40px 90px rgba(4,2,7,.62);
  --ag-rad:1.15rem;
}

*,*::before,*::after { box-sizing:border-box; margin:0; }
body { min-width:20rem; min-height:100svh; background:var(--ag-ink-deep); color:var(--ag-text); font-family:"Inter",system-ui,sans-serif; line-height:1.5; -webkit-text-size-adjust:100%; }
body:has(dialog[open]) { overflow:hidden; }
button,input,select,textarea { color:inherit; font:inherit; }
button { border:0; background:none; cursor:pointer; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.ag-sprite { position:absolute; width:0; height:0; overflow:hidden; }
.ag-i { width:1.05rem; height:1.05rem; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.ag-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid var(--ag-gold); outline-offset:2px; border-radius:.4rem; }
.ag-onlight :focus-visible, .ag-pass :focus-visible { outline-color:var(--ag-ink); }

.ag-skip { position:fixed; top:.6rem; left:.6rem; z-index:400; padding:.7rem 1.05rem; border-radius:999px; background:var(--ag-gold); color:var(--ag-ink); font-size:.8rem; font-weight:760; transform:translateY(-220%); transition:transform .18s ease; }
.ag-skip:focus { transform:translateY(0); }

/* ---------- stage / playbill ---------- */
.ag-stage { min-height:100svh; display:grid; grid-template-columns:minmax(21rem,.86fr) minmax(30rem,1.14fr); background:
  radial-gradient(120% 90% at 8% -10%, rgba(216,193,228,.14), transparent 62%),
  radial-gradient(90% 70% at 96% 108%, rgba(216,169,91,.16), transparent 60%),
  var(--ag-ink-deep); }
.ag-playbill { min-height:100svh; display:flex; flex-direction:column; justify-content:space-between; gap:2rem; padding:clamp(1.6rem,4vw,4rem); border-right:1px solid var(--ag-line); }
.ag-back { width:fit-content; min-height:2.75rem; display:inline-flex; align-items:center; gap:.5rem; color:var(--ag-muted); font-size:.76rem; font-weight:700; letter-spacing:.02em; }
.ag-back:hover { color:var(--ag-lilac); }
.ag-kicker { display:flex; align-items:center; gap:.45rem; color:var(--ag-gold); font-size:.66rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.ag-kicker::before { width:1.4rem; height:1px; background:currentColor; content:""; }
.ag-playbill__body { max-width:34rem; }
.ag-playbill h1 { margin-top:1.1rem; font-size:clamp(2.3rem,4vw,3.5rem); font-weight:520; letter-spacing:-.045em; line-height:1.02; text-wrap:balance; }
.ag-playbill h1::after { display:block; width:4.5rem; height:2px; margin-top:1.1rem; background:linear-gradient(90deg,var(--ag-gold),rgba(216,169,91,0)); content:""; }
.ag-lede { margin-top:1.1rem; color:var(--ag-muted); font-size:.95rem; }
.ag-playbill__list { display:grid; gap:.7rem; margin-top:1.6rem; padding:0; list-style:none; font-size:.85rem; }
.ag-playbill__list li { display:flex; align-items:center; gap:.65rem; color:var(--ag-text); }
.ag-playbill__list .ag-i { color:var(--ag-lilac); }
.ag-playbill__foot { display:grid; gap:.9rem; }
.ag-ghost { width:fit-content; min-height:2.75rem; display:inline-flex; align-items:center; gap:.4rem; padding:.6rem 1.05rem; border:1px solid var(--ag-line-strong); border-radius:999px; font-size:.8rem; font-weight:720; }
.ag-ghost:hover { border-color:var(--ag-gold); color:var(--ag-gold); }
.ag-playbill__foot p { max-width:26rem; color:var(--ag-muted); font-size:.74rem; }

.ag-deviceWrap { position:relative; min-width:0; min-height:100svh; display:grid; place-items:center; padding:clamp(1.5rem,4vw,3.5rem); }
.ag-glow { position:absolute; inset:0; background:radial-gradient(46% 34% at 50% 26%, rgba(216,169,91,.26), transparent 70%), radial-gradient(40% 32% at 50% 84%, rgba(216,193,228,.16), transparent 72%); pointer-events:none; }
.ag-device { position:relative; z-index:1; width:min(100%,26.5rem); height:min(53rem,calc(100svh - 3rem)); min-height:42rem; overflow:hidden; border:.45rem solid #060409; border-radius:2.9rem; background:var(--ag-ink); box-shadow:var(--ag-shadow),0 0 0 1px rgba(216,169,91,.3); }
.ag-device__slot { position:absolute; top:.72rem; left:50%; z-index:20; width:3.6rem; height:.26rem; border-radius:999px; background:rgba(216,193,228,.22); transform:translateX(-50%); }

/* ---------- in-phone shell ---------- */
.ag-appbar { height:4.4rem; display:flex; align-items:flex-end; justify-content:space-between; gap:.75rem; padding:.95rem 1.15rem .55rem; border-bottom:1px solid var(--ag-line); }
.ag-wordmark { display:grid; gap:.12rem; font-size:1rem; font-weight:600; letter-spacing:.13em; text-transform:uppercase; }
.ag-wordmark em { color:var(--ag-gold); font-size:.56rem; font-style:normal; font-weight:700; letter-spacing:.16em; }
.ag-clock { display:grid; justify-items:end; gap:.12rem; }
.ag-clock strong { font-size:.9rem; font-weight:640; font-variant-numeric:tabular-nums; letter-spacing:-.01em; }
.ag-clock em { color:var(--ag-muted); font-size:.56rem; font-style:normal; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.ag-demoline { height:1.6rem; display:flex; align-items:center; justify-content:center; gap:.4rem; background:var(--ag-card-2); color:var(--ag-lilac); font-size:.6rem; font-weight:660; letter-spacing:.02em; }
.ag-demoline span { width:.35rem; height:.35rem; border-radius:50%; background:var(--ag-gold); }
.ag-screen { position:absolute; top:6rem; right:0; bottom:4.5rem; left:0; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; }
.ag-screen::-webkit-scrollbar { display:none; }
.ag-tabs { position:absolute; right:0; bottom:0; left:0; z-index:10; height:4.5rem; display:grid; grid-template-columns:repeat(4,1fr); align-items:stretch; border-top:1px solid var(--ag-line); background:rgba(23,19,27,.94); backdrop-filter:blur(16px); }
.ag-tabs button { position:relative; min-height:2.75rem; display:grid; place-items:center; align-content:center; gap:.2rem; padding:.5rem .25rem; color:var(--ag-muted); font-size:.6rem; font-weight:700; letter-spacing:.02em; }
.ag-tabs button::after { position:absolute; top:0; left:50%; width:0; height:2px; background:var(--ag-gold); content:""; transform:translateX(-50%); transition:width .2s ease; }
.ag-tabs button[aria-current="true"] { color:var(--ag-gold); }
.ag-tabs button[aria-current="true"]::after { width:2.6rem; }
.ag-tabs b { position:absolute; top:.4rem; right:calc(50% - 1.6rem); min-width:1.05rem; height:1.05rem; display:grid; place-items:center; padding-inline:.2rem; border-radius:999px; background:var(--ag-gold); color:var(--ag-ink); font-size:.56rem; font-weight:820; }
.ag-tabs b[hidden] { display:none; } /* display:grid otherwise beats the hidden attribute */

/* ---------- shared screen furniture ---------- */
.ag-pad { padding:1.1rem 1.1rem 0; }
.ag-screen > *:last-child { margin-bottom:1.6rem; }
.ag-head { padding:1.2rem 1.1rem .3rem; }
.ag-head h2 { margin-top:.5rem; font-size:1.75rem; font-weight:540; letter-spacing:-.04em; line-height:1.06; text-wrap:balance; }
.ag-head p { margin-top:.5rem; color:var(--ag-muted); font-size:.76rem; }
.ag-sec { display:flex; align-items:flex-end; justify-content:space-between; gap:.8rem; margin:1.5rem 1.1rem .65rem; }
.ag-sec h3 { margin-top:.3rem; font-size:1.05rem; font-weight:560; letter-spacing:-.025em; }
.ag-sec > * { min-width:0; }
.ag-sec button { display:inline-flex; align-items:center; gap:.3rem; min-height:2.75rem; padding-inline:.4rem; color:var(--ag-gold); font-size:.72rem; font-weight:720; white-space:nowrap; }
.ag-sec button:disabled { color:var(--ag-muted); cursor:not-allowed; }
.ag-card { margin:0 1.1rem; padding:1rem; border:1px solid var(--ag-line); border-radius:var(--ag-rad); background:var(--ag-card); }
.ag-card + .ag-card { margin-top:.6rem; }
.ag-note { margin:.75rem 1.1rem 0; padding:.85rem .95rem; border-left:2px solid var(--ag-gold); border-radius:0 .7rem .7rem 0; background:var(--ag-card); color:var(--ag-muted); font-size:.72rem; }
.ag-note strong { display:block; margin-bottom:.2rem; color:var(--ag-text); font-size:.76rem; }

.ag-btn { min-height:2.75rem; display:inline-flex; align-items:center; justify-content:center; gap:.45rem; padding:.62rem 1.05rem; border-radius:999px; font-size:.78rem; font-weight:740; text-align:center; }
.ag-btn--gold { background:var(--ag-gold); color:var(--ag-ink); }
.ag-btn--gold:hover { background:#e6bc74; }
.ag-btn--line { border:1px solid var(--ag-line-strong); color:var(--ag-text); }
.ag-btn--line:hover { border-color:var(--ag-gold); color:var(--ag-gold); }
.ag-btn--quiet { color:var(--ag-lilac); }
.ag-btn:disabled { opacity:.5; cursor:not-allowed; }
.ag-btnrow { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.85rem; }
.ag-btnrow .ag-btn { flex:1 1 8rem; }
.ag-iconbtn { width:2.75rem; height:2.75rem; display:grid; place-items:center; flex:0 0 auto; border:1px solid var(--ag-line-strong); border-radius:50%; }
.ag-pill { display:inline-flex; align-items:center; gap:.3rem; padding:.28rem .55rem; border-radius:999px; background:rgba(216,193,228,.14); color:var(--ag-lilac); font-size:.62rem; font-weight:740; letter-spacing:.03em; white-space:nowrap; }
.ag-pill--gold { background:rgba(216,169,91,.18); color:var(--ag-gold); }
.ag-pill--warn { background:rgba(240,160,140,.16); color:var(--ag-coral); }
.ag-pill--mute { background:rgba(167,155,176,.14); color:var(--ag-muted); }

/* ---------- tonight ---------- */
.ag-greet { padding:1.2rem 1.1rem .2rem; }
.ag-greet p { color:var(--ag-muted); font-size:.78rem; }
.ag-greet h2 { margin-top:.35rem; font-size:1.85rem; font-weight:540; letter-spacing:-.045em; line-height:1.04; text-wrap:balance; }

.ag-hold { position:relative; overflow:hidden; margin:1rem 1.1rem 0; padding:1.1rem; border:1px solid rgba(216,169,91,.36); border-radius:1.35rem; background:linear-gradient(165deg,#2b2130,#1a1420 62%); }
.ag-hold::after { position:absolute; top:-40%; right:-18%; width:12rem; height:12rem; border-radius:50%; background:radial-gradient(circle,rgba(216,169,91,.3),transparent 66%); content:""; pointer-events:none; }
.ag-hold__top { position:relative; z-index:1; display:flex; align-items:flex-start; justify-content:space-between; gap:.8rem; }
.ag-hold__top > div { min-width:0; }
.ag-hold__label { color:var(--ag-muted); font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.ag-hold__value { margin-top:.25rem; font-size:2.3rem; font-weight:560; font-variant-numeric:tabular-nums; letter-spacing:-.055em; line-height:1; }
.ag-hold__value.is-word { font-size:1.5rem; letter-spacing:-.035em; }
.ag-hold__unit { margin-top:.15rem; color:var(--ag-muted); font-size:.6rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.ag-hold__unit[hidden] { display:none; }
.ag-hold__sub { position:relative; z-index:1; margin-top:.55rem; color:var(--ag-muted); font-size:.75rem; }
.ag-hold__meter { position:relative; z-index:1; height:.3rem; overflow:hidden; margin-top:.9rem; border-radius:999px; background:rgba(246,241,248,.14); }
.ag-hold__meter span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--ag-gold),var(--ag-lilac)); transition:width .4s ease; }
.ag-hold .ag-btnrow { position:relative; z-index:1; }
.ag-hold--lost { border-color:rgba(240,160,140,.45); }
.ag-hold--lost .ag-hold__value { color:var(--ag-coral); }

.ag-rail { margin:0 1.1rem; padding:0; list-style:none; }
.ag-rail li { position:relative; display:grid; grid-template-columns:4.5rem 1fr; gap:.6rem; padding:.55rem 0 .55rem; }
.ag-rail li::before { position:absolute; top:1.35rem; bottom:-.35rem; left:4.8rem; width:1px; background:var(--ag-line); content:""; }
.ag-rail li:last-child::before { display:none; }
.ag-rail li::after { position:absolute; top:.95rem; left:4.5rem; width:.6rem; height:.6rem; border:1px solid var(--ag-line-strong); border-radius:50%; background:var(--ag-ink); content:""; }
.ag-rail li.is-done::after { border-color:var(--ag-gold); background:var(--ag-gold); }
.ag-rail li.is-now::after { border-color:var(--ag-lilac); background:var(--ag-lilac); box-shadow:0 0 0 4px rgba(216,193,228,.2); }
.ag-rail__t { padding-top:.78rem; color:var(--ag-muted); font-size:.66rem; font-weight:720; font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.ag-rail__body { min-width:0; padding:.55rem 0 .55rem 1.15rem; }
.ag-rail strong { display:block; font-size:.84rem; font-weight:620; }
.ag-rail span { display:block; margin-top:.15rem; color:var(--ag-muted); font-size:.72rem; }
.ag-rail li.is-done strong { color:var(--ag-muted); }
.ag-rail li.is-now { border-radius:.9rem; background:rgba(216,193,228,.07); }
.ag-rail li.is-now strong { color:var(--ag-lilac); }
/* solid lilac, ink text: 11.0:1 — the translucent pill sat at 4.4:1 on the
   already-tinted "now" row, which is under the 4.5 threshold. */
.ag-rail .ag-rail__mark { display:inline-flex; width:fit-content; margin-top:.4rem; background:var(--ag-lilac); color:var(--ag-ink); }

.ag-arrivals { display:flex; gap:.45rem; overflow-x:auto; padding:0 1.1rem .3rem; scrollbar-width:none; }
.ag-arrivals::-webkit-scrollbar { display:none; }
.ag-arrivals button { min-width:4.6rem; min-height:5.2rem; display:grid; place-items:center; align-content:center; gap:.35rem; padding:.6rem .4rem; border:1px solid var(--ag-line); border-radius:1rem; background:var(--ag-card); color:var(--ag-muted); font-size:.6rem; font-weight:700; }
.ag-arrivals button span.ag-face { width:2.1rem; height:2.1rem; display:grid; place-items:center; border:1px solid var(--ag-line-strong); border-radius:50%; color:var(--ag-lilac); font-size:.68rem; font-weight:780; }
.ag-arrivals button.is-in { border-color:rgba(216,169,91,.5); color:var(--ag-gold); }
.ag-arrivals button.is-in span.ag-face { border-color:var(--ag-gold); background:var(--ag-gold); color:var(--ag-ink); }
.ag-arrivals button em { font-style:normal; font-size:.55rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }

.ag-tile { display:grid; grid-template-columns:2.4rem 1fr auto; gap:.75rem; align-items:center; width:calc(100% - 2.2rem); margin:.55rem 1.1rem 0; padding:.85rem .95rem; border:1px solid var(--ag-line); border-radius:1rem; background:var(--ag-card); text-align:left; }
.ag-tile > * { min-width:0; }
.ag-tile__ico { width:2.4rem; height:2.4rem; display:grid; place-items:center; border-radius:.75rem; background:rgba(216,193,228,.12); color:var(--ag-lilac); }
.ag-tile__ico.is-gold { background:rgba(216,169,91,.16); color:var(--ag-gold); }
.ag-tile__ico.is-warn { background:rgba(240,160,140,.16); color:var(--ag-coral); }
.ag-tile div.ag-tile__txt { display:grid; gap:.15rem; }
.ag-tile strong { font-size:.8rem; font-weight:620; }
.ag-tile span { color:var(--ag-muted); font-size:.72rem; }
.ag-tile > .ag-i:last-child { color:var(--ag-muted); }
button.ag-tile:hover { border-color:var(--ag-line-strong); }

/* ---------- table ledger ---------- */
.ag-resv { margin:1rem 1.1rem 0; overflow:hidden; border:1px solid var(--ag-line); border-radius:1.25rem; background:var(--ag-card); }
.ag-resv__top { display:flex; align-items:flex-start; justify-content:space-between; gap:.8rem; padding:1rem 1rem .8rem; }
.ag-resv__top > div { min-width:0; }
.ag-resv__top small { color:var(--ag-gold); font-size:.64rem; font-weight:780; letter-spacing:.1em; text-transform:uppercase; }
.ag-resv__top h3 { margin-top:.3rem; font-size:1.2rem; font-weight:580; letter-spacing:-.03em; }
.ag-resv__top p { margin-top:.25rem; color:var(--ag-muted); font-size:.74rem; }
.ag-resv__grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--ag-line); }
.ag-resv__grid div { padding:.75rem .8rem; border-right:1px solid var(--ag-line); }
.ag-resv__grid div:last-child { border-right:0; }
.ag-resv__grid strong { display:block; font-size:.86rem; font-weight:640; font-variant-numeric:tabular-nums; }
.ag-resv__grid span { display:block; margin-top:.1rem; color:var(--ag-muted); font-size:.62rem; letter-spacing:.03em; text-transform:uppercase; }
.ag-resv__acts { display:flex; gap:.5rem; padding:.8rem 1rem; border-top:1px solid var(--ag-line); }
.ag-resv__acts .ag-btn { flex:1 1 0; }

.ag-open { margin:0; padding:0; list-style:none; }
.ag-open li + li { margin-top:.5rem; }
.ag-open button { display:grid; grid-template-columns:1.35rem 1fr auto; gap:.65rem; align-items:center; width:100%; min-height:2.75rem; padding:.7rem .8rem; border:1px solid var(--ag-line); border-radius:.85rem; background:var(--ag-card-2); text-align:left; }
.ag-open button:hover { border-color:var(--ag-gold); }
.ag-open button > * { min-width:0; }
.ag-open i { width:1.35rem; height:1.35rem; display:grid; place-items:center; border:1px solid var(--ag-line-strong); border-radius:50%; color:var(--ag-gold); font-size:.6rem; font-style:normal; font-weight:800; }
.ag-open strong { display:block; font-size:.78rem; font-weight:620; }
.ag-open span { display:block; margin-top:.1rem; color:var(--ag-muted); font-size:.7rem; }
.ag-open .ag-i { color:var(--ag-muted); }
.ag-clear { display:flex; align-items:center; gap:.6rem; padding:.9rem 1rem; border:1px solid rgba(216,169,91,.35); border-radius:.9rem; background:rgba(216,169,91,.1); color:var(--ag-gold); font-size:.78rem; font-weight:640; }

.ag-fit { margin-top:.9rem; }
.ag-fit__scale { position:relative; height:2.6rem; margin-top:.7rem; }
.ag-fit__track { position:absolute; top:1.05rem; right:0; left:0; height:.4rem; border-radius:999px; background:rgba(246,241,248,.1); }
.ag-fit__band { position:absolute; top:1.05rem; height:.4rem; border-radius:999px; background:rgba(216,169,91,.5); }
.ag-fit__marks { position:absolute; top:1.85rem; right:0; left:0; display:flex; justify-content:space-between; color:var(--ag-muted); font-size:.6rem; font-variant-numeric:tabular-nums; }
.ag-fit__pin { position:absolute; top:0; display:grid; justify-items:center; gap:.15rem; transform:translateX(-50%); }
.ag-fit__pin b { padding:.1rem .35rem; border-radius:.35rem; background:var(--ag-lilac); color:var(--ag-ink); font-size:.6rem; font-weight:800; }
.ag-fit__pin i { width:1px; height:.6rem; background:var(--ag-lilac); }
.ag-fit__pin.is-off b { background:var(--ag-coral); }
.ag-fit__pin.is-off i { background:var(--ag-coral); }

.ag-party { display:grid; gap:.55rem; margin-top:.85rem; }
.ag-guest { padding:.8rem; border:1px solid var(--ag-line); border-radius:.95rem; background:var(--ag-card-2); }
.ag-guest__top { display:grid; grid-template-columns:2.2rem 1fr auto; gap:.7rem; align-items:center; }
.ag-guest__top > * { min-width:0; }
.ag-guest__face { width:2.2rem; height:2.2rem; display:grid; place-items:center; border:1px solid var(--ag-line-strong); border-radius:50%; color:var(--ag-lilac); font-size:.7rem; font-weight:780; }
.ag-guest strong { display:block; font-size:.8rem; font-weight:620; }
.ag-guest__meta { display:block; margin-top:.1rem; color:var(--ag-muted); font-size:.7rem; }
.ag-guest__acts { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.65rem; }
.ag-guest__acts button { min-height:2.75rem; padding:.4rem .7rem; border:1px solid var(--ag-line-strong); border-radius:999px; font-size:.7rem; font-weight:700; }
.ag-guest__acts button:hover { border-color:var(--ag-gold); color:var(--ag-gold); }
.ag-guest__acts .is-pour { border-color:rgba(216,169,91,.5); color:var(--ag-gold); }
.ag-guest.is-out { opacity:.62; }
.ag-check { display:flex; align-items:center; gap:.55rem; min-height:2.75rem; color:var(--ag-muted); font-size:.72rem; cursor:pointer; }
.ag-check input { width:1.1rem; height:1.1rem; flex:0 0 auto; accent-color:var(--ag-gold); cursor:pointer; }

.ag-meter { margin-top:.85rem; }
.ag-meter__bar { position:relative; height:.65rem; overflow:hidden; margin-top:.6rem; border-radius:999px; background:rgba(246,241,248,.1); }
.ag-meter__bar span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--ag-gold),var(--ag-lilac)); transition:width .35s ease; }
.ag-meter__nums { display:flex; justify-content:space-between; gap:1rem; margin-top:.5rem; color:var(--ag-muted); font-size:.72rem; font-variant-numeric:tabular-nums; }
.ag-meter__nums strong { color:var(--ag-text); font-weight:660; }
.ag-meter__state { margin-top:.55rem; font-size:.76rem; font-weight:620; }
.ag-meter__state.is-under { color:var(--ag-coral); }
.ag-meter__state.is-met { color:var(--ag-gold); }

.ag-lines { display:grid; gap:.35rem; margin-top:.8rem; padding-top:.75rem; border-top:1px solid var(--ag-line); }
.ag-lines div { display:flex; justify-content:space-between; gap:.8rem; color:var(--ag-muted); font-size:.74rem; }
.ag-lines div span:first-child { min-width:0; }
.ag-lines div b { color:var(--ag-text); font-weight:620; font-variant-numeric:tabular-nums; }
.ag-lines .is-empty { color:var(--ag-muted); font-style:italic; }

.ag-plates { display:grid; gap:.5rem; margin-top:.85rem; }
.ag-plate { display:grid; grid-template-columns:1fr auto; gap:.7rem; align-items:center; padding:.65rem .75rem; border:1px solid var(--ag-line); border-radius:.85rem; background:var(--ag-card-2); }
.ag-plate > div { min-width:0; }
.ag-plate strong { display:block; font-size:.76rem; font-weight:620; }
.ag-plate span { display:block; color:var(--ag-muted); font-size:.68rem; }
.ag-step { display:flex; align-items:center; gap:.15rem; }
.ag-step button { width:2.75rem; height:2.75rem; display:grid; place-items:center; border:1px solid var(--ag-line-strong); border-radius:50%; color:var(--ag-text); }
.ag-step button:hover:not(:disabled) { border-color:var(--ag-gold); color:var(--ag-gold); }
.ag-step output { min-width:1.6rem; font-size:.8rem; font-weight:700; font-variant-numeric:tabular-nums; text-align:center; }

.ag-split { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin-top:.85rem; }
.ag-split div { padding:.75rem .8rem; border:1px solid var(--ag-line); border-radius:.85rem; background:var(--ag-card-2); }
.ag-split strong { display:block; font-size:1.15rem; font-weight:620; font-variant-numeric:tabular-nums; letter-spacing:-.03em; }
.ag-split span { display:block; margin-top:.15rem; color:var(--ag-muted); font-size:.66rem; letter-spacing:.03em; text-transform:uppercase; }
.ag-paid { display:flex; align-items:center; gap:.55rem; margin-top:.85rem; padding:.8rem .9rem; border:1px solid rgba(216,169,91,.35); border-radius:.85rem; background:rgba(216,169,91,.1); color:var(--ag-gold); font-size:.76rem; font-weight:640; }

/* ---------- programme ---------- */
.ag-night { margin:0 1.1rem .6rem; overflow:hidden; border:1px solid var(--ag-line); border-radius:1.15rem; background:var(--ag-card); }
.ag-night.is-tonight { border-color:rgba(216,169,91,.45); }
.ag-night__top { display:flex; align-items:flex-start; justify-content:space-between; gap:.7rem; padding:.95rem 1rem .6rem; }
.ag-night__top > div { min-width:0; }
.ag-night small { color:var(--ag-muted); font-size:.68rem; font-weight:700; letter-spacing:.04em; }
.ag-night h3 { margin-top:.2rem; font-size:1.05rem; font-weight:580; letter-spacing:-.03em; }
.ag-night p { padding:0 1rem; color:var(--ag-muted); font-size:.74rem; }
.ag-night__sets { display:grid; gap:.28rem; margin:.7rem 1rem 0; padding:.6rem .75rem; border-radius:.7rem; background:var(--ag-card-2); }
.ag-night__sets div { display:flex; align-items:center; gap:.45rem; color:var(--ag-lilac); font-size:.7rem; font-weight:620; }
.ag-night__acts { display:flex; flex-wrap:wrap; gap:.5rem; padding:.85rem 1rem; }
.ag-night__acts .ag-btn { flex:1 1 8rem; }

/* ---------- you ---------- */
.ag-me { display:flex; align-items:center; gap:.85rem; margin:1rem 1.1rem 0; padding:1rem; border:1px solid var(--ag-line); border-radius:1.25rem; background:linear-gradient(150deg,#2b2130,#1a1420 70%); }
.ag-me__face { width:3.4rem; height:3.4rem; display:grid; place-items:center; flex:0 0 auto; border:1px solid rgba(216,169,91,.5); border-radius:50%; color:var(--ag-gold); font-size:1.05rem; font-weight:700; letter-spacing:.02em; }
.ag-me > div { min-width:0; }
.ag-me h3 { font-size:1.1rem; font-weight:600; letter-spacing:-.025em; }
.ag-me p { margin-top:.2rem; color:var(--ag-muted); font-size:.73rem; }
.ag-toggles { display:grid; gap:.5rem; margin-top:.85rem; }
.ag-toggle { display:grid; grid-template-columns:1fr 2.6rem; gap:.8rem; align-items:center; min-height:2.75rem; padding:.7rem .8rem; border:1px solid var(--ag-line); border-radius:.9rem; background:var(--ag-card-2); cursor:pointer; }
.ag-toggle > div { min-width:0; }
.ag-toggle strong { display:block; font-size:.78rem; font-weight:620; }
.ag-toggle span { display:block; margin-top:.1rem; color:var(--ag-muted); font-size:.7rem; }
.ag-toggle input { position:absolute; opacity:0; width:0; height:0; }
.ag-toggle i { position:relative; width:2.6rem; height:1.5rem; border:1px solid var(--ag-line-strong); border-radius:999px; background:rgba(246,241,248,.08); transition:background .2s ease,border-color .2s ease; }
.ag-toggle i::after { position:absolute; top:.18rem; left:.2rem; width:1rem; height:1rem; border-radius:50%; background:var(--ag-muted); content:""; transition:transform .2s ease,background .2s ease; }
.ag-toggle input:checked + i { border-color:var(--ag-gold); background:rgba(216,169,91,.3); }
.ag-toggle input:checked + i::after { background:var(--ag-gold); transform:translateX(1.05rem); }
.ag-toggle input:focus-visible + i { outline:3px solid var(--ag-gold); outline-offset:2px; }

.ag-policies { display:grid; gap:.45rem; margin-top:.85rem; }
.ag-policies details { border:1px solid var(--ag-line); border-radius:.9rem; background:var(--ag-card-2); }
.ag-policies summary { display:flex; align-items:center; justify-content:space-between; gap:.7rem; min-height:2.75rem; padding:.7rem .85rem; font-size:.78rem; font-weight:640; cursor:pointer; list-style:none; }
.ag-policies summary::-webkit-details-marker { display:none; }
.ag-policies summary .ag-i { color:var(--ag-gold); transition:transform .2s ease; }
.ag-policies details[open] summary .ag-i { transform:rotate(90deg); }
.ag-policies p { padding:0 .85rem .8rem; color:var(--ag-muted); font-size:.73rem; }

/* ---------- dialogs ---------- */
.ag-dialog { width:min(28rem,calc(100vw - 1.6rem)); max-height:min(86svh,44rem); margin:auto; padding:0; overflow-y:auto; overscroll-behavior:contain; border:1px solid var(--ag-line-strong); border-radius:1.35rem; background:var(--ag-ink); color:var(--ag-text); box-shadow:var(--ag-shadow); }
.ag-dialog::backdrop { background:rgba(6,4,9,.78); backdrop-filter:blur(5px); }
.ag-dialog__bar { position:sticky; top:0; z-index:2; display:flex; align-items:flex-start; justify-content:space-between; gap:.8rem; padding:1rem; border-bottom:1px solid var(--ag-line); background:rgba(23,19,27,.96); backdrop-filter:blur(12px); }
.ag-dialog__bar > div { min-width:0; }
.ag-dialog__bar h2 { margin-top:.35rem; font-size:1.35rem; font-weight:560; letter-spacing:-.035em; text-wrap:balance; }
.ag-dialog__body { padding:1rem; }
.ag-dialog--note { width:min(23rem,calc(100vw - 1.6rem)); padding:1.5rem; text-align:center; }
.ag-dialog--note .ag-kicker { justify-content:center; }
.ag-dialog--note h2 { margin-top:.5rem; font-size:1.5rem; font-weight:560; letter-spacing:-.035em; text-wrap:balance; }
.ag-dialog--note > p:not(.ag-kicker) { margin-top:.6rem; color:var(--ag-muted); font-size:.82rem; }
.ag-dialog--note .ag-btn { width:100%; margin-top:1.15rem; }

.ag-form { display:grid; grid-template-columns:repeat(2,1fr); gap:.7rem; padding:1rem; }
.ag-form label { display:grid; gap:.35rem; }
.ag-form label > span { color:var(--ag-muted); font-size:.66rem; font-weight:760; letter-spacing:.07em; text-transform:uppercase; }
.ag-form input,.ag-form select,.ag-form textarea { width:100%; min-height:2.75rem; padding:.6rem .7rem; border:1px solid var(--ag-line-strong); border-radius:.7rem; background:var(--ag-card-2); color:var(--ag-text); font-size:.82rem; }
.ag-form input[readonly] { color:var(--ag-muted); }
.ag-form textarea { min-height:4.5rem; resize:vertical; }
.ag-form ::placeholder { color:var(--ag-muted); opacity:1; }
.ag-form .ag-check { align-items:center; }
.ag-form .ag-check span { color:var(--ag-muted); font-size:.78rem; text-transform:none; letter-spacing:0; }
.ag-wide { grid-column:1/-1; }
.ag-formnote { color:var(--ag-muted); font-size:.72rem; }

.ag-choice { display:grid; gap:.5rem; }
.ag-choice button { display:grid; grid-template-columns:1fr auto; gap:.7rem; align-items:center; min-height:2.75rem; padding:.8rem .85rem; border:1px solid var(--ag-line); border-radius:.9rem; background:var(--ag-card); text-align:left; }
.ag-choice button > div { min-width:0; }
.ag-choice button:hover { border-color:var(--ag-gold); }
.ag-choice button[aria-pressed="true"] { border-color:var(--ag-gold); background:rgba(216,169,91,.12); }
.ag-choice strong { display:block; font-size:.82rem; font-weight:620; }
.ag-choice span { display:block; margin-top:.12rem; color:var(--ag-muted); font-size:.72rem; }
.ag-choice b { font-size:.85rem; font-weight:680; font-variant-numeric:tabular-nums; white-space:nowrap; }
.ag-choice .ag-pill { display:inline-flex; width:fit-content; font-size:.6rem; }

/* the pass: ink on gold, 8.5:1 */
.ag-pass { margin:1rem; padding:0; border-radius:1.1rem; background:var(--ag-gold); color:var(--ag-ink); }
.ag-pass__top { padding:1.05rem 1.05rem .8rem; }
.ag-pass__top p:first-child { font-size:.66rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.ag-pass__top h3 { margin-top:.35rem; font-size:1.5rem; font-weight:640; letter-spacing:-.035em; }
.ag-pass__top > p:last-child { margin-top:.25rem; font-size:.78rem; font-weight:600; }
.ag-pass__grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(23,19,27,.28); }
.ag-pass__grid div { padding:.7rem .8rem; border-right:1px solid rgba(23,19,27,.28); }
.ag-pass__grid div:last-child { border-right:0; }
.ag-pass__grid strong { display:block; font-size:.85rem; font-weight:700; font-variant-numeric:tabular-nums; }
.ag-pass__grid span { display:block; margin-top:.1rem; font-size:.62rem; font-weight:640; letter-spacing:.04em; text-transform:uppercase; }
.ag-pass__tear { position:relative; height:1.3rem; border-top:2px dashed rgba(23,19,27,.35); }
.ag-pass__tear::before,.ag-pass__tear::after { position:absolute; top:-.65rem; width:1.3rem; height:1.3rem; border-radius:50%; background:var(--ag-ink); content:""; }
.ag-pass__tear::before { left:-.65rem; }
.ag-pass__tear::after { right:-.65rem; }
.ag-pass__seal { display:flex; align-items:flex-end; gap:.14rem; height:3.2rem; padding:0 1.05rem; }
.ag-pass__seal i { flex:1 1 0; border-radius:.1rem; background:var(--ag-ink); }
.ag-pass__code { display:flex; align-items:baseline; justify-content:space-between; gap:.8rem; padding:.75rem 1.05rem 1.05rem; }
.ag-pass__code strong { font-size:1.25rem; font-weight:760; font-variant-numeric:tabular-nums; letter-spacing:.16em; }
.ag-pass__code span { font-size:.68rem; font-weight:640; text-align:right; }
.ag-passfoot { padding:0 1rem 1rem; }
.ag-passfoot p { color:var(--ag-muted); font-size:.75rem; }
.ag-passfoot .ag-btn { width:100%; margin-top:.85rem; }
.ag-passfoot ul { display:grid; gap:.3rem; margin:.85rem 0 0; padding:0; list-style:none; }
.ag-passfoot li { display:flex; gap:.5rem; color:var(--ag-muted); font-size:.72rem; }
.ag-passfoot li .ag-i { color:var(--ag-gold); }

.ag-toast { position:fixed; z-index:300; bottom:1.2rem; left:50%; width:min(22rem,calc(100vw - 2rem)); padding:.75rem 1rem; border:1px solid var(--ag-line-strong); border-radius:.85rem; background:var(--ag-card-2); color:var(--ag-text); box-shadow:var(--ag-shadow); font-size:.8rem; transform:translateX(-50%); }

/* ---------- responsive ---------- */
@media (max-width:1000px) {
  .ag-stage { grid-template-columns:1fr; }
  .ag-playbill { min-height:auto; align-items:center; flex-direction:row; flex-wrap:nowrap; gap:1rem; padding:.8rem 1.2rem; border-right:0; border-bottom:1px solid var(--ag-line); }
  /* The playbill copy collapses, but the page's only h1 stays in the DOM and
     in the accessibility tree rather than being display:none'd away. */
  .ag-playbill__body { display:block; max-width:none; }
  .ag-playbill__body > *:not(h1) { display:none; }
  .ag-playbill h1 { position:absolute; width:1px; height:1px; margin:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  .ag-playbill h1::after { display:none; }
  .ag-back { flex:0 0 auto; }
  .ag-playbill__foot { flex:1 1 auto; min-width:0; grid-template-columns:auto minmax(0,1fr); align-items:center; justify-content:end; gap:1rem; }
  .ag-playbill__foot p { max-width:none; font-size:.66rem; text-align:right; }
  .ag-deviceWrap { min-height:0; padding:1.2rem .8rem 2rem; }
  .ag-device { height:min(53rem,calc(100svh - 7rem)); min-height:38rem; }
}
@media (max-width:620px) {
  .ag-playbill { display:block; gap:0; padding:0; border:0; }
  .ag-playbill > .ag-back,.ag-playbill__foot { display:none; }
  .ag-deviceWrap { min-height:100svh; padding:0; }
  .ag-glow { display:none; }
  .ag-device { width:100%; height:100svh; min-height:100svh; border:0; border-radius:0; box-shadow:none; }
  .ag-device__slot { display:none; }
  .ag-appbar { height:calc(4.4rem + env(safe-area-inset-top)); padding-top:max(.95rem,calc(env(safe-area-inset-top) + .4rem)); }
  .ag-screen { top:calc(6rem + env(safe-area-inset-top)); bottom:calc(4.5rem + env(safe-area-inset-bottom)); }
  .ag-tabs { height:calc(4.5rem + env(safe-area-inset-bottom)); padding-bottom:env(safe-area-inset-bottom); }
  .ag-form { grid-template-columns:1fr; }
  .ag-wide { grid-column:auto; }
  .ag-dialog { max-height:min(90svh,44rem); }
  .ag-toast { bottom:calc(5.3rem + env(safe-area-inset-bottom)); }
}
@media (max-width:400px) {
  .ag-greet h2,.ag-head h2 { font-size:1.6rem; }
  .ag-hold__value { font-size:2rem; }
  .ag-resv__grid { grid-template-columns:1fr 1fr; }
  .ag-resv__grid div:nth-child(2) { border-right:0; }
  .ag-resv__grid div:nth-child(3) { grid-column:1/-1; border-top:1px solid var(--ag-line); border-right:0; }
  .ag-split { grid-template-columns:1fr; }
  .ag-pass__grid { grid-template-columns:1fr 1fr; }
  .ag-pass__grid div:nth-child(2) { border-right:0; }
  .ag-pass__grid div:nth-child(3) { grid-column:1/-1; border-top:1px solid rgba(23,19,27,.28); border-right:0; }
  .ag-rail li { grid-template-columns:4.2rem 1fr; }
  .ag-rail li::before { left:4.5rem; }
  .ag-rail li::after { left:4.2rem; }
  .ag-rail__body { padding-left:.9rem; }
}
@media (max-width:359px) {
  .ag-resv__acts,.ag-btnrow,.ag-night__acts { flex-direction:column; }
  .ag-btnrow .ag-btn,.ag-night__acts .ag-btn,.ag-resv__acts .ag-btn { flex:0 0 auto; width:100%; }
  .ag-guest__acts button { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}