:root{--color-brand:#0400f5;--color-brand-light:#4a47ff;--color-brand-deep:#020099;--color-accent:#c38a32;--color-danger:#d1242f;--color-surface:#fff;--color-surface-2:#f5f6ff;--color-border:#cfd3ef;--color-text:#1f2328;--color-text-muted:#656d76;--radius:10px;--shadow:0 8px 18px #0400f51f;--transition:.2s ease}@media (prefers-color-scheme:dark){:root{--color-surface:#0d1124;--color-surface-2:#171d3a;--color-border:#333e70;--color-text:#eef1ff;--color-text-muted:#afb8d6;--shadow:0 10px 24px #00000073}}[data-theme=dark]{--color-surface:#0d1124;--color-surface-2:#171d3a;--color-border:#333e70;--color-text:#eef1ff;--color-text-muted:#afb8d6;--shadow:0 10px 24px #00000073}[data-theme=light]{--color-surface:#fff;--color-surface-2:#f5f6ff;--color-border:#cfd3ef;--color-text:#1f2328;--color-text-muted:#656d76;--shadow:0 8px 18px #0400f51f}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--color-surface);height:100%;color:var(--color-text);-webkit-tap-highlight-color:transparent;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:16px}#app{flex-direction:column;min-height:100dvh;display:flex}.btn{border-radius:var(--radius);cursor:pointer;transition:opacity var(--transition), transform var(--transition);white-space:nowrap;-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;gap:6px;padding:10px 18px;font-size:.95rem;font-weight:600;display:inline-flex}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.45;pointer-events:none}.btn-primary{background:linear-gradient(145deg, var(--color-brand-light), var(--color-brand));color:#fff}.btn-secondary{background:var(--color-surface-2);color:var(--color-text);border:1px solid var(--color-border)}.btn-danger{background:var(--color-danger);color:#fff}.btn-accent{background:var(--color-accent);color:#151515}.btn-sm{padding:6px 12px;font-size:.82rem}.btn-lg{padding:14px 28px;font-size:1.05rem}.btn-icon{border-radius:50%;padding:8px}.card{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.badge{border-radius:999px;align-items:center;padding:2px 8px;font-size:.75rem;font-weight:700;display:inline-flex}.badge-brand{background:var(--color-brand);color:#fff}.badge-accent{background:var(--color-accent);color:#000}.badge-muted{background:var(--color-border);color:var(--color-text-muted)}.section-title{letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:10px;font-size:.7rem;font-weight:700}.app-header{background:radial-gradient(1200px 240px at 0% 0%, #fff3, transparent), linear-gradient(145deg, var(--color-brand-light), var(--color-brand-deep));color:#fff;z-index:100;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;display:flex;position:sticky;top:0}.app-header h1{letter-spacing:.01em;font-size:1rem;font-weight:800;line-height:1.05}.brand-block{align-items:center;gap:10px;min-width:0;display:flex}.club-logo,.club-logo-fallback{border:2px solid color-mix(in srgb, #fff 72%, var(--color-brand));border-radius:50%;flex-shrink:0;width:44px;height:44px;box-shadow:0 4px 12px #00000038}.club-logo{object-fit:cover;background:#fff}.club-logo-fallback{letter-spacing:.04em;color:var(--color-brand);background:#fff;justify-content:center;align-items:center;font-size:.9rem;font-weight:800;display:inline-flex}.brand-copy{min-width:0}.brand-copy p{letter-spacing:.06em;text-transform:uppercase;opacity:.88;margin-top:1px;font-size:.74rem;font-weight:700}.btn-header-settings{color:#fff;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#ffffff26;border:1px solid #ffffff57}.app-body{flex-direction:column;flex:1;gap:12px;width:100%;max-width:600px;margin:0 auto;padding:12px;display:flex}.in-play-layout{gap:10px}.live-compact-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:8px;display:grid}.timer-card-compact,.goal-card-compact{min-width:0;padding:10px 12px;overflow:hidden}@media (width<=460px){.app-header{padding:10px 12px}.club-logo,.club-logo-fallback{width:38px;height:38px}.brand-copy h1{font-size:.88rem}.brand-copy p{font-size:.66rem}.btn-header-settings{padding:6px 10px}}.goal-card-compact .score-display{gap:14px;padding:2px 0}.goal-card-compact .score-sep{font-size:1.6rem}.goal-card-compact .btn{white-space:normal;min-width:0;padding:8px 10px;line-height:1.1}@media (width<=380px){.live-compact-grid{grid-template-columns:1fr}}@media (orientation:portrait) and (width<=900px){.live-compact-grid{grid-template-columns:1fr}}.modal-backdrop{z-index:200;background:#0000008c;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.modal-sheet{background:var(--color-surface);border-radius:var(--radius) var(--radius) 0 0;width:100%;max-width:600px;max-height:90dvh;padding:20px;overflow-y:auto}.modal-sheet-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.modal-sheet-header h2{font-size:1.1rem}.score-display{justify-content:center;align-items:center;gap:24px;padding:8px 0;display:flex}.score-display .score-value{font-size:3rem;font-weight:800;line-height:1}.score-display .score-sep{color:var(--color-text-muted);font-size:2rem;font-weight:300}.score-display .score-label{text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);text-align:center;font-size:.65rem}.timer-display{font-variant-numeric:tabular-nums;letter-spacing:.04em;color:var(--color-text);text-align:center;font-size:2.5rem;font-weight:800}.timer-display.running{color:var(--color-brand-light)}.timer-display.halftime{color:var(--color-accent)}.timer-display.overrun{color:var(--color-danger)}.player-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.group-dropzone{border-radius:var(--radius);transition:border-color var(--transition), background var(--transition);border:1px dashed #0000;padding:6px}.group-dropzone.drag-over{border-color:var(--color-brand);background:color-mix(in srgb, var(--color-brand) 8%, transparent)}.player-card{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius);cursor:pointer;transition:border-color var(--transition), background var(--transition);-webkit-user-select:none;user-select:none;cursor:grab;padding:10px 12px;position:relative}.player-card:active{cursor:grabbing}.player-card:focus-visible{outline:3px solid color-mix(in srgb, var(--color-brand) 65%, white);outline-offset:2px}.player-card.on-field{border-color:var(--color-brand);background:color-mix(in srgb, var(--color-brand) 8%, var(--color-surface))}.player-card.on-bench{border-color:var(--color-accent);background:color-mix(in srgb, var(--color-accent) 8%, var(--color-surface))}.player-card.on-sideline{border-color:var(--color-border);background:var(--color-surface)}.player-card.suggested-off{box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--color-danger) 50%, transparent)}.player-card.selected{outline:3px solid var(--color-accent);outline-offset:2px}.player-card .player-name{margin-bottom:4px;font-size:.95rem;font-weight:700}.player-card .player-time{color:var(--color-text-muted);font-variant-numeric:tabular-nums;font-size:.78rem}.player-card .next-sub-dot{background:var(--color-accent);border-radius:50%;width:8px;height:8px;animation:1.2s infinite pulse;position:absolute;top:8px;right:8px}.player-card .suggested-off-dot{background:var(--color-danger);border-radius:50%;width:8px;height:8px;animation:1.2s infinite pulse;position:absolute;top:8px;left:8px}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)}}.sub-clock{align-items:center;gap:16px;display:flex}.sub-clock .sub-clock-ring{flex-shrink:0;width:72px;height:72px;position:relative}.sub-clock .sub-clock-ring svg{transform:rotate(-90deg)}.sub-clock .sub-clock-ring .ring-track{stroke:var(--color-border);fill:none;stroke-width:6px}.sub-clock .sub-clock-ring .ring-progress{fill:none;stroke:var(--color-accent);stroke-width:6px;stroke-linecap:round;transition:stroke-dashoffset 1s linear}.sub-clock .sub-clock-ring .ring-label{font-variant-numeric:tabular-nums;justify-content:center;align-items:center;font-size:.8rem;font-weight:700;display:flex;position:absolute;inset:0}.sub-clock .sub-clock-info{flex:1}.sub-clock .sub-clock-info .next-label{text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);margin-bottom:4px;font-size:.7rem}.sub-clock .sub-clock-info .next-player{color:var(--color-accent);font-size:1rem;font-weight:700}.goal-log{flex-direction:column;gap:4px;max-height:140px;list-style:none;display:flex;overflow-y:auto}.goal-log li{color:var(--color-text-muted);background:var(--color-surface);border-radius:6px;align-items:center;gap:8px;padding:4px 8px;font-size:.82rem;display:flex}.phase-badge{letter-spacing:.06em;text-transform:uppercase;border-radius:999px;align-items:center;gap:6px;padding:4px 12px;font-size:.72rem;font-weight:700;display:inline-flex}.phase-badge.pre-game{background:var(--color-border);color:var(--color-text-muted)}.phase-badge.first-half{background:var(--color-brand);color:#fff}.phase-badge.halftime{background:var(--color-accent);color:#000}.phase-badge.second-half{background:var(--color-brand);color:#fff}.phase-badge.full-time{background:var(--color-text-muted);color:var(--color-surface)}.phase-dot{background:currentColor;border-radius:50%;width:6px;height:6px}.first-half .phase-dot,.second-half .phase-dot{animation:1.2s infinite pulse}.fade-enter-active,.fade-leave-active{transition:opacity .2s}.fade-enter-from,.fade-leave-to{opacity:0}.slide-up-enter-active,.slide-up-leave-active{transition:transform .3s,opacity .3s}.slide-up-enter-from,.slide-up-leave-to{opacity:0;transform:translateY(20px)}
