:root{--bg:#151123;--card:#211b34;--ink:#fff;--muted:#bbb4cf;--yellow:#ffcc31;--purple:#7b2cff;--blue:#1686ff;--red:#ff3f59;--green:#1ed760}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:radial-gradient(circle at top,#342063 0,#151123 38%);color:var(--ink);font-family:ui-rounded,-apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;min-height:100vh;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}button,input,select{font:inherit}.topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 18px 8px}.eyebrow{font-size:11px;font-weight:900;letter-spacing:2px;color:var(--yellow)}h1{font-size:23px;margin:2px 0}.round{width:44px;height:44px;border-radius:50%;border:1px solid #ffffff25;background:#ffffff12;color:#fff;font-size:20px}main{padding:10px 14px 28px;max-width:720px;margin:auto}.card,.notice{background:linear-gradient(145deg,#29203e,#1d182e);border:1px solid #ffffff16;border-radius:24px;padding:18px;margin:12px 0;box-shadow:0 14px 40px #0005}.hidden{display:none!important}.hero{text-align:center}.logo{font-size:58px}.hero h2{font-size:30px;margin:6px}.hero p,.notice span{color:var(--muted);line-height:1.4}label{display:block;text-align:left;color:var(--muted);font-size:13px;font-weight:700;margin:14px 0 6px}input,select{width:100%;border:1px solid #ffffff22;background:#0e0c18;color:#fff;border-radius:14px;padding:14px;font-size:16px;margin-top:6px}button{border:0;border-radius:15px;padding:14px 16px;font-weight:900;color:#fff}.primary{background:linear-gradient(135deg,#ffca28,#ff8f00);color:#1a1022;width:100%;box-shadow:0 8px 18px #ff9b0038}.secondary{background:#ffffff12;border:1px solid #ffffff1d}.danger{background:#9f2637}.full{width:100%;margin-top:10px}.help{text-align:left;margin-top:16px;color:var(--muted)}.notice{display:grid;gap:8px;border-color:#ffcc3150}.notice button{justify-self:start;background:var(--yellow);color:#211729;padding:8px 12px}.scoreboard{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:12px}.team{text-align:center;border-radius:19px;padding:12px 6px}.team span{font-size:12px;font-weight:1000;letter-spacing:1px}.team strong{display:block;font-size:48px}.team div{display:flex;justify-content:center;gap:8px}.team button{width:42px;padding:8px;font-size:22px;background:#0003}.blue{background:linear-gradient(160deg,#1686ff,#0a3da5)}.red{background:linear-gradient(160deg,#ff5369,#a80b29)}.vs{font-weight:1000;padding:6px}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.results{margin-top:8px}.result{display:flex;width:100%;justify-content:space-between;text-align:left;background:#ffffff0b;border-bottom:1px solid #ffffff12;border-radius:0;padding:12px}.result small{display:block;color:var(--muted);margin-top:3px}.cardNo{display:inline-block;background:var(--yellow);color:#1a1022;font-weight:1000;border-radius:999px;padding:6px 12px}.song h2{font-size:30px;margin:14px 0 3px}.song>p{color:var(--muted);font-size:18px;margin-top:0}.timeBox{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;background:#0e0c18;border-radius:18px;padding:10px;margin:18px 0}.timeBox button{background:#ffffff12;font-size:18px}.timeBox label{text-align:center;margin:0}.timeBox input{text-align:center;font-size:27px;font-weight:1000;margin:4px 0;padding:8px}.timeBox small{display:block}.spotify{background:var(--green);color:#09180e;width:100%;margin-top:10px}.matches{margin-top:10px}.match{display:grid;grid-template-columns:46px 1fr auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid #ffffff13}.match img{width:46px;height:46px;border-radius:8px}.match small{display:block;color:var(--muted)}.match button{padding:9px;background:var(--purple)}.device{display:grid;grid-template-columns:1fr auto;gap:8px}.device select{margin:0}dialog{width:min(94vw,520px);border:1px solid #ffffff25;border-radius:24px;background:#191426;color:#fff;padding:16px}dialog::backdrop{background:#000b}.dialogHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.dialogHead button{padding:8px;background:#ffffff12}video{width:100%;border-radius:18px;background:#000;min-height:300px}.file{background:#ffffff12;padding:14px;border-radius:15px;text-align:center}.file input{display:none}@media(max-width:390px){.team strong{font-size:40px}.song h2{font-size:25px}}
.three{display:grid;grid-template-columns:1fr 1fr;gap:10px}.three .emotionBtn{grid-column:1/-1}
.emotionBtn{background:linear-gradient(135deg,#7b2cff,#ff3f9a);border:1px solid #ffffff25;box-shadow:0 8px 20px #7b2cff45}
.emotionDialog{overflow:hidden}
.emotionStage{text-align:center;background:radial-gradient(circle at top,#5c2da8 0,#241838 68%);border:1px solid #ffffff20;border-radius:24px;padding:22px 14px;margin:8px 0 14px;min-height:260px;display:flex;flex-direction:column;justify-content:center}
.emotionEmoji{font-size:92px;line-height:1;filter:drop-shadow(0 10px 18px #0008)}
.emotionStage h2{font-size:32px;margin:14px 0 6px}
.emotionStage p{margin:0;color:#d5cbea;line-height:1.4}
.emotionRoll{font-size:18px;padding:17px}
.emotionList{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.emotionList span{background:#ffffff0c;border:1px solid #ffffff12;border-radius:12px;padding:9px;font-size:12px;text-align:center;color:#d8d0e7}
.rolling{animation:diceShake .18s linear infinite}
@keyframes diceShake{0%{transform:rotate(-8deg) scale(.96)}25%{transform:rotate(8deg) scale(1.04)}50%{transform:rotate(-5deg) scale(1)}75%{transform:rotate(7deg) scale(1.03)}100%{transform:rotate(-8deg) scale(.96)}}
.resultFlash{animation:resultPop .42s ease-out}
@keyframes resultPop{0%{transform:scale(.65);opacity:.2}70%{transform:scale(1.12);opacity:1}100%{transform:scale(1)}}
@media(max-width:390px){.emotionEmoji{font-size:78px}.emotionStage h2{font-size:27px}}

.gameMenu h2{margin:0 0 14px;font-size:24px}.menuGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.menuButton{min-height:130px;text-align:left;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #ffffff20}.menuButton span{font-size:35px}.menuButton b{font-size:16px}.menuButton small{font-size:11px;opacity:.8;font-weight:700}.songRandom{background:linear-gradient(145deg,#ffb000,#ff6d00);color:#201020}.testRandom{background:linear-gradient(145deg,#7b2cff,#c03cff)}.decadeMenu{background:linear-gradient(145deg,#0ca7a0,#0662ae)}.menuButton.emotionBtn{background:linear-gradient(145deg,#e63487,#7b2cff);grid-column:auto}.spotifyHelp{background:#ffffff0b;border-radius:14px;padding:12px;line-height:1.4;font-size:14px!important}.decadeBadge{display:inline-block;margin-left:6px;background:#ffffff12;border:1px solid #ffffff20;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:900;color:#e3dcee}.testStage{text-align:center;background:radial-gradient(circle at top,#6233a7,#241838 70%);border-radius:22px;padding:24px 15px;margin-bottom:14px;min-height:270px;display:flex;flex-direction:column;justify-content:center}.testEmoji{font-size:88px}.testStage h2{font-size:31px;margin:12px 0 8px}.testStage p,.dialogIntro{color:#d5cbea;line-height:1.45}.decadeAction{width:100%;margin-top:10px;background:linear-gradient(135deg,#08b3a9,#0871bd);font-size:17px}.decadeGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.decadeGrid button{min-height:90px;background:linear-gradient(145deg,#302452,#1e3151);border:1px solid #ffffff20;display:flex;flex-direction:column;align-items:center;justify-content:center}.decadeGrid b{font-size:18px}.decadeGrid small{color:#cfc8df;margin-top:5px}.decadeGrid button:last-child{grid-column:1/-1}.song .spotify{font-size:18px;padding:17px}.song h2{margin-top:14px}@media(max-width:390px){.menuButton{min-height:115px}.testEmoji{font-size:72px}.testStage h2{font-size:27px}}

.spotifyConnectCard{display:flex;flex-direction:column;gap:12px}.spotifyConnectInfo{display:flex;align-items:center;gap:12px}.spotifyConnectInfo div{display:flex;flex-direction:column;gap:3px}.spotifyConnectInfo b{font-size:1.15rem}.spotifyConnectInfo small,.spotifyStatus{opacity:.75}.spotifyLogo{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#1ed760;color:#101010;font-size:24px;box-shadow:0 0 18px rgba(30,215,96,.35)}

.guessBtn{background:linear-gradient(145deg,#f7b500,#ef6c00)!important}.guessDialog{max-width:560px;width:calc(100% - 24px);border:0;border-radius:28px;background:#211a38;color:#fff;padding:18px}.guessStage{text-align:center;padding:12px}.guessIcon{font-size:74px;filter:drop-shadow(0 8px 18px #0008)}.guessCountdown{font-size:72px;font-weight:1000;min-height:88px;color:#ffd54a}.buzzers{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}.buzzers button{min-height:116px;border:0;border-radius:22px;color:#fff;font-size:20px;font-weight:1000}.blueBuzzer{background:linear-gradient(145deg,#1687ff,#0754c9)}.redBuzzer{background:linear-gradient(145deg,#ff4568,#c6143d)}.buzzers button:disabled{opacity:.35;filter:grayscale(.8)}.judgeControls{text-align:center;background:#ffffff10;border-radius:20px;padding:14px}.judgeGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.judgeGrid button{border:0;border-radius:16px;padding:16px 8px;font-weight:1000;font-size:16px}.correctBtn{background:#21d769;color:#08180e}.wrongBtn{background:#ff4867;color:white}.guessReveal{text-align:center;background:#ffffff10;border-radius:20px;padding:18px;margin-top:14px}.guessReveal small{letter-spacing:2px;color:#ffd54a;font-weight:900}.guessReveal h2{font-size:30px;margin:8px 0}.guessReveal p{font-size:19px}.guessReveal .spotify{width:100%;margin:8px 0}.guessPulse{animation:guessPulse .5s ease 3}@keyframes guessPulse{50%{transform:scale(1.2)}}