/* DRNOJR Watch Party + Community styles.
 * Consolidated 2026-10-14 from six stylesheets, concatenated in their original load order
 * (cascade unchanged): community, watch-party-canceled, watch-party-immersive,
 * watch-party-cinematic-v4, watch-party-repair-v5, watch-party-scenes.
 * Does not style the global header, logo or navigation. */

/* ==================== was community.css ==================== */

/* Phase 9.0A — Community Hub */

.community-page {
    --community-purple: #a78bfa;
    --community-cyan: #67e8f9;
}

.community-shell {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto;
    padding: 36px 0 90px;
}

.community-hero {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    display: flex;
    align-items: center;
    min-height: 420px;
    padding: clamp(30px, 6vw, 72px);
    border: 1px solid rgba(167,139,250,.25);
    border-radius: 26px;
    background:
        radial-gradient(
            ellipse at 75% 18%,
            rgba(95,61,183,.4),
            transparent 55%
        ),
        radial-gradient(
            ellipse at 10% 95%,
            rgba(25,107,143,.3),
            transparent 60%
        ),
        linear-gradient(140deg, #121425, #090c16);
    color: #f5f3ff;
}

.community-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .3;
    background: repeating-linear-gradient(
        120deg,
        transparent 0 50px,
        rgba(255,255,255,.025) 51px 52px
    );
    pointer-events: none;
}

.community-hero-content {
    position: relative;
    z-index: 1;
    max-width: 760px;
}

.community-eyebrow {
    margin-bottom: 14px;
    color: var(--community-cyan);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .19em;
    text-transform: uppercase;
}

.community-hero h1 {
    margin: 0 0 22px;
    color: #fff;
    font-size: clamp(2.6rem, 6vw, 5rem);
    line-height: 1.06;
    letter-spacing: -.045em;
}

.community-lead {
    color: #e4dcff;
    font-size: clamp(1.1rem, 2vw, 1.35rem);
    line-height: 1.6;
}

.community-hero p:not(.community-eyebrow) {
    max-width: 650px;
}

.community-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 24px;
    padding: 14px 23px;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 12px;
    background: linear-gradient(120deg, #7150c9, #405da7);
    color: #fff;
    font-weight: 750;
    text-decoration: none;
    transition: filter .2s ease, transform .2s ease;
}

.community-button:hover,
.community-button:focus-visible {
    color: #fff;
    filter: brightness(1.2);
    transform: translateY(-2px);
}

.community-section {
    margin-top: 65px;
}

.community-section-heading {
    margin-bottom: 25px;
}

.community-section h2 {
    margin: 0;
    color: #f3f1ff;
    font-size: clamp(1.7rem, 3vw, 2.4rem);
}
.community-info-card {
    border: 1px solid rgba(167,139,250,.2);
    border-radius: 20px;
    background: linear-gradient(
        145deg,
        rgba(31,34,58,.96),
        rgba(15,19,34,.96)
    );
    color: #dddff0;
}

.community-status {
    display: inline-block;
    padding: 7px 12px;
    border: 1px solid rgba(103,232,249,.35);
    border-radius: 100px;
    background: rgba(103,232,249,.08);
    color: #a5f3fc;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .12em;
}

.community-text-link,
.community-back a {
    color: #b6c9ff;
    text-decoration: none;
    font-weight: 700;
}

.community-text-link:hover,
.community-back a:hover {
    color: #fff;
    text-decoration: underline;
}

.community-back {
    margin-bottom: 25px;
}

.community-info-card {
    padding: 26px;
}

.community-info-card h3 {
    margin-top: 0;
    color: #fff;
}

.community-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.watch-party-hero {
    min-height: 570px;
}

.watch-party-hero .community-hero-content {
    width: 100%;
    max-width: none;
    text-align: center;
}

.watch-party-hero p {
    margin-left: auto;
    margin-right: auto;
}

.watch-party-stage {
    margin-top: 36px;
    padding: clamp(25px, 5vw, 50px);
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 22px;
    background: rgba(5,8,20,.35);
}

.watch-party-stage h2 {
    color: #fff;
    font-size: clamp(1.6rem, 3vw, 2.5rem);
}

.watch-party-symbol {
    margin: 25px 0;
    color: #cbbaff;
    font-size: 4rem;
    text-shadow: 0 0 40px rgba(167,139,250,.7);
}

