:root{--green:#3b5bdb;--green-light:#4c6ef5;--gold:#f5b800;--gold-dim:#f5b80026;--dark:#0d0f17;--card:#14172a;--card2:#1a1e35;--card3:#21263f;--text:#e8eaf6;--muted:#8892b0;--danger:#e05252;--radius:12px;--radius-sm:8px;--gradient-primary:#3b5bdb40;--gradient-accent:#f5b8000f}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--dark);color:var(--text);-webkit-tap-highlight-color:transparent;min-height:100vh;font-family:DM Sans,sans-serif;overflow-x:hidden}body:before{content:"";background:radial-gradient(ellipse at 15% 0%, var(--gradient-primary) 0%, transparent 55%), radial-gradient(ellipse at 85% 100%, var(--gradient-accent) 0%, transparent 50%);pointer-events:none;z-index:0;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes eq{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse-play{0%,to{box-shadow:0 0 #d4af3780}50%{box-shadow:0 0 0 10px #d4af3700}}.app-shell{z-index:1;max-width:480px;min-height:100vh;margin:0 auto;padding:0 16px 110px;animation:.2s fadeIn;position:relative}.app-header{text-align:center;padding:28px 0 20px}.league-badge{background:var(--gold);color:var(--dark);letter-spacing:2px;border-radius:20px;margin-bottom:8px;padding:4px 14px;font-family:Bebas Neue,sans-serif;font-size:11px;display:inline-block}.team-name{letter-spacing:2px;color:#fff;font-family:Bebas Neue,sans-serif;font-size:50px;line-height:1}.team-name span{color:var(--gold)}.season-tag{color:var(--muted);letter-spacing:1px;text-transform:uppercase;margin-top:4px;font-size:12px}.empty-state{text-align:center;padding:50px 24px}.empty-icon{opacity:.6;margin-bottom:16px;font-size:56px}.empty-title{color:var(--muted);margin-bottom:8px;font-family:Bebas Neue,sans-serif;font-size:28px}.empty-sub{color:var(--muted);opacity:.6;margin-bottom:28px;font-size:14px;line-height:1.5}.btn{border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;align-items:center;gap:7px;padding:10px 16px;font-family:DM Sans,sans-serif;font-size:13px;font-weight:600;text-decoration:none;transition:background .15s,transform .1s;display:flex}.btn:active{transform:scale(.97)}.btn-ghost{background:var(--card);color:var(--text);border:1px solid #ffffff14}.btn-ghost:hover{background:var(--card2)}.btn-primary{background:var(--green);color:#fff}.btn-primary:hover{background:var(--green-light)}.btn-gold{background:var(--gold);color:var(--dark)}.btn-gold:hover{background:#ffc920}.form-group{margin-bottom:16px}.form-label{letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);margin-bottom:7px;font-size:11px;font-weight:600;display:block}.form-input{background:var(--card);border-radius:var(--radius-sm);width:100%;color:var(--text);-webkit-appearance:none;border:1px solid #ffffff14;outline:none;padding:12px 14px;font-family:DM Sans,sans-serif;font-size:15px;transition:border-color .15s,box-shadow .15s}.form-input:focus{border-color:var(--green);box-shadow:0 0 0 3px #3b5bdb33}.form-input::placeholder{color:#fff3}.form-hint{color:var(--muted);opacity:.6;margin-top:5px;font-size:11px;line-height:1.4}.form-row{grid-template-columns:1fr 1fr;gap:12px;display:grid}.form-divider{border:none;border-top:1px solid #ffffff0f;margin:20px 0}.form-actions{gap:10px;margin-top:24px;display:flex}.form-actions .btn{flex:1;justify-content:center;padding:14px;font-size:15px}.setup-card{background:var(--card);border-radius:var(--radius);margin-top:8px;padding:20px}.setup-preview-box{background:var(--card2);border-radius:var(--radius-sm);margin:16px 0;padding:12px 14px;display:none}.setup-preview-box.show{display:block}.setup-preview-label{letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-size:10px}.setup-preview-url{color:var(--gold);word-break:break-all;font-size:13px;font-weight:600}.setup-error{color:var(--danger);text-align:center;margin-top:10px;font-size:13px}.modal-overlay{z-index:100;background:#000000b3;align-items:flex-end;display:none;position:fixed;inset:0}.modal-overlay.open{animation:.2s fadeIn;display:flex}.modal-sheet{background:var(--card);border-radius:20px 20px 0 0;width:100%;max-width:480px;max-height:82vh;margin:0 auto;padding:20px 16px 44px;animation:.25s slideUp;overflow-y:auto}.modal-handle{background:#ffffff26;border-radius:2px;width:36px;height:4px;margin:0 auto 18px}.modal-title{letter-spacing:1px;margin-bottom:5px;font-family:Bebas Neue,sans-serif;font-size:26px}.modal-sub{color:var(--muted);margin-bottom:18px;font-size:13px;line-height:1.4}.theme-grid{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.theme-swatch{cursor:pointer;border:2px solid #0000;border-radius:8px;transition:border-color .15s,transform .1s;overflow:hidden}.theme-swatch:active{transform:scale(.95)}.theme-swatch.active{border-color:#fff;box-shadow:0 0 0 1px #ffffff4d}.theme-swatch-colors{height:28px;display:flex}.theme-swatch-primary{flex:2}.theme-swatch-accent{flex:1}.theme-swatch-name{text-align:center;color:#ffffffd9;white-space:nowrap;text-overflow:ellipsis;background:#00000073;padding:3px 2px;font-size:9px;font-weight:600;overflow:hidden}.bottom-bar{bottom:env(safe-area-inset-bottom,0px);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:50;background:#0d0f17f5;border-top:1px solid #ffffff0f;justify-content:center;gap:8px;padding:10px 16px 16px;display:flex;position:fixed;left:0;right:0}.toast{background:var(--gold);color:var(--dark);z-index:200;white-space:nowrap;pointer-events:none;border-radius:20px;padding:10px 20px;font-size:13px;font-weight:700;transition:transform .3s;position:fixed;top:20px;left:50%;transform:translate(-50%)translateY(-80px)}.toast.show{transform:translate(-50%)translateY(0)}.form-screen-header{align-items:center;gap:12px;padding:20px 0 18px;display:flex}.back-btn{background:var(--card);width:36px;height:36px;color:var(--text);cursor:pointer;border:1px solid #ffffff14;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s;display:flex}.back-btn:hover{background:var(--card2)}.form-screen-title{letter-spacing:1px;font-family:Bebas Neue,sans-serif;font-size:30px}.page-footer{text-align:center;color:var(--muted);opacity:.65;padding:24px 0 8px;font-size:13px}.page-footer a{color:inherit;text-decoration:none}.page-footer a:hover{opacity:1}.now-playing{background:var(--green);border-radius:var(--radius);align-items:center;gap:14px;margin-bottom:20px;padding:16px 18px;transition:box-shadow .3s;display:flex;position:relative;overflow:hidden}.now-playing:before{content:"";background:linear-gradient(135deg,#ffffff0f 0%,#0000 60%);position:absolute;inset:0}.lineup{flex-direction:column;gap:7px;display:flex}.player-card{background:var(--card);border-radius:var(--radius);cursor:pointer;-webkit-user-select:none;user-select:none;border:1px solid #ffffff0a;align-items:center;gap:11px;padding:12px 14px;transition:background .15s,transform .15s,box-shadow .15s;display:flex}.player-card:hover{background:var(--card2)}.player-card.active{background:var(--card2);box-shadow:inset 3px 0 0 var(--gold);border-color:#f5b8004d}.bat-number{color:var(--muted);text-align:center;flex-shrink:0;width:24px;font-family:Bebas Neue,sans-serif;font-size:22px;line-height:1}.player-card.active .bat-number{color:var(--gold)}.jersey-num{width:30px;height:30px;color:var(--gold);background:#3b5bdb66;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-family:Bebas Neue,sans-serif;font-size:16px;display:flex}.card-info{flex:1;min-width:0}.card-name{color:var(--text);font-size:15px;font-weight:600;line-height:1.2}.card-song{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.section-header{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.section-title{letter-spacing:1px;color:var(--text);font-family:Bebas Neue,sans-serif;font-size:22px}.pill-count{background:var(--gold-dim);color:var(--gold);vertical-align:middle;border-radius:10px;margin-left:6px;padding:2px 8px;font-size:10px;font-weight:700;position:relative;top:-1px}.sign-in-btn{color:#333;border-radius:var(--radius-sm);cursor:pointer;background:#fff;border:none;align-items:center;gap:10px;padding:12px 24px;font-family:DM Sans,sans-serif;font-size:14px;font-weight:600;transition:background .15s,transform .1s;display:inline-flex}.sign-in-btn:hover{background:#f0f0f0}.sign-in-btn:active{transform:scale(.97)}.sign-in-btn img{width:18px;height:18px}.user-bar{background:var(--card);border-radius:var(--radius-sm);align-items:center;gap:10px;margin-bottom:16px;padding:8px 14px;display:flex}.user-bar img{border-radius:50%;width:28px;height:28px}.user-bar-name{color:var(--text);flex:1;font-size:13px;font-weight:600}.user-bar-signout{color:var(--muted);cursor:pointer;background:0 0;border:none;font-family:DM Sans,sans-serif;font-size:11px;font-weight:600}.user-bar-signout:hover{color:var(--text)}
