/* SHOWTIME: a bold, television-first Christmas party-show identity. */
:root{--show-ink:#152038;--show-red:#e8433e;--show-cream:#fff4d9;--show-yellow:#ffd45a;--show-mint:#95e4ce}
body{background:#131e31}.btn{border-radius:4px;font-weight:950;letter-spacing:.02em}.btn-red{background:#ed4540;box-shadow:0 5px 0 #9b292e}.btn-cream{background:#ffe39a;box-shadow:0 5px 0 #a36b36}.page-home .main{padding:0;max-width:none}.page-home .topbar{display:none}
.splash{min-height:100svh;display:flex;align-items:center;padding:5vh clamp(24px,8vw,128px);isolation:isolate;background:#1b3042}.splash:before{inset:0;background-image:url('assets/showtime-stage-v1.png'),url('assets/pixel-flappy-world.png');background-position:center;background-size:cover;opacity:1}.splash:after{background:linear-gradient(90deg,#13283df5 0%,#13283de8 38%,#13283d66 72%,#13283d30 100%)}
.splash-content{width:min(700px,70%);position:relative;z-index:2}.splash-presented{color:#fff0c8;font-size:clamp(10px,1.05vw,15px);letter-spacing:.24em}.splash-presented span{color:#f7c757;margin:0 8px}.splash-logo{font-family:Impact,'Arial Black',sans-serif;font-weight:900;font-size:clamp(150px,22vw,325px);letter-spacing:-.095em;line-height:.72;color:#fff3d4;margin:35px 0 23px;text-shadow:6px 7px 0 #e34940,10px 12px 0 #13263b}.splash-logo span{color:#ffd05b}.splash-subtitle{display:inline-block;background:#ed4540;color:#fff4df;transform:rotate(-2deg);padding:8px 16px 9px;font-size:clamp(16px,2vw,27px);letter-spacing:.12em;box-shadow:5px 5px 0 #172238}.splash-content p{font-weight:750;font-size:clamp(17px,1.8vw,24px);color:#fff1d9;line-height:1.35;margin:25px 0}.splash-actions{gap:18px}.splash-actions .btn{border:3px solid #fff2d8;background:#ec4941;box-shadow:5px 6px 0 #152038;padding:17px 23px;font-size:18px;letter-spacing:.06em}.splash-actions .btn span{font-size:24px;margin-left:23px}.splash-secondary{font-size:13px;letter-spacing:.08em;color:#fff2d8;border-bottom:2px solid #ffdc88;border-radius:0}.splash-settings{font-size:10px;letter-spacing:.11em;color:#d5e2dc;margin-top:22px}.splash-badge{position:absolute;right:8%;top:22%;width:clamp(165px,19vw,285px);aspect-ratio:1;border-radius:50%;background:#f9d265;color:#18263c;border:5px solid #fff2d5;box-shadow:9px 11px 0 #17233899;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transform:rotate(10deg);animation:badge-in .8s cubic-bezier(.17,.89,.32,1.3) both}.splash-badge span{font-size:12px;font-weight:1000;letter-spacing:.25em}.splash-badge strong{font-family:Impact,'Arial Black',sans-serif;font-size:clamp(26px,3.3vw,48px);line-height:.85;margin:9px 0}.splash-badge b{color:#d84b40;letter-spacing:.25em}.splash-bottom{position:absolute;bottom:20px;left:8%;font-size:10px;letter-spacing:.14em;font-weight:900;color:#ffedcb}.splash-bottom span{color:#ffd05b;margin:0 12px}
@keyframes badge-in{from{opacity:0;transform:rotate(-20deg) scale(.2)}to{opacity:1;transform:rotate(10deg) scale(1)}}
/* Setup belongs to the same show, while remaining easy to use. */
.page-setupPeople,.page-setupLineup,.page-players,.page-rounds,.page-settings,.page-games,.page-scores{background:radial-gradient(circle at 90% 5%,#285260,#14273c 58%,#101b2d)}.topbar{border-color:#ffebbd35}.home-link{font-family:Impact,'Arial Black',sans-serif;color:#fff0d2;font-size:36px}.home-link small{font-family:system-ui;color:#ffcf70}.panel{background:#173042;border:2px solid #71919766;border-radius:8px;box-shadow:7px 7px 0 #0c18267d}.page-head h1{font-family:Impact,'Arial Black',sans-serif;letter-spacing:.005em;text-transform:uppercase;color:#fff2d9}.avatar{border-radius:8px;background:#ffd875}
/* The room is a graphic broadcast package; each game still supplies its own world. */
.live{background:#112438}.live:before{opacity:.6;transform:scale(1.04);animation:show-world-in 1.4s ease-out both}.live:after{background:linear-gradient(180deg,#10233999,#10223888 45%,#0b1a2ae0)}@keyframes show-world-in{from{transform:scale(1.15);filter:blur(7px)}to{transform:scale(1.04);filter:blur(0)}}
.live .eyebrow,.game-progress{letter-spacing:.2em;font-weight:950}.live>.control-bar .btn{border-radius:5px;text-transform:uppercase;letter-spacing:.07em;font-size:13px}.live>.control-bar .btn-red{background:#f04e45;border:2px solid #fff0cf;box-shadow:4px 5px 0 #0a1b2d}.live>.control-bar .btn-outline{background:#102335b3;border-color:#ffffff45}.hint{opacity:.8}.game-progress{background:#102338d9;border-left:4px solid #f5cb65;padding:9px 12px;top:14px;left:16px}
.phase-round-intro,.phase-intro,.phase-transition,.phase-title,.phase-match-result,.phase-round-result{overflow:visible}.round-announce h2,.game-title-scene h2,.ready-scene h2,.result-scene h2{font-family:Impact,'Arial Black',sans-serif;text-transform:uppercase;letter-spacing:.015em}.round-announce h2{font-size:clamp(105px,19vw,260px);line-height:.78;color:#fff1d4;text-shadow:6px 7px 0 #e34c42,11px 12px 0 #10263b;transform:rotate(-3deg);margin:18px 0 30px}.round-announce h2 span{color:#ffd15f}.round-announce p,.matchup-game{display:inline-block;background:#f4d178;color:#1b283a;padding:8px 18px;transform:rotate(1deg);font-weight:950;letter-spacing:.06em;text-transform:uppercase;box-shadow:5px 6px 0 #0e1d30}.round-announce .eyebrow{font-size:clamp(12px,1.2vw,17px);color:#a8edd9}
.matchup-scene .eyebrow{font-size:clamp(11px,1.2vw,17px);color:#fff0cc}.matchup-game{font-size:clamp(15px,2vw,26px);background:#fae4b1;transform:rotate(-2deg);margin-top:10px}.versus{gap:clamp(12px,2vw,35px);margin:22px auto}.competitor{position:relative;width:clamp(170px,24vw,315px);min-width:0;border:4px solid #fff1d3;border-radius:8px;background:#d94b42;box-shadow:8px 9px 0 #0c1e30;font-family:Impact,'Arial Black',sans-serif;font-size:clamp(26px,3.7vw,53px);letter-spacing:.03em;text-transform:uppercase;line-height:1;padding:12px 8px 16px;overflow-wrap:anywhere;transform:rotate(-3deg)}.competitor:last-child{background:#429e9b;transform:rotate(3deg)}.competitor .face{font-family:system-ui;font-size:clamp(60px,13vh,125px);line-height:1.1;margin:0 0 10px}.competitor small{font:950 11px system-ui;color:#fff4d2;letter-spacing:.16em;margin:10px 0 0}.vs{font-family:Impact,'Arial Black',sans-serif;font-size:clamp(70px,11vw,140px);line-height:1;color:#ffdc72;text-shadow:4px 5px 0 #cf493f,8px 9px 0 #0d1e31;transform:rotate(-8deg)}.matchup-tag{margin-top:16px;color:#fff3d8;font-size:13px;letter-spacing:.2em}
.portal-scene{width:100%;height:100%;display:grid;place-items:center}.portal-ring{position:absolute;width:170vmax;max-width:none;border:0;background:repeating-conic-gradient(#ec4c42 0deg 30deg,#fff0cd 30deg 60deg);animation:show-iris 1.4s ease-in both}.portal-icon{font-size:clamp(100px,18vh,210px);filter:drop-shadow(5px 8px 0 #14273b);animation:show-pop 1.3s ease-in both}.portal-copy{position:absolute;bottom:12%;font-size:16px;color:#15263b;background:#ffdc77;padding:8px 15px;z-index:1;transform:rotate(-3deg)}@keyframes show-iris{from{transform:scale(.05) rotate(-35deg);opacity:0}35%{opacity:1}to{transform:scale(1) rotate(10deg);opacity:1}}@keyframes show-pop{from{transform:scale(.1) rotate(-30deg)}50%{transform:scale(1.1) rotate(5deg)}to{transform:scale(2);opacity:0}}
.game-title-scene{width:min(1100px,94%);max-width:none}.game-title-kicker{display:inline-block;background:#f6d16a;color:#16263b;padding:8px 13px;transform:rotate(-2deg)}.game-title-icon{font-size:clamp(70px,14vh,150px);filter:drop-shadow(5px 7px 0 #122638);animation:title-icon .7s .15s cubic-bezier(.16,1.4,.36,1) both}.game-title-scene h2{font-size:clamp(70px,11vw,160px);line-height:.8;color:#fff2d5;text-shadow:6px 7px 0 #dc4a42,10px 12px 0 #10263b;margin:15px 0 24px;transform:rotate(-2deg)}.game-title-ribbon{background:#e84b42;color:#fff6df;border-radius:0;font-size:12px;transform:rotate(2deg);letter-spacing:.16em}.game-title-tagline{font-size:clamp(13px,1.5vw,19px);color:#fff5d9;letter-spacing:.13em}@keyframes title-icon{from{transform:scale(.3) rotate(-20deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}
.tutorial-label{color:#11253a;background:#fbd267;display:inline-block;padding:7px 13px;transform:rotate(-2deg);font-size:13px}.tutorial-copy{background:#fff1d5;color:#15283c;border:4px solid #fbd16c;border-radius:5px;box-shadow:8px 9px 0 #102238;transform:rotate(1deg)}.tutorial-copy h2{font-family:Impact,'Arial Black',sans-serif;text-transform:uppercase;letter-spacing:.02em}.tutorial-step span{background:#e44a40;color:#fff3d9}.tutorial-step p{color:#24364a}.tutorial-tip{color:#b13633}.demo-screen{border:4px solid #fff1d5!important;border-radius:5px!important;box-shadow:8px 9px 0 #102238}.tutorial-push{color:#ffe09a}
.countdown-scene .count-number{font-family:Impact,'Arial Black',sans-serif;color:#fff2d5;text-shadow:7px 8px 0 #e44b42,12px 14px 0 #10263b}.result-scene h2{font-size:clamp(48px,7vw,100px);color:#fff1d4;text-shadow:4px 5px 0 #dd4b41,8px 9px 0 #10263b}.result-card{border:3px solid #fff0d1!important;border-radius:5px!important;background:#17344a!important;box-shadow:5px 6px 0 #102034}.result-card.winner{background:#27645b!important;border-color:#ffe394!important}
/* Compact viewport adjustments keep the controls visible on a laptop and iPad. */
@media(max-height:700px){.splash-logo{font-size:clamp(125px,20vw,230px);margin:20px 0 16px}.splash-content p{margin:14px 0}.splash-settings{margin-top:12px}.game-title-icon{max-height:16vh}.game-title-scene h2{font-size:clamp(58px,9vw,110px)}.round-announce h2{font-size:clamp(88px,15vw,175px)}.competitor .face{font-size:clamp(48px,9vh,75px)}.competitor{font-size:clamp(23px,3vw,36px)}.vs{font-size:clamp(60px,8vw,100px)}.versus{margin:13px auto}.game-title-icon{margin:8px auto}.game-title-tagline{margin-top:10px}}
@media(max-width:700px){.splash{padding:45px 24px;align-items:center}.splash-content{width:100%}.splash-logo{font-size:clamp(135px,31vw,210px)}.splash-badge{right:-26px;top:12%;width:140px;opacity:.9}.splash-badge strong{font-size:27px}.splash-content p{font-size:17px}.splash-bottom{left:24px;font-size:8px}.competitor{width:34vw;font-size:clamp(20px,5vw,32px)}.matchup-game{font-size:14px}.vs{font-size:50px}.game-title-scene h2{font-size:clamp(48px,11vw,75px)}.tutorial-copy h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){.splash-badge,.live:before,.portal-ring,.portal-icon,.game-title-icon{animation-duration:.01ms!important;animation-delay:0s!important}}
.tutorial-copy h2{color:#172b40}
/* The central versus mark arrives with an impact rather than sitting on the page. */
.matchup-scene .vs{position:relative;isolation:isolate}.matchup-scene .vs:before{content:'✦';position:absolute;inset:-.35em;display:grid;place-items:center;color:#ffdc6a;font-size:1.8em;opacity:.16;z-index:-1;animation:vs-impact .55s 2.15s both}@keyframes vs-impact{from{transform:scale(.1) rotate(-35deg);opacity:.8}to{transform:scale(1.1) rotate(10deg);opacity:.16}}