:root {
  color-scheme: dark;
  font-family: 'Trebuchet MS', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --evergreen: #0c2824;
  --forest: #061a18;
  --burgundy: #5e2430;
  --red: #8c3640;
  --gold: #dec187;
  --soft-gold: #f1dab0;
  --cream: #f5e8ce;
  --paper: #d5c9b4;
  --muted: #b8b9aa;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--forest); color: var(--cream); min-height: 100vh; overflow-x: hidden; }
body::before { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: -1; background:
  radial-gradient(ellipse at 20% 8%, #37513c77, transparent 50%),
  radial-gradient(ellipse at 90% 58%, #742a3450, transparent 45%),
  repeating-linear-gradient(125deg, #f7d7a007 0 1px, transparent 1px 12px),
  linear-gradient(150deg, #102b27, #061a18 70%); }
.mural { position: fixed; z-index: -1; top: 10%; width: 35vw; height: 80vh; background-repeat: no-repeat; background-position: center; background-size: contain; opacity: .095; filter: grayscale(1) sepia(.6); pointer-events: none; }
.mural-left { left: -15vw; background-image: url('/leech-marley.jpg'); }
.mural-right { right: -17vw; background-image: url('/leech-future.jpg'); transform: rotate(7deg); }
a { color: var(--soft-gold); }
a:hover { color: #fff3d5; }
button, select { font: inherit; }
button { cursor: pointer; }
button:disabled { opacity: .48; cursor: not-allowed; }
.page { width: min(1250px, calc(100% - 32px)); margin: auto; }
.masthead { display: flex; align-items: center; justify-content: center; gap: 23px; padding: 25px 0 19px; border-bottom: 1px solid #d3b98245; }
.brand-text { font-size: .64rem; letter-spacing: .25em; color: #dfc797; font-weight: 800; text-align: center; }
.brand-mark { color: var(--gold); font-size: 1.1rem; }
.hero { display: grid; grid-template-columns: 1.1fr .9fr; min-height: 440px; align-items: center; gap: 15px; padding: 34px 12px 46px; }
.hero-copy { position: relative; z-index: 2; padding: 28px 0; }
.eyebrow { font-weight: 800; letter-spacing: .25em; color: var(--gold); font-size: .7rem; }
.sprig { font-size: 1.2rem; vertical-align: middle; padding: 0 5px; }
.hero-overline { color: #d7c3a2; text-transform: uppercase; letter-spacing: .17em; font-size: .73rem; margin: 25px 0 3px; }
h1, h2, h3 { font-family: Georgia, 'Times New Roman', serif; font-weight: 500; }
h1 { line-height: .85; letter-spacing: -.065em; font-size: clamp(4rem, 8.7vw, 7.7rem); margin: 8px 0 20px; text-shadow: 0 5px 30px #0008; }
h1 em { font-size: .5em; letter-spacing: -.04em; font-weight: 400; }
.hero-numeral { color: var(--soft-gold); }
.hero-title-main { font-size: 1.16em; color: #fff5e0; }
.hero-tagline { font-family: Georgia, serif; font-size: clamp(1.15rem, 2.2vw, 1.6rem); color: var(--soft-gold); margin: 0 0 16px; }
.hero-description { max-width: 600px; line-height: 1.75; color: #d4d2c4; margin: 0 0 22px; font-size: .97rem; }
.hero-badges { display: flex; gap: 9px; flex-wrap: wrap; }
.hero-badge { border: 1px solid #c5a96c62; border-radius: 100px; background: #1e3933dd; color: #e4d6b7; font-size: .77rem; padding: 8px 12px; white-space: nowrap; }
.hero-badge span { color: var(--gold); margin-right: 3px; }
.hero-art { position: relative; height: 400px; min-width: 0; }
.hero-portrait { position: absolute; margin: 0; background: #c4ae84; padding: 8px 8px 25px; border: 1px solid #ead9ad; box-shadow: 0 14px 35px #000a; }
.hero-portrait img { width: 100%; height: 100%; display: block; object-fit: cover; filter: sepia(.15) saturate(.8); }
.hero-portrait figcaption { position: absolute; bottom: 6px; left: 0; right: 0; text-align: center; color: #382f22; letter-spacing: .13em; font-size: .57rem; font-weight: 800; }
.portrait-one { width: 58%; height: 348px; top: 12px; left: 8%; transform: rotate(-10deg); }
.portrait-one img { object-position: 50% 43%; }
.portrait-two { width: 56%; height: 312px; top: 47px; right: 2%; transform: rotate(9deg); }
.portrait-two img { object-position: 45% 50%; }
.art-star { position: absolute; color: var(--soft-gold); text-shadow: 0 0 18px #d1aa6c; font-size: 2rem; }
.star-one { left: 3%; top: 5px; }
.star-two { right: 0; bottom: -2px; }
.feature { border: 1px solid #cfab72a0; border-radius: 20px; background: linear-gradient(150deg, #122e29 0%, #10221e 75%, #321b22); box-shadow: inset 0 0 0 5px #d7b56e0b, 0 20px 65px #0008; padding: clamp(16px, 2.8vw, 30px); }
.feature-topline { display: flex; justify-content: space-between; align-items: center; gap: 10px; border-bottom: 1px solid #d9b77947; padding-bottom: 16px; }
.section-label, .date-label { font-weight: 800; font-size: .7rem; letter-spacing: .2em; color: var(--gold); }
.date-label { color: #e4d2aa; }
.feature-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; padding: 20px 0 15px; }
.feature-kicker { color: #d7b383; font-weight: 700; letter-spacing: .12em; font-size: .68rem; text-transform: uppercase; }
.feature h2 { font-size: clamp(1.65rem, 4vw, 2.7rem); margin: 5px 0 6px; line-height: 1.12; }
.feature-subtitle { color: #bfbcae; font-size: .9rem; margin: 0; }
.phase-pill { border: 1px solid #c7a77090; border-radius: 100px; color: var(--soft-gold); background: #4635289e; white-space: nowrap; padding: 9px 13px; font-size: .67rem; font-weight: 800; letter-spacing: .09em; }
.phase-pill.is-live { color: #f4e3bf; background: #8d303ac7; border-color: #cc6970; }
.stage { position: relative; background: #08120f; border-radius: 13px; border: 1px solid #ad895da1; overflow: hidden; box-shadow: 0 12px 42px #0006; }
.stage-poster { min-height: 290px; aspect-ratio: 16/8; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 35px; background: linear-gradient(#061b19ce,#071311df), url('/leech-future.jpg') center 44% / cover; }
.stage-star { color: var(--gold); font-size: 3.4rem; line-height: 1; }
.poster-title { font-family: Georgia, serif; font-size: clamp(1.6rem, 4vw, 2.7rem); color: #fff3d7; margin-top: 10px; }
.stage-poster p { color: #d1c5aa; max-width: 560px; }
.video-shell { position: relative; background: #000; }
video { display: block; width: 100%; aspect-ratio: 16/9; object-fit: contain; background: #000; }
.collapse-button { display: none; position: absolute; top: 14px; right: 16px; z-index: 5; padding: 8px 12px; border-radius: 6px; background: #281b1be0; border: 1px solid #dec187; color: var(--cream); font-size: .8rem; }
.video-shell.expanded { position: fixed; inset: 0; z-index: 10000; background: #000; display: grid; place-items: center; }
.video-shell.expanded video { width: 100%; max-height: 100vh; height: 100vh; }
.video-shell.expanded .collapse-button { display: block; }
.video-shell:fullscreen { display: grid; place-items: center; }
.video-shell:fullscreen video { width: 100vw; height: 100vh; max-height: 100vh; }
.feature-bottom { display: flex; justify-content: space-between; align-items: center; gap: 22px; padding: 18px 1px 5px; flex-wrap: wrap; }
.time-panel { flex: 1 1 220px; }
.time-caption { color: var(--gold); letter-spacing: .16em; font-weight: 800; font-size: .66rem; }
.countdown { font-family: Georgia, serif; font-size: clamp(1.55rem, 3.2vw, 2.3rem); font-variant-numeric: tabular-nums; color: #fff2d4; padding-top: 5px; }
.event-note { color: #b7b9a9; font-size: .78rem; margin: 7px 0 0; }
.player-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.button { min-height: 43px; border-radius: 8px; border: 1px solid #c9ad7591; padding: 11px 14px; font-size: .83rem; font-weight: 800; transition: background .15s ease, transform .15s ease; }
.button:not(:disabled):hover { transform: translateY(-1px); }
.button-gold { color: #292219; background: linear-gradient(#f9e5b7,#d7ae67); border-color: #f1d19c; }
.button-gold:hover { background: #ffebbd; }
.button-quiet { color: var(--cream); background: #243f37; }
.button-quiet:hover { background: #345449; }
.playback-status { border-top: 1px solid #ccb07a3c; color: #d4b98c; padding-top: 14px; margin: 14px 0 0; font-size: .84rem; min-height: 30px; }
.lineup { padding-top: 68px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; border-bottom: 1px solid #d9b77950; padding-bottom: 20px; }
.section-heading h2 { font-size: clamp(1.8rem, 4vw, 3rem); margin: 7px 0 0; }
.section-side-note { color: #c7bea6; font-family: Georgia, serif; font-style: italic; text-align: right; }
.lineup-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 13px; margin-top: 20px; }
.lineup-card { min-width: 0; position: relative; padding: 19px 17px; min-height: 158px; border: 1px solid #8d866455; border-radius: 12px; background: linear-gradient(145deg,#254139bd,#152b27b8); overflow: hidden; }
.lineup-card::after { content: '✦'; position: absolute; right: -10px; bottom: -25px; font-size: 5rem; color: #bd9c6455; opacity: .2; }
.lineup-card.current { border-color: #dfbd7f; background: linear-gradient(150deg,#64323a,#2c302b); }
.lineup-card.theater { border-color: #d9b273; background: linear-gradient(125deg,#53292d,#6c4033); grid-column: span 4; min-height: 132px; display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.lineup-date { font-weight: 900; letter-spacing: .13em; font-size: .69rem; color: #dbc18c; }
.lineup-card h3 { font-size: clamp(1.02rem, 1.6vw, 1.36rem); line-height: 1.2; margin: 17px 0 9px; }
.lineup-card.theater h3 { font-size: 1.75rem; margin: 6px 0; }
.lineup-detail { font-size: .71rem; color: #c8c7b7; line-height: 1.35; }
.lineup-tag { display: inline-block; margin-top: 12px; font-size: .62rem; font-weight: 800; letter-spacing: .1em; color: #e4c99e; text-transform: uppercase; }
.theater-ticket { border: 1px dashed #e6ca9e; color: #f7e6bd; border-radius: 7px; padding: 17px 22px; letter-spacing: .15em; font-weight: 900; font-size: .74rem; transform: rotate(-3deg); white-space: nowrap; }
.art-history { display: grid; grid-template-columns: 34% 1fr; align-items: stretch; border: 1px solid #ab906a60; background: #1c332ee0; border-radius: 16px; overflow: hidden; margin: 67px 0 40px; }
.history-art { max-height: 335px; overflow: hidden; position: relative; }
.history-art img { width: 100%; height: 100%; object-fit: cover; object-position: center 42%; filter: sepia(.19); }
.history-copy { padding: clamp(24px, 4vw, 45px); }
.history-copy h2 { font-size: clamp(1.7rem, 3.6vw, 2.8rem); line-height: 1.1; margin: 13px 0; }
.history-copy h2 em { color: var(--gold); }
.history-copy p { color: #d1d0c3; line-height: 1.62; font-size: .87rem; }
.theater-link { display: inline-block; margin-top: 6px; font-weight: 800; font-size: .84rem; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.test-panel { background: #1c2f35; border: 1px dashed #d6b47b; padding: 20px; border-radius: 12px; margin: 30px 0; }
.test-panel h2 { margin: 0; }
.test-panel p { color: #cbcec3; }
.test-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.test-actions select { flex: 1; min-width: 180px; background: #0e2724; color: #f4e6cd; padding: 12px; border: 1px solid #d4b47d; border-radius: 8px; }
footer { border-top: 1px solid #d6b47b50; text-align: center; padding: 22px 10px 30px; color: #b2b8ab; }
footer p { font-size: .68rem; line-height: 1.7; }
.footer-brand { color: #e1c99c; font-weight: 800; letter-spacing: .25em; }
@media (max-width: 880px) {
  .hero { grid-template-columns: 1fr; gap: 0; padding-top: 35px; }
  .hero-copy { padding-bottom: 0; }
  .hero-art { width: min(550px, 100%); height: 295px; justify-self: center; }
  .portrait-one { height: 260px; }
  .portrait-two { height: 242px; top: 28px; }
  .lineup-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lineup-card.theater { grid-column: span 2; }
  .art-history { grid-template-columns: 30% 1fr; }
}
@media (max-width: 570px) {
  .page { width: min(100% - 18px,1250px); }
  .masthead { padding: 16px 0; gap: 9px; }
  .brand-text { font-size: .52rem; letter-spacing: .14em; }
  .hero { padding: 20px 6px 35px; }
  h1 { font-size: clamp(3.7rem, 18vw, 6rem); }
  .hero-description { font-size: .88rem; }
  .hero-art { height: 245px; }
  .portrait-one { height: 224px; }
  .portrait-two { height: 210px; top: 24px; }
  .feature-heading { align-items: flex-start; flex-direction: column; }
  .feature { padding: 14px; }
  .stage-poster { min-height: 230px; aspect-ratio: auto; }
  .feature-bottom { gap: 16px; }
  .player-actions { width: 100%; }
  .player-actions .button { flex: 1 1 140px; }
  .lineup { padding-top: 42px; }
  .lineup-grid { gap: 9px; }
  .lineup-card { padding: 14px 12px; min-height: 156px; }
  .lineup-card h3 { font-size: 1.05rem; }
  .lineup-card.theater { flex-direction: column; align-items: flex-start; gap: 8px; }
  .art-history { grid-template-columns: 1fr; }
  .history-art { height: 150px; }
  .section-side-note { display: none; }
}