:root { --blue:#075eb5; --blue-dark:#064889; --red:#b42318; --green:#16794b; --ink:#17202a; --muted:#667085; --surface:#fff; --page:#eef2f6; --radius:12px; --protocol-font-size:15px; --header-height:56px; }
  * { box-sizing: border-box; touch-action: manipulation; margin: 0; padding: 0; }
  html, body { height: 100dvh; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
  body { display: grid; grid-template-rows: 56px minmax(0,1fr); background: var(--page); color:var(--ink); -webkit-text-size-adjust: 100%; }
  button, input { font:inherit; }
  button:focus-visible, input:focus-visible { outline:3px solid #f79009; outline-offset:2px; }

  hr { margin-top: 20px; margin-bottom: 20px; }

  .mt-12 { margin-top: 12px; }
  .mt-16 { margin-top: 16px; }
  .mb-10 { margin-bottom: 10px; }
  .mb-14 { margin-bottom: 14px; }
  .mb-16 { margin-bottom: 16px; }

  /* Navigation */
  .tab-nav { display:flex; min-height:46px; background:var(--blue); padding:env(safe-area-inset-top) 6px 0; gap:4px; }
  .tab-nav button { flex:1; color:white; background:none; border:none; font-size:18px; cursor:pointer; font-weight:bold; }
  
  .tab-nav .cache-clear-btn {
  flex: 0 0 auto !important;
  font-size: 12px !important;
  padding: 4px 10px !important;
  margin: 6px;
  background: #dc3545 !important;
  color: white;
  border-radius: 6px;
}

.cache-clear-btn {
  flex: 0 0 auto;
  padding: 4px 10px;
  font-size: 12px;
  background: #dc3545;
  color: white;
  border: none;
  border-radius: 6px;
  margin: 6px;
  cursor: pointer;
}
 
  
  .tab-nav button { border-radius:8px; }
  .tab-nav > [role="tab"] { align-self:stretch; border-radius:0; }
  .tab-nav > [role="tab"].active { background:var(--blue-dark); }
  .protocol-font-controls { position:sticky; right:0; z-index:3; flex:0 0 auto; display:flex; align-items:center; gap:2px; margin-left:auto; padding-left:7px; border-left:1px solid rgba(255,255,255,.22); background:var(--blue); }
  .tab-nav .protocol-font-controls button { flex:0 0 30px; min-width:30px; height:30px; padding:0; margin:0; background:transparent; border:0; color:rgba(255,255,255,.76); font-size:19px; font-weight:600; line-height:1; }
  .tab-nav .protocol-font-controls button:hover { background:rgba(255,255,255,.08); color:#fff; }
  .tab-nav .protocol-font-controls button:active { background:rgba(255,255,255,.16); }
  .tab-nav .intercom-primary-btn { min-width:142px; display:inline-flex; align-items:center; justify-content:center; gap:9px; }
  .intercom-header-status { flex:0 0 10px; width:10px; height:10px; border:2px solid rgba(255,255,255,.7); border-radius:50%; background:#94a3b8; box-shadow:0 0 0 2px rgba(15,23,42,.16); }
  .intercom-header-status[data-state="connected"] { background:#32c47f; }
  .intercom-header-status[data-state="waiting"] { background:#f4b740; }
  .intercom-header-status[data-state="interrupted"] { background:#ef6259; }
  .intercom-header-status[data-state="inactive"] { background:#94a3b8; }
  .tab-nav .header-icon-btn { flex:0 0 38px; width:38px; min-width:38px; height:38px; align-self:center; margin:0 2px; padding:0; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.18); border-radius:8px; background:transparent; color:rgba(255,255,255,.82); font-weight:600; line-height:1; box-shadow:none; }
  .tab-nav .header-icon-btn[hidden] { display:none; }
  .tab-nav .score-menu-btn { margin-left:5px; }
  .tab-nav .settings-menu-btn { font-size:21px; }
  .tab-nav .header-icon-btn:hover, .tab-nav .header-icon-btn:active, .tab-nav .header-icon-btn.active { background:rgba(255,255,255,.08); color:#fff; }
  .tab-nav .score-menu-btn svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
  .tab-nav .fullscreen-menu-btn svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  #intercomMenu { position:fixed; top:50%; left:50%; z-index:240; width:min(720px,calc(100% - 28px)); max-height:calc(100dvh - 82px); padding:0; overflow:auto; transform:translate(-50%,-50%); border:1px solid #cbd5e1; border-radius:14px; background:#fff; box-shadow:0 0 0 100vmax rgba(15,23,42,.2),0 18px 48px rgba(15,23,42,.3); }
  #intercomMenu[hidden] { display:none; }
  .intercom-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; background:#172b4d; }
  .intercom-head strong { color:#fff; font-size:17px; }
  .intercom-close { width:34px; height:34px; border:1px solid rgba(255,255,255,.18); border-radius:8px; background:rgba(255,255,255,.1); color:#fff; cursor:pointer; font-size:21px; }
  .intercom-close:hover { background:rgba(255,255,255,.18); }
  .intercom-view[hidden] { display:none; }
  .intercom-status-summary { width:calc(100% - 28px); min-height:52px; margin:14px 14px 0; padding:9px 12px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)) auto; gap:10px; align-items:center; border:1px solid #d7e1ec; border-radius:11px; background:#f8fafc; color:#253347; cursor:pointer; text-align:left; box-shadow:0 1px 3px rgba(16,24,40,.04); }
  .intercom-status-summary:hover { border-color:#b8c9d9; background:#f2f6fa; }
  .intercom-status-summary-item { min-width:0; display:flex; align-items:center; gap:9px; font-size:12px; font-weight:850; }
  .intercom-status-summary-item span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .intercom-status-summary-arrow { color:#075eb5; font-size:20px; font-weight:900; }
  .intercom-view-back { min-height:38px; margin:14px 14px 0; padding:7px 11px; border:1px solid #b8c9d9; border-radius:9px; background:#fff; color:#075eb5; cursor:pointer; font-size:12px; font-weight:850; }
  .intercom-view-back:hover { background:#f2f6fa; }
  .intercom-presets { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; padding:14px; }
  .intercom-preset { min-height:48px; padding:10px 12px; border:1px solid #c5d5e7; border-radius:10px; background:#eaf2ff; color:#174ea6; cursor:pointer; font-weight:800; text-align:left; box-shadow:0 1px 3px rgba(16,24,40,.06); }
  .intercom-preset:hover { background:#dceaff; border-color:#9fbae0; }
  .intercom-preset:active { background:#cfdef4; transform:scale(.985); }
  .intercom-preset.triggered { border-color:#16794b; background:#e7f6ee; color:#11623d; }
  .intercom-preset:disabled { border-color:#d8e0e9; background:#f2f4f7; color:#98a2b3; cursor:not-allowed; box-shadow:none; transform:none; }
  .intercom-custom { padding:0 14px 14px; }
  .intercom-custom[hidden], .intercom-custom form[hidden] { display:none; }
  .intercom-custom-toggle { width:100%; min-height:44px; padding:10px 12px; border:1px solid #b8c9d9; border-radius:10px; background:#fff; color:#075eb5; cursor:pointer; font-weight:800; text-align:left; }
  .intercom-custom-toggle:hover { background:#f2f6fa; }
  .intercom-custom-toggle:disabled { color:#98a2b3; cursor:not-allowed; }
  .intercom-custom form { display:grid; gap:9px; margin-top:10px; }
  .intercom-custom label { color:#253347; font-size:12px; font-weight:800; }
  .intercom-custom textarea { width:100%; box-sizing:border-box; resize:vertical; padding:10px 12px; border:1px solid #b8c9d9; border-radius:9px; font:inherit; }
  .intercom-custom-actions { display:flex; justify-content:flex-end; gap:8px; }
  .intercom-custom-actions button { min-height:36px; padding:7px 12px; border:1px solid #b8c9d9; border-radius:8px; background:#fff; color:#075eb5; cursor:pointer; font-weight:800; }
  .intercom-custom-actions button[type="submit"] { border-color:#075eb5; background:#075eb5; color:#fff; }
  .intercom-custom-actions button:disabled { opacity:.55; cursor:not-allowed; }
  .intercom-status { min-height:32px; padding:0 14px 12px; color:var(--muted); font-size:12px; font-weight:700; }
  .intercom-connection-panel { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:14px 14px 0; padding:12px 13px; border:1px solid #dce4ec; border-radius:11px; background:#f8fafc; }
  .intercom-connection-panel + .intercom-connection-panel { margin-top:10px; }
  .intercom-connection-copy { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); gap:2px 9px; align-items:center; }
  .intercom-connection-dot { grid-row:1/3; width:11px; height:11px; border-radius:50%; background:#d1433b; box-shadow:0 0 0 4px rgba(209,67,59,.12); }
  .intercom-connection-dot.connected { background:#1c9b61; box-shadow:0 0 0 4px rgba(28,155,97,.13); }
  .intercom-connection-copy strong { color:#253347; font-size:14px; }
  .intercom-connection-copy small { overflow:hidden; color:#667085; font-size:11px; line-height:1.35; text-overflow:ellipsis; }
  .intercom-pairing { flex:0 0 auto; display:flex; align-items:center; gap:8px; }
  .intercom-pairing-code { min-width:116px; padding:8px 10px; border-radius:8px; background:#172b4d; color:#fff; font-size:18px; font-weight:950; letter-spacing:.16em; text-align:center; font-variant-numeric:tabular-nums; }
  .intercom-new-pairing { min-height:36px; padding:7px 10px; border:1px solid #b8c9d9; border-radius:8px; background:#fff; color:#075eb5; cursor:pointer; font-size:11px; font-weight:850; }
  .intercom-url-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:11px 12px; border:1px solid #d8e2ec; border-radius:10px; background:#f8fafc; }
  .intercom-url-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .intercom-url-grid.intercom-url-overlay { margin:10px 14px 0; }
  .intercom-url-grid.intercom-url-settings { margin:0 0 14px; }
  .intercom-url-card[hidden] { display:none; }
  .intercom-url-copy { min-width:0; display:flex; flex-direction:column; gap:2px; }
  .intercom-url-copy small { color:#667085; font-size:11px; font-weight:800; }
  .intercom-url-copy a { overflow-wrap:anywhere; color:#075eb5; font-size:13px; font-weight:800; line-height:1.35; text-decoration:none; }
  .intercom-url-copy a:hover { text-decoration:underline; }
  .intercom-copy-url { min-height:36px; padding:7px 10px; border:1px solid #b8c9d9; border-radius:8px; background:#fff; color:#075eb5; cursor:pointer; font-size:11px; font-weight:850; white-space:nowrap; }
  .intercom-copy-url.copied { border-color:#8dc8ad; background:#e7f6ee; color:#11623d; }

  /* Tab Content */
  .tab-content { display: grid; grid-template-columns: minmax(210px,1fr) minmax(420px,2.2fr) minmax(210px,1fr); gap: 8px; overflow:hidden; }

  .side { padding: 8px 6px; overflow: hidden; display: flex; flex-direction: column; gap: 4px; }
  .timeout-tracker { flex:0 0 auto; width:min(100%,216px); min-width:0; padding:9px 10px; border:1px solid #d7e1ec; border-radius:10px; background:#fff; box-shadow:0 2px 7px rgba(16,24,40,.07); }
  .right .timeout-tracker { align-self:flex-end; }
  .timeout-periods { min-width:0; display:flex; align-items:center; flex-wrap:wrap; gap:7px 10px; }
  .right .timeout-periods { justify-content:flex-end; }
  .timeout-period { display:flex; align-items:center; gap:4px; }
  .timeout-period-label { min-width:18px; color:#667085; font-size:9px; font-weight:900; text-align:center; }
  .timeout-dot { width:24px; height:24px; flex:0 0 24px; padding:0; border:3px solid #075eb5; border-radius:50%; background:#155eef; cursor:pointer; box-shadow:0 2px 4px rgba(21,94,239,.26); touch-action:manipulation; }
  .timeout-dot.used { border-color:#b8c2ce; background:#e4e7ec; box-shadow:none; }
  .timeout-dot:focus-visible { outline:3px solid #f79009; outline-offset:2px; }
  .timeout-dot:active { transform:scale(.9); }
  .staff-foul-tracker { flex:0 0 auto; width:min(100%,216px); min-width:0; padding:7px 8px; border:1px solid #f0c5c2; border-radius:10px; background:#fff8f7; box-shadow:0 2px 7px rgba(127,29,29,.07); }
  .right .staff-foul-tracker { align-self:flex-end; }
  .staff-foul-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:5px; color:#7a271a; font-size:9px; }
  .staff-foul-heading strong { min-width:0; overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
  .staff-foul-thresholds { flex:0 0 auto; display:flex; align-items:center; gap:4px; }
  .staff-foul-thresholds span { padding:2px 5px; border-radius:999px; font-weight:950; white-space:nowrap; }
  .staff-foul-total-limit { background:#e4e7ec; color:#667085; }
  .staff-foul-total-limit.has-total-warning { background:#fee4e2; color:#b42318; }
  .staff-foul-coach-limit { background:#e4e7ec; color:#667085; }
  .staff-foul-coach-limit.has-coach-foul { background:#fee4e2; color:#b42318; }
  .staff-foul-controls { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) 30px; gap:4px; }
  .staff-foul-button, .staff-foul-correction { min-width:0; min-height:30px; padding:3px; border:1px solid #e67b73; border-radius:7px; background:#fff; color:#b42318; cursor:pointer; font-weight:950; }
  .staff-foul-button { display:flex; align-items:center; justify-content:center; gap:4px; }
  .staff-foul-button b { font-size:13px; }
  .staff-foul-button small { min-width:14px; padding:1px 3px; border-radius:999px; background:#fee4e2; font-size:9px; }
  .staff-foul-correction { border-color:#c9ced6; color:#5b6472; }
  .staff-foul-button:disabled, .staff-foul-correction:disabled { cursor:not-allowed; opacity:.45; }
  .staff-foul-tracker.is-disqualified { border-color:#b42318; background:#fee4e2; box-shadow:inset 0 0 0 1px #b42318; }
  .staff-foul-tracker.is-disqualified .staff-foul-total-limit, .staff-foul-tracker.is-disqualified .staff-foul-coach-limit { background:#b42318; color:#fff; }
  .staff-foul-protocol { display:none; width:100%; margin-bottom:7px; }
  body[data-dashboard-version="legacy"] #overviewTab > .side > .staff-foul-tracker { display:none; }
  body[data-dashboard-version="legacy"] #overviewTab .staff-foul-protocol { display:block; }
  .player-row { display: flex; align-items: center; gap: 8px; flex: 1; min-height: 0; }
  .left .player-row { justify-content: flex-start; }
  .right .player-row { justify-content: flex-end; }

  .player-btn { width: 80px; height: 100%; min-height: 46px; font-size: 21px; background: var(--blue); }
  .foul-btn { width: 70px; height: 100%; min-height: 46px; font-size: 19px; background: var(--red); }
  .correct-btn { width: 50px; height: 100%; min-height: 46px; font-size: 18px; background: #6c757d; }
  .player-btn, .foul-btn, .correct-btn { border-radius: 10px; border: none; color: white; cursor: pointer; font-weight: bold; display: flex; flex-direction: column; justify-content: center; align-items: center; line-height: 1.3; }
  .foul-btn.disabled, .correct-btn.disabled, .player-btn.disabled { background: #999 !important; cursor: not-allowed; opacity: 0.7; }

  .center { padding: 8px; border-left: 2px solid #ccc; border-right: 2px solid #ccc; display: flex; flex-direction: column; gap: 8px; overflow: hidden; }
  .logs-container { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; overflow: hidden; }
  .log { background: white; padding: 12px clamp(12px,3vw,30px); font-size: 20px; border-radius: 10px; box-shadow: 0 2px 6px rgba(0,0,0,0.1); display: flex; flex-direction: column; overflow: hidden; }
  .title { font-weight: bold; text-align: center; margin-bottom: 6px; font-size: 19px; border-bottom: 2px solid #007bff; padding-bottom: 4px; flex-shrink: 0; cursor: pointer; }
  #logLeft, #logRight { overflow-y: auto; flex: 1; }
  .protocol-section + .protocol-section { margin-top:14px; padding-top:10px; border-top:1px solid #dbe3ec; }
  .protocol-section-heading { margin:0 0 6px; color:#475467; font-size:13px; font-weight:800; letter-spacing:.02em; }
  .entry { margin: 6px 0; line-height: 1.4; word-wrap: break-word; }
  .number { font-weight: bold; }
  .foul-entry { color: #c40000; font-weight: bold; }
  .staff-foul-entry .number { background:#fee4e2; color:#b42318; }
  .correction-entry { color: #6c757d; font-style: italic; }
  .clear-button { padding: 12px; font-size: 19px; background: #dc3545; color: white; border: none; border-radius: 10px; cursor: pointer; font-weight: bold; flex-shrink: 0; }
  .overview-footer-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,.42fr) minmax(180px,.42fr); gap:8px; flex-shrink:0; }
  .starting-five-button { padding:12px 14px; border:0; border-radius:10px; background:#16794b; color:#fff; cursor:pointer; font-size:16px; font-weight:850; }
  .starting-five-button:disabled { opacity:.58; cursor:not-allowed; }
  .end-game-button { padding:12px 14px; border:0; border-radius:10px; background:#172b4d; color:#fff; cursor:pointer; font-size:16px; font-weight:850; }
  .overview-footer-actions:has(#saveStartingFive[hidden]) .end-game-button { grid-column:2 / -1; }
  .end-game-button:disabled { opacity:.58; cursor:wait; }
  .game-end-status { min-height:18px; color:#344054; font-size:12px; font-weight:750; text-align:right; }
  .game-end-status[hidden] { display:none; }

  body[data-home-team-side="left"] #activeGameLogs .log:has(#logRight) { order:1; }
  body[data-home-team-side="left"] #activeGameLogs .log:has(#logLeft) { order:2; }
  body[data-home-team-side="right"] #activeGameLogs .log:has(#logLeft) { order:1; }
  body[data-home-team-side="right"] #activeGameLogs .log:has(#logRight) { order:2; }

  @media (min-width:821px) {
    body[data-home-team-side="left"] #overviewTab > #rightSide { order:1; }
    body[data-home-team-side="left"] #overviewTab > .center { order:2; }
    body[data-home-team-side="left"] #overviewTab > #leftSide { order:3; }
    body[data-home-team-side="right"] #overviewTab > #leftSide { order:1; }
    body[data-home-team-side="right"] #overviewTab > .center { order:2; }
    body[data-home-team-side="right"] #overviewTab > #rightSide { order:3; }

    body[data-home-team-side="left"] #rightSide .player-btn { order:1; }
    body[data-home-team-side="left"] #rightSide .foul-btn { order:2; }
    body[data-home-team-side="left"] #rightSide .correct-btn { order:3; }
    body[data-home-team-side="left"] #leftSide .correct-btn { order:1; }
    body[data-home-team-side="left"] #leftSide .foul-btn { order:2; }
    body[data-home-team-side="left"] #leftSide .player-btn { order:3; }
  }
  .active-game-empty { flex:1; min-height:0; display:grid; place-items:center; padding:28px; border:1px dashed #b9c7d7; border-radius:12px; background:linear-gradient(145deg,#fff,#f4f7fa); text-align:center; }
  .active-game-empty[hidden] { display:none; }
  .active-game-empty-inner { max-width:680px; }
  .active-game-empty-icon { width:54px; height:54px; display:grid; place-items:center; margin:0 auto 14px; border-radius:14px; background:#e8f1fa; color:var(--blue-dark); font-size:26px; }
  .active-game-empty h2 { margin:0 0 7px; color:#172b4d; font-size:25px; }
  .active-game-empty p { margin:0 0 18px; color:var(--muted); font-size:14px; line-height:1.5; }
  .active-game-empty button { min-height:46px; padding:10px 20px; border:0; border-radius:9px; background:var(--blue); color:#fff; cursor:pointer; font-weight:900; }
  .active-game-empty-actions { display:flex; align-items:stretch; justify-content:center; flex-wrap:wrap; gap:10px; }
  .active-game-empty-actions #loadTodayScheduleGame { display:flex; align-items:center; justify-content:flex-start; gap:12px; min-width:0; max-width:100%; padding:10px 14px; text-align:left; background:var(--today-team-color,var(--blue)); color:var(--today-team-text,#fff); }
  .active-game-empty-actions #loadTodayScheduleGame[hidden] { display:none; }
  #todayScheduleOpponentLogo { flex:0 0 52px; width:52px; height:52px; object-fit:contain; }
  #todayScheduleOpponentLogo[hidden] { display:none; }
  .today-schedule-copy { display:grid; gap:2px; min-width:0; line-height:1.3; overflow-wrap:anywhere; }
  .today-schedule-copy strong { font-size:14px; line-height:1.2; }
  #todayScheduleMatch { font-size:12px; font-weight:700; }
  #todayScheduleTime { font-size:11px; font-weight:600; }
  #todayScheduleTime[hidden] { display:none; }
  #gameDayHeading[hidden], #activeGameLogs[hidden], #activeGameActions[hidden] { display:none !important; }