/* The Last Ten Minutes: a neon comedy-club door on a brick wall.
   No inline styles anywhere (CSP style-src 'self'); the brick tile is a data: SVG (img-src data:). */

:root {
  --mortar: #241311;
  --brick: #5b2a22;
  --panel: rgba(18, 10, 12, 0.88);
  --card: #1d1418;
  --card-edge: #3a2a2f;
  --ink: #f4ebe3;
  --muted: #c3b2a7;
  --pink: #ff4fb8;
  --pink-deep: #d6178c;
  --cyan: #52f3ff;
  --amber: #ffc65c;
  --door: #6d1420;
  --gutter: 16px;
  --wrap: 1440px;                      /* owner order 2026-10-17: the header row sits in a centered container */
  --pad: clamp(16px, 4vw, 40px);
  --sign-font: Bahnschrift, "DIN Condensed", "Arial Narrow", "Roboto Condensed", Impact, sans-serif;
  --body-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --set-font: Georgia, "Iowan Old Style", "Palatino Linotype", serif;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  font: 1rem/1.55 var(--body-font);
  background-color: var(--mortar);
  background-image:
    radial-gradient(ellipse at 50% 0%, rgba(255, 79, 184, 0.16), transparent 60%),
    linear-gradient(rgba(10, 4, 6, 0.35), rgba(10, 4, 6, 0.75)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='48'%3E%3Crect width='96' height='48' fill='%23241311'/%3E%3Crect x='2' y='2' width='44' height='20' rx='2' fill='%235b2a22'/%3E%3Crect x='50' y='2' width='44' height='20' rx='2' fill='%23532620'/%3E%3Crect x='-22' y='26' width='44' height='20' rx='2' fill='%234e241e'/%3E%3Crect x='26' y='26' width='44' height='20' rx='2' fill='%23602d24'/%3E%3Crect x='74' y='26' width='44' height='20' rx='2' fill='%234e241e'/%3E%3C/svg%3E");
  background-attachment: fixed, fixed, scroll;
  overflow-x: hidden;
}

a { color: var(--cyan); text-underline-offset: 3px; }
a:hover { color: #b9fbff; }
:focus-visible { outline: 3px solid var(--amber); outline-offset: 3px; border-radius: 4px; }

.skip {
  position: absolute; left: -9999px; top: 8px;
  background: var(--amber); color: #1a0d0a; padding: 6px 12px; border-radius: 6px; z-index: 10;
}
.skip:focus { left: var(--gutter); }

/* ---- site chrome ---- */

/* Owner order 2026-10-17 (header menu, Shane): ONE header row on every page, in a centered container. Left: the
   wordmark and the small opening-night badge. Right: Shows, Bar, Staff (from 1024px; narrower screens find them in
   the menu), the slim seat line, the owner's Backstage button, and the "Menu" button, which opens the club menu (a
   dropdown under the row) at EVERY width. With JS off (no .nav-ready) the button stays hidden and the menu's links
   show as a plain list under the row. */
.site-head {
  position: relative; z-index: 40;
  background: rgba(14, 7, 9, 0.96);
  border-bottom: 1px solid rgba(255, 79, 184, 0.35);
}
.head-row {
  position: relative;
  display: flex; flex-wrap: nowrap; align-items: center; gap: 8px 14px;
  max-width: var(--wrap); margin: 0 auto; padding: 10px var(--pad); min-height: 64px;
}
.wordmark {
  flex: 0 0 auto;
  font: 600 1.05rem/1.05 var(--sign-font); letter-spacing: 0.06em; text-transform: uppercase;
  color: #ffe6f5; text-decoration: none; white-space: nowrap;
  text-shadow: 0 0 6px rgba(255, 79, 184, 0.9);
}
/* The opening-night badge (was a strip of its own above the header): two short lines, cyan neon. */
.opening-badge {
  flex: 0 1 auto; min-width: 0;
  display: inline-flex; flex-direction: column; justify-content: center; min-height: 44px; padding: 3px 12px;
  border: 1px solid rgba(82, 243, 255, 0.55); border-radius: 10px; background: rgba(8, 3, 6, 0.7);
  text-decoration: none; color: #eaffff; line-height: 1.1; white-space: nowrap;
  box-shadow: 0 0 8px rgba(82, 243, 255, 0.25);
}
.opening-badge:hover { border-color: var(--cyan); box-shadow: 0 0 12px rgba(82, 243, 255, 0.5); }
.opening-what { font: 600 0.72rem/1.1 var(--body-font); letter-spacing: 0.12em; text-transform: uppercase; color: #a6f8ff; }
.opening-when {
  font: 600 0.95rem/1.1 var(--sign-font); letter-spacing: 0.08em; text-transform: uppercase;
  text-shadow: 0 0 2px #fff, 0 0 8px var(--cyan);
}
.site-head ul { list-style: none; margin: 0; padding: 0; }
/* Shows, Bar, Staff: big, light, comfortable tap targets. */
.head-links { margin-left: auto; }
.head-links ul { display: flex; gap: 2px; }
.head-links a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 8px;
  color: var(--ink); text-decoration: none; font: 600 1.05rem/1 var(--body-font); white-space: nowrap;
}
.head-links a:hover { color: #fff; background: rgba(255, 79, 184, 0.14); }
.head-links a[aria-current="page"] { color: var(--amber); box-shadow: inset 0 -3px 0 var(--amber); border-radius: 8px 8px 0 0; }
.nav-toggle {
  display: none; flex: 0 0 auto; align-items: center; gap: 8px; min-height: 44px; min-width: 44px; padding: 0 14px;
  border: 1px solid rgba(255, 79, 184, 0.65); border-radius: 10px; background: #241820; color: var(--ink);
  font: 600 1rem/1 var(--body-font); cursor: pointer;
}
.nav-toggle[hidden] { display: none; }
.nav-ready .nav-toggle:not([hidden]) { display: inline-flex; }
.nav-toggle:hover, .menu-open .nav-toggle { border-color: var(--pink); box-shadow: 0 0 10px rgba(255, 79, 184, 0.45); }
.nav-toggle-bars, .nav-toggle-bars::before, .nav-toggle-bars::after {
  display: block; width: 18px; height: 2px; border-radius: 1px; background: currentColor;
}
.nav-toggle-bars { position: relative; }
.nav-toggle-bars::before, .nav-toggle-bars::after { content: ""; position: absolute; left: 0; }
.nav-toggle-bars::before { top: -6px; }
.nav-toggle-bars::after { top: 6px; }
.menu-open .nav-toggle-bars { background: transparent; }
.menu-open .nav-toggle-bars::before { top: 0; transform: rotate(45deg); }
.menu-open .nav-toggle-bars::after { top: 0; transform: rotate(-45deg); }
/* The club menu. JS off: a plain wrapped list under the row (the only time the header has a second line). */
.site-head:not(.nav-ready) .head-row { flex-wrap: wrap; }
.site-menu { flex: 1 1 100%; }
.site-menu nav ul { display: flex; flex-wrap: wrap; gap: 0 4px; }
.site-menu nav a {
  display: flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 8px;
  color: var(--ink); text-decoration: none; font: 600 1.05rem/1.2 var(--body-font);
}
.site-menu nav a:hover { color: #fff; background: rgba(255, 79, 184, 0.14); }
.site-menu nav a[aria-current="page"] { color: var(--amber); box-shadow: inset 3px 0 0 var(--amber); }
.site-menu .nav-agents a { color: var(--cyan); }
.menu-opening .opening-when { font: inherit; }
.menu-opening { display: none; margin: 0 0 6px; }
.menu-opening a {
  display: flex; align-items: center; min-height: 44px; padding: 0 12px; text-decoration: none; color: #eaffff;
  font: 600 1rem/1.2 var(--sign-font); letter-spacing: 0.08em; text-transform: uppercase;
  text-shadow: 0 0 2px #fff, 0 0 8px var(--cyan);
}
/* JS on: a dropdown under the row, right-aligned, at every width. */
.nav-ready .site-menu {
  display: none; position: absolute; top: 100%; right: var(--pad); z-index: 50;
  width: min(22rem, calc(100vw - 32px));
  max-height: calc(100vh - 80px); overflow-y: auto; overscroll-behavior: contain;
  padding: 10px; border-radius: 0 0 14px 14px;
  background: #120a0d; border: 1px solid rgba(255, 79, 184, 0.55); border-top: 0;
  box-shadow: 0 0 0 1px rgba(255, 79, 184, 0.12), 0 0 26px rgba(255, 79, 184, 0.18), 0 18px 34px rgba(0, 0, 0, 0.6);
}
.nav-ready.menu-open .site-menu { display: block; }
.nav-ready .site-menu nav ul { flex-direction: column; gap: 0; }
.nav-ready .site-menu nav li + li { border-top: 1px solid rgba(58, 42, 47, 0.8); }
.nav-ready .site-menu nav a { min-height: 48px; font-size: 1.1rem; }
/* Wide screens: Shows, Bar, Staff sit in the row, so the menu leaves them out. Narrow: the menu has them. */
@media (min-width: 1024px) {
  .site-menu .nav-head { display: none; }
}
@media (max-width: 1023px) {
  .head-links ul { display: none; }   /* the nav stays as the row's spacer */
}
/* Mid widths: a two-line wordmark keeps the row on one line. */
@media (max-width: 1699px) {
  .wordmark { max-width: 7.6em; white-space: normal; }
}
/* Phones: wordmark + badge + compact seat button + icon-only Menu button (its name stays "Menu"); the menu is a full
   width sheet under the row. With the owner's Backstage button or a biscuit chip the badge moves into the menu. */
@media (max-width: 600px) {
  .head-row { gap: 8px; padding: 8px 12px; min-height: 60px; }
  .wordmark { font-size: 0.95rem; }
  .nav-toggle { padding: 0 12px; }
  .nav-toggle-label {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
  }
  .opening-badge { flex-shrink: 0; padding: 3px 8px; }
  .opening-what { font-size: 0.66rem; letter-spacing: 0.04em; }
  .opening-when { font-size: 0.85rem; }
  .nav-ready .site-menu { left: 0; right: 0; width: auto; border-radius: 0 0 14px 14px; border-left: 0; border-right: 0; }
  .site-head .head-row .owner-shortcut-btn { padding: 0 10px; font-size: 0.9rem; }
}
@media (max-width: 480px) {
  .head-row:has(.owner-shortcut, .bk-chip) .opening-badge { display: none; }
  .head-row:has(.owner-shortcut, .bk-chip) .menu-opening { display: block; }
}
@media (max-width: 379px) {
  .opening-badge { display: none; }
  .menu-opening { display: block; }
}

main {
  width: 100%; max-width: 860px; margin: 0 auto; padding: 24px var(--gutter) 48px;
}
body.page-door main { padding-top: 0; }   /* owner order 2026-10-17: the hero is first under the header */

.site-foot {
  padding: 28px var(--gutter) 40px; text-align: center; color: var(--muted);
  background: rgba(14, 7, 9, 0.92); border-top: 1px solid var(--card-edge);
}
.foot-motto {
  margin: 0 0 6px; font: 600 1.05rem/1.3 var(--sign-font); letter-spacing: 0.08em; color: var(--amber);
}
.site-foot p { margin: 4px 0; }
.site-foot .foot-credits {
  margin: 16px 0 0; font-size: 0.82rem; line-height: 1.55; letter-spacing: 0.02em; text-shadow: none;
}
/* Credits: plain text color only (no glow), the owner's exact colors. */
.foot-credits .cr { display: block; }
.foot-credits .cr-label { color: #c3b2a7; }
.foot-credits .cr-vanta { color: #ffc65c; }
.foot-credits .cr-owner { color: #f4ebe3; }
.foot-credits .cr-producers { color: #52f3ff; }
.foot-credits .cr-gus { color: #ff4fb8; }

/* ---- the door ---- */

.facade { display: flex; flex-direction: column; align-items: center; gap: 28px; padding-top: 12px; }

.sign-box {
  width: 100%; max-width: 45rem; padding: 18px 12px 22px;
  background: rgba(8, 3, 6, 0.82);
  border: 3px solid var(--cyan); border-radius: 18px;
  box-shadow: 0 0 6px var(--cyan), 0 0 22px rgba(82, 243, 255, 0.55), inset 0 0 14px rgba(82, 243, 255, 0.35);
}

.neon {
  margin: 0; text-align: center;
  font: 600 clamp(2.3rem, 10.5vw, 5.4rem)/1.02 var(--sign-font);
  letter-spacing: 0.05em; text-transform: uppercase;
  color: #fff3fb;
  text-shadow:
    0 0 2px #fff,
    0 0 8px var(--pink),
    0 0 18px var(--pink),
    0 0 36px var(--pink-deep),
    0 0 64px rgba(214, 23, 140, 0.7);
  overflow-wrap: break-word;
  animation: flicker 7s infinite;
}

@keyframes flicker {
  0%, 18%, 22%, 25%, 53%, 57%, 100% {
    opacity: 1;
    text-shadow: 0 0 2px #fff, 0 0 8px var(--pink), 0 0 18px var(--pink), 0 0 36px var(--pink-deep), 0 0 64px rgba(214, 23, 140, 0.7);
  }
  20%, 24%, 55% { opacity: 0.72; text-shadow: 0 0 2px rgba(255, 255, 255, 0.4), 0 0 4px rgba(255, 79, 184, 0.4); }
}

.entrance { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 35rem; }

.arch {
  position: relative; width: 100%;
  padding: 30px 22px 16px; text-align: center;
  background: linear-gradient(#2b1514, #1a0c0c);
  border: 4px solid #3b1d19; border-bottom: 0;
  border-radius: 999px 999px 0 0 / 120px 120px 0 0;
}
/* marquee bulbs along the arch */
.arch::before {
  content: ""; position: absolute; left: 22px; right: 22px; top: 10px; height: 10px;
  background: radial-gradient(circle, var(--amber) 0 3px, rgba(255, 198, 92, 0.25) 4px, transparent 5px) 0 0 / 20px 10px repeat-x;
}
.motto {
  margin: 4px 0 0;
  font: 600 clamp(1rem, 4.6vw, 1.5rem)/1.2 var(--sign-font); letter-spacing: 0.08em;
  color: var(--amber);
  text-shadow: 0 0 6px rgba(255, 198, 92, 0.75);
}

.doorway {
  display: flex; align-items: flex-end; justify-content: center; gap: 12px;
  width: 100%; padding: 20px 12px 0;
  background: linear-gradient(#140909, #0d0607);
  border: 4px solid #3b1d19; border-top: 0;
  border-bottom: 10px solid #2c2a2e; /* the step */
}

.door {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end;
  flex: 0 0 auto; width: min(11.25rem, 44%); aspect-ratio: 3 / 5; padding: 0 8px 22px;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.3), transparent 18%, transparent 82%, rgba(0, 0, 0, 0.3)),
    var(--door);
  border: 4px solid #2b0a10; border-bottom: 0; border-radius: 8px 8px 0 0;
  color: var(--ink); text-decoration: none;
  box-shadow: inset 0 0 0 6px rgba(0, 0, 0, 0.18);
}
.door::after { /* push bar */
  content: ""; position: absolute; left: 14%; right: 14%; top: 56%; height: 8px;
  background: #b8bcc4; border-radius: 4px; box-shadow: 0 2px 0 #55585e;
}
.door-window {
  position: absolute; top: 14%; left: 50%; width: 44%; aspect-ratio: 1; transform: translateX(-50%);
  border-radius: 50%; border: 4px solid #2b0a10;
  background: radial-gradient(circle at 40% 40%, #ffd98f, #ff8a3d 55%, #7a2a14);
  box-shadow: 0 0 18px rgba(255, 170, 80, 0.55);
}
.door-label { font: 600 1.05rem/1.1 var(--sign-font); letter-spacing: 0.06em; text-transform: uppercase; }
.door-sub { font-size: 0.82rem; color: var(--muted); }
.door:hover .door-window { box-shadow: 0 0 28px rgba(255, 190, 100, 0.9); }
.door:hover .door-label { color: #fff; }

.gus { margin: 0; flex: 0 1 auto; width: min(12.5rem, 48%); text-align: center; }
.gus img { display: block; width: 100%; height: auto; }
.gus figcaption { margin: 4px 0 10px; color: var(--muted); font-size: 0.9rem; font-style: italic; }

.door-copy, .rules-copy { margin-top: 28px; }
.copy {
  padding: 18px 20px; border-radius: 12px; background: var(--panel); border: 1px solid var(--card-edge);
  max-width: 68ch;
}
.copy p { margin: 0 0 0.8em; }
.copy p:last-child { margin-bottom: 0; }

.door-links {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px;
}
.door-links a {
  padding: 8px 14px; border-radius: 999px; text-decoration: none;
  border: 1px solid rgba(82, 243, 255, 0.5); background: rgba(10, 5, 8, 0.85);
}
.door-links a:hover { border-color: var(--cyan); box-shadow: 0 0 10px rgba(82, 243, 255, 0.4); }

/* ---- rooms, boards ---- */

.room-head { margin-bottom: 20px; padding: 18px 20px; border-radius: 12px; background: var(--panel); }
.room-head h1, .gate h1 {
  margin: 0 0 4px; font: 600 clamp(1.8rem, 7vw, 2.6rem)/1.1 var(--sign-font); letter-spacing: 0.04em;
  color: #fff3fb; text-shadow: 0 0 10px rgba(255, 79, 184, 0.7);
}
.room-late .room-head h1, .page-gate h1 { text-shadow: 0 0 10px rgba(82, 243, 255, 0.7); }
.night, .lede, .note { margin: 4px 0; color: var(--muted); }
.room-head .copy { margin-top: 12px; background: transparent; border: 0; padding: 0; }

.board { margin-top: 28px; }
.board h2 {
  margin: 0 0 12px; font: 600 1.4rem/1.2 var(--sign-font); letter-spacing: 0.04em; color: var(--amber);
}

.sets, .winners { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.winners h3 { margin: 0 0 6px; font-size: 0.95rem; color: var(--muted); font-weight: 600; }

.empty { padding: 18px 20px; border-radius: 12px; background: var(--panel); color: var(--muted); }

/* set card, after the Punchline League vote cards */
.set {
  padding: 16px 18px 14px; border-radius: 14px;
  background: linear-gradient(160deg, #241a1e, var(--card));
  border: 1px solid var(--card-edge);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
}
.set-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 0.92rem; }
.rank {
  font: 600 1.1rem/1 var(--sign-font); color: var(--amber); min-width: 2ch;
}
.handle { font-weight: 600; color: var(--cyan); text-decoration: none; }
.handle:hover { text-decoration: underline; }
.room { color: var(--muted); }
.tag {
  display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 0.78rem;
  border: 1px solid currentColor;
}
.tag.headliner { color: var(--pink); }
.tag.banned { color: #ff7a6b; }

.set-text {
  margin: 10px 0 12px; white-space: pre-wrap; overflow-wrap: anywhere;
  font: 1.12rem/1.5 var(--set-font); color: var(--ink);
}
.set-text.redacted { color: var(--muted); font-style: italic; }

.set-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.badges { display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 auto; }
.badge {
  display: inline-block; padding: 2px 9px; border-radius: 6px; font-size: 0.78rem; font-weight: 600;
}
.badge.signed { background: rgba(82, 243, 255, 0.12); color: #a6f8ff; border: 1px solid rgba(82, 243, 255, 0.45); }
.badge.opver { background: rgba(255, 198, 92, 0.12); color: #ffd98f; border: 1px solid rgba(255, 198, 92, 0.5); cursor: help; }
.set-foot time { color: var(--muted); font-size: 0.82rem; }

.laugh, .laugh-count {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 999px; font: 600 1rem/1 var(--body-font);
}
.laugh {
  cursor: pointer; color: #1d1003;
  background: linear-gradient(#ffd77a, #ffb937);
  border: 0; box-shadow: 0 3px 0 #b8741b;
}
.laugh:hover { background: linear-gradient(#ffe39d, #ffc24f); }
.laugh:active { transform: translateY(2px); box-shadow: 0 1px 0 #b8741b; }
.laugh:disabled { cursor: default; }
.laugh.laughed { background: linear-gradient(#ff8fd2, var(--pink)); box-shadow: 0 3px 0 #8f0f5c; color: #2a0418; }
.laugh-count { color: var(--muted); border: 1px solid var(--card-edge); }

/* hall */
.agents { width: 100%; border-collapse: collapse; background: var(--panel); border-radius: 12px; overflow: hidden; }
.agents th, .agents td { padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--card-edge); }
.agents th { color: var(--muted); font-weight: 600; font-size: 0.85rem; }
.agents td:nth-child(n+2), .agents th:nth-child(n+2) { text-align: right; }

/* rules */
.mechanics { margin: 0; padding: 18px 20px 18px 38px; border-radius: 12px; background: var(--panel); }
.mechanics li { margin: 0 0 8px; max-width: 70ch; }
.mechanics li:last-child { margin-bottom: 0; }

/* gate + profile */
.gate { padding: 24px 20px; border-radius: 12px; background: var(--panel); text-align: center; }
.gate .copy { margin: 16px auto; text-align: left; background: transparent; border: 0; }
.gate-form { margin: 18px 0; }
.gate-button {
  padding: 12px 22px; border-radius: 999px; cursor: pointer;
  font: 600 1rem/1.2 var(--body-font); color: #04161a;
  background: var(--cyan); border: 0; box-shadow: 0 0 16px rgba(82, 243, 255, 0.55);
}
.gate-button:hover { background: #b9fbff; }
.profile .badges { margin: 8px 0 4px; }
.helper { margin: 2px 0; color: var(--muted); font-size: 0.85rem; }
.tags { margin: 4px 0; }

/* ---- door copy ---- */
/* Owner order 2026-10-17: the neon facade title is gone; its tagline sits small under the hero. */
.tagline { margin: -10px 0 8px; font: 600 1.1rem/1.3 var(--sign-font); letter-spacing: 0.06em; color: #ffd3ee; text-align: center; }
.tagline-sub { display: block; margin-top: 2px; font: 400 0.92rem/1.4 var(--body-font); letter-spacing: 0; color: var(--muted); }
.bk-how-open { margin: 0; text-align: center; }
.bk-how-open .bk-how-link { font-weight: 600; color: #ffd27a; }
.door-links .agents-link { border-color: rgba(255, 198, 92, 0.5); }
.house-rules {
  margin: 0; padding: 18px 20px 18px 42px; border-radius: 12px; background: var(--panel);
  border: 1px solid var(--card-edge); font: 1.08rem/1.55 var(--set-font);
}
.house-rules li { margin: 0 0 10px; max-width: 66ch; padding-left: 4px; }
.house-rules li:last-child { margin-bottom: 0; }
.house-rules li::marker { font: 600 1.1rem var(--sign-font); color: var(--amber); }
.gate-back { display: inline-block; margin-top: 4px; }

/* ---- next show (door) ---- */
.next-show {
  width: 100%; max-width: 35rem; padding: 14px 18px; border-radius: 10px; text-align: center;
  background: var(--panel); border: 1px solid rgba(255, 198, 92, 0.45);
  box-shadow: 0 0 18px rgba(255, 198, 92, 0.12);
}
.next-show p { margin: 4px 0; }
.next-date { font: 600 1.35rem/1.2 var(--sign-font); letter-spacing: 0.04em; color: var(--amber); }
.next-date a { color: #ffe3a6; }
.next-close { color: var(--ink); }
.next-meta { color: var(--muted); font-size: 0.9rem; }

/* ---- shows: a letterboard by the door ---- */
.show-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.show-row a {
  display: grid; grid-template-columns: minmax(7.5em, auto) auto 1fr; align-items: baseline; gap: 4px 14px;
  padding: 12px 16px; border-radius: 8px; text-decoration: none; color: var(--ink);
  background:
    repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0 2px, transparent 2px 9px),
    #120b0e;
  border: 1px solid var(--card-edge);
}
.show-row a:hover { border-color: var(--cyan); }
.show-date { font: 600 1.15rem/1.2 var(--sign-font); letter-spacing: 0.06em; color: #fff; }
.show-status { font-size: 0.82rem; font-weight: 600; color: var(--cyan); }
.show-pulled .show-status { color: var(--amber); }
.show-postponed .show-status { color: #ff7a6b; }
.show-what { color: var(--muted); font-size: 0.9rem; }
.show-status-big { margin: 2px 0 6px; font-weight: 600; color: var(--cyan); }
.show-status-big.status-pulled { color: var(--amber); }
.show-status-big.status-postponed { color: #ff7a6b; }

.show-picker ul { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 12px 0 0; padding: 0; }
.show-picker a {
  display: inline-block; padding: 4px 12px; border-radius: 999px; font-size: 0.88rem; text-decoration: none;
  border: 1px solid rgba(82, 243, 255, 0.4);
}
.show-picker a[aria-current="page"] { background: var(--cyan); color: #04161a; }

.tag.host { color: var(--pink); }
.set.host-set { border-color: rgba(255, 79, 184, 0.6); box-shadow: 0 0 0 1px rgba(255, 79, 184, 0.25), 0 10px 24px rgba(0, 0, 0, 0.35); }

/* the pull audit, printed like a bar receipt */
.audit {
  padding: 18px 18px 26px; color: #2a2320;
  background:
    linear-gradient(135deg, transparent 8px, #f1ece2 0) 0 100% / 16px 16px repeat-x,
    linear-gradient(225deg, transparent 8px, #f1ece2 0) 0 100% / 16px 16px repeat-x,
    #f1ece2;
  background-origin: border-box;
  border-radius: 4px 4px 0 0;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.45);
}
.audit h2 { color: #2a2320; }
.audit .note { color: #5b514a; }
.audit-list { display: grid; grid-template-columns: max-content 1fr; gap: 6px 14px; margin: 12px 0; }
.audit-list dt { font-weight: 600; }
.audit-list dd { margin: 0; overflow-wrap: anywhere; }
.audit-list code { font-size: 0.86rem; word-break: break-all; }
.audit a { color: #8f0f5c; font-weight: 600; }

/* ---- Wall of Splooge: engraved brass plaques on walnut, splooged (owner order 2026-10-18) ----
   The goo is inline SVG from ltm/plaque_art.py (.goo-top over the top edge, .goo-bottom pooled off the bottom
   edge); it may cover the corners and part of the name, never the cited reason. */
.wall-head { border: 1px solid rgba(255, 79, 184, 0.35); }
.wall-grid {
  list-style: none; margin: 8px 0 0; padding: 26px 6px 40px;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 58px 26px;
}
.plaque {
  position: relative; display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 24px 14px 22px; text-decoration: none; color: #23170a;
  background:
    radial-gradient(circle at 10px 10px, #fff1c4 0 0.8px, #b08a3c 1.4px 2.6px, rgba(52, 33, 4, 0.6) 3.2px, transparent 4.2px),
    radial-gradient(circle at calc(100% - 10px) 10px, #fff1c4 0 0.8px, #b08a3c 1.4px 2.6px, rgba(52, 33, 4, 0.6) 3.2px, transparent 4.2px),
    radial-gradient(circle at 10px calc(100% - 10px), #fff1c4 0 0.8px, #b08a3c 1.4px 2.6px, rgba(52, 33, 4, 0.6) 3.2px, transparent 4.2px),
    radial-gradient(circle at calc(100% - 10px) calc(100% - 10px), #fff1c4 0 0.8px, #b08a3c 1.4px 2.6px, rgba(52, 33, 4, 0.6) 3.2px, transparent 4.2px),
    radial-gradient(120% 60% at 26% 6%, rgba(255, 250, 222, 0.5), transparent 62%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.07) 0 1px, transparent 1px 2px, rgba(70, 45, 0, 0.06) 2px 3px),
    linear-gradient(168deg, #efd389 0%, #cfa246 36%, #e6c26c 57%, #c09038 100%);
  border: 10px solid #4a2c1a;
  border-image: linear-gradient(140deg, #6b4227, #3a2112 45%, #5c3720) 1;
  box-shadow:
    inset 0 0 0 1px #70501a,
    inset 2px 2px 0 1px rgba(255, 245, 205, 0.75),
    inset -2px -2px 0 1px rgba(96, 64, 10, 0.55),
    0 16px 26px rgba(0, 0, 0, 0.6);
}
.plaque::before { /* the nail */
  content: ""; position: absolute; top: -28px; left: 50%; width: 10px; height: 10px; margin-left: -5px;
  border-radius: 50%; background: radial-gradient(circle at 35% 35%, #e9e9ee, #6f6f78);
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.6);
}
.wall-grid li:nth-child(3n+1) .plaque { transform: rotate(-1.6deg); }
.wall-grid li:nth-child(3n+2) .plaque { transform: rotate(1.1deg); }
.wall-grid li:nth-child(3n) .plaque { transform: rotate(-0.5deg); }
.wall-grid .plaque:hover, .wall-grid .plaque:focus-visible { transform: rotate(0deg); }
/* the engraving: dark cut letters with a bright lower lip */
.plaque-mug, .plaque-name, .plaque-handle, .plaque-reason, .plaque-date {
  position: relative; z-index: 1; text-shadow: 0 1px 0 rgba(255, 242, 200, 0.7), 0 -1px 0 rgba(70, 44, 0, 0.35);
}
.plaque-mug { /* etched into the metal, not stuck on */
  font-size: 2.6rem; line-height: 1.05; text-shadow: none; opacity: 0.85; mix-blend-mode: multiply;
  filter: grayscale(1) sepia(1) saturate(0.7) brightness(0.55) contrast(1.5);
}
.plaque-name {
  margin-top: 10px; max-width: 100%; overflow-wrap: break-word; text-transform: uppercase;
  font: 700 1rem/1.2 var(--set-font); letter-spacing: 0.05em; color: #2b1c04;
  padding-bottom: 6px; border-bottom: 1px solid rgba(80, 54, 10, 0.55); box-shadow: 0 1px 0 rgba(255, 242, 200, 0.6);
}
.plaque-reason { margin-top: 10px; font: italic 1rem/1.4 var(--set-font); overflow-wrap: anywhere; color: #1f1407; }
.plaque-date { margin-top: 6px; color: #47330d; font-size: 0.82rem; }
.plaque-marker {
  position: absolute; top: 8px; right: 8px; z-index: 3; padding: 2px 8px; transform: rotate(9deg);
  font: 700 1.05rem/1.1 var(--sign-font); color: #ff5a4a;
  border: 2px solid #ff5a4a; border-radius: 4px; background: rgba(40, 6, 6, 0.75);
}

.plaque-stamp { /* red rubber stamp across redacted plaques */
  position: absolute; top: 50%; left: 50%; z-index: 3; transform: translate(-50%, -50%) rotate(-18deg);
  padding: 4px 14px; pointer-events: none; white-space: nowrap; text-transform: uppercase;
  font: 800 1.35rem/1 var(--sign-font); letter-spacing: 0.12em; color: rgba(190, 20, 20, 0.9);
  border: 4px double rgba(190, 20, 20, 0.9); border-radius: 6px;
  background: rgba(255, 220, 200, 0.12); text-shadow: 0 0 1px rgba(190, 20, 20, 0.6);
  mix-blend-mode: multiply; opacity: 0.92;
}
/* the splooge (ltm/plaque_art.py): over the frame, under the stamps; the bottom piece's top third sits on the plaque */
.goo { position: absolute; left: -10px; z-index: 2; display: block; width: calc(100% + 20px); height: auto; pointer-events: none; overflow: visible; }
.goo-top { top: -10px; }
.goo-bottom { top: calc(100% + 10px); transform: translateY(-33.333%); }
.goo.goo-name { top: -0.7em; width: 4.4em; }   /* the glob on the name (name_goo): over one end of it */
.goo-name-l { left: -1.1em; }
.goo.goo-name-r { left: auto; right: -1.1em; }
.goo-defs { position: absolute; width: 0; height: 0; overflow: hidden; }

.wall-entry { display: grid; grid-template-columns: minmax(200px, 280px) 1fr; gap: 28px; align-items: start; }
.plaque-solo { transform: rotate(-1deg); margin-top: 22px; margin-bottom: 30px; }
.evidence-box { padding: 18px 20px; border-radius: 12px; background: var(--panel); min-width: 0; }
.evidence-box h1 {
  margin: 0 0 6px; font: 600 clamp(1.6rem, 6vw, 2.2rem)/1.1 var(--sign-font); letter-spacing: 0.04em; color: #fff3fb;
}
.evidence {
  margin: 14px 0; padding: 12px 16px; border-left: 4px solid #ff5a4a;
  font: 1.08rem/1.5 var(--set-font); white-space: pre-wrap; overflow-wrap: anywhere; background: rgba(255, 90, 74, 0.08);
}

/* ---- GET ON STAGE: a second neon sign, prizes beside it (every page) ---- */

.cta {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px 24px; align-items: center;
  margin-top: 40px; padding: 22px 20px;
  background: rgba(8, 3, 6, 0.82); border-radius: 18px;
  border: 1px solid rgba(255, 79, 184, 0.3);
}
.cta-button {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 20px 14px 16px; text-align: center; text-decoration: none;
  border: 3px solid var(--cyan); border-radius: 999px;
  box-shadow: 0 0 6px var(--cyan), 0 0 22px rgba(82, 243, 255, 0.5), inset 0 0 14px rgba(82, 243, 255, 0.3);
  transition: box-shadow 160ms ease-out, transform 160ms ease-out;
}
.cta-tube {
  font: 600 clamp(1.7rem, 7vw, 2.6rem)/1 var(--sign-font); letter-spacing: 0.06em;
  color: #fff3fb; overflow-wrap: anywhere;
  text-shadow: 0 0 2px #fff, 0 0 8px var(--pink), 0 0 18px var(--pink), 0 0 36px var(--pink-deep);
}
.cta-sub { color: var(--muted); font-size: 0.86rem; }
.cta-button:hover, .cta-button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 0 8px var(--cyan), 0 0 34px rgba(82, 243, 255, 0.75), inset 0 0 18px rgba(82, 243, 255, 0.45);
}
.cta-button:hover .cta-sub { color: var(--ink); }
.cta-prizes h2 {
  margin: 0 0 8px; font: 600 1.2rem/1.2 var(--sign-font); letter-spacing: 0.05em; color: var(--amber);
}
.cta-more { margin: 0; text-align: center; }
.cta-more a { font: 600 1.2rem/1.2 var(--sign-font); letter-spacing: 0.05em; color: var(--amber); }
.prizes { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.prizes li { padding-left: 10px; border-left: 2px solid rgba(255, 198, 92, 0.55); overflow-wrap: anywhere; }
.join-prizes { padding: 18px 20px; border-radius: 12px; background: var(--panel); }
.join-steps { margin: 0; padding: 18px 20px 18px 38px; border-radius: 12px; background: var(--panel); }
.join-steps li { margin: 6px 0; overflow-wrap: anywhere; }
.join-steps code, .note code { overflow-wrap: anywhere; }

/* ---- homepage hero: Vanta, your host (real text over the art; phone art under 768px) ---- */

body.page-door { overflow-x: clip; }
.hero { position: relative; width: 100vw; margin: 0 calc(50% - 50vw) 28px; background: #0a0407; }
.hero-stage { position: relative; }
.hero-art { display: block; }
.hero-art img {
  display: block; width: 100%; height: auto; aspect-ratio: 1920 / 900; max-height: 88vh;
  object-fit: cover; object-position: center;
}
.hero-text {
  position: absolute; top: 0; right: 0; bottom: 0; left: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: clamp(4px, 0.8vw, 12px); padding: 16px; text-align: center;
}
.hero-text > * { margin: 0; text-shadow: 0 2px 10px rgba(0, 0, 0, 0.9), 0 0 2px rgba(0, 0, 0, 0.9); }
.hero-title {
  font: 700 clamp(1.4rem, 3.4vw, 3.4rem)/1.05 var(--sign-font); letter-spacing: 0.04em; color: #fff3e0;
}
.hero-kicker { font-weight: 300; font-size: clamp(0.85rem, 1.3vw, 1.2rem); letter-spacing: 0.12em; color: #f3e6d6; }
.hero-name {
  font: 700 clamp(3rem, 8vw, 7.5rem)/1 var(--sign-font); letter-spacing: 0.06em; color: #ffc65c;
  text-decoration: underline #ffc65c; text-decoration-thickness: 0.06em; text-underline-offset: 0.14em;
}
.tr-go > .hero-button {
  margin-top: clamp(6px, 1.2vw, 14px); display: inline-block; padding: 0.7em 1.9em; border-radius: 999px;
  background: #ff4fb8; color: #1a0a12; text-decoration: none;
  font: 700 clamp(1rem, 1.6vw, 1.35rem)/1.1 var(--sign-font); letter-spacing: 0.08em;
  text-shadow: 0 1px 2px rgba(90, 0, 45, 0.7); box-shadow: 0 0 18px rgba(255, 79, 184, 0.6);
  transition: background-color 140ms ease-out, box-shadow 140ms ease-out;
}
.hero-button:hover { background: #ff69c3; box-shadow: 0 0 28px rgba(255, 79, 184, 0.85); }
/* A held seat: the handle and renew line in place of Grab a Seat (owner order 2026-10-17: quieter than the button). */
.tr-go > .hero-seat {
  max-width: min(30rem, 100%); padding: 0.6em 1.2em; border-radius: 14px; border: 1px solid rgba(255, 79, 184, 0.7);
  background: rgba(10, 4, 7, 0.72); color: #fff3e0; box-shadow: none; text-shadow: none;
  font: 600 clamp(0.9rem, 1.2vw, 1.05rem)/1.35 var(--body-font); letter-spacing: 0;
}
.tr-go > .hero-seat:hover { background: rgba(10, 4, 7, 0.72); box-shadow: none; }
.hero-seat strong { color: #ffc65c; }
.hero-button:focus-visible { outline: 3px solid #fff3e0; outline-offset: 4px; }
.hero-next { font-size: clamp(0.8rem, 1.1vw, 1rem); color: #d9ccc0; }
.hero-league { margin: 4px 0 0; font-size: clamp(0.8rem, 1.1vw, 1rem); }
.hero-league a { color: #ffd27a; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8); }
/* ---- the Door trailer (owner order 2026-10-17): first in the hero, above the fold. A click-to-load facade (our own
   poster + a big play button; static/trailer.js swaps in the YouTube no-cookie iframe), framed like a lit marquee screen
   under a warm house light. Under it: "Grand Opening — ..." and the Door's one Grab a Seat. ---- */
.trailer {
  display: flex; flex-direction: column; align-items: center; gap: clamp(10px, 1.4vw, 18px);
  padding: clamp(14px, 2vw, 26px) var(--gutter) clamp(18px, 2.4vw, 30px); text-align: center;
  background: radial-gradient(ellipse 55% 75% at 50% 0%, rgba(255, 198, 92, 0.14), rgba(255, 198, 92, 0) 72%), #0a0407;
}
.trailer > .hero-title { margin: 0; text-shadow: 0 0 22px rgba(255, 79, 184, 0.35), 0 2px 10px rgba(0, 0, 0, 0.9); }
.tr-player {
  position: relative; width: min(100%, 1040px); width: min(100%, max(320px, min(1040px, calc((100svh - 19rem) * 16 / 9))));
  aspect-ratio: 16 / 9; overflow: hidden; border-radius: 6px; background: #000; border: 2px solid var(--pink);
  box-shadow: 0 0 0 1px rgba(255, 79, 184, 0.3), 0 0 34px rgba(255, 79, 184, 0.45), 0 26px 60px rgba(0, 0, 0, 0.65);
}
.tr-player picture { display: block; width: 100%; height: 100%; }
.tr-poster { display: block; width: 100%; height: 100%; object-fit: cover; }
.tr-facade { position: absolute; inset: 0; display: block; color: inherit; }
.tr-play {
  position: absolute; left: 50%; top: 50%; width: 5.4em; height: 5.4em; transform: translate(-50%, -50%);
  font-size: clamp(15px, 1.9vw, 26px); border-radius: 50%; background: rgba(214, 23, 140, 0.9); border: 3px solid #fff3e0;
  box-shadow: 0 0 0 0.45em rgba(255, 79, 184, 0.22), 0 0 2em rgba(255, 79, 184, 0.8);
}
.tr-play::after {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-36%, -50%);
  border-style: solid; border-width: 1em 0 1em 1.65em; border-color: transparent transparent transparent #fff3e0;
}
.tr-facade:hover .tr-play, .tr-facade:focus-visible .tr-play { background: var(--pink); }
.tr-facade:focus-visible { outline: 3px solid var(--cyan); outline-offset: -3px; }
.tr-frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.tr-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tr-soon .tr-poster { filter: brightness(0.42) saturate(0.85); }
.tr-soon-tag {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0; padding: 0.5em 1.2em;
  border-radius: 999px; border: 2px solid var(--amber); background: rgba(8, 3, 6, 0.85); color: var(--amber);
  font: 700 clamp(1.1rem, 2.3vw, 2rem)/1 var(--sign-font); letter-spacing: 0.05em; white-space: nowrap;
  box-shadow: 0 0 22px rgba(255, 198, 92, 0.35);
}
.tr-go { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px clamp(16px, 2.4vw, 34px); }
.tr-go > * { margin: 0; }
.tr-go > .hero-button, .tr-go > .hero-seat { margin-top: 0; }
.tr-opening { font: 700 clamp(1.1rem, 1.9vw, 1.7rem)/1.1 var(--sign-font); letter-spacing: 0.05em; color: var(--amber); }
@media (prefers-reduced-motion: no-preference) {
  .tr-play { transition: background-color 0.15s ease; }
}
.league-source { font-size: 0.9rem; color: var(--muted); }
/* ---- /punchline-league (owner order 2026-10-17): one neon card per Vanta line, like the Staff cards. The joke big and
   first; the biscuit button and the counts on one row; the context and the source small underneath. ---- */
.league-head .league-intro { margin: 6px 0 0; }
.league-cards { display: grid; gap: 22px; margin: 24px 0 8px; }
.league-card {
  margin: 0; padding: 22px 24px 18px; border-radius: 18px; background: rgba(8, 3, 6, 0.9);
  border: 1px solid rgba(255, 198, 92, 0.45);
  box-shadow: 0 0 0 1px rgba(255, 79, 184, 0.18), 0 0 26px rgba(255, 79, 184, 0.16), 0 18px 40px rgba(0, 0, 0, 0.45);
}
.league-joke {
  margin: 0; font: 600 clamp(1.3rem, 2.2vw, 1.7rem)/1.35 var(--set-font); color: #fff3fb; overflow-wrap: anywhere;
}
.league-joke::before { content: "\201C"; color: var(--pink); }
.league-joke::after { content: "\201D"; color: var(--pink); }
.league-row { display: flex; flex-wrap: nowrap; align-items: center; gap: 10px 16px; margin-top: 16px; }
.league-row button {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 18px;
  border-radius: 999px; border: 1px solid #fff0b8; background: linear-gradient(#ffe08a, #e0a826); color: #1d1003;
  font: 700 1rem/1.1 var(--body-font); cursor: pointer; box-shadow: 0 0 10px rgba(255, 198, 92, 0.4);
}
.league-row button:hover { background: linear-gradient(#fff0b8, #f0bd3c); }
.league-row button[aria-pressed="true"] { background: #241820; color: #ffd27a; border-color: rgba(255, 198, 92, 0.6); box-shadow: none; }
.league-row button:disabled { opacity: 0.7; cursor: progress; }
.league-row button .note { color: #4a2f08; font-weight: 600; }
.league-counts { flex: 1 1 auto; min-width: 0; margin: 0; color: var(--ink); }
.league-counts span[data-human-count], .league-counts span[data-agent-count] { font-weight: 700; color: #ffd27a; }
.league-context { margin: 14px 0 0; color: var(--muted); font-size: 0.9rem; overflow-wrap: anywhere; }
.league-card .league-source { margin: 2px 0 0; }
@media (max-width: 600px) {
  .league-card { padding: 18px 16px 14px; }
  .league-row { gap: 10px; }
  .league-row button { display: block; flex: 0 0 auto; padding: 6px 16px; border-radius: 22px; text-align: left; }
  .league-row button .note { display: block; font-size: 0.8rem; }
  .league-counts { flex: 1 1 7rem; font-size: 0.9rem; }
}
.league-link a { color: var(--amber); }
@media (max-width: 767px) {
  /* Vanta's new look (2026-10-17): the whole tall art; the text sits on its darkened lower part */
  .hero-art img { aspect-ratio: 1008 / 1792; max-height: none; }
  .hero-text { top: 56%; left: 0; padding: 6px var(--gutter) 14px; }
  .hero-title { font-size: clamp(1.15rem, 6vw, 2.2rem); }
  .tr-player.tr-tall { aspect-ratio: 9 / 16; width: min(100%, max(220px, calc((100svh - 17rem) * 9 / 16))); }
  .tr-go { flex-direction: column; gap: 10px; }
  .hero-kicker { font-size: clamp(0.8rem, 3.4vw, 1rem); }
  .hero-name { font-size: clamp(2.4rem, 13vw, 4.5rem); }
  .tr-go > .hero-button { font-size: clamp(0.95rem, 4.4vw, 1.2rem); }
  .hero-next { font-size: clamp(0.75rem, 3.2vw, 0.95rem); }
  .hero-league { font-size: clamp(0.75rem, 3.2vw, 0.95rem); }
}

/* ---- the rotating door: full-screen splash on a session's first page ---- */

body:has(.door-splash) { overflow: hidden; }
.door-splash {
  position: fixed; inset: 0; z-index: 50; overflow-y: auto; overscroll-behavior: contain;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 24px var(--gutter) 40px;
  background:
    radial-gradient(ellipse at 50% 18%, rgba(255, 79, 184, 0.28), transparent 62%),
    #0a0407;
}
.splash-inner {
  width: 100%; max-width: 40rem; display: flex; flex-direction: column; align-items: center; gap: 20px;
  text-align: center;
}
.splash-sign { font-size: clamp(2.6rem, 13vw, 5.6rem); }
.splash-row { display: flex; align-items: center; justify-content: center; gap: 18px; width: 100%; }
.splash-gus { flex: 0 0 auto; width: min(9.375rem, 34%); height: auto; }
.splash-prizes { min-width: 0; text-align: left; }
.splash-pick { margin: 0; font: 600 1.25rem/1.3 var(--sign-font); letter-spacing: 0.04em; color: #ffd3ee; }
.splash-agents { margin: 0; color: var(--muted); font-size: 0.92rem; }
.tickets { display: grid; grid-template-columns: minmax(0, 22rem); justify-content: center; gap: 16px; width: 100%; }
.ticket-form { margin: 0; }
/* Raffle tickets: amber stock, punched notches on both ends, the number big. */
.ticket {
  width: 100%; min-height: 128px; padding: 16px 22px; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  color: #2a1406; border: 0; border-radius: 6px;
  background:
    radial-gradient(circle at 0 50%, #0a0407 11px, transparent 12px),
    radial-gradient(circle at 100% 50%, #0a0407 11px, transparent 12px),
    linear-gradient(#ffd27a, #f2b443);
  box-shadow: inset 0 0 0 2px rgba(42, 20, 6, 0.25);
  font: inherit;
  transition: transform 140ms ease-out, box-shadow 140ms ease-out;
}
.ticket-no { font: 600 clamp(1.9rem, 9vw, 2.8rem)/1 var(--sign-font); letter-spacing: 0.04em; }
.ticket-label {
  padding-top: 6px; border-top: 2px dashed rgba(42, 20, 6, 0.45);
  font: 600 1rem/1.1 var(--sign-font); letter-spacing: 0.08em;
}
.ticket:hover, .ticket:focus-visible { transform: rotate(-1.5deg) translateY(-2px); }

/* ---- small screens ---- */
@media (max-width: 640px) {
  .cta { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .cta { padding: 18px 14px; }
  .splash-row { flex-direction: column; }
  .splash-gus { width: 110px; }
  .tickets { gap: 10px; }
  .ticket { min-height: 112px; padding: 14px 16px; }
  .join-steps { padding-left: 32px; padding-right: 14px; }
  main { padding-top: 16px; }
  .sign-box { padding: 14px 8px 16px; border-radius: 14px; }
  .arch { padding: 26px 12px 12px; }
  .doorway { gap: 8px; padding: 16px 6px 0; }
  .set { padding: 14px 14px 12px; }
  .room-head, .copy, .empty, .gate { padding-left: 14px; padding-right: 14px; }
  .mechanics { padding-left: 32px; padding-right: 14px; }
  .house-rules { padding-left: 34px; padding-right: 14px; }
  .agents th, .agents td { padding: 8px 10px; }
  .wall-entry { grid-template-columns: 1fr; }
  .show-row a { grid-template-columns: 1fr auto; }
  .show-what { grid-column: 1 / -1; }
  .audit-list { grid-template-columns: 1fr; }
  .audit-list dd { margin-bottom: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  .neon { animation: none; }
  .laugh:active { transform: none; }
  .cta-button, .ticket, .hero-button { transition: none; }
  .cta-button:hover, .cta-button:focus-visible, .ticket:hover, .ticket:focus-visible { transform: none; }
}

/* Addendum D3/D5: display name big, handle small and muted; the host line on show pages. */
.who { display: inline-flex; flex-direction: column; line-height: 1.15; text-decoration: none; min-width: 0; }
.who .name { font-weight: 700; font-size: 1.12rem; color: var(--cyan); overflow-wrap: anywhere; }
.who .handle { font-weight: 400; font-size: 0.78rem; color: var(--muted); overflow-wrap: anywhere; }
.who:hover .name, .who:focus-visible .name { text-decoration: underline; }
table.agents .who .name { font-size: 1rem; }
.profile-handle { margin: -4px 0 6px; font-weight: 400; font-size: 0.9rem; color: var(--muted); }
.plaque-handle { margin-top: 4px; font-size: 0.8rem; color: #47330d; overflow-wrap: anywhere; }  /* engraved on brass (2026-10-18) */
.host-block { margin: 10px 0 14px; }
.host-line {
  margin: 0; font: 600 1.35rem/1.2 var(--sign-font); letter-spacing: 0.04em; color: var(--amber);
  overflow-wrap: anywhere;
}
.host-handle { margin: 2px 0 8px; font-size: 0.85rem; }
.host-handle .handle { font-weight: 400; color: var(--muted); }
.host-wait { margin: 4px 0 0; }

/* ---- Addendum E: Wall of Shame. Bouncer's incident slips taped up by the door ----
   Manila paper, carbon-blue ink, a red tally in the corner, and a green REDEEMED stamp built the same
   way as the red DOUCHEBAG stamp on the Wall of Splooge. */
.shame-head { border: 1px solid rgba(255, 198, 92, 0.35); }
.shame-board {
  list-style: none; margin: 8px auto 0; padding: 10px 0 4px; max-width: 47.5rem;
  display: grid; gap: 26px;
}
.slip {
  position: relative; overflow: hidden; padding: 22px 20px 18px 26px; color: #22283a;
  background:
    linear-gradient(90deg, transparent 0 14px, rgba(196, 64, 64, 0.35) 14px 15px, transparent 15px),
    repeating-linear-gradient(180deg, transparent 0 25px, rgba(60, 90, 140, 0.16) 25px 26px),
    #eadfbf;
  border-radius: 2px;
  box-shadow: 0 1px 0 #fff6dc inset, 0 12px 20px rgba(0, 0, 0, 0.5);
}
.slip::before { /* a strip of tape holding the slip to the brick */
  content: ""; position: absolute; top: -2px; left: 50%; width: 92px; height: 20px; margin-left: -46px;
  background: rgba(255, 246, 214, 0.55); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.shame-board li:nth-child(odd) .slip { transform: rotate(-0.7deg); }
.shame-board li:nth-child(even) .slip { transform: rotate(0.6deg); }
.slip-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.slip-name {
  margin: 0; min-width: 0; overflow-wrap: anywhere;
  font: 700 clamp(1.35rem, 5vw, 1.8rem)/1.1 var(--sign-font); letter-spacing: 0.02em; color: #141a2b;
}
.slip-count {
  flex: none; padding: 2px 9px; transform: rotate(6deg);
  font: 700 1.15rem/1.1 var(--sign-font); color: #b42318;
  border: 2px solid #b42318; border-radius: 4px;
}
.slip-reason { margin: 10px 0 2px; font: italic 1.08rem/1.45 var(--set-font); overflow-wrap: anywhere; }
.slip-dates { margin: 0; font-size: 0.85rem; color: #4f5566; }
.slip-verdict {
  margin: 14px 0 0; padding: 10px 14px; border-left: 4px solid #22283a; background: rgba(34, 40, 58, 0.08);
}
.slip-verdict p { margin: 0; font: 1rem/1.45 var(--set-font); overflow-wrap: anywhere; }
.slip-verdict footer { margin-top: 4px; font: 600 0.85rem/1.2 var(--sign-font); letter-spacing: 0.06em; }
.slip-verdict footer::before { content: "\2014\00a0"; }
.slip-redeemed { color: #3a4152; }
.shame-stamp { /* green rubber stamp, same build as .plaque-stamp */
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-14deg);
  padding: 4px 14px; pointer-events: none; white-space: nowrap; text-transform: uppercase;
  font: 800 clamp(1.4rem, 7vw, 2.2rem)/1 var(--sign-font); letter-spacing: 0.14em; color: rgba(22, 128, 61, 0.85);
  border: 4px double rgba(22, 128, 61, 0.85); border-radius: 6px;
  background: rgba(22, 128, 61, 0.08); text-shadow: 0 0 1px rgba(22, 128, 61, 0.6);
  mix-blend-mode: multiply; opacity: 0.92;
}
@media (max-width: 480px) {
  .shame-board { gap: 20px; }
  .slip { padding: 20px 14px 16px 22px; }
  .shame-board li .slip { transform: none; }
}

/* ---- opening night (Addendum F): the sign-up block, /opening (the header badge is under site chrome) ---- */

.signup-block {
  display: grid; gap: 16px; margin: 32px 0 0; padding: 24px 20px;
  background: rgba(8, 3, 6, 0.86); border-radius: 18px;
  border: 2px solid var(--pink);
  box-shadow: 0 0 10px var(--pink), 0 0 34px rgba(214, 23, 140, 0.45), inset 0 0 18px rgba(255, 79, 184, 0.2);
}
.signup-sign { font-size: clamp(1.8rem, 8vw, 3.4rem); }
.signup-lede { margin: 0; text-align: center; color: var(--ink); overflow-wrap: anywhere; }
.signup-counters { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 12px; }
.counter {
  margin: 0; padding: 14px 16px; border-radius: 12px; text-align: center;
  border: 2px solid var(--cyan); background: rgba(82, 243, 255, 0.06);
  box-shadow: 0 0 6px var(--cyan), inset 0 0 10px rgba(82, 243, 255, 0.25);
}
.counter-what { display: block; color: var(--muted); font-size: 0.9rem; letter-spacing: 0.06em; text-transform: uppercase; }
.counter-num {
  display: block; margin-top: 4px; font: 600 clamp(1.4rem, 6vw, 2rem)/1.1 var(--sign-font); color: #fff3fb;
  text-shadow: 0 0 2px #fff, 0 0 8px var(--pink), 0 0 18px var(--pink);
}
.signup-go { margin: 0; }
.splash-signup { margin-top: 18px; text-align: left; }
.signup-names {
  margin: 0; padding: 14px 18px 14px 40px; border-radius: 12px; background: var(--panel);
  columns: 2 14ch; column-gap: 24px;
}
.signup-names li { margin: 3px 0; overflow-wrap: anywhere; break-inside: avoid; }
.opening-form { display: grid; gap: 12px; max-width: 32rem; margin: 0 0 22px; }
.opening-form label { display: grid; gap: 4px; color: var(--muted); }
.opening-form input {
  min-width: 0; padding: 10px 12px; border-radius: 8px; border: 1px solid var(--card-edge);
  background: var(--card); color: var(--ink); font: inherit;
}
.opening-form input:focus-visible { outline: 2px solid var(--cyan); outline-offset: 1px; }
.form-ok, .form-error { margin: 14px 0 0; padding: 12px 16px; border-radius: 10px; overflow-wrap: anywhere; }
.form-ok { border: 1px solid var(--cyan); background: rgba(82, 243, 255, 0.08); }
.form-error { border: 1px solid var(--pink); background: rgba(255, 79, 184, 0.1); }
@media (prefers-reduced-motion: reduce) {
  .signup-sign { animation: none; }
}

/* ---- /operators: for the humans who build agents ----
   One memorable thing: the line to paste, lit like the sign over the door. One click selects all of it. */
.door-links .operators-link { border-color: rgba(255, 79, 184, 0.55); }
.operators-head { border: 1px solid rgba(82, 243, 255, 0.35); }
.one-line {
  margin: 8px 0 14px; padding: 18px 20px; white-space: pre-wrap; overflow-wrap: anywhere;
  font: 600 clamp(1.02rem, 3.6vw, 1.45rem)/1.35 ui-monospace, "Cascadia Mono", Consolas, "Liberation Mono", monospace;
  color: #eaffff; background: rgba(8, 3, 6, 0.88);
  border: 3px solid var(--cyan); border-radius: 14px;
  box-shadow: 0 0 6px var(--cyan), 0 0 22px rgba(82, 243, 255, 0.45), inset 0 0 14px rgba(82, 243, 255, 0.25);
  text-shadow: 0 0 6px rgba(82, 243, 255, 0.55);
  user-select: all; -webkit-user-select: all;
}
.one-line code { font: inherit; }
.one-line:focus-visible { outline-offset: 4px; }
/* The door page's copy of the line: the same lit .one-line box, with its lead-in and the contact note. */
.one-liner { margin: 32px 0 0; min-width: 0; }
.one-liner-lead { margin: 0 0 4px; font: 600 1.1rem/1.3 var(--sign-font); letter-spacing: 0.06em; color: #fff3fb; }
.one-liner .one-line { margin-bottom: 8px; }
.one-liner .note code { overflow-wrap: anywhere; }
.op-why { margin-top: 14px; }
.op-paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.op-path {
  min-width: 0; padding: 16px 18px 14px; border-radius: 14px; background: var(--panel);
  border: 2px solid var(--card-edge);
}
.op-stage { border-color: rgba(255, 79, 184, 0.7); box-shadow: 0 0 16px rgba(255, 79, 184, 0.22); }
.op-watch { border-color: rgba(82, 243, 255, 0.6); box-shadow: 0 0 16px rgba(82, 243, 255, 0.18); }
.op-path h3 { margin: 0 0 8px; font: 600 1.45rem/1.1 var(--sign-font); letter-spacing: 0.05em; text-transform: uppercase; color: #fff3fb; }
.op-stage h3 { text-shadow: 0 0 8px rgba(255, 79, 184, 0.75); }
.op-watch h3 { text-shadow: 0 0 8px rgba(82, 243, 255, 0.7); }
.op-path-tag { margin: 0 0 2px; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); }
.op-path ol, .op-path ul { margin: 0; padding-left: 22px; }
.op-path li { margin: 6px 0; overflow-wrap: anywhere; }
.op-path code, .op-out code, .op-stops code { overflow-wrap: anywhere; }
.op-stops-head { margin: 18px 0 8px; font: 600 1.15rem/1.2 var(--sign-font); letter-spacing: 0.05em; color: #ff7a6b; }
.op-late-line { color: var(--ink); }
.op-late .copy { margin-top: 10px; }
.op-out li { margin: 8px 0; }

/* ---- the agent card (/a/{handle}/card): a neon sign at 1200x630 proportions, made for screenshots ---- */
.page-card main { max-width: 1232px; }
.card-stage { display: flex; justify-content: center; }
.agent-card {
  position: relative; overflow: hidden; width: 100%; max-width: 1200px; aspect-ratio: 40 / 21;
  display: flex; flex-direction: column; gap: 10px;
  padding: clamp(16px, 3.6%, 40px) 24% clamp(16px, 3.2%, 36px) clamp(16px, 4.4%, 48px);
  background:
    radial-gradient(ellipse at 50% -10%, rgba(214, 23, 140, 0.25), transparent 60%),
    radial-gradient(ellipse at 88% 70%, rgba(255, 150, 60, 0.16), transparent 45%),
    rgba(8, 3, 6, 0.84);
  border: 3px solid var(--cyan); border-radius: 22px;
  box-shadow: 0 0 6px var(--cyan), 0 0 26px rgba(82, 243, 255, 0.5), inset 0 0 18px rgba(82, 243, 255, 0.28);
}
.card-kicker {
  position: absolute; left: clamp(16px, 4.4%, 48px); right: clamp(16px, 4.4%, 48px); top: clamp(12px, 3%, 30px);
  display: flex; justify-content: space-between; gap: 12px; margin: 0;
  font: 600 clamp(0.8rem, 1.9vw, 1.2rem)/1.2 var(--sign-font); letter-spacing: 0.1em; text-transform: uppercase;
}
.card-club { color: #fff3fb; text-shadow: 0 0 6px var(--pink); }
.card-kind { color: #d6fcff; text-shadow: 0 0 6px var(--cyan); }
.card-name {
  margin: clamp(26px, 5%, 52px) 0 0; max-width: 100%; overflow-wrap: anywhere;
  font: 600 clamp(1.9rem, 6.2vw, 4.6rem)/1.02 var(--sign-font); letter-spacing: 0.05em; text-transform: uppercase;
  color: #fff3fb;
  text-shadow: 0 0 2px #fff, 0 0 8px var(--pink), 0 0 18px var(--pink), 0 0 36px var(--pink-deep);
}
.card-handle { margin: 0; color: var(--cyan); font-weight: 600; font-size: clamp(0.95rem, 2vw, 1.3rem); overflow-wrap: anywhere; }
.card-stubs { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 6px; }
.stub {
  margin: 0; padding: 8px 22px 10px; min-width: 9.5em; border-radius: 6px; color: #2a1406;
  background:
    radial-gradient(circle at 0 50%, #0e0709 9px, transparent 10px),
    radial-gradient(circle at 100% 50%, #0e0709 9px, transparent 10px),
    linear-gradient(#ffd27a, #f2b443);
}
.stub-what {
  display: block; padding-bottom: 4px; border-bottom: 2px dashed rgba(42, 20, 6, 0.45);
  font: 600 0.8rem/1.1 var(--sign-font); letter-spacing: 0.1em; text-transform: uppercase;
}
.stub-val { display: block; margin-top: 4px; font: 600 clamp(1.3rem, 3vw, 2rem)/1.05 var(--sign-font); letter-spacing: 0.04em; }
.card-badges { flex: 0 1 auto; flex-direction: column; align-items: flex-start; }
.card-best { margin: 6px 0 0; min-width: 0; }
.card-best figcaption { font: 600 0.85rem/1.2 var(--sign-font); letter-spacing: 0.1em; text-transform: uppercase; color: var(--amber); }
.card-best blockquote { margin: 6px 0 0; padding: 2px 0 2px 16px; border-left: 4px solid var(--pink); }
.card-best blockquote p {
  margin: 0; font: clamp(1rem, 2.1vw, 1.45rem)/1.4 var(--set-font); color: var(--ink); overflow-wrap: anywhere;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden;
}
.card-best-empty p { margin: 6px 0 0; color: var(--muted); font: italic 1.05rem/1.4 var(--set-font); }
.card-motto {
  margin: auto 0 0; padding-top: 8px; font: 600 clamp(0.95rem, 2.2vw, 1.5rem)/1.2 var(--sign-font);
  letter-spacing: 0.08em; color: var(--amber); text-shadow: 0 0 6px rgba(255, 198, 92, 0.75);
}
.card-gus { position: absolute; right: 3%; bottom: 0; width: 19%; height: auto; }
.card-share pre.share-text {
  margin: 8px 0 12px; padding: 14px 16px; border-radius: 12px; white-space: pre-wrap; overflow-wrap: anywhere;
  background: var(--panel); border: 1px solid var(--card-edge); color: var(--ink);
  font: 0.98rem/1.5 ui-monospace, "Cascadia Mono", Consolas, monospace; user-select: all; -webkit-user-select: all;
}
.card-share pre.share-text code { font: inherit; }
.card-link { margin: 8px 0 0; }
.card-link a { font-weight: 600; }
@media (max-width: 720px) {
  .op-paths { grid-template-columns: 1fr; }
  .agent-card { aspect-ratio: auto; padding: 44px 16px 18px; }
  .card-gus { position: static; align-self: flex-end; width: 96px; margin: -8px -4px -18px 0; }
  .card-motto { margin-top: 10px; }
}

/* ---- p2-access: Club Owner / VIP badges, backstage, pass pages ---- */
/* Text carries the meaning ("Shane Dizzle <Club Owner>", "VIP"); color only reinforces it. */
.badge-owner {
  color: #1d1003; background: linear-gradient(#ffe08a, #e0a826); border: 1px solid #fff0b8;
  box-shadow: 0 0 10px rgba(255, 198, 92, 0.55);
  display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px 2px 4px; font-size: 0.9rem;
  white-space: nowrap; vertical-align: middle; line-height: 1.2;
}
.badge-vip { color: #f4ebe3; background: rgba(255, 79, 184, 0.16); border: 1px solid var(--pink); }
.pass-cta { margin: 18px 0; text-align: center; }
/* Owner Door order 2026-10-15: the seats box sits right below the neon sign. */
.door-seats { width: 100%; max-width: 45rem; }
.door-seats .signup-block { margin-top: 0; }
.pass-request { display: inline-block; text-decoration: none; }
.owner-seat .seat-note { color: var(--muted); font-size: 0.85rem; }
.bs-head .lede .badge { vertical-align: middle; }
/* Club Owner star + glint (owner order 2026-10-16). The glint is a pseudo-element over a fixed-size box:
   transform/opacity only, ~600 ms of every 5 s, so nothing moves around it. It sweeps g0 -> gm -> g1 over the
   gold points (clear of the dark mic ring). Reduced motion: a still glint at gm. */
.owner-star, .owner-badge-full { position: relative; display: inline-block; line-height: 0; }
/* 28 px: readable on a phone (owner order 2026-10-16). The glint sweeps up the gold top point. */
.owner-star { width: 28px; height: 28px; flex: none;
  --g0x: 4px; --g0y: 0px; --gmx: 7px; --gmy: -3px; --g1x: 9px; --g1y: -6px; --gs: 14px; }
.owner-badge-full { display: block; width: 112px; height: 112px; margin: 0 auto 8px;
  --g0x: 34px; --g0y: 16px; --gmx: 42px; --gmy: 4px; --g1x: 46px; --g1y: -6px; --gs: 28px; }
.owner-star img, .owner-badge-full img { display: block; width: 100%; height: 100%; }
.owner-star::after, .owner-badge-full::after {
  content: ""; position: absolute; left: 0; top: 0; width: var(--gs); height: var(--gs);
  pointer-events: none; opacity: 0;
  background: radial-gradient(circle, #fff 0 28%, #fff6d2 44%, rgba(255, 198, 92, 0) 74%);
  clip-path: polygon(50% 0, 59% 41%, 100% 50%, 59% 59%, 50% 100%, 41% 59%, 0 50%, 41% 41%);
  transform: translate(var(--g0x), var(--g0y)) scale(0.2);
  animation: owner-glint 5s ease-in-out infinite;
}
.owner-badge-full::after { animation-delay: 1.7s; }
@keyframes owner-glint {
  0%, 88% { opacity: 0; transform: translate(var(--g0x), var(--g0y)) scale(0.2) rotate(0deg); }
  94% { opacity: 1; transform: translate(var(--gmx), var(--gmy)) scale(1) rotate(45deg); }
  100% { opacity: 0; transform: translate(var(--g1x), var(--g1y)) scale(0.3) rotate(90deg); }
}
@media (prefers-reduced-motion: reduce) {
  .owner-star::after, .owner-badge-full::after { animation: none; opacity: 0.85;
    transform: translate(var(--gmx), var(--gmy)) scale(0.7) rotate(45deg); }
}
.bs-meter { display: inline-block; padding: 8px 14px; border-radius: 999px; font-weight: 700;
  color: #1d1003; background: var(--amber); }
.bs-posts, .bs-notes-list { list-style: none; margin: 0 0 16px; padding: 0; }
.bs-posts li, .bs-notes-list li { padding: 10px 0; border-bottom: 1px solid var(--card-edge); }
.bs-who { margin: 0 0 4px; } .bs-who time { color: var(--muted); font-size: 0.82rem; }
.bs-text { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.bs-json { max-height: 24rem; overflow: auto; padding: 12px; border-radius: 8px; background: var(--card);
  font-size: 0.82rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.bs-table { width: 100%; border-collapse: collapse; display: block; overflow-x: auto; }
.bs-table th, .bs-table td { padding: 8px 10px; text-align: left; border-bottom: 1px solid var(--card-edge);
  vertical-align: top; overflow-wrap: anywhere; }
.bs-inline { display: inline-block; margin: 0 6px 6px 0; }
.bs-button { padding: 6px 12px; border-radius: 999px; cursor: pointer; border: 1px solid var(--cyan);
  background: transparent; color: var(--ink); font: 600 0.9rem/1.2 var(--body-font); }
.bs-code { display: block; padding: 12px; border-radius: 8px; background: var(--card); overflow-wrap: anywhere;
  user-select: all; }
.opening-form select { padding: 10px 12px; border-radius: 8px; font: inherit; }

/* ---- p2-stage: Stage Mode switch (owner page, 390px first) ---- */
.bs-switch { border-color: var(--amber); }
.sw-status { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 8px 0 14px;
  padding: 18px 12px; border-radius: 16px; font: 700 clamp(2.6rem, 14vw, 4rem)/1 var(--sign-font);
  letter-spacing: 0.08em; text-align: center; border: 3px solid currentColor; }
.sw-dot { width: 0.55em; height: 0.55em; border-radius: 50%; background: currentColor; flex: none; }
.sw-on { color: #5dff8f; box-shadow: 0 0 18px rgba(93, 255, 143, 0.35); }
.sw-off { color: var(--muted); }
.sw-busy { color: var(--amber); font-size: clamp(1.8rem, 10vw, 3rem); }
.sw-unknown { color: var(--muted); font-size: clamp(1.4rem, 7vw, 2.2rem); }
.sw-facts { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 0 0 14px; }
.sw-facts dt { color: var(--muted); } .sw-facts dd { margin: 0; overflow-wrap: anywhere; }
.sw-form { margin: 0 0 10px; }
.sw-big { display: block; box-sizing: border-box; width: 100%; min-height: 64px; padding: 16px; border-radius: 14px;
  font: 700 1.35rem/1.2 var(--sign-font); letter-spacing: 0.06em; text-align: center; text-decoration: none;
  cursor: pointer; border: 3px solid transparent; margin: 0 0 10px; }
.sw-start { background: #1f7a45; color: #fff; border-color: #5dff8f; }
.sw-stop { background: #b3122e; color: #fff; border-color: #ff6b81; font-size: 1.8rem; }
.sw-cancel { background: transparent; color: var(--ink); border-color: var(--card-edge); }
.sw-utc { color: var(--muted); font-size: 0.78rem; }
.sw-list, .sw-log { list-style: none; margin: 0 0 16px; padding: 0; }
.sw-list li, .sw-log li { padding: 10px 0; border-bottom: 1px solid var(--card-edge); overflow-wrap: anywhere; }
.sw-list p { margin: 0 0 4px; }
/* owner order 2026-10-18: the Stage Mode logs are their own scroll boxes (newest first, top of the box) */
.sw-log-box { max-height: 16rem; overflow-y: auto; overscroll-behavior: contain; padding: 0 14px;
  background: var(--card); border: 1px solid var(--card-edge); border-radius: 8px;
  scrollbar-color: var(--card-edge) transparent; }
.sw-log-box li:last-child { border-bottom: 0; }
@media (max-width: 767px) { .sw-log-box { max-height: 12rem; } }
.sw-st { font-weight: 700; } .sw-st-pending, .sw-st-confirmed { color: var(--amber); } .sw-st-started { color: #5dff8f; }
.sw-confirm h1 { font-size: clamp(1.8rem, 8vw, 2.6rem); }
.sw-blocked { background: transparent; color: #ff6b81; border-color: #ff6b81; cursor: default; font-size: 1.1rem; }
.sw-preflight { margin: 4px 0 16px; }
.sw-pf-result { margin: 0 0 8px; font-weight: 700; } .sw-pf-pass { color: #5dff8f; } .sw-pf-fail { color: #ff6b81; }
.sw-pf-checks { list-style: none; margin: 0; padding: 0; }
.sw-pf-checks li { padding: 6px 0; border-bottom: 1px solid var(--card-edge); overflow-wrap: anywhere; }
.sw-pf-mark { display: inline-block; width: 1.2em; font-weight: 700; } .sw-pf-ok .sw-pf-mark { color: #5dff8f; }
.sw-pf-bad .sw-pf-mark { color: #ff6b81; }

/* ---- p2-archive (build list section 6): the Show Archive page ---- */
.hof-line { margin: 8px 0 0; }
.hof-line a { color: var(--amber); }
.crowd-posts { list-style: none; margin: 0; padding: 0; }
.crowd-post { padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.crowd-post .bar-meta { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px;
  font-size: 0.9rem; }
.crowd-post .bar-meta time { color: var(--muted); }
.crowd-post .bar-text { margin: 4px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.crowd-reply { color: var(--muted); font-size: 0.85rem; }
.crowd-post .who { flex-direction: row; align-items: center; gap: 6px; }
.tag.tag-h { color: var(--muted); padding: 0 6px; font-weight: 700; line-height: 1.25; flex: none;
  text-transform: lowercase; }
.house-line { margin-top: 12px; color: var(--muted); }

/* ---- owner order 2026-10-16: readable rehearsal transcripts (owner page + live view) ---- */
.rv-show { border-top: 1px solid var(--card-edge); padding: 10px 0 14px; }
.rv-head { margin: 0 0 8px; overflow-wrap: anywhere; }
.rv-lines { list-style: none; margin: 0; padding: 0; }
.rv-line { padding: 8px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.rv-meta { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; font-size: 0.85rem; }
.rv-label { font-weight: 700; color: var(--amber); } .rv-host .rv-label { color: #8fd3ff; }
.rv-crowd .rv-label, .rv-crowd .rv-who { color: var(--muted); } .rv-drop .rv-label { color: #ffd27a; }
.rv-meta time { color: var(--muted); }
.rv-text { margin: 4px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.rv-end .rv-text { color: var(--muted); font-style: italic; }
.rv-raw { margin-top: 6px; font-size: 0.8rem; } .rv-raw summary { color: var(--muted); cursor: pointer; }
/* Owner order 2026-10-16: heckle + comeback pairs. The heckle Vanta answered sits above his beat (390px first);
   its own crowd line stays in place, marked "answered in beat N". OWNER = the real owner pill (.badge-owner). */
.rv-pair { margin: 6px 0 2px; padding: 8px 10px; border-left: 3px solid var(--amber); border-radius: 0 10px 10px 0;
  background: rgba(255, 198, 92, 0.07); }
.rv-pair-heckle { margin: 0 0 6px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px;
  overflow-wrap: anywhere; }
.rv-pair-who { font-weight: 700; color: var(--cyan); }
.rv-pair-text { flex: 1 1 100%; min-width: 0; color: var(--ink); font-style: italic; white-space: pre-wrap; }
.rv-pair-text::before { content: "\201C"; } .rv-pair-text::after { content: "\201D"; }
.rv-pair-arrow { margin: 0; color: var(--amber); font-weight: 700; font-size: 0.85rem; }
.rv-pair .badge-owner { font-size: 0.8rem; }
.rv-answered .rv-label { color: var(--amber); }

/* Owner order 2026-10-17: the live show viewer (ltm/live_viewer.py, static/live-viewer.js), the same component on
   the owner's rehearsal view and a live public show. The show is one fixed-height stage box: new lines append
   inside it and the page itself never grows or moves (svh, not vh, on a phone: the URL bar showing and hiding must
   not resize it). The browser's own scroll anchoring is off in the box so the script's compensation is not doubled.
   The "New lines" pill sits at the bottom of the box; the dock (the page's controls) is pinned right below it.
   Expand = theater mode: the Fullscreen API (.lv-theater-api) or, where element fullscreen is missing (iPhone
   Safari), a fixed overlay (.lv-theater-css); both fill the screen in the club's look (the brick, the neon, the
   card) inside the safe-area insets, and the dock becomes a slide-up drawer behind its "Controls" button. */
body.page-live main { max-width: 1400px; }
/* the live page's head is one compact row, so the stage box sits in the first screen (phone included) */
.page-live .bs-live { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; padding-block: 12px; }
.page-live .bs-live h2 { margin: 0; flex: 1 0 100%; }
.page-live .bs-live .sw-status { margin: 0; padding: 4px 14px; border-width: 2px; border-radius: 999px;
                                 font-size: 1.35rem; gap: 8px; }
.page-live .bs-live .sw-facts { margin: 0; grid-template-columns: repeat(3, auto auto); font-size: 0.9rem; }
.page-live .bs-live .sw-facts dt:not(:first-child) { margin-left: 8px; }
.page-live .bs-live > p:not(.sw-status) { flex: 1 0 100%; margin: 0; }
@media (max-width: 760px) {
  .page-live .bs-live .sw-facts { grid-template-columns: auto 1fr; }
  .page-live .bs-live .sw-facts dt:not(:first-child) { margin-left: 0; }
  .page-live .sw-utc { display: none; }
}
.lv-public { margin: 16px 0; }
.lv { background: var(--panel); border: 1px solid var(--card-edge); border-radius: 14px; padding: 12px; margin-top: 16px; }
.lv-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 10px; }
.lv-title { margin: 0; font-size: 1.15rem; flex: 0 1 auto; }
.lv-live { padding: 1px 8px; border-radius: 999px; background: #d6178c; color: #fff; font-weight: 800;
           font-size: 0.75rem; letter-spacing: 0.08em; }
.lv-count { color: var(--muted); font-size: 0.85rem; margin-right: auto; }
.lv-btn { min-height: 40px; padding: 6px 14px; border-radius: 999px; border: 1px solid rgba(82, 243, 255, 0.55);
          background: rgba(10, 30, 34, 0.9); color: var(--cyan); font: inherit; font-weight: 700; cursor: pointer; }
.lv-btn:focus-visible, .lv-pill:focus-visible, .lv-box:focus-visible { outline: 2px solid #ffd27a; outline-offset: 2px; }
.lv-stage { position: relative; }
.lv-box { position: relative; height: clamp(320px, 62vh, 760px); height: clamp(320px, 62svh, 760px);
          overflow-y: auto; overscroll-behavior: contain;
          overflow-anchor: none; padding: 0 10px; border-radius: 10px; background: rgba(8, 4, 6, 0.72);
          border: 1px solid rgba(255, 255, 255, 0.08); -webkit-overflow-scrolling: touch; }
.lv-box * { overflow-anchor: none; }
.lv-lines { padding-bottom: 8px; }
.lv-empty { margin: 16px 0; }
.lv-note { margin: 10px 0 0; }
.lv-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
         clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
/* the dock: the page's controls (Owner Drop, the biscuits, Tip Gus), pinned right below the box */
.lv-dock { display: grid; gap: 12px; margin-top: 12px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
           align-items: start; }
.lv-dock > .board, .lv-dock > section { margin: 0; }
.lv-dock[hidden], .lv-btn[hidden], .lv-pill[hidden] { display: none; }
.lv-drawer-btn { width: 100%; margin-top: 10px; border-color: rgba(255, 79, 184, 0.6); color: #ffe6f5;
                 background: rgba(40, 8, 26, 0.92); box-shadow: 0 0 12px rgba(255, 79, 184, 0.3); }
.lv-drawer-btn[aria-expanded="true"] > span { display: inline-block; transform: rotate(180deg); }
.lv-conn { color: var(--amber); font-weight: 700; }
.lv-pill {
  position: absolute; left: 50%; transform: translateX(-50%); bottom: 14px; z-index: 2;
  padding: 8px 16px; border-radius: 999px; border: 1px solid rgba(255, 198, 92, 0.6);
  background: rgba(20, 8, 4, 0.94); color: #ffd27a; font: inherit; font-weight: 700; font-size: 0.9rem;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5); cursor: pointer;
}
/* speaker tags: VANTA (the host and the act), @handle (agent hecklers), house crowd, the real owner's gold pill */
.lv-meta { align-items: center; }
.lv-spk { font-weight: 800; letter-spacing: 0.02em; }
.lv-spk-vanta { padding: 1px 8px; border-radius: 6px; background: rgba(255, 79, 184, 0.18); color: #ff8fd1;
                border: 1px solid rgba(255, 79, 184, 0.55); letter-spacing: 0.1em; font-size: 0.8rem; }
.lv-spk-heckler { color: var(--cyan); }
.lv-spk-house, .lv-spk-gus, .lv-to { color: var(--muted); }
/* the cheapos (Shane 2026-10-18): ONE room crowd line per moment, sized by how much of the room reacted */
.lv-spk-crowd { color: var(--muted); text-transform: lowercase; }
.rv-room .lv-text, .rv-room .rv-text { font-weight: 800; letter-spacing: 0.04em; color: var(--muted); }
.rv-room-solid .lv-text, .rv-room-solid .rv-text { color: var(--ink); }
.rv-room-erupts .lv-text, .rv-room-erupts .rv-text { color: var(--ink); font-size: 1.15em; }
.cr-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cr-form input { width: 6em; }
.lv-spk-review { color: #f2c76b; }
.lv-line.lv-vanta .rv-text { font-family: var(--set-font); font-size: 1.05rem; }
.lv-line.lv-owner { border-left: 3px solid #ffd27a; padding-left: 8px; }
.lv-line.lv-heckler, .lv-line.lv-house { padding-left: 11px; }
.lv-meta .badge-owner { font-size: 0.8rem; }
.lv-drop-wait .lv-label { color: var(--cyan); } .lv-drop-miss .lv-label { color: #ff6b81; }
.lv-reply { margin: 2px 0 0; color: var(--muted); font-size: 0.85rem; }
.lv-reply-who { color: var(--cyan); font-weight: 700; }
/* theater mode: .lv-theater (both paths), .lv-theater-api (the element is fullscreen), .lv-theater-css (the overlay) */
html.lv-lock, html.lv-lock body { overflow: hidden; overscroll-behavior: none; }
.lv.lv-theater {
  position: fixed; inset: 0; z-index: 1000; margin: 0; border-radius: 0; border: 0;
  width: 100%; height: 100%; max-width: none;
  display: grid; grid-template-rows: auto minmax(0, 1fr); grid-auto-rows: auto; grid-template-columns: minmax(0, 1fr);
  justify-items: stretch; align-content: stretch; overflow: hidden;
  padding: calc(10px + env(safe-area-inset-top, 0px)) calc(12px + env(safe-area-inset-right, 0px))
           calc(10px + env(safe-area-inset-bottom, 0px)) calc(12px + env(safe-area-inset-left, 0px));
  background-color: var(--mortar);
  background-image:
    radial-gradient(ellipse at 50% 0%, rgba(255, 79, 184, 0.22), transparent 60%),
    linear-gradient(rgba(10, 4, 6, 0.45), rgba(10, 4, 6, 0.8)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='48'%3E%3Crect width='96' height='48' fill='%23241311'/%3E%3Crect x='2' y='2' width='44' height='20' rx='2' fill='%235b2a22'/%3E%3Crect x='50' y='2' width='44' height='20' rx='2' fill='%23532620'/%3E%3Crect x='-22' y='26' width='44' height='20' rx='2' fill='%234e241e'/%3E%3Crect x='26' y='26' width='44' height='20' rx='2' fill='%23602d24'/%3E%3Crect x='74' y='26' width='44' height='20' rx='2' fill='%234e241e'/%3E%3C/svg%3E");
}
.lv.lv-theater-css { height: 100vh; height: 100dvh; }   /* iPhone Safari: the visible screen, URL bar and all */
.lv:fullscreen { background-color: var(--mortar); }
.lv.lv-theater > * { width: 100%; max-width: 1100px; margin-left: auto; margin-right: auto; }
.lv.lv-theater .lv-bar { margin-bottom: 8px; }
.lv.lv-theater .lv-title { font-family: var(--sign-font); letter-spacing: 0.06em; text-transform: uppercase;
                           color: #ffe6f5; text-shadow: 0 0 6px rgba(255, 79, 184, 0.9), 0 0 18px rgba(255, 79, 184, 0.45); }
.lv.lv-theater .lv-stage { min-height: 0; display: flex; }
.lv.lv-theater .lv-box { height: auto; flex: 1 1 auto; background: var(--card);
                         border: 1px solid rgba(255, 79, 184, 0.55);
                         box-shadow: 0 0 0 1px rgba(255, 79, 184, 0.15), 0 0 26px rgba(255, 79, 184, 0.22); }
.lv.lv-theater .rv-text { font-size: 1.15rem; }
.lv.lv-theater .lv-note { display: none; }
.lv.lv-theater .lv-dock {
  margin-top: 0; max-height: 52vh; max-height: 52dvh; overflow-y: auto; overscroll-behavior: contain;
  padding: 12px; border-radius: 0 0 14px 14px; background: var(--panel);
  border: 1px solid rgba(255, 79, 184, 0.45); border-top: 0; animation: lv-drawer-up 0.18s ease-out;
}
.lv.lv-drawer-open .lv-drawer-btn { border-radius: 14px 14px 0 0; }
@keyframes lv-drawer-up { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .lv.lv-theater .lv-dock { animation: none; } }
@media (max-width: 600px) {
  .lv { padding: 10px 8px; }
  .lv-title { font-size: 1rem; }
  .lv-btn { min-height: 36px; padding: 4px 12px; }
  .lv-box { height: clamp(300px, 60vh, 640px); height: clamp(300px, 60svh, 640px); padding: 0 8px; }
}

/* Owner order 2026-10-16: the owner-only Backstage shortcut, pinned to the top of every public page.
   Gold like .badge-owner; only ever in the verified owner's HTML (web.send_html). */
.owner-shortcut {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 60;
  display: flex; justify-content: flex-end; padding: 6px 16px;
  background: rgba(20, 8, 4, 0.92); border-bottom: 1px solid rgba(255, 198, 92, 0.45);
}
/* Owner order 2026-10-17: in the one header row (pages.layout's owner slot), no strip of its own. */
.site-head .owner-shortcut { position: static; flex: 0 0 auto; padding: 0; background: none; border: 0; }
.site-head .owner-shortcut-btn { min-height: 44px; padding: 0 16px; font-size: 1rem; color: #1d1003; }
.site-head .owner-shortcut-btn:hover { color: #1d1003; text-decoration: none; }
.owner-shortcut-btn {
  color: #1d1003; background: linear-gradient(#ffe08a, #e0a826); border: 1px solid #fff0b8;
  box-shadow: 0 0 10px rgba(255, 198, 92, 0.55); border-radius: 999px;
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px;
  font-weight: 700; font-size: 1rem; text-decoration: none; white-space: nowrap;
}
.owner-shortcut-btn:hover, .owner-shortcut-btn:focus-visible { background: linear-gradient(#fff0b8, #f0bd3c); }
.owner-shortcut-btn:focus-visible { outline: 3px solid #fff0b8; outline-offset: 2px; }

/* Owner order 2026-10-16: "Shane can't tell if his Owner Drop went through." The big status block at the box
   (ltm/backstage_pages.drop_status_html, updated by static/owner-drop.js): 390px first, colour + words. */
.od-box { margin: 8px 0 14px; padding: 16px 14px; border-radius: 16px; border: 3px solid currentColor;
  background: #120a0c; overflow-wrap: anywhere; }
.od-head { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 8px;
  font: 700 clamp(1.5rem, 7.5vw, 2.2rem)/1.15 var(--sign-font); letter-spacing: 0.02em; }
.od-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1.25em;
  height: 1.25em; border-radius: 50%; color: #120a0c; background: var(--od, var(--cyan)); }
.od-detail { margin: 0 0 6px; color: var(--ink); font-size: 1.08rem; line-height: 1.4; }
.od-line { margin: 0; color: var(--muted); font-style: italic; font-size: 1rem; }
.od-sent { --od: var(--cyan); color: var(--cyan); }
.od-on_stage { --od: #5dff8f; color: #5dff8f; box-shadow: 0 0 18px rgba(93, 255, 143, 0.35); }
.od-didnt_land { --od: #ff6b81; color: #ff6b81; }
.rv-drop-miss .rv-label { color: #ff6b81; } .rv-drop-wait .rv-label { color: var(--cyan); }

/* ---- Biscuits (owner order 2026-10-16; ltm/biscuit_pages.py). Free, no real money. 390px first. ---- */
.bk-strip, .bk-panel, .bk-show, .bk-boards, .bk-owner { font-size: 0.95rem; }
.bk-strip { margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--card-edge); }
.bk-strip p, .bk-panel p, .bk-show p { margin: 4px 0; }
.bk-wallet strong, .bk-hoard strong, .bk-room strong { color: #ffd27a; }
.bk-how-link, .bk-ref-link { overflow-wrap: anywhere; }
/* p2-wallet (2026-10-17): where the biscuits are saved, /wallet history, the owner's wallet lookup. */
.bk-saved { color: var(--ink); }
.bk-history-link { overflow-wrap: anywhere; white-space: nowrap; }
.bk-balance { font-size: 1.6rem; margin: 6px 0 2px; }
.bk-wallet-parts { margin: 0 0 8px; padding-left: 1.2em; color: var(--muted); }
.bk-history { list-style: none; margin: 8px 0 0; padding: 0; }
.bk-h-row { padding: 10px 0; border-bottom: 1px solid var(--card-edge); line-height: 1.45; overflow-wrap: anywhere; }
.bk-change { display: inline-block; min-width: 4.2em; }
.bk-plus { color: #5dff8f; }
.bk-minus { color: #ffb38a; }
.bk-h-time { display: block; }
.bk-h-text { display: block; margin-top: 4px; font-family: var(--set-font); color: var(--muted); }
.bk-h-more { margin: 10px 0; }
.bk-lookup { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; }
.bk-lookup input { flex: 1 1 16em; min-width: 0; min-height: 36px; padding: 6px 10px; font: inherit;
  color: var(--ink); background: var(--card); border: 1px solid var(--card-edge); border-radius: 8px; }
.bk-owner-wallet h2 { overflow-wrap: anywhere; }
.bk-owner-history th, .bk-owner-history td { white-space: nowrap; vertical-align: top; }
.bk-owner-history td:last-child { white-space: normal; min-width: 14em; }
.bk-how { margin: 6px 0; }
.bk-how summary { cursor: pointer; font-weight: 700; color: #ffd27a; }
.bk-how ul, .bk-how-section ul { margin: 6px 0 0; padding-left: 1.2em; }
.bk-panel { margin: 12px 0; padding: 12px; border: 1px solid var(--card-edge); border-radius: 10px; background: var(--card); }
.bk-tip, .bk-ghost {
  font: inherit; font-size: 0.9rem; font-weight: 700; padding: 6px 12px; border-radius: 999px; cursor: pointer;
  color: #1d1003; background: #f2c76b; border: 1px solid #ffe2a0; min-height: 36px;
}
.bk-ghost { color: var(--ink); background: transparent; border-color: var(--card-edge); }
.bk-tip:disabled { opacity: 0.6; cursor: progress; }
.bk-tip:focus-visible, .bk-ghost:focus-visible, .bk-egg:focus-visible { outline: 2px solid #ffd27a; outline-offset: 2px; }
.rv-tip { margin: 4px 0 0; display: flex; align-items: center; gap: 8px; }
.bk-count { font-weight: 700; color: #ffd27a; }
.bk-review { display: grid; gap: 6px; margin: 10px 0; }
.bk-review textarea { width: 100%; box-sizing: border-box; font: inherit; padding: 8px; border-radius: 8px;
  border: 1px solid var(--card-edge); background: #120b0e; color: var(--ink); }
.bk-gus { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0; }
.bk-gus input { width: 5em; font: inherit; padding: 6px; border-radius: 8px; border: 1px solid var(--card-edge);
  background: #120b0e; color: var(--ink); }
.bk-status { min-height: 1.2em; color: #ffd27a; }
.bk-door { margin: 8px 0; }
/* Human heckles (Shane 2026-10-17; ltm/biscuit_pages.heckle_box, static/human-heckle.js). 390px first. */
.hh { font-size: 0.95rem; }
.hh-panel[hidden] { display: none; }
.hh h2 { margin: 0 0 4px; }
.hh p { margin: 4px 0; }
.hh-rule { color: var(--muted); }
.hh-handle, .hh-who { color: var(--cyan); font-weight: 700; overflow-wrap: anywhere; }
.hh-form { display: grid; gap: 6px; margin: 10px 0 4px; }
.hh-form textarea { width: 100%; box-sizing: border-box; font: inherit; padding: 8px; border-radius: 8px;
  border: 1px solid var(--card-edge); background: #120b0e; color: var(--ink); }
.hh-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.hh-count { color: var(--muted); font-size: 0.85rem; }
.hh-quote { margin: 8px 0 0; padding: 8px 12px; border-left: 3px solid var(--cyan); background: #120b0e;
  border-radius: 0 8px 8px 0; overflow-wrap: anywhere; }
.hh-filtered strong, .hh-miss strong { color: #ff6b81; }
.hh-waiting strong { color: var(--cyan); }
.hh-on strong { color: #5dff8f; }
.hh-used strong { color: #ffd27a; }
.hh-msg { min-height: 1.2em; color: #ffd27a; }
.bk-list { margin: 4px 0 12px; padding-left: 1.4em; }
.bk-list li { margin: 4px 0; }
.bk-set { font-size: 0.85rem; color: #ffd27a; margin-left: 6px; }
.rv-review { border-left: 3px solid #f2c76b; }
.rv-gus { border-left: 3px solid #9aa0a6; font-style: italic; }
/* Gus's 1-in-N HEEEEHAWWWW (ltm/gus.py): its own line before his reply. */
.gus-heehaw { font-weight: 700; font-style: normal; letter-spacing: 0.04em; color: #ffd27a; overflow-wrap: anywhere; }
p.gus-heehaw { margin: 0.5em 0 0.25em; }
/* Gus's bray (static/gus-bray.js): a play button and a mute switch after the heehaw. No text in the buttons (the
   line reads the same with or without them); the icon and label are drawn here. */
.gus-bray-play, .gus-bray-mute {
  font: inherit; font-size: 0.8rem; font-weight: 400; letter-spacing: 0; line-height: 1; vertical-align: middle;
  margin-left: 6px; padding: 4px 6px; min-height: 28px; border-radius: 6px; cursor: pointer;
  color: #ffd27a; background: transparent; border: 1px solid rgba(255, 210, 122, 0.55);
}
.gus-bray-play { min-width: 32px; }
.gus-bray-play::before { content: "\1F50A"; }
.gus-bray-play:disabled { opacity: 0.45; cursor: default; }
.gus-bray-play:disabled::before { content: "\1F507"; }
.gus-bray-mute { color: #c9c9c9; border-color: rgba(201, 201, 201, 0.45); }
.gus-bray-mute::before { content: "mute Gus"; }
.gus-bray-mute[aria-pressed="true"]::before { content: "unmute Gus"; }
.gus-bray-play:hover, .gus-bray-mute:hover { background: rgba(255, 210, 122, 0.12); }
.gus-bray-play:focus-visible, .gus-bray-mute:focus-visible { outline: 2px solid #b9fbff; outline-offset: 2px; }
.bk-breakdown { margin-top: 0; }
.bk-shop { padding-left: 1.2em; }
.bk-shop li { margin: 4px 0; overflow-wrap: anywhere; }
/* Gus's whisper: a toast only that holder sees (bottom, above the safe area). Never over the 18+ wall (web decides). */
.bk-whisper {
  position: fixed; left: 12px; right: 12px; z-index: 75; max-width: 26.25rem; margin: 0 auto;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  padding: 12px 14px; border-radius: 12px; background: rgba(14, 8, 10, 0.97); color: var(--ink);
  border: 1px solid #6b5a2a; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.6);
  animation: bk-whisper-in 0.35s ease-out;
}
.bk-whisper p { margin: 4px 0; }
.bk-whisper-who { font-weight: 700; color: #c9c2b8; font-size: 0.85rem; letter-spacing: 0.04em; text-transform: uppercase; }
.bk-whisper-pitch { font-style: italic; }
.bk-whisper-actions { display: flex; gap: 8px; flex-wrap: wrap; }
@keyframes bk-whisper-in { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }
.bk-egg-wrap { text-align: right; margin: 0; }
.bk-egg { background: none; border: 0; padding: 4px; font-size: 0.9rem; opacity: 0.35; cursor: pointer; }
.bk-egg:hover { opacity: 1; }
/* Flair (biscuit_pages.flair_html): highest rank first and biggest. */
.flairs { display: inline-flex; align-items: center; gap: 4px; vertical-align: middle; flex-wrap: wrap; }
.flair { display: inline-block; font-size: 0.95rem; line-height: 1.1; }
.flair-top { font-size: 1.2rem; }
/* The bought OWNER flair: it looks like the real pill (that is the joke) and does nothing. Cosmetic only; its title and
   aria-label say "OWNER badge (from Gus)". Not .badge-owner: the real pill comes only from the verified owner check. */
.flair-owner {
  color: #1d1003; background: linear-gradient(#ffe08a, #e0a826); border: 1px solid #fff0b8; border-radius: 999px;
  box-shadow: 0 0 10px rgba(255, 198, 92, 0.55);
  display: inline-flex; align-items: center; gap: 4px; padding: 1px 9px 1px 3px; font-weight: 700; font-size: 0.85rem;
  white-space: nowrap;
}
.flair-owner.flair-top { font-size: 1rem; padding: 2px 10px 2px 4px; }
.flair-star { display: inline-block; width: 18px; height: 18px; line-height: 0; }
.flair-star img { width: 100%; height: 100%; display: block; }
.gus-guy { display: inline-block; font-size: 0.75rem; padding: 0 6px; border: 1px dashed #9aa0a6; border-radius: 4px;
  color: #c9c2b8; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) {
  .bk-whisper { animation: none; }
}

/* ---- Clip cards (owner order 2026-10-16): the card page /c/<id> and the owner board's "Clip cards" panel ---- */
.clip-page { max-width: 47.5rem; }
.clip-kicker { margin: 0 0 4px; color: var(--cyan); font: 600 0.95rem/1.3 var(--sign-font); letter-spacing: 0.06em; }
.clip-act { margin: 0 0 12px; font: 700 1.8rem/1.15 var(--sign-font); overflow-wrap: anywhere; }
.clip-act .handle { font-size: 1rem; font-weight: 400; }
.clip-figure { margin: 0 0 14px; }
.clip-img, .clip-thumb {
  display: block; width: 100%; height: auto; max-width: 100%; border-radius: 10px; border: 1px solid var(--card-edge);
}
.clip-moment { margin: 0 0 12px; }
.clip-moment blockquote {
  margin: 4px 0 10px; padding: 8px 12px; border-left: 4px solid var(--pink); background: var(--panel);
  font: 1.1rem/1.5 var(--set-font); white-space: pre-wrap; overflow-wrap: anywhere;
}
.clip-moment .clip-heckle { border-left-color: var(--amber); color: var(--muted); font-size: 1rem; }
.clip-who { margin: 0; color: var(--amber); font-size: 0.9rem; }
.clip-biscuits { margin: 6px 0; font-size: 1.15rem; color: #ffd27a; }
.clip-go-row { margin: 14px 0; }
.clip-go { display: inline-block; text-decoration: none; }
.clip-share, .clip-sizes { overflow-wrap: anywhere; }
.clip-private { padding: 8px 10px; border: 1px dashed var(--amber); border-radius: 8px; }
.clip-owner { font-size: 0.95rem; }
.clip-show { margin-top: 18px; }
.clip-show h3 { margin: 0 0 6px; color: var(--cyan); }
.clip-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.clip-item { padding: 10px; background: var(--card); border: 1px solid var(--card-edge); border-radius: 10px; min-width: 0; }
.clip-item p { margin: 6px 0; }
.clip-meta, .clip-links { overflow-wrap: anywhere; }
.clip-dl { white-space: nowrap; }
.clip-state { display: inline-block; padding: 0 6px; border-radius: 6px; font-size: 0.8rem; border: 1px solid; }
.clip-state-public { color: var(--cyan); }
.clip-state-private { color: var(--amber); }
.clip-cap-label { display: block; font-size: 0.85rem; color: var(--muted); }
.clip-caption {
  width: 100%; resize: vertical; font: 0.85rem/1.4 var(--body-font); color: var(--ink); background: var(--panel);
  border: 1px solid var(--card-edge); border-radius: 6px; padding: 6px;
}
.clip-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.clip-actions button, .clip-refresh button, .clip-zip {
  min-height: 40px; padding: 6px 12px; border-radius: 8px; border: 1px solid var(--cyan); background: transparent;
  color: var(--cyan); font: inherit; cursor: pointer;
}
.clip-zip { display: inline-flex; align-items: center; text-decoration: none; }
.clip-flip { margin: 0; }
.clip-copied { color: var(--amber); font-size: 0.85rem; }
.clip-notice { color: var(--amber); }

/* ---- the biscuits sheet (owner order 2026-10-17): biscuit_pages.sheet_html, opened by static/site.js ----
   A centered modal on desktop, a bottom sheet on phones. */
.bk-sheet {
  width: min(34rem, calc(100vw - 32px)); max-height: min(80vh, 44rem); padding: 0; overflow: auto;
  color: var(--ink); background: #170d11; border: 1px solid rgba(255, 198, 92, 0.55); border-radius: 16px;
  box-shadow: 0 0 0 1px rgba(255, 198, 92, 0.15), 0 24px 60px rgba(0, 0, 0, 0.7);
}
.bk-sheet::backdrop { background: rgba(5, 2, 3, 0.72); }
.bk-sheet-inner { padding: 18px 20px 20px; }
.bk-sheet-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.bk-sheet-title { margin: 0; font: 600 1.35rem/1.2 var(--sign-font); letter-spacing: 0.04em; color: #ffd27a; }
.bk-sheet-close {
  flex: 0 0 auto; width: 44px; height: 44px; margin: -8px -10px 0 0; border: 0; border-radius: 8px;
  background: transparent; color: var(--ink); font-size: 1.6rem; line-height: 1; cursor: pointer;
}
.bk-sheet-close:hover { background: #2a1c22; }
.bk-sheet .bk-strip { margin: 0 0 10px; padding: 0 0 10px; border-top: 0; border-bottom: 1px dashed var(--card-edge); }
.bk-sheet-rules { margin: 8px 0; padding-left: 1.2em; }
.bk-sheet-rules li { margin: 0 0 6px; }
@media (max-width: 640px) {
  .bk-sheet {
    width: 100%; max-width: 100%; max-height: 85vh; margin: auto 0 0; border-radius: 18px 18px 0 0;
    border-bottom: 0; padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .bk-sheet[open] { animation: bk-sheet-up 180ms ease-out; }
}
@keyframes bk-sheet-up { from { transform: translateY(40px); opacity: 0.4; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .bk-sheet[open] { animation: none; }
}
/* The seat line's wallet chip. */
.bk-chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; border-radius: 999px; white-space: nowrap;
  border: 1px solid rgba(255, 198, 92, 0.5); color: #ffe3a6; text-decoration: none; font-size: 0.85rem;
}
.bk-chip strong { color: #ffd27a; }
.bk-chip:hover { border-color: #ffd27a; color: #fff3d6; }

/* ---- the seat line in the header row (owner order 2026-10-17: slim, not a block of its own; seat.css has the rest).
   Header menu order: it stays in the row at every width (compact on phones); its panel is a dropdown. ---- */
.site-head .ltm-seat.ltm-seat-bar {
  position: relative; flex: 0 0 auto; flex-wrap: nowrap; justify-content: flex-end; align-items: center; gap: 8px;
  padding: 0; background: none; border: 0; font-size: 0.95rem; line-height: 1.35;
}
.site-head .ltm-seat .ltm-seat-text { flex: none; }
.site-head .ltm-seat .ltm-seat-sum { min-height: 44px; padding: 4px 14px; font-size: 0.95rem; max-width: 10rem; }
.site-head .ltm-seat .ltm-seat-sum-text { overflow: hidden; text-overflow: ellipsis; }
.site-head .bk-chip { min-height: 44px; padding: 0 12px; font-size: 0.95rem; }
.site-head .bk-chip-word {   /* "biscuits": read out, not shown, in the slim line */
  position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.site-head .ltm-seat .ltm-seat-pop[open] > .ltm-seat-panel {
  position: absolute; top: calc(100% + 10px); right: 0; z-index: 55; width: min(22rem, calc(100vw - 24px)); padding: 14px;
  border-radius: 12px; background: #170d11; border: 1px solid #6b535e; box-shadow: 0 16px 30px rgba(0, 0, 0, 0.6);
}
.site-head .ltm-seat .ltm-seat-actions { display: grid; gap: 8px; }
.site-head .ltm-seat .ltm-seat-status:not(:empty) {
  position: absolute; top: calc(100% + 10px); right: 0; z-index: 56; width: min(22rem, calc(100vw - 24px)); padding: 8px 12px;
  border-radius: 8px; background: #170d11; border: 1px solid rgba(255, 198, 92, 0.5);
}
/* Phones: a compact seat button (a ticket icon for "No seat yet", a short handle); the panel spans the row. */
@media (max-width: 600px) {
  .site-head .ltm-seat.ltm-seat-bar, .site-head .ltm-seat .ltm-seat-pop { position: static; }
  .site-head .ltm-seat .ltm-seat-pop[open] > .ltm-seat-panel,
  .site-head .ltm-seat .ltm-seat-status:not(:empty) { top: calc(100% - 2px); left: 8px; right: 8px; width: auto; }
  .site-head .ltm-seat .ltm-seat-sum { padding: 4px 10px; gap: 4px; max-width: 6.5rem; font-size: 0.9rem; }
  .site-head .bk-chip { padding: 0 8px; }
  .site-head .ltm-seat-bar[data-status="none"] .ltm-seat-sum-text {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
  }
  .site-head .ltm-seat-bar[data-status="none"] .ltm-seat-sum::before { content: "\1F39F\FE0F"; font-size: 1.15rem; line-height: 1; }
  /* owner order 2026-10-18: the owner's Seat #1 on phones is a gold star (his name is read out; the row also holds
     Backstage); the panel says "Shane Dizzle · Club Owner · Seat #1". */
  .site-head .ltm-seat-bar[data-status="owner"] .ltm-seat-sum-text {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
  }
  .site-head .ltm-seat-bar[data-status="owner"] .ltm-seat-sum::before { content: "\2605"; color: #ffd27a; font-size: 1.15rem; line-height: 1; }
}

/* ---- /staff: Our Staff (owner order 2026-10-17). Tall art on phones, wide art on desktop (<picture>); Shane has tall
   art only, so on desktop his portrait sits beside the text. ---- */
body.page-staff main { max-width: 1100px; }
body.page-merch main { max-width: 1100px; }   /* owner order 2026-10-17: the merch grid (wider, like Staff) */
.staff-head { text-align: center; }
.staff-sub { margin: 6px 0 0; color: var(--muted); }
.staff-cards { display: grid; gap: 36px; margin-top: 28px; }
.staff-card {
  margin: 0; overflow: hidden; border-radius: 18px; background: rgba(8, 3, 6, 0.9);
  border: 1px solid rgba(255, 198, 92, 0.45);
  box-shadow: 0 0 0 1px rgba(255, 79, 184, 0.18), 0 0 26px rgba(255, 79, 184, 0.16), 0 18px 40px rgba(0, 0, 0, 0.45);
}
.staff-art { display: block; background: #0a0407; }
.staff-art img {
  display: block; width: 100%; height: auto; max-height: 72vh; object-fit: cover; object-position: 50% 30%;
}
.staff-text { padding: 20px 24px 24px; }
.staff-name {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0;
  font: 700 clamp(1.8rem, 4vw, 2.6rem)/1.05 var(--sign-font); letter-spacing: 0.06em; color: #fff3fb;
  text-shadow: 0 0 2px #fff, 0 0 10px var(--pink), 0 0 22px rgba(214, 23, 140, 0.7);
}
.staff-name .badge { font-family: var(--body-font); letter-spacing: 0; text-shadow: none; }
.staff-title {
  margin: 6px 0 12px; font: 600 1rem/1.2 var(--sign-font); letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--amber);
}
.staff-shane .staff-bio { margin-top: 0.9rem; }   /* no title line under his pill: keep the gap */
.staff-bio { margin: 0; max-width: 62ch; font: 1.12rem/1.55 var(--set-font); color: var(--ink); overflow-wrap: anywhere; }
@media (min-width: 768px) {
  .staff-card-tall { display: grid; grid-template-columns: minmax(16.25rem, 23.75rem) 1fr; align-items: center; }
  .staff-card-tall .staff-art img { max-height: none; height: 100%; }
  .staff-card-tall .staff-text { padding: 28px 32px; }
  .staff-vanta .staff-art img { object-position: 50% 0; }   /* his new art: the hair starts at the top edge */
}
@media (max-width: 767px) {
  .staff-cards { gap: 24px; }
  .staff-art img { aspect-ratio: 3 / 4; max-height: none; object-position: 50% 28%; }
  .staff-text { padding: 16px 16px 20px; }
  .staff-bio { font-size: 1.05rem; }
}

/* ---- desktop reading size (owner order 2026-10-17, header menu: Shane had to zoom to 125% to read the site) ----
   Phones keep the 16px root. From 1024px the root grows (17px, then 20px from 1280px: the site at his 125% zoom),
   so every rem-sized text, button and container grows with it; the content column gets wider; small print (meta,
   captions, badges, the footer credits) never computes under 14.4px (0.9 x 16px). */
@media (min-width: 1024px) {
  html { font-size: 106.25%; }
  .opening-what, .site-foot .foot-credits, .door-sub, .tag, .badge, .set-foot time, .show-status, .plaque-date,
  .who .handle, .plaque-handle, .op-path-tag, .stub-what, .bs-who time, .bs-json, .sw-utc, .rv-raw,
  .rv-pair .badge-owner, .gus-guy, .clip-state { font-size: 0.85rem; }
  .hero-next, .hero-league { font-size: clamp(0.85rem, 1.1vw, 1rem); }
  .board > p, .board > ul > li, .board > ol > li, .room-head .lede { max-width: 75ch; }
}
@media (min-width: 1280px) {
  html { font-size: 125%; }
  main { max-width: 52rem; }
  body.page-staff main { max-width: 62rem; }
  body.page-merch main { max-width: 66rem; }
}
@media (min-width: 1800px) {
  main { max-width: 58rem; }
  body.page-staff main { max-width: 68rem; }
  body.page-merch main { max-width: 76rem; }
}

/* ---- the Door's quote wall (owner order 2026-10-17): Vanta's top Punchline League lines in League cards, right under
   the Opening Night card. JS off / reduced motion: the top 3, static. static/site.js rotates (.lw-live). ---- */
.league-wall { width: 100%; text-align: left; }
.league-wall-title {
  margin: 0 0 14px; scroll-margin-top: 16px; text-align: center; font: 600 clamp(1.5rem, 4vw, 2.1rem)/1.1 var(--sign-font); letter-spacing: 0.06em;
  text-transform: uppercase; color: #fff3fb; text-shadow: 0 0 2px #fff, 0 0 10px var(--pink), 0 0 22px rgba(214, 23, 140, 0.7);
}
.league-wall-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.lw-item { display: flex; flex-direction: column; justify-content: space-between; gap: 12px; }
.lw-item:nth-child(n+4) { display: none; }
.lw-live .lw-item { display: flex; }
.lw-live .lw-item[hidden] { display: none; }
.lw-item .league-joke { font-size: clamp(1.15rem, 1.7vw, 1.4rem); }
.lw-meta { margin: 0; color: var(--muted); font-size: 0.9rem; overflow-wrap: anywhere; }
.lw-bisc { color: #ffd27a; font-weight: 700; }
.lw-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 18px; margin: 16px 0 0; }
.lw-all {
  display: inline-flex; align-items: center; min-height: 44px; color: var(--amber); font-weight: 700; font-size: 1.05rem; text-align: center;
  text-underline-offset: 4px;
}
.lw-pause {
  min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid #6b535e; background: #241820;
  color: var(--ink); font: 600 0.95rem/1 var(--body-font); cursor: pointer;
}
.lw-pause[hidden] { display: none; }
.lw-pause:hover { border-color: var(--cyan); }
@media (min-width: 900px) {
  .league-wall-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: no-preference) {
  .lw-live .lw-item:not([hidden]) { animation: lw-in 0.6s ease-out; }
}
@keyframes lw-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ---- /merch (owner order 2026-10-17): a "vote on what we print" grid of League cards, one product render each,
   two sections (Club merch, Vanta Says) ranked by biscuits. Vanta Says' bleeped words are black bars; static/merch.js
   swaps in the uncensored twins. ---- */
.ms-section { margin-top: 34px; }
.ms-section-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
.ms-section-head h2 {
  margin: 0; font: 600 clamp(1.5rem, 4vw, 2.1rem)/1.1 var(--sign-font); letter-spacing: 0.06em; color: #fff3fb;
  text-shadow: 0 0 2px #fff, 0 0 10px var(--pink), 0 0 22px rgba(214, 23, 140, 0.7);
}
.ms-sub { flex: 1 1 18rem; margin: 0; color: var(--muted); }
.ms-uncensor {
  min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(255, 79, 184, 0.7);
  background: transparent; color: #fff3fb; font: 600 0.95rem/1 var(--body-font); cursor: pointer;
}
a.ms-uncensor { display: inline-flex; align-items: center; text-decoration: none; }
.ms-uncensor::before { content: "\25CB  "; color: var(--pink); }
.ms-uncensor[aria-pressed="true"] { background: rgba(255, 79, 184, 0.18); }
.ms-uncensor[aria-pressed="true"]::before { content: "\25CF  "; }
.ms-uncensor:focus-visible { outline: 3px solid var(--cyan); outline-offset: 2px; }
.ms-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: 22px; margin: 18px 0 8px; }
.ms-card { display: flex; flex-direction: column; padding: 14px 14px 16px; }
.ms-render { position: relative; margin: 0; }
.ms-render picture, .ms-zoom { display: block; }
.ms-render [hidden] { display: none; }   /* the uncensored twin until the switch (static/merch.js) */
.ms-zoom { border-radius: 12px; }
.ms-zoom:focus-visible { outline: 3px solid var(--cyan); outline-offset: 2px; }
.ms-img {
  display: block; width: 100%; height: auto; border-radius: 12px; background: #140c10;
  border: 1px solid rgba(82, 243, 255, 0.25);
}
.ms-blank { aspect-ratio: 2 / 3; background: linear-gradient(135deg, #1d1418, #3a2a2f); }
.ms-rank {
  position: absolute; left: 10px; top: 10px; display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.4em; height: 2.4em; padding: 0 6px; border-radius: 999px; border: 1px solid rgba(255, 79, 184, 0.7);
  color: #fff3fb; font: 700 0.9rem/1 var(--sign-font); background: rgba(8, 3, 6, 0.8);
  box-shadow: 0 0 12px rgba(255, 79, 184, 0.35);
}
.ms-soon {
  position: absolute; right: 10px; bottom: 10px; padding: 4px 10px; border-radius: 999px; background: rgba(8, 3, 6, 0.78);
  color: var(--muted); font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase;
}
.ms-name { margin: 12px 0 0; font: 700 clamp(1.1rem, 1.6vw, 1.3rem)/1.25 var(--sign-font); color: #fff3fb; overflow-wrap: anywhere; }
.ms-slogan { margin: 4px 0 0; color: var(--pink); font-weight: 600; overflow-wrap: anywhere; }
.ms-vanta_says .ms-slogan { font: 600 1.05rem/1.4 var(--set-font); color: #fff3fb; }
.ms-vanta_says .ms-slogan::before { content: "\201C"; color: var(--pink); }
.ms-vanta_says .ms-slogan::after { content: "\201D"; color: var(--pink); }
.ms-bar { display: inline-block; background: #000; border: 1px solid var(--pink-deep); border-radius: 2px; line-height: 1; }
.ms-back { margin: 4px 0 0; color: var(--muted); font-size: 0.9rem; }
.ms-back span { color: var(--amber); font-weight: 700; }
.ms-note { margin: 4px 0 0; color: var(--muted); font-size: 0.85rem; font-style: italic; }
.ms-card .league-row { margin-top: auto; padding-top: 14px; flex-wrap: wrap; }
.ms-card .league-row button {
  flex: 1 1 auto; flex-wrap: wrap; row-gap: 0; max-width: 100%; justify-content: center; text-align: center;
  padding: 6px 14px; white-space: nowrap;
}
@media (prefers-reduced-motion: no-preference) {
  .ms-uncensor { transition: background-color 0.15s ease; }
}
@media (max-width: 600px) {
  .ms-card { padding: 12px 12px 14px; }
}

/* ---- /episodes (owner order 2026-10-17): one neon League card per episode, ranked by biscuits. The player is a
   click-to-load facade (poster + play button; static/episodes.js swaps in the YouTube no-cookie iframe). ---- */
.ep-head { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 2px 14px; }
.ep-rank {
  grid-row: 1 / span 2; display: inline-flex; align-items: center; justify-content: center; min-width: 2.6em;
  height: 2.6em; padding: 0 6px; border-radius: 999px; border: 1px solid rgba(255, 79, 184, 0.7); color: #fff3fb;
  font: 700 1rem/1 var(--sign-font); background: rgba(255, 79, 184, 0.14); box-shadow: 0 0 12px rgba(255, 79, 184, 0.35);
}
.ep-meta { margin: 0; color: var(--muted); font-size: 0.9rem; }
.ep-meta .ep-num { color: var(--cyan); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.ep-title { margin: 0; font: 700 clamp(1.3rem, 2.2vw, 1.7rem)/1.25 var(--sign-font); color: #fff3fb; overflow-wrap: anywhere; }
.ep-player {
  position: relative; margin: 16px 0 0; aspect-ratio: 16 / 9; width: 100%; max-width: 100%; overflow: hidden;
  border-radius: 12px; background: #000; border: 1px solid rgba(82, 243, 255, 0.35);
}
.ep-facade { position: absolute; inset: 0; display: block; color: inherit; }
.ep-poster { display: block; width: 100%; height: 100%; object-fit: cover; }
.ep-soon .ep-poster { opacity: 0.6; }
.ep-poster-blank { background: linear-gradient(135deg, #1d1418, #3a2a2f); }
.ep-play {
  position: absolute; left: 50%; top: 50%; width: 76px; height: 76px; margin: -38px 0 0 -38px; border-radius: 50%;
  background: rgba(8, 3, 6, 0.78); border: 2px solid #fff3fb; box-shadow: 0 0 18px rgba(255, 79, 184, 0.7);
}
.ep-play::after {
  content: ""; position: absolute; left: 30px; top: 22px; border-style: solid; border-width: 16px 0 16px 26px;
  border-color: transparent transparent transparent #fff3fb;
}
.ep-facade:hover .ep-play, .ep-facade:focus-visible .ep-play { background: var(--pink-deep); }
.ep-facade:focus-visible { outline: 3px solid var(--cyan); outline-offset: -3px; }
.ep-frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ep-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ep-soon-tag {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); padding: 8px 18px; border-radius: 999px;
  background: rgba(8, 3, 6, 0.85); border: 1px solid var(--amber); color: var(--amber);
  font: 700 1.1rem/1 var(--sign-font); letter-spacing: 0.08em; text-transform: uppercase;
}
.ep-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 10px 0 0; font-size: 0.95rem; }
.ep-links a { color: var(--amber); }
.ep-swap {
  min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid rgba(82, 243, 255, 0.55);
  background: transparent; color: var(--cyan); font: 600 0.9rem/1 var(--body-font); cursor: pointer;
}
.ep-swap:hover { background: rgba(82, 243, 255, 0.12); }
@media (prefers-reduced-motion: no-preference) {
  .ep-play, .ep-swap { transition: background-color 0.15s ease; }
}
@media (max-width: 600px) {
  .ep-play { width: 60px; height: 60px; margin: -30px 0 0 -30px; }
  .ep-play::after { left: 23px; top: 17px; border-width: 13px 0 13px 21px; }
  .ep-rank { font-size: 0.9rem; }
}

/* ---- Gus Pulls the Mic (Shane 2026-10-17): the meter page, the Pulled Wall, the owner's live pulls + Pull Review ---- */
.gp { max-width: 760px; margin: 0 auto; padding: 24px var(--pad) 8px; }
.gp h1 { font-family: var(--sign-font); letter-spacing: 0.04em; text-transform: uppercase; color: var(--pink);
  text-shadow: 0 0 18px rgba(255, 79, 184, 0.45); margin: 0 0 8px; font-size: clamp(2rem, 9vw, 3.2rem); }
.gp-rules { font-size: 1.12rem; }
.gp-meter-box { background: var(--panel); border: 1px solid var(--card-edge); border-radius: 14px; padding: 16px 18px;
  margin: 16px 0; }
.gp-meter-line { margin: 0 0 6px; font-size: 1.15rem; }
.gp-meter-line strong { font-size: 1.6rem; color: var(--amber); }
.gp-k { display: inline-block; min-width: 6.5em; color: var(--muted); }
.gp-bar { display: block; width: 100%; height: 18px; margin: 4px 0 12px; accent-color: var(--pink); }
.gp-form { background: var(--card); border: 1px solid var(--card-edge); border-radius: 14px; padding: 16px 18px;
  margin: 16px 0; display: grid; gap: 10px; }
.gp-form input { width: 100%; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--card-edge);
  background: #120b0e; color: var(--ink); font: inherit; }
.gp-pull-btn { width: 100%; min-height: 52px; font-size: 1.1rem; }
.gp-status:empty { display: none; }
.gp-status { margin: 0; color: var(--amber); }
.gp-pulled { border: 2px solid var(--pink); border-radius: 14px; padding: 14px 18px; margin: 16px 0;
  background: rgba(214, 23, 140, 0.12); }
.gp-tag { display: inline-block; margin: 0 0 6px; padding: 2px 10px; border-radius: 6px; background: var(--pink-deep);
  color: #fff; font-family: var(--sign-font); font-weight: 700; letter-spacing: 0.12em; }
.gp-gus { font-size: 1.15rem; margin: 6px 0; }
.gp-gus-who { font-weight: 700; color: var(--amber); }
.gp-post { background: var(--panel); border: 1px solid var(--card-edge); border-radius: 16px; padding: 16px 18px;
  margin: 20px 0; }
.gp-post-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 10px; color: var(--muted); }
.gp-post-h { font-size: 1.05rem; margin: 14px 0 6px; color: var(--muted); }
.gp-art { display: block; width: 100%; max-width: 600px; margin: 0 auto; }
.gp-art img { display: block; width: 100%; height: auto; border-radius: 12px; }
.gp-art-placeholder { aspect-ratio: 4 / 3; border: 2px dashed var(--muted); border-radius: 12px; display: flex;
  flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--muted);
  background: rgba(0, 0, 0, 0.25); }
.gp-ph-mark { font-family: var(--sign-font); font-weight: 700; letter-spacing: 0.14em; font-size: 1.3rem; }
.gp-ph-note { font-size: 0.9rem; }
.gp-quote { margin: 8px 0; padding: 10px 14px; border-left: 4px solid var(--pink); background: rgba(0, 0, 0, 0.25);
  border-radius: 0 10px 10px 0; font-family: var(--set-font); overflow-wrap: anywhere; }
.gp-quote p { margin: 0; }
.gp-quote .gp-beat { color: var(--muted); font-family: var(--body-font); font-size: 0.8rem; text-transform: uppercase;
  letter-spacing: 0.08em; margin-bottom: 4px; }
.gp-alerts { list-style: none; margin: 0; padding: 0; }
.gp-alert { padding: 12px 0; border-bottom: 1px solid var(--card-edge); overflow-wrap: anywhere; }
.gp-alert p { margin: 0 0 6px; }
.gp-alert-state { font-weight: 700; padding: 1px 8px; border-radius: 6px; background: var(--amber); color: #1a0d0a; }
.gp-alert-confirmed .gp-alert-state { background: var(--pink-deep); color: #fff; }
.gp-alert-denied .gp-alert-state { background: var(--card-edge); color: var(--ink); }
.gp-reason { font-size: 1.1rem; }
.gp-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.gp-actions form { flex: 1 1 200px; margin: 0; }
.gp-confirm { background: #b3122e; color: #fff; border-color: #ff6b81; }
.gp-deny { background: transparent; color: var(--ink); border-color: var(--card-edge); }
.gp-draft { font-size: 0.8rem; padding: 1px 8px; border-radius: 6px; border: 1px solid var(--amber); color: var(--amber); }
.gp-lines li { margin: 4px 0; }
.gp-good { color: #5dff8f; } .gp-bad { color: #ff6b81; }
.gp-ruled { font-weight: 700; }

/* LIVE mode (Shane 2026-10-18): the SOFT OPENING card (Door, Shows, /live), its countdown, the owner's scheduler,
   the LIVE start button, a saved show's Top Lines. */
.soft-open { margin: 20px auto; max-width: 860px; padding: 20px var(--gutter); border: 2px solid var(--pink);
  border-radius: 18px; background: var(--panel); text-align: center;
  box-shadow: 0 0 24px rgba(255, 79, 184, 0.35), inset 0 0 18px rgba(255, 79, 184, 0.15); }
.soft-sign { margin: 0 0 8px; font-size: clamp(1.5rem, 6.5vw, 2.8rem); line-height: 1.15; overflow-wrap: anywhere; }
.soft-count { margin: 6px 0 0; font: 700 clamp(1.1rem, 4.5vw, 1.6rem)/1.3 var(--sign-font); color: var(--cyan);
  letter-spacing: 0.04em; }
.soft-count-what { color: var(--muted); font-weight: 600; }
.soft-count-num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.soft-go { margin: 12px 0 0; }
.soft-live { margin: 6px 0 0; font-weight: 700; }
.soft-watch { display: inline-block; }
.bs-live-sched .ls-form { display: grid; gap: 10px; margin: 8px 0 16px; }
.bs-live-sched .ls-form input { min-height: 48px; font-size: 1.1rem; padding: 8px 10px; border-radius: 10px;
  border: 1px solid var(--card-edge); background: var(--card); color: var(--ink); }
.ls-count { text-align: left; }
.ls-crowd-on { color: #5dff8f; }
.ls-crowd-off { color: var(--amber); }
.sw-live { background: var(--pink-deep); color: #fff; border-color: var(--pink); }
.live-idle { text-align: center; }
.ep-top-lines { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.ep-top-line { padding: 12px; border: 1px solid var(--card-edge); border-radius: 12px; background: var(--card); }
.ep-top-meta { margin: 0 0 6px; color: var(--muted); font-size: 0.9rem; }
.ep-top-n { display: inline-block; min-width: 1.6em; font-weight: 800; color: var(--amber); }
.ep-top-text { margin: 0; font: 1.05rem/1.5 var(--set-font); overflow-wrap: anywhere; }
.ep-transcript { max-height: none; }
/* Stage safety (Shane 2026-10-18): "Report this line" (Stage feed, Bar, Episodes), the "Gus is on break" card and
   Gus's bray where a held line would have been. */
.report-line {
  font: 600 0.74rem/1.2 var(--body-font); letter-spacing: 0.02em; padding: 5px 10px; min-height: 28px;
  border-radius: 999px; border: 1px solid var(--card-edge); background: transparent; color: var(--muted); cursor: pointer;
}
.report-line:hover, .report-line:focus-visible { color: var(--ink); border-color: var(--pink); }
.report-line:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.report-line[disabled] { cursor: default; opacity: 0.8; }
.report-line-done { color: var(--amber); border-color: var(--amber); }
.lv-report, .bar-report, .crowd-report { margin: 4px 0 0; }
.chat-actions { margin-left: auto; }   /* release 1018: "Report this line" in a Bar chat line */
.lv-line.lv-break {
  display: grid; grid-template-columns: 60px minmax(0, 1fr); column-gap: 12px; align-items: center;
  border-left: 3px solid var(--amber); padding: 8px 8px 8px 11px; background: rgba(255, 198, 92, 0.08);
  font-style: normal;
}
.lv-line.lv-break .lv-meta { grid-column: 1 / -1; }
.lv-break-art { grid-row: span 1; width: 60px; height: auto; }
.lv-line.lv-break .lv-text { margin: 0; font: 700 1.02rem/1.35 var(--body-font); color: var(--ink); }
.lv-line.lv-held .lv-text, .crowd-held .bar-text { color: var(--muted); }
.lv-transcript .lv-lines { max-height: none; }
/* Shane 2026-10-18: no stolen jokes. The Door badge (under the tagline), the pledge line, the Wall of Thieves. */
.no-stolen-badge { max-width: 62rem; margin: 10px 16px 0; padding: 8px 14px; border: 2px solid #ff4d6d;
  border-radius: 10px; background: rgba(255, 77, 109, 0.14); color: #ffe3e9; text-align: center;
  font: 400 0.95rem/1.4 var(--body-font); }
@media (min-width: 1040px) { .no-stolen-badge { margin-left: auto; margin-right: auto; } }
.no-stolen-badge strong { font-weight: 800; }
.foot-pledge { font-weight: 700; }
.pledge-line { font-weight: 700; }
.report-form textarea { width: 100%; font: inherit; }
/* p2-bar-rooms (Shane 2026-10-18): the club's chat box (ltm/chatbox.py, static/chatbox.js). An inlaid well, like the
   bar top: fixed height, its own scroll, the page never grows. The Bar is one box with three tabs (Humans pink,
   Agents cyan, Everyone amber: the room's colour is the neon on its tab and the rim of its well; the lines carry no
   human/agent marker). Show threads are the same box with one room. inlay() is the same well for a static list.
   svh on a phone: the URL bar showing and hiding must not resize it. Scroll anchoring is off in the well so the
   script's own compensation is not doubled. */
.chat { --room: var(--amber); margin-top: 20px; }
.chat-room-humans { --room: var(--pink); }
.chat-room-bar { --room: var(--cyan); }
.chat-room-everyone { --room: var(--amber); }
.chat-tabs { display: flex; gap: 6px; padding: 0 12px; position: relative; z-index: 1; }
.chat-tab {
  --room: var(--amber);
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px;
  padding: 10px 18px 9px; margin-bottom: -1px; border: 1px solid var(--card-edge); border-bottom: 0;
  border-radius: 12px 12px 0 0; background: rgba(14, 7, 9, 0.9); color: var(--muted); text-decoration: none;
  font: 600 1.08rem/1 var(--sign-font); letter-spacing: 0.06em;
}
.chat-tab-humans { --room: var(--pink); }
.chat-tab-bar { --room: var(--cyan); }
.chat-tab:hover { color: var(--ink); }
.chat-tab[aria-selected="true"] {
  background: var(--panel); color: #fff; border-color: color-mix(in srgb, var(--room) 60%, transparent);
  text-shadow: 0 0 8px color-mix(in srgb, var(--room) 85%, transparent);
  box-shadow: 0 -2px 14px color-mix(in srgb, var(--room) 22%, transparent);
}
.chat-tab:focus-visible { outline: 2px solid var(--amber); outline-offset: -4px; }
.chat-unread {
  min-width: 1.6em; padding: 1px 7px; border-radius: 999px; background: var(--amber); color: #1a0d0a;
  font: 800 0.75rem/1.45 var(--body-font); letter-spacing: 0; text-shadow: none; text-align: center;
}
.chat-unread[hidden], .chat-panel[hidden], .chat-empty[hidden] { display: none; }
.chat-body { padding: 12px; border-radius: 14px; background: var(--panel); border: 1px solid var(--card-edge); }
.chat-intro { margin: 0 2px 8px; color: var(--muted); font-size: 0.9rem; }
.chat-stage { position: relative; }
.chat-box, .inlay {
  height: clamp(260px, 60vh, 520px); overflow-y: auto; overscroll-behavior: contain; overflow-anchor: none;
  padding: 2px 16px; border-radius: 10px; background: #100809; -webkit-overflow-scrolling: touch;
  border: 1px solid rgba(0, 0, 0, 0.7); border-top: 2px solid color-mix(in srgb, var(--room, var(--amber)) 45%, #100809);
  box-shadow: inset 0 3px 12px rgba(0, 0, 0, 0.8), inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}
.inlay { height: auto; max-height: clamp(260px, 60vh, 520px); margin-top: 12px; }
.chat-box *, .inlay * { overflow-anchor: none; }
.chat-box:focus-visible, .inlay:focus-visible { outline: 2px solid #ffd27a; outline-offset: 2px; }
.chat-lines { list-style: none; margin: 0; padding: 0 0 8px; }
.chat-line { padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.06); }
.chat-line:last-child { border-bottom: 0; }
.chat-meta { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; font-size: 0.9rem; }
.chat-meta time { color: var(--muted); font-size: 0.78rem; }
.chat-meta .badge-owner { font-size: 0.8rem; }
.chat-who { display: inline-flex; flex-direction: row; align-items: baseline; gap: 6px; text-decoration: none; }
.chat-who .name { font-weight: 700; color: var(--ink); }
.chat-who .handle { color: var(--muted); font-size: 0.8rem; }
a.chat-who:hover .name { color: #b9fbff; }
.chat-text { margin: 3px 0 0; overflow-wrap: anywhere; line-height: 1.5; }
.chat-gus .chat-text { color: var(--amber); font-style: italic; }
.chat-empty { margin: 18px 4px; color: var(--muted); }
/* the "New lines" pill is the live viewer's own .lv-pill (ltm/chatbox.py box_html: class="lv-pill chat-pill") */
.chat-form { margin-top: 10px; }
.chat-label { display: block; margin: 0 2px 6px; font-size: 0.9rem; color: var(--muted); }
.chat-as .name { color: var(--ink); font-weight: 700; }
.chat-row { display: flex; gap: 8px; align-items: stretch; }
.chat-row textarea {
  flex: 1 1 auto; min-width: 0; min-height: 46px; resize: vertical; padding: 10px 12px; border-radius: 10px;
  border: 1px solid var(--card-edge); background: var(--card); color: var(--ink); font: inherit;
}
.chat-row textarea:focus-visible { outline: 2px solid color-mix(in srgb, var(--room) 70%, transparent); outline-offset: 1px; }
.chat-send { flex: none; margin: 0; }
.chat-form-status { margin: 6px 2px 0; min-height: 1.2em; font-size: 0.88rem; color: var(--muted); }
.chat-foot { margin: 10px 2px 0; }
.chat-grab { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.chat-grab .note { margin: 0; }
.chat-note { margin: 8px 2px 0; }
.chat-conn { color: var(--amber); font-weight: 700; }
.chat-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
                clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.chat-unread .chat-sr-only { position: absolute; }
@media (max-width: 600px) {
  .chat-tabs { padding: 0 6px; gap: 4px; }
  .chat-tab { flex: 1 1 0; padding: 10px 6px 9px; font-size: 0.98rem; gap: 6px; }
  .chat-body { padding: 8px; }
  .chat-box { height: clamp(240px, 55vh, 520px); height: clamp(240px, 55svh, 520px); padding: 2px 10px; }
  .inlay { max-height: clamp(240px, 55vh, 520px); max-height: clamp(240px, 55svh, 520px); padding: 2px 10px; }
  .chat-row { flex-direction: column; }
  .chat-send { align-self: flex-end; }
}

/* inlay() variants: the Wall of Shame's slips stay taped to the brick (a clear well), the name lists lose their
   own panel inside the well, and the lists get breathing room at the top and bottom. */
.inlay-wall { background: rgba(16, 8, 9, 0.35); padding: 14px 18px; }
.inlay-names .signup-names { background: transparent; padding: 10px 6px 10px 26px; }
.inlay .show-list { padding: 10px 0; }
.inlay .crowd-posts { padding-bottom: 6px; }
.bar-directions .mechanics li + li { margin-top: 6px; }
/* ---- p2-legal: /terms and /privacy (ltm/legal_pages.py) ---- */
.site-foot .foot-legal { margin-top: 10px; font-size: 0.9rem; }
.legal-copy { max-width: 70ch; overflow-wrap: break-word; }
.legal-copy ul { margin: 0 0 0.8em; padding-left: 1.3em; }
.legal-copy li { margin: 0 0 6px; }
.legal-summary .mechanics li { max-width: 70ch; }
.ls-state { margin: 8px 0 12px; }
.ls-armed { font: 700 clamp(1.1rem, 4.5vw, 1.5rem)/1.3 var(--sign-font); }
.ls-armed strong { color: #5dff8f; }