@media (max-width: 760px) {
    .community-shell {
        width: min(100% - 24px, 1180px);
        padding-top: 18px;
    }

    .community-hero {
        min-height: 350px;
        padding: 28px 22px;
    }
    .community-card-grid {
        grid-template-columns: 1fr;
    }

    .community-section {
        margin-top: 45px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .community-button {
        transition: none;
    }

    .community-button:hover,
    .community-button:focus-visible {
        transform: none;
    }
}

/* Phase 9.0B.2E.1 — Public Watch Party Event Presentation */

.watch-party-events {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    margin-top: 32px;
    text-align: left;
}

.watch-party-event-card {
    --event-accent: #a78bfa;

    position: relative;
    min-width: 0;
    padding: clamp(24px, 3vw, 36px);
    border: 1px solid rgba(167, 139, 250, .25);
    border-top: 3px solid var(--event-accent);
    border-radius: 18px;
    background:
        radial-gradient(
            ellipse at 100% 0%,
            rgba(111, 76, 175, .14),
            transparent 55%
        ),
        linear-gradient(145deg, #1e2138, #101421);
    color: #e5e7f3;
    overflow-wrap: anywhere;
}

.watch-party-event-card:only-child {
    grid-column: 1 / -1;
}

.watch-party-event-heading {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.watch-party-theme {
    display: inline-block;
    padding: 8px 14px;
    border: 1px solid var(--event-accent);
    border-radius: 100px;
    color: var(--event-accent);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.watch-party-event-status {
    color: #a5f3fc;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .12em;
}

.watch-party-event-card h3 {
    margin: 0 0 14px;
    color: #fff;
    font-size: clamp(1.55rem, 2.5vw, 2.2rem);
    line-height: 1.2;
}

.watch-party-date,
.watch-party-participation {
    margin-top: 24px;
    padding: 18px 20px;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 12px;
    background: rgba(5, 8, 20, .35);
}

.watch-party-detail-label {
    display: block;
    margin-bottom: 10px;
    color: #93dfed;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .12em;
}

.watch-party-date strong {
    display: block;
    color: #fff;
    font-size: 1.12rem;
}

.watch-party-date small {
    display: block;
    margin-top: 6px;
    color: #b5bdd9;
}

.watch-party-description {
    margin-top: 24px;
    line-height: 1.75;
}

.watch-party-participation p {
    margin: 0;
    line-height: 1.7;
}

.watch-party-event-card.theme-cinema {
    --event-accent: #c4b5fd;
}

.watch-party-event-card.theme-anime {
    --event-accent: #f0abfc;
}

.watch-party-event-card.theme-cartoon {
    --event-accent: #fcd34d;
}

.watch-party-event-card.theme-scifi {
    --event-accent: #67e8f9;
}

.watch-party-event-card.theme-fantasy {
    --event-accent: #86efac;
}

.watch-party-event-card.theme-horror {
    --event-accent: #fda4af;
}

@media (max-width: 900px) {
    .watch-party-events {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .watch-party-event-card {
        padding: 22px 18px;
    }

    .watch-party-event-heading {
        align-items: flex-start;
    }

    .watch-party-date,
    .watch-party-participation {
        padding: 16px;
    }
}

/* Phase 9.0B.2E.1A — Separate event presentation */

.watch-party-hero--intro {
    min-height: 300px;
    justify-content: center;
    text-align: center;
}

.watch-party-hero--intro .community-hero-content {
    max-width: 900px;
}

.watch-party-featured-section {
    margin-top: 48px;
}

.watch-party-featured-card {
    padding: clamp(28px, 5vw, 55px);
    text-align: left;
}

.watch-party-featured-card h3 {
    font-size: clamp(2rem, 4vw, 3rem);
}

.watch-party-featured-card .watch-party-date {
    max-width: 650px;
}

.watch-party-empty-state {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.watch-party-empty-state h2 {
    margin-bottom: 16px;
}

.watch-party-empty-state p {
    margin-left: auto;
    margin-right: auto;
    max-width: 620px;
}

@media (max-width: 760px) {
    .watch-party-hero--intro {
        min-height: 240px;
    }

    .watch-party-featured-card {
        padding: 24px 20px;
    }
}

/* Phase 9.0B.2E.2 — Dedicated event pages and countdowns */

.watch-party-end-label {
    margin-top: 20px;
}

.watch-party-countdown {
    margin-top: 28px;
    padding: clamp(20px, 4vw, 34px);
    border: 1px solid rgba(103,232,249,.25);
    border-radius: 16px;
    background: rgba(5, 8, 20, .42);
}

.watch-party-countdown-values {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
}

/* !important: theme layers set display:grid/flex with higher specificity. */
.watch-party-countdown-values[hidden] {
    display: none !important;
}

.watch-party-countdown-values span {
    display: grid;
    gap: 8px;
    padding: 16px 8px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px;
    text-align: center;
    color: #cbd5e1;
}

.watch-party-countdown-values strong {
    font-size: clamp(1.3rem, 3vw, 2.3rem);
    color: #fff;
}

@media (max-width: 560px) {
    .watch-party-countdown-values {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Phase 9.0.1 - public cancellation discovery; event theme accents reused. */
.community-cancellations .community-section-heading { margin-bottom: 1rem; }

/* Phase 9.0.1 visual themes v1 — CSS-only
 * Theme values from WatchPartyEvent.Theme: anime, cartoon, fantasy,
 * scifi, horror, cinema. All layers are local CSS — no external assets.
 * Scoped to event cards so the site's shared design is unchanged.
 */
.watch-party-event-card:is(.theme-anime,.theme-cartoon,.theme-scifi,.theme-fantasy,.theme-horror,.theme-cinema) {
  --wp-theme-accent: #92dce6;
  --wp-theme-border: rgba(146,220,230,.60);
  --wp-theme-shadow: rgba(146,220,230,.18);
  color: #f5f7ff;
  border: 1px solid var(--wp-theme-border);
  border-top: 4px solid var(--wp-theme-accent);
  border-radius: 18px;
  box-shadow: 0 16px 42px rgba(0,0,0,.23), 0 0 28px var(--wp-theme-shadow);
  background-color: #121725;
  background-repeat: no-repeat, no-repeat, repeat;
  overflow-wrap: anywhere;
}
.watch-party-event-card:is(.theme-anime,.theme-cartoon,.theme-scifi,.theme-fantasy,.theme-horror,.theme-cinema) .watch-party-theme {
  color: var(--wp-theme-accent);
  border-color: var(--wp-theme-border);
  letter-spacing: .09em;
  font-weight: 750;
}
.watch-party-event-card:is(.theme-anime,.theme-cartoon,.theme-scifi,.theme-fantasy,.theme-horror,.theme-cinema) h1,
.watch-party-event-card:is(.theme-anime,.theme-cartoon,.theme-scifi,.theme-fantasy,.theme-horror,.theme-cinema) h2,
.watch-party-event-card:is(.theme-anime,.theme-cartoon,.theme-scifi,.theme-fantasy,.theme-horror,.theme-cinema) h3 {
  color: #fff;
  text-wrap: balance;
}
.watch-party-event-card:is(.theme-anime,.theme-cartoon,.theme-scifi,.theme-fantasy,.theme-horror,.theme-cinema) a:focus-visible {
  outline: 3px solid var(--wp-theme-accent);
  outline-offset: 4px;
}
/* Anime: sakura-pink light, twilight violet, delicate diagonal shimmer. */
.watch-party-event-card.theme-anime {
  --wp-theme-accent: #ffb5ea;
  --wp-theme-border: rgba(255,181,234,.66);
  --wp-theme-shadow: rgba(235,100,219,.19);
  background-image:
    repeating-linear-gradient(135deg, transparent 0 22px, rgba(255,255,255,.07) 23px 24px, transparent 25px 48px),
    radial-gradient(ellipse at 88% 6%, rgba(255,146,223,.37), transparent 44%),
    linear-gradient(125deg, rgba(78,32,114,.90), rgba(20,22,62,.95) 55%, rgba(40,19,66,.96));
}
/* Cartoon: golden burst, bright cyan rim-light, playful halftone dots. */
.watch-party-event-card.theme-cartoon {
  --wp-theme-accent: #ffdb73;
  --wp-theme-border: rgba(255,219,115,.78);
  --wp-theme-shadow: rgba(255,189,68,.17);
  background-image:
    radial-gradient(circle, rgba(255,244,171,.12) 1.5px, transparent 2px),
    radial-gradient(circle at 90% 12%, rgba(255,207,73,.34), transparent 45%),
    linear-gradient(120deg, rgba(17,74,92,.98), rgba(24,41,91,.96) 52%, rgba(72,36,91,.95));
  background-size: 19px 19px, auto, auto;
}
/* Sci-Fi: cyan terminal glow with a fine engineering grid. */
.watch-party-event-card.theme-scifi {
  --wp-theme-accent: #6ee6ff;
  --wp-theme-border: rgba(110,230,255,.69);
  --wp-theme-shadow: rgba(62,191,250,.20);
  background-image:
    linear-gradient(rgba(103,218,255,.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103,218,255,.09) 1px, transparent 1px),
    radial-gradient(ellipse at 100% 0%, rgba(51,202,255,.29), transparent 52%),
    linear-gradient(115deg, rgba(6,38,62,.98), rgba(9,19,48,.97) 62%, rgba(11,42,56,.98));
  background-size: 29px 29px, 29px 29px, auto, auto;
}
/* Fantasy: jade aurora, amethyst shadows and luminous mist. */
.watch-party-event-card.theme-fantasy {
  --wp-theme-accent: #b8e9b5;
  --wp-theme-border: rgba(184,233,181,.64);
  --wp-theme-shadow: rgba(174,126,255,.20);
  background-image:
    radial-gradient(ellipse at 84% 8%, rgba(133,219,159,.30), transparent 48%),
    radial-gradient(ellipse at 14% 90%, rgba(157,103,228,.35), transparent 57%),
    linear-gradient(115deg, rgba(25,48,52,.98), rgba(29,20,57,.98) 70%, rgba(22,38,47,.96));
}
/* Horror: crimson fog and distant low-light highlights. */
.watch-party-event-card.theme-horror {
  --wp-theme-accent: #ffb4bf;
  --wp-theme-border: rgba(248,120,144,.68);
  --wp-theme-shadow: rgba(232,49,85,.15);
  background-image:
    repeating-linear-gradient(120deg, transparent 0 49px, rgba(255,120,145,.055) 50px 51px, transparent 52px 100px),
    radial-gradient(ellipse at 90% 11%, rgba(178,31,66,.35), transparent 57%),
    linear-gradient(138deg, rgba(42,13,28,.98), rgba(15,17,30,.99) 62%, rgba(55,17,33,.98));
}
/* Cinema: warm projector spot, midnight navy and Art Deco stripes. */
.watch-party-event-card.theme-cinema {
  --wp-theme-accent: #ffdc95;
  --wp-theme-border: rgba(240,198,132,.73);
  --wp-theme-shadow: rgba(255,194,107,.15);
  background-image:
    repeating-linear-gradient(90deg, transparent 0 52px, rgba(232,195,126,.09) 53px 54px, transparent 55px 108px),
    radial-gradient(ellipse at 82% -4%, rgba(243,191,103,.31), transparent 59%),
    linear-gradient(105deg, rgba(42,33,48,.97), rgba(12,24,46,.99) 62%, rgba(53,38,44,.97));
}
/* Keep scheduled and canceled status visually distinct from the theme. */
@media (max-width: 640px) {
  .watch-party-event-card:is(.theme-anime,.theme-cartoon,.theme-scifi,.theme-fantasy,.theme-horror,.theme-cinema) {
    box-shadow: 0 10px 28px rgba(0,0,0,.18);
    background-position: center;
  }
}

/* ==================== was watch-party-canceled.css ==================== */

/* Phase 9.0.1 public cancellation screen - local CSS, CSP-safe. */
.wp-canceled{--glow:#5dbcc8;--shade:#132b39;min-height:70vh;padding:clamp(2rem,5vw,5rem) 1rem;color:#f0f5fa;background:radial-gradient(ellipse at 20% 5%,var(--shade),transparent 65%),#09111c;}
.wp-canceled[data-theme="anime"]{--glow:#f5a3d5;--shade:#442140}
.wp-canceled[data-theme="cartoon"]{--glow:#ffd36b;--shade:#463619}
.wp-canceled[data-theme="fantasy"]{--glow:#bba2ff;--shade:#302349}
.wp-canceled[data-theme="scifi"]{--glow:#56d7f0;--shade:#153d50}
.wp-canceled[data-theme="horror"]{--glow:#ec7e90;--shade:#451d2d}
.wp-canceled[data-theme="cinema"]{--glow:#eac68e;--shade:#3f3127}
.wp-canceled__card{max-width:780px;margin:auto;padding:clamp(1.5rem,4vw,3.5rem);border:1px solid color-mix(in srgb,var(--glow) 50%,transparent);border-radius:22px;background:rgba(12,19,32,.87);box-shadow:0 25px 75px rgba(0,0,0,.35)}
.wp-canceled__status{display:inline-block;border:1px solid var(--glow);border-radius:999px;padding:.5rem 1rem;letter-spacing:.15em;font-size:.8rem;font-weight:700;color:var(--glow)}
.wp-canceled__theme{display:block;margin:1.4rem 0 .5rem;color:var(--glow)}
.wp-canceled h1{font-size:clamp(2rem,5vw,3.5rem);line-height:1.12;margin:.5rem 0 1.3rem}
.wp-canceled__media,.wp-canceled__schedule{color:#c4d0de}
.wp-canceled__reason{border-left:3px solid var(--glow);padding:.6rem 1.2rem;margin:2rem 0;background:rgba(255,255,255,.04);overflow-wrap:anywhere}
.wp-canceled__reason h2{font-size:1.1rem;color:var(--glow)}
.wp-canceled__reason p{white-space:normal;line-height:1.6}
.wp-canceled__link{display:inline-block;padding:.8rem 1.1rem;border-radius:10px;background:var(--glow);color:#0c1620;text-decoration:none;font-weight:700}
.wp-canceled__link:focus-visible{outline:3px solid white;outline-offset:4px}

/* Phase 9.0.1 visual themes v1 — CSS-only
 * Canceled pages inherit the same six visual identities while retaining
 * the explicit, accessible CANCELED badge and cancellation reason.
 */
.wp-canceled[data-theme] {
  background-color: #090f1d;
}
.wp-canceled[data-theme] .wp-canceled__card {
  border-top: 4px solid var(--glow);
  box-shadow: 0 22px 64px rgba(0,0,0,.36), 0 0 34px color-mix(in srgb, var(--glow) 16%, transparent);
}
.wp-canceled[data-theme] .wp-canceled__status {
  color: #ffb8c4;
  border-color: #ff9daf;
  background: rgba(102,18,36,.30);
}
.wp-canceled[data-theme] .wp-canceled__reason {
  border-left-color: #ff9daf;
  background: rgba(255,165,181,.07);
}
.wp-canceled[data-theme] .wp-canceled__reason h2 {
  color: #ffc1cc;
}
.wp-canceled[data-theme="anime"] {
  background-image:
    radial-gradient(ellipse at 15% 0, rgba(236,110,202,.22), transparent 58%),
    linear-gradient(145deg,#27162e,#0a1429 62%,#211135);
}
.wp-canceled[data-theme="cartoon"] {
  background-image:
    radial-gradient(ellipse at 90% 0, rgba(252,194,71,.17), transparent 60%),
    linear-gradient(140deg,#163d4d,#11162f 60%,#362144);
}
.wp-canceled[data-theme="scifi"] {
  background-image:
    linear-gradient(rgba(82,191,226,.055) 1px, transparent 1px),
    linear-gradient(90deg,rgba(82,191,226,.055) 1px,transparent 1px),
    radial-gradient(ellipse at 85% 5%,rgba(51,167,211,.19),transparent 62%),
    linear-gradient(125deg,#0a2436,#081223 63%,#0d2e3a);
  background-size: 40px 40px, 40px 40px, auto, auto;
}
.wp-canceled[data-theme="fantasy"] {
  background-image:
    radial-gradient(ellipse at 5% 7%,rgba(104,198,132,.17),transparent 56%),
    radial-gradient(ellipse at 85% 6%,rgba(151,103,217,.22),transparent 57%),
    linear-gradient(135deg,#192d32,#151329 65%,#21253a);
}
.wp-canceled[data-theme="horror"] {
  background-image:
    radial-gradient(ellipse at 84% 0,rgba(172,30,61,.21),transparent 58%),
    linear-gradient(120deg,#280f22,#0b101b 67%,#2a1220);
}
.wp-canceled[data-theme="cinema"] {
  background-image:
    radial-gradient(ellipse at 89% 0,rgba(228,184,103,.20),transparent 58%),
    linear-gradient(120deg,#2b2330,#111526 65%,#312a2e);
}
@media (max-width: 640px) {
  .wp-canceled[data-theme] .wp-canceled__card { padding: 1.35rem; }
}

/* ==================== was watch-party-immersive.css ==================== */

/* DRNOJR Phase 9.0.1 — Illustrated Event Worlds v2
 * Standalone CSS; loaded AFTER the existing community/cancellation styles.
 * All illustrations are local, original SVG assets. No scripts, external calls,
 * remote fonts, copyrighted franchise logos, or animated full-screen videos.
 */
:root {
  --wp-ink: #070c18;
  --wp-paper: #fff9ef;
}
/* Six worlds — the event's stored theme chooses art and style. */
.theme-anime, .wp-canceled[data-theme="anime"] { --wp-accent: #ffc0e7;
  --wp-rim: #e470c5; --wp-dim: #2a1744; --wp-surface: #120f2c;
  --wp-accent-rgb: 255, 156, 220; --wp-title-font: Georgia, 'Times New Roman', serif;
}
.theme-cartoon, .wp-canceled[data-theme="cartoon"] { --wp-accent: #ffdf87;
  --wp-rim: #f7ab54; --wp-dim: #155767; --wp-surface: #082f46;
  --wp-accent-rgb: 255, 208, 109; --wp-title-font: 'Trebuchet MS', Verdana, sans-serif;
}
.theme-scifi, .wp-canceled[data-theme="scifi"] { --wp-accent: #94f4ff;
  --wp-rim: #42bee9; --wp-dim: #103953; --wp-surface: #08172c;
  --wp-accent-rgb: 106, 230, 249; --wp-title-font: 'Trebuchet MS', Verdana, sans-serif;
}
.theme-fantasy, .wp-canceled[data-theme="fantasy"] { --wp-accent: #ebd5a3;
  --wp-rim: #8acebd; --wp-dim: #253c37; --wp-surface: #12292a;
  --wp-accent-rgb: 192, 226, 177; --wp-title-font: Georgia, 'Times New Roman', serif;
}
.theme-horror, .wp-canceled[data-theme="horror"] { --wp-accent: #ffb0b4;
  --wp-rim: #cf4964; --wp-dim: #40202f; --wp-surface: #160f1e;
  --wp-accent-rgb: 236, 98, 123; --wp-title-font: Georgia, 'Times New Roman', serif;
}
.theme-cinema, .wp-canceled[data-theme="cinema"] { --wp-accent: #ffda93;
  --wp-rim: #d7a455; --wp-dim: #43202f; --wp-surface: #1a1223;
  --wp-accent-rgb: 243, 188, 107; --wp-title-font: Georgia, 'Times New Roman', serif;
}
/* Separate artwork from event text: even small card images remain legible. */
.wp-artwork {
  position: relative;
  display: block;
  overflow: hidden;
  background-color: var(--wp-surface, #12182c);
  background-image: var(--wp-art);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  isolation: isolate;
}
.wp-artwork::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(7,12,24,.88), rgba(7,12,24,.02) 58%, rgba(7,12,24,.06));
  pointer-events: none;
}
.wp-artwork__label {
  position: absolute;
  bottom: 18px;
  left: clamp(16px, 3vw, 34px);
  z-index: 1;
  max-width: calc(100% - 40px);
  color: white;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .17em;
  text-transform: uppercase;
  text-shadow: 0 2px 12px #060b18;
}
.wp-artwork__label::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 2px;
  vertical-align: middle;
  margin-right: 12px;
  background: var(--wp-accent, #fff);
  box-shadow: 0 0 12px var(--wp-rim, #fff);
}
/* All existing cancellation/upcoming content stays in the HTML underneath. */
.watch-party-event-card.wp-immersive-card {
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--wp-rim);
  border-top: 4px solid var(--wp-rim);
  background: linear-gradient(145deg, var(--wp-surface), #080e20 94%);
  box-shadow: 0 14px 38px rgba(0,0,0,.26), 0 0 25px rgba(var(--wp-accent-rgb),.11);
}
.wp-immersive-card .wp-artwork { height: clamp(152px, 24vw, 225px); }
.wp-immersive-card__content { padding: clamp(23px, 3.4vw, 43px); }
.wp-immersive-card h3,
.wp-immersive-card h2 {
  color: #fff;
  font-family: var(--wp-title-font);
  letter-spacing: -.02em;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.wp-immersive-card .watch-party-event-heading { margin: 0 0 22px; }
.wp-immersive-card .watch-party-theme,
.wp-detail-hero .watch-party-theme {
  color: var(--wp-accent);
  border-color: var(--wp-rim);
  background: rgba(4,11,25,.7);
}
.wp-immersive-card .watch-party-event-status,
.wp-immersive-card .watch-party-detail-label { color: var(--wp-accent); }
.wp-immersive-card .watch-party-date,
.wp-immersive-card .watch-party-participation {
  background: rgba(4,11,24,.63);
  border: 1px solid rgba(var(--wp-accent-rgb),.22);
  box-shadow: inset 3px 0 0 rgba(var(--wp-accent-rgb),.50);
}
.wp-immersive-card .community-text-link {
  color: var(--wp-accent);
  text-underline-offset: 4px;
}
.wp-immersive-card .community-text-link:hover { color: #fff; }
/* The featured event becomes a full-width story panel, not a plain rectangle. */
.watch-party-featured-card.wp-immersive-card .wp-artwork { height: clamp(210px, 37vw, 380px); }
.watch-party-featured-card.wp-immersive-card .wp-immersive-card__content { max-width: 940px; }
.watch-party-featured-card.wp-immersive-card h3 { font-size: clamp(1.9rem, 4vw, 3.1rem); }
/* Genre identity panel: recognizable references, explicitly inspiration only. */
.wp-worlds { margin-top: 72px; }
.wp-worlds__lede { color: #bacce0; max-width: 730px; line-height: 1.7; }
.wp-worlds__grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; margin-top: 26px; }
.wp-world-tile { min-width: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.17); border-radius: 16px; background: #0e1426; color: #f4f5fc; }
.wp-world-tile .wp-artwork { height: 146px; }
.wp-world-tile__body { padding: 18px 19px 21px; border-top: 3px solid var(--wp-rim); }
.wp-world-tile h3 { font-family: var(--wp-title-font); font-size: 1.43rem; margin: 0 0 6px; color: var(--wp-accent); }
.wp-world-tile__caption { margin: 0 0 12px; font-weight: 700; line-height: 1.4; }
.wp-world-tile__references { margin: 0; font-size: .87rem; color: #becadb; line-height: 1.65; }
.wp-worlds__note { color: #a7b5c9; font-size: .78rem; margin-top: 16px; }
/* Shared story language in cards and full event pages. */
.wp-storyline { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0; }
.wp-storyline span { display: inline-flex; align-items: center; padding: 7px 10px; background: rgba(var(--wp-accent-rgb),.085); border: 1px solid rgba(var(--wp-accent-rgb),.27); border-radius: 6px; color: var(--wp-accent); font-weight: 700; font-size: .73rem; letter-spacing: .06em; text-transform: uppercase; }
/* Individual event: atmospheric hero, genre-specific lettering and brief panels. */
.wp-detail-hero {
  position: relative;
  min-height: clamp(390px, 42vw, 545px);
  display: flex;
  align-items: end;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--wp-rim);
  border-radius: 24px;
  padding: clamp(29px, 5vw, 68px);
  background-color: var(--wp-surface);
  background-image: linear-gradient(90deg, rgba(4,8,23,.93) 0%,rgba(4,8,23,.72) 33%, rgba(4,8,23,.23) 75%), var(--wp-art);
  background-repeat: no-repeat;
  background-position: center, center;
  background-size: cover;
  box-shadow: 0 25px 70px rgba(0,0,0,.25);
}
.wp-detail-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(0deg, rgba(4,9,21,.77) 0%, transparent 50%); z-index: -1; }
.wp-detail-hero__content { z-index: 1; position: relative; max-width: 780px; }
.wp-detail-hero__eyebrow { display: block; text-transform: uppercase; font-weight: 800; letter-spacing: .18em; color: var(--wp-accent); font-size: .73rem; margin-bottom: 17px; }
.wp-detail-hero h1 { color: white; font-family: var(--wp-title-font); font-size: clamp(2.4rem, 5.9vw, 5rem); line-height: 1.06; text-wrap: balance; overflow-wrap: anywhere; text-shadow: 0 3px 28px #081020; margin: 15px 0 12px; }
.wp-detail-hero__subtitle { font-size: clamp(1rem, 1.65vw, 1.25rem); color: #f1eaf7; max-width: 570px; line-height: 1.65; }
.wp-detail-hero .wp-storyline { margin-bottom: 0; }
.wp-detail-stage { margin-top: 27px; }
.wp-detail-stage .wp-immersive-card__content { max-width: 1020px; }
.wp-detail-stage .wp-detail-opening { padding: clamp(25px, 3.8vw, 45px); margin-bottom: 16px; border: 1px solid rgba(var(--wp-accent-rgb),.25); border-radius: 14px; background: linear-gradient(125deg, rgba(var(--wp-accent-rgb),.13),rgba(6,13,26,.78)); }
.wp-detail-stage .wp-detail-opening h2 { font-family: var(--wp-title-font); font-size: clamp(1.8rem, 3vw, 2.7rem); margin-top: 4px; }
.wp-detail-stage .wp-detail-opening .watch-party-description { margin-top: 13px; }
.wp-detail-stage .watch-party-countdown { border: 1px solid rgba(var(--wp-accent-rgb),.41); border-radius: 14px; background: rgba(4,8,18,.74); padding: clamp(18px,3vw,28px); margin-top: 24px; }
.wp-detail-stage .watch-party-countdown .watch-party-detail-label { color: var(--wp-accent); }
.wp-detail-stage .watch-party-countdown-values { display: flex; flex-wrap: wrap; gap: 12px; }
.wp-detail-stage .watch-party-countdown-values > span { min-width: 80px; padding: 13px 12px; border: 1px solid rgba(var(--wp-accent-rgb),.37); border-radius: 9px; background: rgba(var(--wp-accent-rgb),.07); color: #f4f4ff; text-align: center; }
.wp-detail-stage .watch-party-countdown-values strong { display: block; font-variant-numeric: tabular-nums; font-family: var(--wp-title-font); font-size: clamp(1.7rem,3vw,2.5rem); color: var(--wp-accent); }
.wp-detail-stage .watch-party-countdown-values > span { font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; }
.wp-detail-stage .community-button { background: var(--wp-rim); color: #08101b; border-color: var(--wp-rim); }
/* Theater ticket, mission brief, enchanted journal etc — separate material design. */
.theme-anime .wp-detail-opening { box-shadow: inset 0 0 32px rgba(245,136,202,.08); }
.theme-cartoon .wp-detail-opening { border-style: dashed; border-width: 2px; box-shadow: 5px 5px 0 rgba(255,223,125,.15); }
.theme-scifi .wp-detail-opening { border-left: 4px solid var(--wp-accent); border-radius: 3px; }
.theme-fantasy .wp-detail-opening { border-left: 6px double var(--wp-rim); }
.theme-horror .wp-detail-opening { border-bottom: 4px double #cc566c; }
.theme-cinema .wp-detail-opening { border: 2px solid #bf8d4e; outline: 1px solid rgba(255,220,163,.20); outline-offset: -10px; }
/* Community Hub featured art reflects the actual upcoming theme. */
/* Canceled event retains genre visuals, but cancellation always wins visually. */
.wp-canceled[data-theme] { background-image: linear-gradient(180deg, rgba(3,7,16,.82), rgba(3,7,16,.96)), var(--wp-art); background-repeat: no-repeat; background-position: center top; background-size: cover; }
.wp-canceled[data-theme] .wp-canceled__card { overflow: hidden; padding: 0; width: min(850px, 100%); border-color: rgba(var(--wp-accent-rgb),.62); background: #0a1120; }
.wp-canceled[data-theme] .wp-canceled__art { height: clamp(170px,25vw,260px); margin-bottom: 0; background-position: center 47%; }
.wp-canceled[data-theme] .wp-canceled__content { padding: clamp(24px, 4vw, 47px); }
.wp-canceled[data-theme] .wp-canceled__theme { color: var(--wp-accent); font-weight: 750; }
.wp-canceled[data-theme] h1 { font-family: var(--wp-title-font); color: #fff; text-wrap: balance; }
.wp-canceled[data-theme] .wp-canceled__status { color: #ffe1e7; border: 1px solid #f8a4b8; background: #611e3d; border-radius: 5px; }
.wp-canceled[data-theme] .wp-canceled__reason { border-left: 4px solid #f3a4bd; background: rgba(255,145,182,.09); }
.wp-canceled[data-theme] .wp-canceled__reason h2 { color: #ffd1df; }
.wp-canceled[data-theme] .wp-canceled__link { color: #0b1120; background: #ffc1d2; }
/* Accessible device sizes and predictable text contrast. */
@media (max-width: 920px) { .wp-worlds__grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 680px) {
  .wp-worlds { margin-top: 54px; }
  .wp-worlds__grid { grid-template-columns: 1fr; }
  .wp-immersive-card .wp-artwork { height: 155px; }
  .watch-party-featured-card.wp-immersive-card .wp-artwork { height: 195px; }
  .wp-detail-hero { min-height: 440px; background-image: linear-gradient(0deg,rgba(4,8,23,.95),rgba(4,8,23,.40) 90%),var(--wp-art); background-position: center, 66% center; padding: 27px 22px; }
  .wp-detail-hero h1 { font-size: clamp(2rem,9vw,3.1rem); }
  .wp-detail-stage .watch-party-countdown-values > span { min-width: 68px; flex: 1 1 calc(50% - 12px); }
  .wp-canceled[data-theme] .wp-canceled__art { height: 165px; }
}
@media (prefers-reduced-motion: reduce) {
  .wp-immersive-card, .wp-detail-hero, .wp-world-tile { animation: none !important; transition: none !important; }
}

/* PHASE 9.0.1 v3 — Approved Cartoon artworks, real content / functional UI.
 * The mockup supplied design direction only; no baked-in fake dates, buttons
 * or screenshot typography is shown as a website background. */
.theme-cartoon {
  --wp-rim: #ffc531;
  --wp-accent: #ffe17c;
  --wp-surface: #061829;
  --wp-dim: #144767;
  --wp-accent-rgb: 255, 205, 56;
  --wp-title-font: Georgia, 'Times New Roman', serif;
}
/* The lobby takes its ambience from the actual *next* event. */
.watch-party-hero--intro[class*="theme-"] {
  position: relative;
  padding: clamp(100px, 15vw, 170px) clamp(26px, 6vw, 90px);
  min-height: clamp(330px, 38vw, 525px);
  isolation: isolate;
  overflow: hidden;
  background-color: #06182b;
  background-image: linear-gradient(90deg,rgba(3,8,25,.50),rgba(3,8,25,.28),rgba(3,8,25,.50)),
                    linear-gradient(0deg,rgba(3,8,25,.87),transparent 65%), var(--wp-art);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 1px solid var(--wp-rim);
  border-radius: 20px;
  box-shadow: 0 22px 55px rgba(0,0,0,.23);
}
.watch-party-hero--intro[class*="theme-"] .community-hero-content {
  position: relative; z-index: 1;
  margin-inline: auto;
  text-align: center;
  max-width: 740px;
  text-shadow: 0 2px 12px rgba(2,6,17,.93);
}
.watch-party-hero--intro[class*="theme-"] h1 { text-wrap: balance; }
/* The approved treehouse concept becomes a genuine side-by-side featured card. */
.watch-party-featured-card.wp-immersive-card.theme-cartoon {
  display: grid;
  grid-template-columns: minmax(230px, 39%) minmax(0, 1fr);
  border: 2px solid #ffd047;
  border-radius: 20px;
  background: linear-gradient(145deg,#091c30,#061122 85%);
  box-shadow: 0 18px 46px rgba(0,0,0,.32), 0 0 23px rgba(248,184,27,.14);
}
.watch-party-featured-card.wp-immersive-card.theme-cartoon .wp-artwork {
  height: 100%; min-height: 395px;
}
.watch-party-featured-card.theme-cartoon .wp-immersive-card__content {
  padding: clamp(22px, 3.3vw, 40px);
  max-width: none;
  min-width: 0;
}
.watch-party-featured-card.theme-cartoon .watch-party-event-heading { margin-bottom: 14px; }
.watch-party-featured-card.theme-cartoon h3 {
  font-size: clamp(1.65rem,2.7vw,2.7rem);
  line-height: 1.17;
}
.watch-party-featured-card.theme-cartoon .watch-party-theme {
  color: #17120a;
  background: #ffcc2f;
  border-color: #ffe07c;
  font-family: 'Trebuchet MS', Verdana, sans-serif;
  font-weight: 900;
}
.watch-party-featured-card.theme-cartoon .community-text-link {
  display: inline-block;
  border: 1px solid #f6bf36;
  border-radius: 9px;
  padding: 11px 18px;
  background: #ffca2e;
  color: #11111b;
  font-weight: 900;
  text-decoration: none;
}
.watch-party-featured-card.theme-cartoon .community-text-link:hover,
.watch-party-featured-card.theme-cartoon .community-text-link:focus-visible {
  color: #07101d; background: #ffe18a;
  outline: 2px solid #62d9fa;
  outline-offset: 2px;
}
/* Reuse existing watch-party-countdown.js from the detail page. */
.theme-cartoon .wp-detail-hero { background-position: center, center, 55% center; }
@media (max-width: 800px) {
  .watch-party-featured-card.wp-immersive-card.theme-cartoon { grid-template-columns: 1fr; }
  .watch-party-featured-card.wp-immersive-card.theme-cartoon .wp-artwork { min-height: 0; height: clamp(220px,46vw,370px); }
}
@media (max-width: 600px) {
  .watch-party-hero--intro[class*="theme-"] { min-height: 340px; padding: 65px 24px; background-position:center,center,55% center; }
}
@media (prefers-reduced-motion: reduce) {
}

/* ==================== was watch-party-cinematic-v4.css ==================== */

/* PHASE 9.0.1 v4 — Cinematic theme unification.
   This file intentionally does not style the global header, logo or navigation.
   All text, links and countdowns are existing live Django/HTML components. */

/* Theme accent colours (artwork comes from the scenes section at the end of this file). */
.theme-anime, .wp-canceled[data-theme="anime"] { --wp-accent:#ffaadf; --wp-rim:#ed67ba; --wp-accent-rgb:255,150,217; }
.theme-scifi, .wp-canceled[data-theme="scifi"] { --wp-accent:#65e8ff; --wp-rim:#21c8f8; --wp-accent-rgb:92,215,255; }
.theme-fantasy, .wp-canceled[data-theme="fantasy"] { --wp-accent:#9bffd1; --wp-rim:#67d6ac; --wp-accent-rgb:135,255,204; }
.theme-horror, .wp-canceled[data-theme="horror"] { --wp-accent:#ff8897; --wp-rim:#f14668; --wp-accent-rgb:255,112,139; }
.theme-cinema, .wp-canceled[data-theme="cinema"] { --wp-accent:#ffda86; --wp-rim:#e7ab42; --wp-accent-rgb:255,210,127; }

/* Lobby atmospheric hero uses the actual featured event genre. */
.community-hero.watch-party-hero--intro[class*="theme-"] {
    min-height: clamp(310px,31vw,420px);
    padding: clamp(54px,7vw,90px) clamp(22px,5vw,80px);
    background-image:
      linear-gradient(90deg,rgba(1,5,19,.64),rgba(1,7,23,.34),rgba(1,5,19,.65)),
      linear-gradient(0deg,rgba(1,8,20,.78),transparent 70%),var(--wp-art);
    background-position:center;
    background-size:cover;
    border-radius:18px;
}

/* Every genre gets the compact two-column featured treatment, not Cartoon alone. */
.watch-party-featured-card.wp-immersive-card,
.watch-party-featured-card.wp-immersive-card.theme-cartoon {
    display:grid;
    grid-template-columns:minmax(0, 39%) minmax(0,61%);
    align-items:stretch;
    border:1px solid var(--wp-rim);
    border-radius:18px;
    background:linear-gradient(120deg, rgba(var(--wp-accent-rgb),.115),#050e22 42%,#05101e);
    box-shadow:0 14px 42px #0006, 0 0 20px rgba(var(--wp-accent-rgb),.10);
    overflow:hidden;
}
.watch-party-featured-card.wp-immersive-card > .wp-artwork,
.watch-party-featured-card.wp-immersive-card.theme-cartoon > .wp-artwork {
    height:auto;min-height:365px;
    background-position:center;
    background-size:cover;
    border-right:1px solid rgba(var(--wp-accent-rgb),.28);
}
.watch-party-featured-card.wp-immersive-card .wp-immersive-card__content,
.watch-party-featured-card.wp-immersive-card.theme-cartoon .wp-immersive-card__content {
    display:flex;flex-direction:column;
    min-width:0;max-width:none;
    gap:9px;padding:clamp(18px,2.6vw,35px);
}
.watch-party-featured-card.wp-immersive-card .watch-party-event-heading { margin-bottom:5px; }
.watch-party-featured-card.wp-immersive-card h3 { font-size:clamp(1.6rem,2.75vw,2.6rem);line-height:1.12;margin:0;overflow-wrap:anywhere; }
.watch-party-featured-card.wp-immersive-card .watch-party-description { margin:5px 0;line-height:1.48; }
.watch-party-featured-card.wp-immersive-card .watch-party-date {padding:12px 15px;margin:1px 0;background:#030b1cbb;}
.watch-party-featured-card.wp-immersive-card .watch-party-participation {padding:11px 14px;margin:2px 0;}
/* In v3 the featured countdown was Cartoon-colored even for Sci-Fi etc. */
/* Genre signatures: distinctive frames rather than changes to actual behavior. */
.watch-party-featured-card.theme-anime {border-radius:22px 22px 9px 9px;}
.watch-party-featured-card.theme-scifi {clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));}
.watch-party-featured-card.theme-fantasy {border:3px double var(--wp-rim);}
.watch-party-featured-card.theme-horror {border-bottom:3px solid #ad304b;}
.watch-party-featured-card.theme-cinema {border:3px double #d5a145;}

/* Genre gallery: six equally cinematic portals. The tiles are inspiration, not phantom event links. */
.wp-worlds__grid {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:11px;align-items:stretch;}
.wp-world-tile {display:flex;flex-direction:column;min-width:0;border-color:rgba(var(--wp-accent-rgb),.65);}
.wp-world-tile .wp-artwork {height:180px;min-height:180px;background-position:center;background-size:cover;}
.wp-world-tile__body {flex:1;padding:14px 13px 17px;}
.wp-world-tile h3 {font-size:1.23rem;}
.wp-world-tile__caption {font-size:.84rem;}
.wp-world-tile__references {font-size:.74rem;line-height:1.55;}

/* Detail: preserve existing page but make feature and hero cohesive and avoid excessive empty height. */
.wp-detail-hero {min-height:clamp(305px,31vw,435px);padding:clamp(25px,4vw,52px);}
.wp-detail-hero h1 {font-size:clamp(2rem,4.9vw,4.2rem);}
.wp-detail-stage {margin-top:18px;}
.wp-detail-stage .wp-detail-opening {padding:clamp(20px,2.3vw,31px);}
.wp-detail-stage .watch-party-countdown {margin-top:15px;}
/* Apply dramatic art to cancellation but keep red/pink cancellation cues above genre colors. */
.wp-canceled[data-theme] .wp-canceled__art {height:clamp(190px,25vw,285px);background-position:center;}
.wp-canceled[data-theme] .wp-canceled__reason {border-left-color:#ff9eb6;}

@media(max-width:1250px) {.wp-worlds__grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;} }
@media(max-width:880px) {
  .watch-party-featured-card.wp-immersive-card,.watch-party-featured-card.wp-immersive-card.theme-cartoon {grid-template-columns:1fr;}
  .watch-party-featured-card.wp-immersive-card > .wp-artwork,.watch-party-featured-card.wp-immersive-card.theme-cartoon > .wp-artwork {height:clamp(220px,38vw,310px);min-height:0;border-right:0;border-bottom:1px solid rgba(var(--wp-accent-rgb),.28);}
  .wp-worlds__grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:560px) {
  .community-hero.watch-party-hero--intro[class*="theme-"] {min-height:295px;padding:52px 21px;}
  .watch-party-featured-card.wp-immersive-card .wp-immersive-card__content {padding:20px 18px;}
  .wp-worlds__grid {grid-template-columns:1fr;}
  .wp-world-tile .wp-artwork {height:195px;}
}
@media(prefers-reduced-motion:reduce) {}

/* ==================== was watch-party-repair-v5.css ==================== */

/* Phase 9.0.1 Visual Repair v5 — scoped layout and clean Cartoon assets.
 * Loads AFTER v3/v4 styles; does not touch site branding, backend or event logic.
 * The five other v4 illustrations remain subject to separate artwork QA. */
/* V4 featured card rule expects TWO children, artwork + text. Detail has ONE.
   Restrict those rules to the actual featured card; fix detail as an independent grid. */
.wp-detail-stage.watch-party-featured-card.wp-immersive-card {
  display: block;
  grid-template-columns: none;
  width:100%;
  max-width: none;
}
.wp-detail-stage.watch-party-featured-card.wp-immersive-card > .wp-immersive-card__content {
  display: grid;
  width: 100%;
  max-width: none;
  min-width: 0;
  box-sizing: border-box;
  grid-template-columns: repeat(2,minmax(0,1fr));
  grid-template-areas:
    'heading heading'
    'opening opening'
    'schedule countdown'
    'participation participation'
    'join join';
  gap: clamp(14px,2vw,24px);
  align-items: start;
  padding:clamp(18px,3vw,32px);
}
.wp-detail-stage > .wp-immersive-card__content > .watch-party-event-heading {grid-area:heading;margin:0;}
.wp-detail-stage > .wp-immersive-card__content > .wp-detail-opening {grid-area:opening;margin:0;min-width:0;}
.wp-detail-stage > .wp-immersive-card__content > .watch-party-date {grid-area:schedule;margin:0;min-width:0;}
.wp-detail-stage > .wp-immersive-card__content > .watch-party-countdown {grid-area:countdown;margin:0;min-width:0;}
.wp-detail-stage > .wp-immersive-card__content > .watch-party-participation {grid-area:participation;margin:0;}
.wp-detail-stage > .wp-immersive-card__content > .community-button {grid-area:join;justify-self:start;}
.wp-detail-stage .watch-party-countdown-values {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
}
.wp-detail-stage .watch-party-countdown-values > span {
  min-width:0;max-width:none;
  padding:10px 2px;
  font-size:.63rem;
}
.wp-detail-stage .watch-party-countdown-values strong {font-size:clamp(1.1rem,2.3vw,2rem);}
/* The featured event is a two-column artwork/content card. Internal details compact. */
.watch-party-featured-section .watch-party-featured-card.wp-immersive-card {
  grid-template-columns:minmax(0,36%) minmax(0,64%);
}
.watch-party-featured-section .watch-party-featured-card.wp-immersive-card > .wp-immersive-card__content {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(170px,.87fr);
  grid-template-areas:
    'heading heading'
    'title title'
    'media media'
    'schedule countdown'
    'description countdown'
    'participation action';
  column-gap:clamp(10px,1.6vw,18px);
  row-gap:9px;
  align-content:center;
  min-width:0;
  padding:clamp(18px,2.5vw,30px);
}
.watch-party-featured-section .watch-party-featured-card .watch-party-event-heading {grid-area:heading;margin:0;}
.watch-party-featured-section .watch-party-featured-card h3 {grid-area:title;margin:0;}
.watch-party-featured-section .watch-party-featured-card .watch-party-date {grid-area:schedule;min-width:0;margin:0;}
.watch-party-featured-section .watch-party-featured-card .watch-party-description {grid-area:description;min-width:0;margin:0;}
.watch-party-featured-section .watch-party-featured-card .watch-party-participation {grid-area:participation;margin:0;}
/* Make artwork distinct without dark panel obstructing the underlying pixels. */
/* Six skinny gallery columns were unreadable at the 900px content width. */
.wp-worlds__grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2vw,19px);}
.wp-world-tile .wp-artwork {height:clamp(175px,21vw,220px);}
.wp-world-tile .wp-world-tile__body {padding:16px;}
@media (max-width:960px) {
  .watch-party-featured-section .watch-party-featured-card.wp-immersive-card {grid-template-columns: minmax(0,1fr);}
  .watch-party-featured-section .watch-party-featured-card.wp-immersive-card > .wp-artwork {height:250px;min-height:0;border-right:none;}
  .watch-party-featured-section .watch-party-featured-card.wp-immersive-card > .wp-immersive-card__content {grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .wp-worlds__grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:670px) {
  .wp-detail-stage.watch-party-featured-card.wp-immersive-card > .wp-immersive-card__content {
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:'heading' 'opening' 'schedule' 'countdown' 'participation' 'join';
  }
  .watch-party-featured-section .watch-party-featured-card.wp-immersive-card > .wp-immersive-card__content {
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:'heading' 'title' 'media' 'schedule' 'description' 'countdown' 'participation' 'action';
  }
  .wp-worlds__grid {grid-template-columns:minmax(0,1fr);}
  .wp-world-tile .wp-artwork {height:225px;}
}
@media(prefers-reduced-motion:reduce) {
  .wp-detail-stage *, .watch-party-featured-section .wp-immersive-card * {transition:none!important;animation:none!important;}
}

/* Genre atmosphere words are descriptive text, not controls: no button-like boxes. */
.wp-storyline { gap: 0; }
.wp-storyline span {
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  font-weight: 600;
  opacity: .9;
  white-space: nowrap;
}
/* Separator trails the previous word so a wrapped line never starts with a dot. */
.wp-storyline span:not(:last-child)::after {
  content: "·";
  margin: 0 .7em;
  opacity: .6;
}

/* Compact countdowns: Community Hub card and lobby "More Upcoming Events" cards. */ .wp-card-countdown { margin-top: 18px; }
.wp-card-countdown .watch-party-countdown-values { margin-top: 10px; gap: 8px; }
.wp-card-countdown .watch-party-countdown-values span { padding: 10px 6px; }
@media (max-width: 560px) {
  .wp-card-countdown .watch-party-countdown-values { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
  .wp-card-countdown .watch-party-countdown-values span { padding: 8px 2px; font-size: .68rem; }
}

/* ==================== was watch-party-scenes.css ==================== */

/* Phase 9.0.1 genre scenes: every genre has a main scene plus two variants.
 * Loads LAST. Each event picks its scene via the wp-scene-<scene> class (WatchPartyEvent.scene).
 * Theme accent colours still come from the earlier layers. */

.theme-anime, .wp-canceled[data-theme="anime"] {
  --wp-art-main: url("../img/watch-party/scenes/anime-main.cc08852da6c6.webp"); --wp-art-v1: url("../img/watch-party/scenes/anime-v1.0eef26c139ef.webp"); --wp-art-v2: url("../img/watch-party/scenes/anime-v2.e786c66c0c62.webp");
  --wp-art-main-sm: url("../img/watch-party/scenes/anime-main-sm.9a28feae495e.webp"); --wp-art-v1-xs: url("../img/watch-party/scenes/anime-v1-xs.4274d6ce0e17.webp"); --wp-art-v2-xs: url("../img/watch-party/scenes/anime-v2-xs.ac2cf86ea8b9.webp");
  --wp-art: var(--wp-art-main);
}
.theme-cartoon, .wp-canceled[data-theme="cartoon"] {
  --wp-art-main: url("../img/watch-party/scenes/cartoon-main.8d0da34d4dce.webp"); --wp-art-v1: url("../img/watch-party/scenes/cartoon-v1.e2c2799e1564.webp"); --wp-art-v2: url("../img/watch-party/scenes/cartoon-v2.2e7a4628f6c9.webp");
  --wp-art-main-sm: url("../img/watch-party/scenes/cartoon-main-sm.2911f59fd405.webp"); --wp-art-v1-xs: url("../img/watch-party/scenes/cartoon-v1-xs.543f9510c3d2.webp"); --wp-art-v2-xs: url("../img/watch-party/scenes/cartoon-v2-xs.244217d70963.webp");
  --wp-art: var(--wp-art-main);
}
.theme-scifi, .wp-canceled[data-theme="scifi"] {
  --wp-art-main: url("../img/watch-party/scenes/scifi-main.90649cbd45b7.webp"); --wp-art-v1: url("../img/watch-party/scenes/scifi-v1.5bf470d697ee.webp"); --wp-art-v2: url("../img/watch-party/scenes/scifi-v2.5002f5a0661a.webp");
  --wp-art-main-sm: url("../img/watch-party/scenes/scifi-main-sm.39b6fb522890.webp"); --wp-art-v1-xs: url("../img/watch-party/scenes/scifi-v1-xs.1fd82739f2ed.webp"); --wp-art-v2-xs: url("../img/watch-party/scenes/scifi-v2-xs.046412dead5a.webp");
  --wp-art: var(--wp-art-main);
}
.theme-fantasy, .wp-canceled[data-theme="fantasy"] {
  --wp-art-main: url("../img/watch-party/scenes/fantasy-main.8e092fb98eee.webp"); --wp-art-v1: url("../img/watch-party/scenes/fantasy-v1.aba9003d347b.webp"); --wp-art-v2: url("../img/watch-party/scenes/fantasy-v2.7d843109fcd5.webp");
  --wp-art-main-sm: url("../img/watch-party/scenes/fantasy-main-sm.6ac87a78565a.webp"); --wp-art-v1-xs: url("../img/watch-party/scenes/fantasy-v1-xs.eb4616ac0f34.webp"); --wp-art-v2-xs: url("../img/watch-party/scenes/fantasy-v2-xs.00541f5e3a3e.webp");
  --wp-art: var(--wp-art-main);
}
.theme-horror, .wp-canceled[data-theme="horror"] {
  --wp-art-main: url("../img/watch-party/scenes/horror-main.8c9aec6c3eac.webp"); --wp-art-v1: url("../img/watch-party/scenes/horror-v1.6dcd663200ce.webp"); --wp-art-v2: url("../img/watch-party/scenes/horror-v2.41d5ef3bd7a9.webp");
  --wp-art-main-sm: url("../img/watch-party/scenes/horror-main-sm.5b8992c6eb86.webp"); --wp-art-v1-xs: url("../img/watch-party/scenes/horror-v1-xs.d44efadc8da0.webp"); --wp-art-v2-xs: url("../img/watch-party/scenes/horror-v2-xs.5391054de651.webp");
  --wp-art: var(--wp-art-main);
}
.theme-cinema, .wp-canceled[data-theme="cinema"] {
  --wp-art-main: url("../img/watch-party/scenes/cinema-main.b9175dca3770.webp"); --wp-art-v1: url("../img/watch-party/scenes/cinema-v1.a4bc0cdfde94.webp"); --wp-art-v2: url("../img/watch-party/scenes/cinema-v2.89dc16595272.webp");
  --wp-art-main-sm: url("../img/watch-party/scenes/cinema-main-sm.3ead176304e8.webp"); --wp-art-v1-xs: url("../img/watch-party/scenes/cinema-v1-xs.fb2df180c5b8.webp"); --wp-art-v2-xs: url("../img/watch-party/scenes/cinema-v2-xs.17936a6424df.webp");
  --wp-art: var(--wp-art-main);
}

/* Scene choice. Listed after the theme rules so it wins on the same element. */
.wp-scene-v1, .wp-canceled.wp-scene-v1 { --wp-art: var(--wp-art-v1); }
.wp-scene-v2, .wp-canceled.wp-scene-v2 { --wp-art: var(--wp-art-v2); }

/* Featured card artwork follows the event's scene. */
.watch-party-featured-section .watch-party-featured-card[class*="theme-"] > .wp-artwork {
  background-image: var(--wp-art);
  background-position: center;
}

/* Genre gallery: main scene on top, the two variants as labelled thumbnails beneath. */
.wp-world-tile[class*="theme-"] .wp-artwork {
  background-image: var(--wp-art-main-sm);
  background-position: center;
}
.wp-world-scenes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  background: #0b1a27;
}
.wp-world-scenes__art {
  display: flex;
  align-items: end;
  min-width: 0;
  height: 88px;
  border-radius: 8px;
  border: 1px solid rgba(var(--wp-accent-rgb, 255, 219, 105), .43);
  background-position: center;
  background-size: cover;
  overflow: hidden;
}
.wp-world-scenes__art--v1 { background-image: var(--wp-art-v1-xs); }
.wp-world-scenes__art--v2 { background-image: var(--wp-art-v2-xs); }
.wp-world-scenes__art > span {
  display: block;
  width: 100%;
  padding: 13px 6px 7px;
  color: #fff7e9;
  text-shadow: 0 2px 8px #02040e;
  font-weight: 800;
  font-size: .6rem;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: .05em;
  background: linear-gradient(transparent, rgba(1, 6, 19, .89));
}
@media (max-width: 670px) {
  .wp-world-scenes__art { height: 110px; }
}

/* ==================== Uniform event cards ====================
 * One layout for every event card (lobby featured / upcoming / canceled, Community Hub):
 * scene banner on top, then genre + status, title, featured title, schedule,
 * description or cancellation reason, countdown (upcoming only), action.
 * Markup: templates/public_site/partials/wp_event_card.html */
.wp-event-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
  gap: clamp(14px, 2vw, 22px);
}
.wp-event-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(var(--wp-accent-rgb, 255, 255, 255), .5);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(14, 20, 38, .96), rgba(6, 10, 22, .98));
  color: #f4f5fc;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .34);
}
.wp-event-card > .wp-artwork {
  height: clamp(170px, 18vw, 230px);
  border-bottom: 3px solid var(--wp-rim, rgba(255, 255, 255, .25));
}
.wp-event-card--featured > .wp-artwork { height: clamp(210px, 27vw, 340px); }
.wp-event-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 14px;
  padding: clamp(18px, 2.6vw, 30px);
}
.wp-event-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.wp-event-card__genre,
.wp-event-card__status {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--wp-accent, #9fe8ff);
}
.wp-event-card__genre {
  padding: 5px 12px;
  border: 1px solid rgba(var(--wp-accent-rgb, 159, 232, 255), .6);
  border-radius: 999px;
}
.wp-event-card__title {
  margin: 0;
  font-family: var(--wp-title-font, Georgia, 'Times New Roman', serif);
  font-size: clamp(1.3rem, 2.2vw, 1.7rem);
  line-height: 1.2;
  color: #fff;
}
.wp-event-card--featured .wp-event-card__title { font-size: clamp(1.55rem, 3vw, 2.3rem); }
.wp-event-card__media { margin: 0; font-weight: 700; color: var(--wp-accent, #9fe8ff); }
.wp-event-card__when { display: grid; gap: 3px; margin: 0; }
.wp-event-card__when span {
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--wp-accent, #9fe8ff);
}
.wp-event-card__when strong { font-size: 1.02rem; }
.wp-event-card__desc { margin: 0; line-height: 1.55; color: #cfd6e6; }
.wp-event-card .watch-party-countdown {
  margin-top: 0;
  padding: 16px clamp(14px, 2vw, 22px);
  border-color: rgba(var(--wp-accent-rgb, 103, 232, 249), .3);
}
.wp-event-card .watch-party-countdown-values strong { color: var(--wp-accent, #fff); }
.wp-event-card__action {
  align-self: flex-start;
  margin-top: auto;
  display: inline-flex;
  gap: .4em;
  padding: 10px 18px;
  border-radius: 10px;
  background: var(--wp-accent, #9fe8ff);
  color: #06101f;
  font-weight: 800;
  text-decoration: none;
}
.wp-event-card__action:hover { filter: brightness(1.08); }
.wp-event-card__action:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

/* Canceled: same card, pink frame, reason instead of countdown. */
.wp-event-card--canceled { border-color: rgba(241, 163, 202, .8); }
.wp-event-card--canceled .wp-event-card__status {
  padding: 4px 10px;
  border: 1px solid rgba(255, 140, 170, .65);
  border-radius: 6px;
  background: rgba(120, 20, 50, .35);
  color: #ffc1d6;
}
.wp-event-card__reason {
  margin: 0;
  padding: 12px 14px;
  border-left: 3px solid #f1a3ca;
  border-radius: 0 8px 8px 0;
  background: rgba(255, 255, 255, .05);
  line-height: 1.55;
}
.wp-event-card__reason strong {
  display: block;
  margin-bottom: 4px;
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #ffc1d6;
}
.wp-event-card--canceled .wp-event-card__action { background: #f7b6d2; }
@media (prefers-reduced-motion: reduce) {
  .wp-event-card, .wp-event-card * { transition: none !important; animation: none !important; }
}

/* ==================== Genre title fonts ====================
 * Self-hosted Latin subsets (static/fonts/watch-party, OFL licenses alongside).
 * Only titles use them (via --wp-title-font); body text, dates, buttons and
 * countdown digits stay in the site font. A font downloads only on pages that
 * show that genre. Single-weight fonts declare a weight range to avoid faux bold. */
@font-face {
  font-family: 'WP Anime Title';
  src: url("../fonts/watch-party/anime-title.001b9536b4b5.woff2") format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'WP Cartoon Title';
  src: url("../fonts/watch-party/cartoon-title.455e6424a2be.woff2") format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'WP Sci-Fi Title';
  src: url("../fonts/watch-party/scifi-title.0bd6e2ed2ff4.woff2") format('woff2');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'WP Fantasy Title';
  src: url("../fonts/watch-party/fantasy-title.2f74f8b423a4.woff2") format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'WP Horror Title';
  src: url("../fonts/watch-party/horror-title.93af17aaf5ff.woff2") format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'WP Cinema Title';
  src: url("../fonts/watch-party/cinema-title.9d1e7d56f888.woff2") format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
.theme-anime, .wp-canceled[data-theme="anime"] { --wp-title-font: 'WP Anime Title', 'Shippori Mincho', Georgia, 'Times New Roman', serif; }
.theme-cartoon, .wp-canceled[data-theme="cartoon"] { --wp-title-font: 'WP Cartoon Title', Impact, 'Arial Black', sans-serif; }
.theme-scifi, .wp-canceled[data-theme="scifi"] { --wp-title-font: 'WP Sci-Fi Title', 'Trebuchet MS', Verdana, sans-serif; }
.theme-fantasy, .wp-canceled[data-theme="fantasy"] { --wp-title-font: 'WP Fantasy Title', Georgia, 'Times New Roman', serif; }
.theme-horror, .wp-canceled[data-theme="horror"] { --wp-title-font: 'WP Horror Title', Georgia, 'Times New Roman', serif; }
.theme-cinema, .wp-canceled[data-theme="cinema"] { --wp-title-font: 'WP Cinema Title', Georgia, 'Times New Roman', serif; }

/* Countdown digits stay in the readable site font on every page. */
.wp-detail-stage .watch-party-countdown-values strong { font-family: inherit; }

/* ==================== Genre countdown boxes ====================
 * One matching countdown-box style per genre, used on event cards and the
 * event detail page. Replaces the earlier partial set (Cartoon/Sci-Fi/Horror/Cinema only).
 * Only borders, backgrounds, shadows and shape change; sizes and spacing stay shared. */
[class*="theme-"] .watch-party-countdown .watch-party-countdown-values > span {
  border: 1px solid rgba(var(--wp-accent-rgb), .4);
  border-radius: 10px;
  background: rgba(var(--wp-accent-rgb), .07);
  box-shadow: none;
  clip-path: none;
  outline: none;
  transform: none;
}
/* Anime: paper lantern, a soft glow from the top. */
.theme-anime .watch-party-countdown .watch-party-countdown-values > span {
  border-color: rgba(var(--wp-accent-rgb), .55);
  border-radius: 14px;
  background: radial-gradient(circle at 50% 0%, rgba(var(--wp-accent-rgb), .24), rgba(var(--wp-accent-rgb), .04) 72%);
  box-shadow: 0 0 16px rgba(var(--wp-accent-rgb), .18);
}
/* Cartoon: comic panel, bold outline, hard shadow, alternating tilt. */
.theme-cartoon .watch-party-countdown .watch-party-countdown-values > span {
  border: 2px solid var(--wp-rim);
  border-radius: 6px;
  background: rgba(var(--wp-accent-rgb), .1);
  box-shadow: 4px 4px 0 rgba(0, 0, 0, .55);
  transform: rotate(-1.2deg);
}
.theme-cartoon .watch-party-countdown .watch-party-countdown-values > span:nth-child(even) { transform: rotate(1.2deg); }
/* Sci-Fi: HUD panel, thin glowing edge with clipped corners. */
.theme-scifi .watch-party-countdown .watch-party-countdown-values > span {
  border-color: rgba(var(--wp-accent-rgb), .65);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(var(--wp-accent-rgb), .14), rgba(var(--wp-accent-rgb), .02));
  box-shadow: inset 0 0 14px rgba(var(--wp-accent-rgb), .16);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
}
/* Fantasy: gilded frame, double border with a parchment sheen. */
.theme-fantasy .watch-party-countdown .watch-party-countdown-values > span {
  border: 3px double rgba(var(--wp-accent-rgb), .75);
  border-radius: 4px;
  background: linear-gradient(180deg, rgba(255, 244, 214, .07), rgba(var(--wp-accent-rgb), .06));
}
/* Horror: candlelit, dark vignette with an ember glow rising from below. */
.theme-horror .watch-party-countdown .watch-party-countdown-values > span {
  border-color: rgba(var(--wp-accent-rgb), .45);
  border-radius: 3px;
  background: radial-gradient(ellipse at 50% 125%, rgba(var(--wp-accent-rgb), .26), rgba(10, 0, 4, .65) 72%);
  box-shadow: inset 0 0 18px rgba(0, 0, 0, .8), 0 0 10px rgba(var(--wp-accent-rgb), .14);
}
/* Cinema: marquee, gold frame with a ring of bulb dots. */
.theme-cinema .watch-party-countdown .watch-party-countdown-values > span {
  border: 2px solid var(--wp-rim);
  border-radius: 6px;
  background: rgba(var(--wp-accent-rgb), .08);
  outline: 2px dotted rgba(255, 226, 150, .8);
  outline-offset: -7px;
}
/* Card countdowns match the detail page: genre-coloured heading, uppercase unit labels. */
.wp-event-card .watch-party-countdown .watch-party-detail-label { color: var(--wp-accent); }
.wp-event-card .watch-party-countdown-values > span { text-transform: uppercase; letter-spacing: .05em; font-size: .66rem; }
@media (max-width: 560px) {
  /* Narrow boxes: keep the marquee bulb ring clear of the unit labels. */
  .theme-cinema .watch-party-countdown .watch-party-countdown-values > span { outline-width: 1px; outline-offset: -4px; }
  .wp-detail-stage .watch-party-countdown-values > span,
  .wp-event-card .watch-party-countdown-values > span { letter-spacing: 0; font-size: .6rem; }
}