@import "https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@400;500;600;700&display=swap";:root{--bg-primary:#0a0e1a;--bg-secondary:#111827;--bg-elevated:#1a1f35;--bg-glass:#ffffff0f;--bg-glass-hover:#ffffff1a;--text-primary:#f0f2f5;--text-secondary:#9ca3af;--text-muted:#4b5563;--accent-primary:#6366f1;--accent-primary-glow:#6366f14d;--accent-gold:#f59e0b;--accent-silver:#94a3b8;--success:#10b981;--error:#ef4444;--warning:#f59e0b;--border-subtle:#ffffff14;--border-glass:#ffffff1f;--shadow-glass:0 8px 32px #0006;--shadow-glow:0 0 20px var(--accent-primary-glow);--font-display:"Bebas Neue", sans-serif;--font-body:"Inter", sans-serif;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--team-primary:var(--accent-primary);--team-secondary:var(--text-primary)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-body);background:var(--bg-primary);color:var(--text-primary);min-height:100dvh;overflow-x:hidden}#root{flex-direction:column;min-height:100dvh;display:flex}h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:.02em;text-transform:uppercase;font-weight:400}h1{font-size:3rem;line-height:1.1}h2{font-size:2rem;line-height:1.2}h3{font-size:1.5rem;line-height:1.3}h4{font-size:1.25rem;line-height:1.4}.glass{background:var(--bg-glass);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-glass);border-radius:var(--radius-lg);box-shadow:var(--shadow-glass)}.glass-elevated{-webkit-backdrop-filter:blur(24px);border-radius:var(--radius-lg);background:#ffffff14;border:1px solid #ffffff26;box-shadow:0 16px 48px #00000080}.app-shell{width:100%;max-width:480px;padding:var(--space-md);flex-direction:column;min-height:100dvh;margin:0 auto;display:flex}.screen{gap:var(--space-lg);flex-direction:column;flex:1;animation:.3s ease-out fadeSlideIn;display:flex}.app-topbar{padding:var(--space-sm) 0;margin-bottom:var(--space-sm);border-bottom:1px solid var(--border-subtle);justify-content:center;align-items:center;display:flex}.app-topbar-logo{font-family:var(--font-display);color:var(--text-muted);cursor:pointer;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);letter-spacing:.03em;background:0 0;border:none;font-size:1.4rem;transition:color .2s,background .2s}.app-topbar-logo:hover{color:var(--text-primary);background:#ffffff0a}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.btn{font-family:var(--font-body);border-radius:var(--radius-md);cursor:pointer;justify-content:center;align-items:center;gap:var(--space-sm);padding:var(--space-md) var(--space-xl);border:none;min-height:48px;font-size:.938rem;font-weight:600;transition:all .2s;display:inline-flex;position:relative;overflow:hidden}.btn-primary{background:var(--accent-primary);color:#fff;box-shadow:0 4px 16px var(--accent-primary-glow)}.btn-primary:hover{box-shadow:0 6px 24px var(--accent-primary-glow);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--bg-glass);color:var(--text-primary);border:1px solid var(--border-glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.btn-secondary:hover{background:var(--bg-glass-hover)}.btn-ghost{color:var(--text-secondary);background:0 0}.btn-ghost:hover{color:var(--text-primary);background:#ffffff0a}.btn-danger{background:var(--error);color:#fff}.btn-success{background:var(--success);color:#fff}.btn-large{padding:var(--space-lg) var(--space-2xl);border-radius:var(--radius-lg);min-height:56px;font-size:1.125rem}.btn-block{width:100%}.input{font-family:var(--font-body);background:var(--bg-glass);border:1px solid var(--border-glass);border-radius:var(--radius-md);color:var(--text-primary);padding:var(--space-md);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);outline:none;width:100%;min-height:48px;font-size:1rem;transition:border-color .2s,box-shadow .2s}.input:focus{border-color:var(--team-primary);box-shadow:0 0 0 3px #6366f126}.input::placeholder{color:var(--text-muted)}.card{padding:var(--space-lg)}.card-sm{padding:var(--space-md)}.team-themed{position:relative}.team-themed:before{content:"";background:radial-gradient(ellipse at top center, var(--team-primary), transparent 70%);opacity:.15;pointer-events:none;z-index:0;height:50%;position:absolute;top:0;left:0;right:0}.team-themed>*{z-index:1;position:relative}.timer-display{font-family:var(--font-display);text-align:center;color:var(--text-primary);font-size:4.5rem;line-height:1;transition:color .3s,transform .3s}.timer-warning{color:var(--warning);animation:.6s ease-in-out infinite timerPulse}.timer-expired{color:var(--error);animation:.3s ease-out timerShake}@keyframes timerPulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@keyframes timerShake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.roster-grid{gap:var(--space-sm);flex-direction:column;display:flex}.roster-slot{align-items:center;gap:var(--space-md);padding:var(--space-md);border-radius:var(--radius-md);min-height:52px;display:flex}.roster-slot-label{font-family:var(--font-display);color:var(--text-muted);text-align:center;flex-shrink:0;width:32px;font-size:1.25rem}.roster-slot-active .roster-slot-label{color:var(--team-secondary)}.roster-slot-filled{border-color:#ffffff26}.roster-slot-empty{border:1px dashed var(--border-subtle)}.roster-slot-current{border:1px solid var(--border-subtle);opacity:.6}@keyframes spin-pulse{0%,to{box-shadow:0 0 #6366f199}50%{box-shadow:0 0 0 14px #6366f100}}@keyframes bounce-arrow{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}.spin-btn-pulse{animation:2s ease-in-out infinite spin-pulse}.spin-arrow-indicator{text-align:center;color:var(--accent-primary);opacity:.8;margin-bottom:var(--space-xs);font-size:1.5rem;animation:1.2s ease-in-out infinite bounce-arrow}.roster-awaiting{opacity:.5}.roster-player-name{font-family:var(--font-display);color:var(--text-primary);font-size:1.25rem}.feedback-success{color:var(--success);animation:.3s ease-out feedbackSlideIn}.feedback-error{color:var(--error);animation:.3s ease-out feedbackSlideIn}@keyframes feedbackSlideIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.interstitial{background:var(--bg-primary);justify-content:center;align-items:center;gap:var(--space-xl);z-index:100;flex-direction:column;animation:.3s ease-out fadeIn;display:flex;position:fixed;inset:0}.interstitial-name{font-family:var(--font-display);color:var(--text-primary);text-align:center;font-size:3.5rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:var(--space-lg);z-index:90;background:#0009;justify-content:center;align-items:center;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.modal-content{width:100%;max-width:400px;max-height:85vh;overflow-y:auto}.spinner-container{align-items:center;gap:var(--space-lg);flex-direction:column;display:flex}.spinner-result{font-family:var(--font-display);color:var(--team-secondary);text-align:center;padding:var(--space-lg);border:2px solid var(--team-primary);box-shadow:0 0 24px rgba(var(--team-primary), .3);font-size:2rem}@media (width>=768px){h1{font-size:4rem}.timer-display{font-size:6rem}.app-shell{max-width:600px}}.text-center{text-align:center}.text-muted{color:var(--text-secondary)}.text-gold{color:var(--accent-gold)}.text-team{color:var(--team-secondary)}.mt-auto{margin-top:auto}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.flex-col{flex-direction:column;display:flex}.flex-row{flex-direction:row;display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.w-full{width:100%}