.fan-mode-page{min-height:100vh;padding:1rem;background:var(--background);color:var(--text-primary);font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;box-sizing:border-box}.fan-mode-page--center{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:100vh;gap:.5rem}.fan-mode-header{display:flex;flex-direction:column;gap:.5rem;background:var(--card-background);border:1px solid var(--border-color);border-radius:12px;padding:1rem;margin-bottom:1rem}.fan-mode-header__title{margin:0;font-size:1rem;font-weight:600;color:var(--text-secondary)}.fan-mode-header__row{display:flex;justify-content:space-between;align-items:center;gap:1rem}.fan-mode-stale-banner{margin:0;font-size:.8rem;color:var(--text-secondary);font-style:italic}.fan-mode-score__value,.fan-mode-score{font-size:2rem;font-weight:700;color:var(--primary-green)}.fan-mode-score__dash{color:var(--text-secondary)}.fan-mode-timer{text-align:right}.fan-mode-timer__value{font-size:1.75rem;font-weight:700;font-variant-numeric:tabular-nums}.fan-mode-timer__meta{font-size:.85rem;color:var(--text-secondary)}.fan-mode-lineup,.fan-mode-events{background:var(--card-background);border:1px solid var(--border-color);border-radius:12px;padding:1rem;margin-bottom:1rem}.fan-mode-lineup h2,.fan-mode-events h2{margin:0 0 .75rem;font-size:1rem;color:var(--text-secondary)}.fan-mode-lineup__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.5rem}.fan-mode-lineup__player{display:flex;flex-direction:column;padding:.5rem;border-radius:8px;background:var(--hover-background)}.fan-mode-lineup__name{font-weight:600}.fan-mode-lineup__position{font-size:.8rem;color:var(--text-secondary)}.fan-mode-events__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}.fan-mode-events__item{display:flex;gap:.5rem;align-items:baseline;padding:.4rem 0;border-bottom:1px solid var(--border-color)}.fan-mode-events__item:last-child{border-bottom:none}.fan-mode-events__type{font-weight:600}.fan-mode-events__minute{margin-left:auto;color:var(--text-secondary)}.fan-mode-empty{color:var(--text-secondary);font-style:italic}@media(min-width:768px){.fan-mode-page{max-width:640px;margin:0 auto}}.tracker-confirmation{margin:0 0 1rem;padding:.6rem .9rem;border-radius:8px;background:var(--light-green);color:var(--primary-green);font-weight:600;text-align:center}.tracker-tap-grid{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:1rem}.tracker-tap-target{min-width:56px;min-height:56px;flex:1 1 100px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;border-radius:12px;border:1px solid var(--border-color);background:var(--card-background);color:var(--text-primary);font-size:1rem;font-weight:600;cursor:pointer}.tracker-tap-target span:first-child{font-size:1.75rem}.tracker-tap-target:disabled{opacity:.6;cursor:not-allowed}.tracker-sheet-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:flex-end;justify-content:center;z-index:1000}.tracker-sheet{width:100%;max-width:640px;background:var(--card-background);border-radius:16px 16px 0 0;padding:1.25rem 1rem calc(1.25rem + env(safe-area-inset-bottom,0px));box-sizing:border-box}.tracker-sheet h2{margin:0 0 1rem}.tracker-sheet-options{display:flex;flex-direction:column;gap:.6rem}.tracker-player-list{display:flex;flex-direction:column;gap:.5rem;max-height:40vh;overflow-y:auto}.tracker-sheet-option{min-height:56px;border-radius:10px;border:1px solid var(--border-color);background:var(--hover-background);color:var(--text-primary);font-size:1rem;font-weight:600;cursor:pointer}.tracker-sheet-option--primary{background:var(--primary-green);color:#fff;border-color:var(--primary-green)}.tracker-sheet-option--skip{background:transparent;font-weight:400;color:var(--text-secondary)}.tracker-sheet-option:disabled{opacity:.6;cursor:not-allowed}.tracker-sheet-cancel{margin-top:1rem;width:100%;min-height:44px;background:transparent;border:none;color:var(--text-secondary);font-size:.95rem;cursor:pointer}.tracker-player-list__group-label{margin:.4rem 0 0;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary)}.tracker-player-list__group-label:first-child{margin-top:0}.tracker-upcoming-games{list-style:none;margin:.5rem 0 0;padding:0;display:flex;flex-direction:column;gap:.5rem;width:100%;max-width:360px}.tracker-upcoming-games__item{display:flex;justify-content:space-between;gap:.75rem;padding:.6rem .8rem;background:var(--card-background);border:1px solid var(--border-color);border-radius:10px}.tracker-upcoming-games__opponent{font-weight:600;color:var(--text-primary)}.tracker-upcoming-games__date{color:var(--text-secondary);font-size:.9rem}.tracker-paused{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.25rem}.tracker-refresh-button{margin-top:.75rem;min-height:44px;padding:0 1.25rem;align-self:center}.tracker-field{width:100%;max-width:420px;margin:0 auto}.soccer-pitch-surface.tracker-field{--soccer-pitch-border-color: var(--primary-green);--soccer-pitch-background: linear-gradient( 180deg, var(--accent-green) 0%, var(--light-green) 100% )}.tracker-field-node{position:absolute;transform:translate(-50%,-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:.15rem;width:clamp(56px,20vw,76px)}.tracker-field-node__jersey{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--primary-green);color:#fff;font-weight:800;font-size:.85rem;border:2px solid white;box-shadow:0 2px 5px #00000040}.tracker-field-node__name{font-size:.7rem;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6);text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tracker-field-node__position{font-size:.6rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:#ffffffd9;text-shadow:0 1px 2px rgba(0,0,0,.6)}.tracker-field-node--multi{width:clamp(84px,30vw,120px)}.tracker-field-node__occupants{display:flex;flex-direction:column;align-items:center;gap:.1rem}.tracker-field-node__occupant{display:flex;align-items:center;gap:.25rem}.tracker-field-node__jersey--compact{width:26px;height:26px;font-size:.68rem;flex-shrink:0}.tracker-field-node--multi .tracker-field-node__name{font-size:.62rem}@media(min-width:768px){.tracker-field{max-width:480px}.tracker-field-node{width:clamp(64px,16vw,84px)}.tracker-field-node__jersey{width:40px;height:40px;font-size:.95rem}.tracker-field-node__name{font-size:.78rem}}@media(max-width:480px){.tracker-field-node__position{display:none}.tracker-field-node__jersey{width:30px;height:30px;font-size:.75rem}}.soccer-pitch-surface{--soccer-pitch-aspect-ratio: 2 / 3;--soccer-pitch-border-radius: 10px;--soccer-pitch-line-color: var(--pitch-surface-line-color, rgba(255, 255, 255, .5));--soccer-pitch-border-color: var(--pitch-surface-border-color, #4caf50);--soccer-pitch-spot-color: var(--pitch-surface-spot-color, rgba(255, 255, 255, .7));--soccer-pitch-stripe-light: var(--pitch-surface-background-start, #4caf50);--soccer-pitch-stripe-dark: var(--pitch-surface-background-end, #2d6d3f);--soccer-pitch-background: repeating-linear-gradient( 0deg, var(--soccer-pitch-stripe-light), var(--soccer-pitch-stripe-light) 10%, var(--soccer-pitch-stripe-dark) 10%, var(--soccer-pitch-stripe-dark) 20% );--soccer-pitch-penalty-width: 50%;--soccer-pitch-penalty-height: 16%;--soccer-pitch-goal-area-width: 40%;--soccer-pitch-goal-area-height: 35%;--soccer-pitch-center-circle-width: 20%;position:relative;aspect-ratio:var(--soccer-pitch-aspect-ratio);border-radius:var(--soccer-pitch-border-radius);border:2px solid var(--soccer-pitch-border-color);background:var(--soccer-pitch-background);overflow:hidden;flex-shrink:0;isolation:isolate;box-shadow:inset 0 0 30px #00000026}.soccer-pitch-surface__markings{position:absolute;inset:0;pointer-events:none}.soccer-pitch-surface__center-line,.soccer-pitch-surface__center-circle,.soccer-pitch-surface__center-spot,.soccer-pitch-surface__penalty-box,.soccer-pitch-surface__goal-area,.soccer-pitch-surface__penalty-arc,.soccer-pitch-surface__penalty-spot,.soccer-pitch-surface__corner{position:absolute;pointer-events:none;box-sizing:border-box}.soccer-pitch-surface__center-line{left:0;right:0;top:50%;border-top:2px solid var(--soccer-pitch-line-color);transform:translateY(-50%)}.soccer-pitch-surface__center-circle{left:50%;top:50%;width:var(--soccer-pitch-center-circle-width);aspect-ratio:1 / 1;transform:translate(-50%,-50%);border:2px solid var(--soccer-pitch-line-color);border-radius:50%}.soccer-pitch-surface__center-spot{left:50%;top:50%;width:6px;height:6px;transform:translate(-50%,-50%);border-radius:50%;background:var(--soccer-pitch-spot-color)}.soccer-pitch-surface__penalty-box{left:50%;width:var(--soccer-pitch-penalty-width);height:var(--soccer-pitch-penalty-height);transform:translate(-50%);border:2px solid var(--soccer-pitch-line-color)}.soccer-pitch-surface__penalty-box--top{top:0;border-top:none}.soccer-pitch-surface__penalty-box--bottom{bottom:0;border-bottom:none}.soccer-pitch-surface__goal-area{left:50%;width:var(--soccer-pitch-goal-area-width);height:var(--soccer-pitch-goal-area-height);transform:translate(-50%);border:2px solid var(--soccer-pitch-line-color)}.soccer-pitch-surface__penalty-box--top .soccer-pitch-surface__goal-area{top:0;border-top:none}.soccer-pitch-surface__penalty-box--bottom .soccer-pitch-surface__goal-area{bottom:0;border-bottom:none}.soccer-pitch-surface__penalty-spot{left:50%;width:4px;height:4px;transform:translate(-50%);border-radius:50%;background:var(--soccer-pitch-spot-color)}.soccer-pitch-surface__penalty-box--top .soccer-pitch-surface__penalty-spot{top:75%}.soccer-pitch-surface__penalty-box--bottom .soccer-pitch-surface__penalty-spot{bottom:75%}.soccer-pitch-surface__penalty-arc{left:50%;width:40%;aspect-ratio:1 / 1;border:2px solid var(--soccer-pitch-line-color);border-radius:50%}.soccer-pitch-surface__penalty-box--top .soccer-pitch-surface__penalty-arc{bottom:0;transform:translate(-50%,50%);clip-path:polygon(0 50%,100% 50%,100% 100%,0 100%)}.soccer-pitch-surface__penalty-box--bottom .soccer-pitch-surface__penalty-arc{top:0;transform:translate(-50%,-50%);clip-path:polygon(0 0,100% 0,100% 50%,0 50%)}.soccer-pitch-surface__corner{width:6%;aspect-ratio:1 / 1;border:2px solid var(--soccer-pitch-line-color);border-radius:50%}.soccer-pitch-surface__corner--tl{top:0;left:0;transform:translate(-50%,-50%)}.soccer-pitch-surface__corner--tr{top:0;right:0;transform:translate(50%,-50%)}.soccer-pitch-surface__corner--bl{bottom:0;left:0;transform:translate(-50%,50%)}.soccer-pitch-surface__corner--br{bottom:0;right:0;transform:translate(50%,50%)}:root{--primary-green: #1a472a;--light-green: #2d6d3f;--accent-green: #4caf50;--background: #f5f5f5;--card-background: #ffffff;--text-primary: #212121;--text-secondary: #757575;--border-color: #e0e0e0;--danger-red: #d32f2f;--hover-background: #f0f0f0;--color-strategy: #0277BD;--color-strategy-light: #E8F4F8;--color-surface-light: #fafafa;--color-surface-disabled: #f5f5f5;--color-surface-hover: #f0f0f0;--color-text-muted: #9e9e9e;--color-border-subtle: #e8e8e8;--pitch-surface-background-start: var(--accent-green);--pitch-surface-background-end: var(--light-green);--pitch-surface-border-color: var(--primary-green);--pitch-surface-line-color: rgba(255, 255, 255, .36);--pitch-surface-spot-color: rgba(255, 255, 255, .65);--shared-shape-node-bg: rgba(26, 71, 42, .14);--shared-shape-node-border: rgba(13, 59, 18, .25);--shared-shape-node-text: #0d3b12;--shared-shape-node-focus-ring-color: #0d47a1;--shared-shape-node-focus-ring-width: 2px;--shared-shape-node-focus-ring-offset: 2px;--shared-shape-node-disabled-bg: #f5f5f5;--shared-shape-node-disabled-text: #9e9e9e;--fve-node-width: 48px;--fve-node-height: 48px;--fve-node-font-size: 12px;--fve-node-border-radius: 50%;--fve-conflict-banner-bg: #fffbeb;--fve-conflict-banner-text: #92400e;--fve-conflict-banner-border: #fcd34d;--fve-error-banner-bg: #fef2f2;--fve-error-banner-text: #dc2626;--fve-error-banner-border: #fca5a5;--fve-node-selected-border: #ffffff;--fve-node-selected-bg: rgba(255, 255, 255, .3);--fve-node-dragging-opacity: .85;--fve-node-dragging-shadow: 0 2px 8px rgba(0, 0, 0, .15);--fve-modal-backdrop-color: rgba(0, 0, 0, .5);--fve-modal-surface-bg: var(--card-background);--fve-modal-surface-shadow: 0 8px 30px rgba(0, 0, 0, .2);--fve-empty-state-bg: rgba(255, 255, 255, .9);--fve-danger-hover-bg: #b71c1c;--fve-layer-modal: 1000;--fve-layer-modal-content: 1001;--fve-layer-nested-overlay: 1010;--fve-layer-nested-modal: 1011;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;padding:0;background-color:var(--background);color:var(--text-primary);min-height:100vh;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif}h1,h2,h3{margin:0;line-height:1.2}h1{font-size:2em}h2{font-size:1.5em;margin-bottom:1rem}h3{font-size:1.1em}button{border-radius:8px;border:none;padding:.7em 1.5em;font-size:1em;font-weight:500;font-family:inherit;cursor:pointer;transition:all .2s ease}button:disabled{opacity:.5;cursor:not-allowed}input{padding:.7em;font-size:1em;border:1px solid var(--border-color);border-radius:6px;font-family:inherit;width:100%}input:focus{outline:none;border-color:var(--primary-green)}.btn-primary{background-color:var(--primary-green);color:#fff}.btn-primary:hover:not(:disabled){background-color:var(--light-green)}.btn-secondary{background-color:var(--hover-background);color:var(--text-primary)}.btn-secondary:hover:not(:disabled){background-color:var(--border-color)}.btn-delete{background-color:transparent;color:var(--danger-red);padding:.5em;font-size:1.2em}.btn-delete:hover{background-color:#d32f2f1a}.btn-back{background-color:transparent;color:var(--primary-green);padding:.25em 1em}.btn-back:hover{background-color:var(--hover-background)}.btn-signout{background-color:transparent;color:var(--text-secondary);padding:.5em 1em}.btn-signout:hover{background-color:var(--hover-background);color:var(--text-primary)}.empty-state{text-align:center;color:var(--text-secondary);padding:2em;font-style:italic}
