:root{color-scheme:dark;--up-ink:#101814;--up-deep:#152019;--up-paper:#f2f0e4;--up-neon:#d3fc67;--up-rule:#64775a;--up-muted:#a9afa3;--up-rust:#f27d4b;font-family:ui-monospace,Menlo,Consolas,"Courier New",monospace}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--up-ink)}body{margin:0;color:var(--up-paper);background:var(--up-ink)}
button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.38}a{color:inherit}
:focus-visible{outline:3px solid var(--up-neon);outline-offset:3px}
.up-visually-hidden{position:absolute!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;white-space:nowrap!important}
.up-skip-link{position:absolute;z-index:100;left:12px;top:-70px;padding:10px;color:#101814;background:var(--up-neon)}.up-skip-link:focus{top:12px}
.up-app{padding:clamp(8px,1.5vw,24px);min-height:100vh;display:grid;place-content:center}.up-stage-shell{width:min(100%,calc(94vh * 16 / 9));margin:auto;position:relative}.up-stage{aspect-ratio:16/9;width:100%;overflow:hidden;isolation:isolate;position:relative;background:var(--up-deep);border:1px solid var(--up-rule)}
.up-layer{position:absolute;inset:0}.up-layer--background{z-index:0}.up-layer--creatures{z-index:3;pointer-events:none}.up-layer--cards{z-index:4;pointer-events:none}.up-layer--time{z-index:5;pointer-events:none}.up-layer--ticker{z-index:6;pointer-events:none}
.up-background-color{position:absolute;inset:0;background:radial-gradient(ellipse at 62% 42%,#29412b 0%,#1e2c21 52%,#141d18 100%)}.up-background-color::after{content:"";position:absolute;inset:3.2%;border:1px solid rgba(220,237,197,.19);pointer-events:none}
.up-background-color::before{content:"";position:absolute;inset:0;opacity:.16;background-image:repeating-linear-gradient(0deg,transparent 0 42px,rgba(241,240,224,.16) 43px),repeating-linear-gradient(90deg,transparent 0 42px,rgba(241,240,224,.12) 43px);background-size:100% 100%}
.up-ambient-video,.up-field-canvas{width:100%;height:100%;object-fit:cover}
.up-card{width:100%;height:100%;position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:5% 10%;text-align:center;gap:min(1.6vw,22px)}
.up-card-eyebrow,.up-card-kicker,.up-card-subtitle,.up-card-location{margin:0;letter-spacing:.15em;text-transform:uppercase}.up-card-eyebrow{font-size:clamp(9px,.95vw,16px);color:var(--up-neon)}.up-card-kicker{font-size:clamp(10px,1.1vw,18px)}.up-card h2{font-family:Georgia,'Times New Roman',serif;font-weight:500;line-height:.95;letter-spacing:-.055em;margin:.03em 0;color:var(--up-paper);font-size:clamp(32px,5.7vw,110px)}
.up-card--title h2{font-size:clamp(36px,7.1vw,132px)}.up-card-subtitle{font-size:clamp(9px,1.15vw,18px)}.up-card-location{font-size:clamp(9px,1vw,16px);color:var(--up-muted)}
.up-card--notice{background:rgba(18,28,20,.91)}.up-card--notice h2{font-size:clamp(28px,5vw,92px);overflow-wrap:anywhere;max-width:100%}
.up-card--credits{background:rgba(19,31,23,.9)}.up-credits-content{font-size:clamp(9px,1vw,18px);letter-spacing:.1em;line-height:1.8}
.up-card--qr{background:rgba(19,31,23,.95)}.up-card--qr h2{font-size:clamp(28px,4vw,80px)}.up-qr-media{width:clamp(90px,17vw,250px);aspect-ratio:1;background:white;padding:8px}.up-qr-destination{font-size:clamp(10px,1.2vw,19px);letter-spacing:.11em}.up-qr-destination a{pointer-events:auto}
.up-stage-identity{position:absolute;z-index:2;left:4%;bottom:4%;letter-spacing:.16em;color:#c5d1ae;font-size:clamp(8px,.72vw,12px)}.up-stage-identity span{color:var(--up-neon)}
.up-clock-panel{position:absolute;top:5%;right:5%;display:flex;align-items:baseline;gap:1.5vw;color:var(--up-neon);background:rgba(13,23,16,.83);padding:1vw 1.5vw;border:1px solid rgba(211,252,103,.35)}.up-clock{font-variant-numeric:tabular-nums;font-size:clamp(22px,3.1vw,54px);font-weight:600}.up-clock-zone{font-size:clamp(8px,.75vw,12px);letter-spacing:.15em}
.up-countdown-panel{position:absolute;top:4%;left:5%;right:5%;margin:auto;text-align:center;background:rgba(15,25,18,.8);padding:1vw}.up-countdown-panel h2,.up-countdown-target{margin:0;font-size:clamp(9px,1vw,18px);font-weight:400;letter-spacing:.14em}.up-countdown-value{font-size:clamp(32px,5vw,93px);font-weight:700;font-variant-numeric:tabular-nums;margin:0;color:var(--up-neon)}
.up-ticker-layer{top:auto;bottom:0;height:auto;background:var(--up-neon);color:var(--up-ink);padding:.8% 0}.up-ticker-viewport{overflow:hidden}.up-ticker-track{font-size:clamp(11px,1.45vw,26px);font-weight:800;letter-spacing:.12em;margin:0;white-space:nowrap;display:inline-block;padding-left:100%;animation:up-ticker 20s linear infinite}@keyframes up-ticker{to{transform:translateX(-100%)}}
.up-sprite{position:absolute;top:0;left:0;display:block;pointer-events:none;will-change:transform}.up-sprite-orientation,.up-sprite-visual{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.up-original{width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}.up-sprite--emoji .up-sprite-visual{font-family:"Apple Color Emoji","Segoe UI Emoji",sans-serif;line-height:1}
.up-stage-controls{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:10px;padding:14px 0 0;font-size:11px;letter-spacing:.09em}.up-stage-controls button,.up-stage-controls a{border:1px solid var(--up-rule);padding:11px 12px;background:transparent;text-decoration:none;color:var(--up-paper)}.up-stage-controls .up-button--quiet{border-color:var(--up-neon);color:var(--up-neon)}
.up-stage-shell:fullscreen{width:100vw;height:100vh;background:#080e09;display:grid;place-items:center}.up-stage-shell:fullscreen .up-stage{width:min(100vw,calc(100vh * 16 / 9));height:min(100vh,calc(100vw * 9 / 16));max-width:none;max-height:none}.up-stage-shell:fullscreen .up-stage-controls{position:absolute;z-index:20;bottom:0;left:0;right:0;padding:12px;background:#0c130cee;opacity:0;transform:translateY(100%);transition:opacity .15s,transform .15s}.up-stage-shell:fullscreen .up-stage-controls:focus-within,.up-stage-shell:fullscreen .up-stage-controls:hover{opacity:1;transform:none}
.up-error-panel,.up-noscript{font-size:12px;padding:20px;max-width:660px}.up-error-panel{border:1px solid #d77}.up-diagnostics{font-size:12px}
[data-up-motion="paused"] .up-ticker-track,[data-up-motion="reduced"] .up-ticker-track{animation-play-state:paused}
[data-up-motion="reduced"] .up-ticker-track{transform:none;padding-left:0;white-space:normal}
@media(max-width:750px){.up-stage-shell{width:100%}.up-app{display:block}.up-card{padding:8% 5%;gap:1.3vw}.up-card--title h2{font-size:clamp(26px,6.5vw,60px)}.up-qr-media{width:clamp(70px,15vw,120px);padding:3px}.up-clock-panel{top:3%;right:3%}}
@media(prefers-reduced-motion:reduce){.up-ticker-track{animation:none!important;transform:none!important;padding-left:0!important;white-space:normal}}

/* 05U's authentic Monster Mixer SVG — not recreated artwork. */
.up-original-title-art {
  display:block;
  width:min(85%,960px);
  max-height:58%;
  object-fit:contain;
  background:#f1efe1;
  padding:clamp(7px,1.35vw,22px);
  border:1px solid rgba(213,252,103,.48);
}
/* Public Playroom already has its own accessible controls. */
[data-up-mode="public-embedded"] .up-stage-controls {display:none}


/* OCT 24 — SOURCE-PRESERVING PROJECTION QA CORRECTIONS
   Sizing is based on the actual stage rather than browser vw units.
   No changes to original creature artwork or the site's shared CSS. */
.up-app {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.up-stage-shell {
  flex: 0 0 auto;
  width: min(100%, calc((100dvh - 118px) * 16 / 9));
}
.up-stage {
  container-type: inline-size;
}
.up-card {
  gap: clamp(2px, 1.35cqw, 24px);
  padding: 3% 7%;
}
.up-card-eyebrow {font-size: clamp(8px, 1.05cqw, 20px);}
.up-card-kicker {font-size: clamp(8px, 1.15cqw, 21px);}
.up-card-subtitle {font-size: clamp(8px, 1.1cqw, 20px);}
.up-card-location {font-size: clamp(8px, 1.05cqw, 19px);}
.up-card h2 {font-size: clamp(20px, 5cqw, 94px);}
.up-card--title h2 {font-size: clamp(22px, 6cqw, 112px);}
.up-card--notice h2 {
  font-size: clamp(14px, 4.65cqw, 90px);
  line-height: 1.08;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.up-card--notice[data-up-length="medium"] h2 {font-size: clamp(12px, 3.4cqw, 66px);}
.up-card--notice[data-up-length="long"] h2 {font-size: clamp(10px, 2.45cqw, 47px);}
.up-card--qr h2 {font-size: clamp(16px, 4.3cqw, 82px); line-height: 1;}
.up-card--qr {gap: clamp(3px, 1.4cqw, 22px);}
.up-qr-media {
  flex: none;
  display: block;
  width: clamp(68px, min(22cqw, 30cqh), 340px);
  height: auto;
  aspect-ratio: 1;
  object-fit: contain;
  padding: clamp(2px, .45cqw, 9px);
}
.up-qr-destination {
  margin: 0;
  font-size: clamp(8px, 1.2cqw, 22px);
  letter-spacing: .045em;
  overflow-wrap: anywhere;
}
.up-card--credits .up-credits-content {font-size: clamp(8px, 1.08cqw, 21px);}
.up-original-title-art {
  width: min(82%, 970px);
  max-height: 54%;
  padding: clamp(4px, .95cqw, 18px);
}
.up-stage-identity {font-size: clamp(7px, .7cqw, 13px);}
.up-clock {font-size: clamp(15px, 3.1cqw, 56px);}
.up-clock-zone {font-size: clamp(8px, .9cqw, 15px);}
.up-countdown-panel h2, .up-countdown-target {font-size: clamp(8px, 1.15cqw, 19px);}
.up-countdown-value {font-size: clamp(23px, 5cqw, 95px);}
.up-ticker-track {font-size: clamp(10px, 1.5cqw, 27px);}
/* The original pointing asset remains recognizable at right; notices remain at left. */
.up-stage[data-up-giant-pointing="true"] .up-layer--creatures {z-index: 5;}
.up-stage[data-up-giant-pointing="true"] .up-layer--time {z-index: 6;}
.up-stage[data-up-giant-pointing="true"] .up-layer--ticker {z-index: 7;}
.up-stage[data-up-giant-pointing="true"] .up-card--notice,
.up-stage[data-up-giant-pointing="true"] .up-card--qr,
.up-stage[data-up-giant-pointing="true"] .up-card--title {
  padding: 3% 43% 3% 4%;
}
.up-stage[data-up-giant-pointing="true"] .up-original-title-art {width: 100%; max-height: 55%;}
.up-stage[data-up-giant-pointing="true"] .up-card--qr .up-qr-media {
  width: clamp(62px, min(20cqw, 27cqh), 290px);
}
.up-stage[data-up-giant-pointing="true"] .up-card--notice h2 {
  font-size: clamp(12px, 4cqw, 76px);
}
.up-stage[data-up-giant-pointing="true"] .up-card--notice[data-up-length="medium"] h2 {
  font-size: clamp(11px, 3cqw, 56px);
}
.up-stage[data-up-giant-pointing="true"] .up-card--notice[data-up-length="long"] h2 {
  font-size: clamp(10px, 2.2cqw, 41px);
}
.up-stage[data-up-giant-pointing="true"] .up-card--qr h2 {
  font-size: clamp(13px, 3.5cqw, 65px);
}
/* Mobile/embedded previews have the same responsive 16:9 composition. */
@media (max-width: 750px) {
  .up-app {display: flex;}
  .up-card {padding: 3% 5%;gap: clamp(2px, 1cqw, 10px);}
  .up-stage[data-up-giant-pointing="true"] .up-card--title,
  .up-stage[data-up-giant-pointing="true"] .up-card--notice,
  .up-stage[data-up-giant-pointing="true"] .up-card--qr {padding: 2% 43% 2% 3%;}
}
@media (max-height: 380px) and (min-width: 751px) {
  .up-stage-shell:not(:fullscreen) {width: min(100%, calc((100dvh - 65px) * 16 / 9));}
}
/* The public Playroom iframe already provides a 16:9 letterbox; no stage chrome. */
.up-app[data-up-mode="public-embedded"] {padding:0; min-height:100%;}
.up-app[data-up-mode="public-embedded"] .up-stage-shell {width:100%; max-width:100%; margin:0;}
.up-app[data-up-mode="public-embedded"] .up-stage {width:100%;}

/* Presentation safety controls: don't leak a stale hovered toolbar onto a projector.
   Pressing Tab still restores visible controls with :focus-within. */
.up-stage-shell:fullscreen .up-stage-controls.up-fullscreen-await-pointer:not(:focus-within){
  opacity:0;transform:translateY(100%);pointer-events:none;
}

/* ===== v3 EXPERIMENT · 24 Oct (Claude) — additive overrides only =====
   1. Original MONSTER MIXER SVG shown light on the dark stage (CSS invert of the
      file's #11110F ink -> near-white); the artwork file itself is untouched.
   2. Creatures cross IN FRONT of the title / thank-you / lower-third captions,
      but stay BEHIND practical text (big centred notice, QR) and the ticker/time.
   3. Lower-third caption variant of the existing notice card.
   4. Pegasus banner (text carried by the original Pegasus). */
.up-original-title-art{
  background:transparent;border:0;padding:0;
  width:min(94%,1180px);max-height:64%;
  filter:invert(1) drop-shadow(0 0 .9cqw rgba(211,252,103,.38)) drop-shadow(0 .25cqw .5cqw rgba(0,0,0,.65));
}
.up-stage[data-up-giant-pointing="true"] .up-original-title-art{width:100%;max-height:58%}
.up-stage:not([data-up-text-priority="high"]) .up-layer--creatures{z-index:5}
.up-stage:not([data-up-text-priority="high"]) .up-layer--time{z-index:6}
.up-stage:not([data-up-text-priority="high"]) .up-layer--ticker{z-index:7}
.up-card--notice[data-up-variant="lower"]{
  inset:auto auto 7% 4%;width:auto;height:auto;max-width:72%;
  align-items:flex-start;text-align:left;justify-content:flex-end;
  padding:1.1cqw 2.2cqw 1.3cqw;gap:.4cqw;
  background:rgba(13,23,16,.86);border-left:.55cqw solid var(--up-neon);
}
.up-card--notice[data-up-variant="lower"] .up-card-eyebrow{display:none}
.up-card--notice[data-up-variant="lower"] h2,
.up-card--notice[data-up-variant="lower"][data-up-length] h2{font-size:clamp(13px,3.1cqw,58px);line-height:1.05;text-wrap:balance}
.up-stage[data-up-giant-pointing="true"] .up-card--notice[data-up-variant="lower"]{padding:1.1cqw 2.2cqw 1.3cqw;max-width:48%}
.up-pegasus-banner{
  position:absolute;right:86%;top:38%;white-space:nowrap;
  background:var(--up-neon);color:var(--up-ink);
  font:800 clamp(11px,2.35cqw,44px)/1 ui-monospace,Menlo,Consolas,"Courier New",monospace;
  letter-spacing:.06em;padding:.55em .8em;border:2px solid #101814;
  box-shadow:0 .3cqw .9cqw rgba(0,0,0,.45);
}
.up-pegasus-banner::after{ /* the "tow line" from banner to Pegasus */
  content:"";position:absolute;left:100%;top:50%;width:1.6cqw;border-top:2px solid var(--up-neon);
}
/* v3 fix of a PRE-EXISTING bug (present in the original input, v1 and v2): the ticker
   rules above target `.up-ticker-layer`, a class the element never had, so the neon
   bottom band never rendered. Same rules, applied to the element's real class. */
.up-layer--ticker{top:auto;bottom:0;height:auto;background:var(--up-neon);color:var(--up-ink);padding:.8% 0}