/* Handball Tracker Cloud v1.28 — complete visual redesign
   Frontend-only layer built on the stable v1.27 hotfix 2 release. */
:root{
  --bg:#020b16;
  --bg-soft:#061321;
  --surface:#081827;
  --surface-2:#0b1d2f;
  --surface-3:#10263b;
  --surface-hover:#13304a;
  --card:#081827;
  --text:#f4f8fb;
  --text-soft:#c5d2de;
  --muted:#8fa4b8;
  --primary:#59d56d;
  --primary-strong:#35b854;
  --primary-dark:#22843a;
  --primary-ink:#031109;
  --danger:#ef6262;
  --warning:#f1b84a;
  --info:#4d9cff;
  --line:#1d3850;
  --line-soft:rgba(142,172,197,.15);
  --shadow:0 18px 48px rgba(0,0,0,.26);
  --shadow-soft:0 8px 28px rgba(0,0,0,.18);
  --radius:18px;
  --radius-sm:12px;
  --content:1440px;
  --header-h:72px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
html,body{min-height:100%}
body{
  margin:0;
  background:
    radial-gradient(circle at 12% -10%,rgba(53,184,84,.12),transparent 34rem),
    radial-gradient(circle at 94% 8%,rgba(42,111,170,.14),transparent 32rem),
    linear-gradient(180deg,#020b16 0,#04101d 42%,#020a13 100%);
  color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15px;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:40px 40px;
}
::selection{background:rgba(89,213,109,.28);color:#fff}
a{color:#7ae98b}
p,.hint,.muted{color:var(--muted)}
h1,h2,h3,h4,strong{letter-spacing:-.012em}
h1{font-size:clamp(22px,2vw,32px)}
h2{font-size:clamp(19px,1.5vw,25px);color:var(--text)}
h3{color:var(--text-soft)}
hr{border-color:var(--line-soft)}
.hidden{display:none!important}

/* Controls */
button,input,select,textarea{font:inherit}
button{
  min-height:42px;padding:10px 14px;border:1px solid var(--line);border-radius:11px;
  background:linear-gradient(180deg,#11283d,#0c2033);color:var(--text-soft);font-weight:780;
  box-shadow:none;transition:transform .14s ease,border-color .14s ease,background .14s ease,color .14s ease,box-shadow .14s ease;
  cursor:pointer;touch-action:manipulation;
}
button:hover:not(:disabled){background:linear-gradient(180deg,#17334c,#102a41);border-color:#315875;color:#fff;transform:translateY(-1px)}
button:active:not(:disabled){transform:translateY(0)}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible,summary:focus-visible{
  outline:3px solid rgba(89,213,109,.26);outline-offset:2px;
}
button.primary,button.active,.primary{
  background:linear-gradient(135deg,var(--primary-strong),#74e080)!important;border-color:#68df79!important;color:var(--primary-ink)!important;
  box-shadow:0 7px 20px rgba(47,184,81,.18);font-weight:900;
}
button.primary:hover,button.active:hover{background:linear-gradient(135deg,#43c660,#89eb93)!important}
button.danger,.danger{background:linear-gradient(180deg,#a93641,#84252f)!important;border-color:#c5505a!important;color:#fff!important}
button.danger-text,.danger-text{color:#ff8f96!important}
button:disabled{opacity:.42;cursor:not-allowed;transform:none!important}
label{color:var(--text-soft);font-size:13px;font-weight:760;letter-spacing:.01em}
input,select,textarea{
  width:100%;min-height:44px;margin-top:6px;padding:10px 12px;border:1px solid var(--line);border-radius:11px;
  background:#061421;color:var(--text);box-shadow:inset 0 1px 0 rgba(255,255,255,.025);transition:border-color .15s,box-shadow .15s,background .15s;
}
input:hover,select:hover,textarea:hover{border-color:#315671}
input:focus,select:focus,textarea:focus{border-color:#58d66e;background:#081a29;box-shadow:0 0 0 3px rgba(89,213,109,.1)}
input[readonly]{background:#091724;color:#9db0c0}
input[type="color"]{padding:5px;min-height:44px}
input[type="checkbox"],input[type="radio"]{accent-color:var(--primary);width:auto;min-height:auto}
select{background-image:none}

/* Global shell */
#appShell{min-height:100vh}
.professional-app-header{
  position:sticky!important;top:0!important;z-index:3200!important;min-height:var(--header-h)!important;
  display:grid!important;grid-template-columns:minmax(260px,1fr) minmax(180px,auto) auto 48px!important;align-items:center!important;gap:18px!important;
  padding:10px clamp(14px,3vw,42px)!important;
  background:rgba(3,13,25,.92)!important;border-bottom:1px solid rgba(128,164,191,.18)!important;
  box-shadow:0 10px 34px rgba(0,0,0,.28)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.brand-lockup{display:flex;align-items:center;gap:12px;min-width:0}
.brand-lockup img{
  width:48px!important;height:48px!important;padding:0!important;border:0!important;border-radius:14px!important;
  background:transparent!important;box-shadow:0 10px 28px rgba(39,196,77,.12)!important;
}
.brand-lockup>div{display:flex;flex:1 1 auto;flex-direction:column;min-width:0}
.brand-lockup strong{font-size:18px!important;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand-lockup strong .brand-accent{color:var(--primary)}
.brand-lockup span{font-size:11px!important;color:#86a0b5!important;letter-spacing:.045em;text-transform:uppercase}
.header-context{
  display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;column-gap:10px!important;
  padding-left:18px!important;border-left:1px solid rgba(255,255,255,.12)!important;
}
.header-context>span{font-size:10px!important;text-transform:uppercase;letter-spacing:.08em;color:#7890a5!important}
.header-context>strong{font-size:14px;color:#e8f0f6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.header-organization-logo{width:36px!important;height:36px!important;border-radius:10px!important;background:#0b2236!important;border:1px solid var(--line)!important}
.header-status{
  min-height:38px;padding:8px 12px!important;border:1px solid rgba(89,213,109,.2)!important;border-radius:999px!important;
  background:rgba(57,178,82,.1)!important;color:#79e58a!important;font-size:11px!important;font-weight:850!important;
}
.sync-dot{width:8px!important;height:8px!important;background:#57dd6e!important;box-shadow:0 0 0 5px rgba(87,221,110,.09)}
.offline .sync-dot{background:var(--warning)!important;box-shadow:0 0 0 5px rgba(241,184,74,.09)}
.header-menu-btn{width:44px;height:44px;padding:0!important;border-radius:12px!important;background:#0c2033!important;border-color:#24435d!important;color:#fff!important;font-size:0!important}
.header-menu-btn::before{content:"";display:block;width:20px;height:14px;margin:auto;background:linear-gradient(#dce8f0 0 0) top/100% 2px no-repeat,linear-gradient(#dce8f0 0 0) center/100% 2px no-repeat,linear-gradient(#dce8f0 0 0) bottom/100% 2px no-repeat}
.header-menu{
  top:64px!important;right:clamp(14px,3vw,42px)!important;width:220px!important;padding:8px!important;border:1px solid #27455e!important;
  border-radius:14px!important;background:#081827!important;box-shadow:var(--shadow)!important;
}
.header-menu button{display:flex;align-items:center;width:100%;text-align:left;background:transparent;border:0;color:#d8e3eb;padding:11px 12px}
.header-menu button:hover{background:#102940}
.review-header-back,.team-home-header-btn,.manage-team-back{
  background:#0d2235!important;color:#e6eef5!important;border-color:#2a4a64!important;box-shadow:none!important;
}
.cloud-bar{display:none!important}
#appShell>header{
  position:sticky!important;top:var(--header-h)!important;z-index:2500!important;max-width:none!important;margin:0!important;
  padding:0 clamp(14px,3vw,42px)!important;background:rgba(5,18,31,.94)!important;border-bottom:1px solid var(--line-soft)!important;color:#fff!important;
  backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);
}
#appShell>header .workspace-heading{min-height:54px}
#workspaceTitle{font-size:18px;margin:0;color:#fff}
.workspace-subtitle{font-size:11px;color:#8299ad;margin:1px 0 0}
#workspaceNav{display:flex!important;justify-content:flex-end!important;gap:4px!important;min-height:54px!important;align-items:stretch!important}
#workspaceNav button{min-height:54px;padding:8px 14px;border:0;border-radius:0;background:transparent;color:#8fa5b8;font-size:12px;box-shadow:none}
#workspaceNav button.active{background:transparent!important;color:#75e486!important;border-bottom:2px solid #59d56d!important}
main{max-width:var(--content)!important;margin:0 auto!important;padding:22px clamp(12px,2.2vw,28px) 48px!important}
.page{animation:v128PageIn .2s ease}
@keyframes v128PageIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* Cards and common layout */
.card{
  margin:0 0 14px!important;padding:18px!important;border:1px solid var(--line-soft)!important;border-radius:var(--radius)!important;
  background:linear-gradient(145deg,rgba(11,30,47,.96),rgba(7,23,37,.96))!important;color:var(--text)!important;box-shadow:var(--shadow-soft)!important;
}
.card.compact{padding:13px 15px!important}
.card.inset-card{background:#071522!important;box-shadow:none!important;border-color:#1d374c!important}
.topbar{gap:14px}
.button-row{gap:8px}
.notice{border-color:rgba(241,184,74,.38)!important;background:rgba(142,93,17,.18)!important;color:#ffd985!important}
.notice.success{border-color:rgba(89,213,109,.35)!important;background:rgba(37,124,54,.16)!important;color:#91efa0!important}
.canvas-wrap{
  background:linear-gradient(145deg,#071724,#0a2134)!important;border:1px solid #284760!important;border-radius:16px!important;
  box-shadow:inset 0 0 34px rgba(0,0,0,.2);overflow:hidden;
}
.canvas-wrap canvas{width:100%;height:auto;max-width:100%;margin:auto}
.table-wrap,.mini-table{border:1px solid var(--line)!important;border-radius:14px!important;background:#061521!important;padding:0!important;overflow:auto!important}
table{background:transparent!important;color:#dce6ee;border-collapse:separate!important;border-spacing:0!important}
th,td{border:0!important;border-bottom:1px solid rgba(135,166,190,.12)!important;padding:10px 11px!important}
th{position:sticky;top:0;z-index:2;background:#102a40!important;color:#9feaaa!important;font-size:11px!important;text-transform:uppercase;letter-spacing:.045em}
td{font-size:12px!important;color:#c8d4de}
tbody tr:hover td{background:rgba(65,113,150,.08)}
.stats-grid{gap:9px!important}
.stat{
  min-height:84px;padding:12px!important;border:1px solid rgba(127,163,190,.15)!important;border-radius:14px!important;
  background:linear-gradient(145deg,#0b2235,#0a1d2e)!important;color:#93a8b9!important;font-size:12px;
}
.stat strong{font-size:23px!important;color:#f2f7fa!important;line-height:1.1;margin-top:7px!important}
.breakdown-grid{gap:12px!important}
.mini-table h3{padding:12px 13px 3px;margin:0;color:#f1f6fa}
.filter-grid{
  grid-template-columns:repeat(auto-fit,minmax(155px,1fr))!important;gap:9px!important;padding:12px!important;margin:10px 0 12px!important;
  border:1px solid rgba(123,157,183,.14);border-radius:15px;background:rgba(3,14,24,.35);
}
.filter-grid label{margin:0!important}
.time-filter-actions{align-items:center;padding:2px 0 8px}
.time-filter-actions button:first-child{background:linear-gradient(135deg,#35b854,#69dc79)!important;color:#031109!important;border-color:#64db75!important}
.applied-time-filter{display:inline-flex;align-items:center;min-height:35px;padding:6px 10px;border-radius:999px;background:#071522;border:1px solid #1c3b52;color:#92a7b8!important;font-size:11px}

/* Authentication and team gate */
.contact-floating{
  position:fixed!important;right:18px!important;bottom:18px!important;z-index:3600!important;margin:0!important;
  border-radius:999px!important;background:#0d263b!important;color:#bcd0df!important;border-color:#2a4b64!important;box-shadow:var(--shadow-soft)!important;
}
.auth-gate{max-width:1120px!important;margin:0 auto!important;padding:clamp(24px,6vh,70px) 16px 40px!important}
.auth-card,.auth-gate>#teamGate{max-width:620px;margin-left:auto!important;margin-right:auto!important;padding:clamp(22px,4vw,36px)!important}
.auth-brand-mark img{width:88px!important;height:88px!important;border-radius:24px!important;box-shadow:0 18px 46px rgba(39,196,77,.16)!important}
.auth-card h1{font-size:30px;text-align:center;margin:2px 0 8px;color:#fff}
.auth-card h1 .brand-accent{color:var(--primary)}
.auth-card>p:first-of-type{text-align:center;max-width:490px;margin:0 auto 22px}
.auth-card .auth-grid{grid-template-columns:1fr!important}
.auth-card .button-row{margin-top:6px}
.auth-card .button-row .primary{flex:1 1 180px}
.auth-help-row{justify-content:center}
.v128-auth-features{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0 22px}
.v128-auth-feature{padding:10px;border:1px solid var(--line-soft);border-radius:12px;background:#071522;text-align:center;color:#9fb2c1;font-size:11px}
.v128-auth-feature svg{display:block;width:20px;height:20px;margin:0 auto 6px;color:var(--primary)}
#teamGate .topbar h2{font-size:24px}
#teamGate hr{margin:22px 0}
#publicHelpPanel.fullscreen-help{background:#020b16!important}
#publicHelpPanel.fullscreen-help>.topbar,#publicHelpPanel.fullscreen-help>.help-content{background:#081827!important;border-color:var(--line)!important}

/* Team home */
#teamHomePage>.card{padding:0!important;overflow:hidden}
.v128-team-hero{
  position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:24px;align-items:center;
  min-height:210px;padding:clamp(24px,4vw,42px);border-bottom:1px solid var(--line-soft);
  background:radial-gradient(circle at 85% 20%,rgba(89,213,109,.15),transparent 19rem),linear-gradient(135deg,#071b2f,#0b2740 62%,#0b2f32);
}
.v128-team-hero::after{content:"";position:absolute;right:-80px;bottom:-140px;width:360px;height:360px;border:1px solid rgba(89,213,109,.12);border-radius:50%;box-shadow:0 0 0 55px rgba(89,213,109,.035),0 0 0 110px rgba(89,213,109,.018)}
.v128-team-hero-copy{position:relative;z-index:1}
.v128-team-kicker{display:inline-flex;align-items:center;gap:7px;margin-bottom:12px;color:#75e486;font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.1em}
.v128-team-hero h2{font-size:clamp(28px,4vw,46px);line-height:1.04;margin:0 0 10px;color:#fff}
.v128-team-hero p{max-width:610px;font-size:15px;color:#a7bac9}
.v128-team-hero-mark{position:relative;z-index:1;justify-self:end;width:min(220px,40vw);filter:drop-shadow(0 24px 44px rgba(0,0,0,.26));opacity:.94}
.v128-team-status{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.v128-status-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid rgba(117,228,134,.18);border-radius:999px;background:rgba(5,21,30,.44);color:#b7c9d5;font-size:11px}
.v128-status-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:#59d56d;box-shadow:0 0 0 4px rgba(89,213,109,.08)}
#teamHomePage>.card>.topbar{display:none!important}
.team-action-grid{grid-template-columns:repeat(12,minmax(0,1fr))!important;gap:12px!important;padding:20px!important}
.team-action-card{
  position:relative;grid-column:span 4;min-height:145px!important;padding:18px 18px 18px 66px!important;justify-content:flex-start!important;
  border:1px solid var(--line)!important;border-radius:16px!important;background:linear-gradient(145deg,#0b2032,#081a2a)!important;color:#fff!important;overflow:hidden;
}
.team-action-card::after{content:"";position:absolute;inset:auto -50px -70px auto;width:145px;height:145px;border-radius:50%;background:rgba(255,255,255,.025)}
.team-action-card:hover{border-color:#3a627e!important;background:linear-gradient(145deg,#102b42,#0a2135)!important;transform:translateY(-2px)!important}
.team-action-card.primary-card{grid-column:span 6;background:linear-gradient(135deg,#1f8f43,#50ce67)!important;border-color:#66df78!important;color:#041309!important}
.team-action-card.primary-card:hover{background:linear-gradient(135deg,#28a44c,#69dc79)!important}
.team-action-card strong{font-size:18px!important;color:inherit!important;line-height:1.2;position:relative;z-index:1}
.team-action-card span{color:#8fa6b8!important;font-size:12px;position:relative;z-index:1}
.team-action-card.primary-card span{color:#0b3a18!important}
.v128-action-icon{position:absolute;left:18px;top:18px;width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:#102d45;color:#70df80;z-index:1}
.primary-card .v128-action-icon{background:rgba(3,30,11,.14);color:#04200b}
.v128-action-icon svg{width:19px;height:19px}

/* Start game */
#newGamePanel{max-width:1080px;margin:0 auto!important;padding:0!important;overflow:hidden}
.v128-start-header{padding:24px 26px;border-bottom:1px solid var(--line-soft);background:linear-gradient(135deg,#0a2035,#0d2a40)}
.v128-start-header h2{margin:0 0 5px;font-size:28px}
.v128-start-header p{margin:0;max-width:700px}
#newGamePanel>h2,#newGamePanel>.hint{display:none!important}
#newGamePanel>.auth-grid{display:block!important;padding:18px 20px 4px}
.v128-start-group{margin:0 0 14px;padding:16px;border:1px solid var(--line-soft);border-radius:16px;background:#071624}
.v128-start-group-head{display:flex;align-items:center;gap:10px;margin-bottom:13px}
.v128-start-group-head span{width:31px;height:31px;display:grid;place-items:center;border-radius:10px;background:#102c43;color:#68df79;font-size:12px;font-weight:900}
.v128-start-group-head h3{margin:0;color:#eef5f9;font-size:16px}
.v128-start-group-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px}
.v128-start-group-grid>label,.v128-start-group-grid>.clock-setup{margin:0}
.v128-start-group-grid .clock-enable-row{display:flex;align-items:center;gap:9px;min-height:44px;padding:8px 11px;margin-top:21px!important;border:1px solid var(--line);border-radius:11px;background:#061421}
.v128-start-group-grid .clock-enable-row input{margin:0}
.clock-setup{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
#lineupSetup{margin:0 20px 16px!important;padding:16px!important;border:1px solid var(--line-soft)!important;border-radius:16px!important;background:#071624!important}
.lineup-setup-team{background:#091b2b!important;border-color:#234058!important;border-radius:14px!important}
.lineup-setup-grid{grid-template-columns:repeat(6,minmax(62px,1fr))!important}
#startGameBtn{display:block;width:calc(100% - 40px);margin:0 20px 20px;min-height:50px;font-size:16px}

/* Live match focused tracking */
body.v128-live-mode main{max-width:1500px!important;padding-top:12px!important}
body.v128-live-mode #appShell>header{display:none!important}
body.v128-live-mode .professional-app-header{min-height:60px!important;--header-h:60px}
body.v128-live-mode .brand-lockup span{display:none}
#gamePanel>.card.compact.topbar{
  display:grid!important;grid-template-columns:minmax(160px,1fr) auto auto minmax(230px,1fr)!important;gap:13px!important;align-items:center!important;
  padding:10px 14px!important;border-radius:16px!important;background:linear-gradient(135deg,#07192a,#0b2237)!important;
}
#activeGameTitle{font-size:14px;color:#fff}
#activeGameMeta{font-size:11px;color:#8097aa}
.live-score-board{
  min-width:330px!important;padding:8px 14px!important;border:1px solid #294861!important;border-radius:14px!important;background:#05131f!important;
}
.score-side{min-width:115px}
.score-team-name{font-size:11px!important;color:#a9bbc9!important;text-transform:uppercase;letter-spacing:.055em}
.score-control-row{gap:8px!important}
.score-control-row strong{font-size:29px!important;line-height:1;color:#fff}
.score-control-row button{width:31px!important;height:31px!important;min-height:31px!important;padding:0!important;border-radius:9px!important;font-size:18px!important}
.score-separator{color:#506a7d!important;font-size:20px}
.match-clock-panel{
  min-width:145px!important;padding:7px 10px!important;border:1px solid #294861!important;border-radius:13px!important;background:#061521!important;
}
.match-clock-panel>div:first-child{display:flex;flex-direction:column;align-items:center}
#matchClockHalf{font-size:10px;color:#86a0b4;text-transform:uppercase;letter-spacing:.06em}
#matchClockDisplay{font-size:24px;color:#68df79}
#gamePanel>.card.compact.topbar>.button-row{justify-content:flex-end}
#gamePanel>.card.compact.topbar>.button-row button{min-height:35px;padding:7px 9px;font-size:11px}
#trackerSessionPanel{padding:10px 13px!important;background:#061522!important;box-shadow:none!important}
#trackerSessionRole{font-size:12px;color:#dce6ee}
#trackerRealtimeStatus{margin:2px 0 0!important;font-size:10px}
.tracker-presence-list{gap:6px}
.tracking-stage-layout{grid-template-columns:minmax(190px,.72fr) minmax(520px,2.7fr) minmax(190px,.72fr)!important;gap:10px!important;align-items:start}
.tracking-main-card{padding:13px!important;border-color:#2a4c66!important;background:linear-gradient(145deg,#091c2c,#061624)!important}
.tracking-main-card h2{font-size:18px;margin-bottom:4px}
.tracking-main-card>#stepText{font-size:12px;margin-top:0}
.lineup-panel{position:sticky!important;top:74px!important;padding:12px!important;background:#071725!important;box-shadow:none!important}
.lineup-panel h3{font-size:14px;margin:0 0 2px;color:#fff}
.lineup-position-list{gap:6px!important}
.lineup-position-btn{border-color:#23425a!important;background:#0a2032!important}
.lineup-position-btn:hover{border-color:#4d7896!important}
.lineup-position{color:#86a0b3!important}
.lineup-player{color:#fff!important}
.court-quick-actions{margin:6px 0 8px!important;gap:7px!important}
.court-action-side{gap:5px!important}
.court-action-side button{min-height:34px!important;padding:7px 8px!important;background:#0b2438!important;color:#9cb0c0!important;font-size:10px!important}
#courtWrap,#goalWrap{max-width:980px;margin:0 auto}
.responsive-court-wrap canvas,#courtCanvas,#goalCanvas{max-height:67vh!important;object-fit:contain}
.details-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.preview-box{grid-column:1/-1;background:#061521!important;border-color:#23435a!important}
.sticky-actions{
  bottom:8px!important;z-index:30!important;margin:10px -4px -4px!important;padding:9px!important;border:1px solid rgba(87,128,158,.2)!important;
  border-radius:13px!important;background:rgba(4,15,25,.9)!important;backdrop-filter:blur(14px);box-shadow:0 12px 30px rgba(0,0,0,.24);
}
.sticky-actions button{min-height:40px;font-size:12px}
#nextStepBtn,#saveShotBtn{margin-left:auto;min-width:170px}
.team-stat-tabs,.graph-display-toggle,.offense-defense-tabs,.review-section-tabs{
  display:flex!important;gap:5px!important;padding:5px!important;border:1px solid rgba(123,157,183,.12)!important;border-radius:13px!important;background:#061522!important;
}
.team-stat-tabs button,.graph-display-toggle button,.offense-defense-tabs button,.review-section-tabs button{
  flex:1;background:transparent!important;border:0!important;color:#8fa6b9!important;box-shadow:none!important;
}
.team-stat-tabs button.active,.graph-display-toggle button.active,.offense-defense-tabs button.active,.review-section-tabs button.active{
  background:linear-gradient(135deg,#2c9d49,#57cb67)!important;color:#041309!important;box-shadow:none!important;
}
.collapsible-card{padding:0!important;overflow:hidden}
.collapsible-card>summary{
  display:flex;align-items:center;min-height:54px;padding:14px 17px!important;background:#0a1f31!important;color:#e7eef4!important;border-bottom:1px solid transparent;
}
.collapsible-card>summary::after{content:"+";margin-left:auto;color:#69de79;font-size:20px}
.collapsible-card[open]>summary{border-bottom-color:var(--line-soft)}
.collapsible-card[open]>summary::after{content:"−"}
.collapsible-content{padding:16px!important}
.graph-outcome-toggle{background:#061522!important;border-color:var(--line-soft)!important}
.graph-outcome-toggle button{background:#0b2235!important;color:#98adbd!important}
.graph-outcome-toggle button.active{background:#244c65!important;color:#fff!important}

/* Old games */
#gamesPage>.card{padding:0!important;overflow:visible}
#gamesPage>.card>.topbar{padding:20px 20px 12px}
#gamesPage>.card>.topbar h2{font-size:27px;margin:0}
.v128-oldgames-toolbar{
  display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:12px;align-items:center;padding:0 20px 16px;
}
.v128-search{position:relative}
.v128-search input{margin:0;padding-left:41px;background:#061522}
.v128-search svg{position:absolute;left:13px;top:12px;width:19px;height:19px;color:#7892a6;pointer-events:none}
.v128-scope-tabs{display:flex;gap:5px;padding:4px;border-radius:12px;background:#061522;border:1px solid var(--line-soft)}
.v128-scope-tabs button{min-height:36px;padding:7px 16px;border:0;background:transparent;color:#8198aa;box-shadow:none}
.v128-scope-tabs button.active{background:#22425b!important;color:#fff!important}
.selection-toolbar{margin:0!important;padding:11px 20px!important;border-color:var(--line-soft)!important;background:rgba(3,13,22,.24)}
#gamesList{padding:14px 16px 18px}
.folder-section{border-color:var(--line-soft)!important;border-radius:15px!important;background:#071522!important;overflow:visible!important}
.folder-header{padding:10px 12px!important;background:#0a2032!important;border-radius:14px!important}
.folder-toggle{color:#dce7ef!important}
.folder-toggle strong{color:#eaf1f5}
.folder-count{color:#7891a5!important}
.folder-compare{color:#9aafbf!important}
.folder-games{padding:8px!important;border-color:var(--line-soft)!important}
.game-item{
  display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:12px!important;align-items:center!important;
  margin:0 0 7px!important;padding:12px 13px!important;border:1px solid rgba(126,162,188,.13)!important;border-radius:13px!important;
  background:linear-gradient(145deg,#0a1d2d,#081827)!important;box-shadow:none!important;
}
.game-item:hover{border-color:#355d78!important;transform:translateY(-1px)!important;background:linear-gradient(145deg,#0d2539,#0a1c2d)!important}
.game-card-date{display:inline-flex;width:max-content;padding:3px 7px;border-radius:7px;background:#102b41;color:#90a8ba!important;font-size:10px!important;text-transform:uppercase;letter-spacing:.055em}
.game-card-match{font-size:16px!important;color:#e8f0f5!important;margin:5px 0 3px!important}
.game-card-match strong span{color:#67df78!important;font-size:18px}
.game-card-competition{color:#7e95a8!important;font-size:11px!important}
.tracking-badge{padding:4px 8px!important;border:1px solid #24445d!important;background:#0d263a!important;color:#99b4c7!important;font-size:10px!important}
.game-actions{gap:6px!important}
.game-actions .review-btn{background:linear-gradient(135deg,#35b854,#68dc78)!important;border-color:#60d873!important;color:#031109!important}
.game-actions .resume-btn{background:#102a40!important}
.menu-button{background:#0b2235!important;color:#b5c6d3!important}
.game-menu{border-color:#2a4b63!important;background:#081827!important;box-shadow:var(--shadow)!important}
.game-menu button{background:transparent!important;color:#cfdae2!important}
.game-menu button:hover{background:#10283d!important}
.analysis-empty{margin-top:16px!important;background:linear-gradient(145deg,#071522,#081c2d)!important}
#overviewPanel{margin-top:16px!important}
.v128-filter-empty{display:none;padding:20px;text-align:center;color:#8ea4b5}

/* Review */
#gameReview{display:grid;grid-template-columns:210px minmax(0,1fr);gap:12px;align-items:start}
#gameReview>.card.compact.topbar{grid-column:1/-1;display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:14px 16px!important}
#reviewTitle{font-size:22px;margin:0 0 3px}
#reviewMeta{font-size:11px;color:#8299ab}
#gameReview>.card.compact.topbar>.button-row{align-items:center;justify-content:flex-end}
#backToOldGamesBtn{display:none!important}
.v128-review-rail{
  grid-column:1;grid-row:2/span 20;position:sticky;top:145px;padding:8px;border:1px solid var(--line-soft);border-radius:15px;background:#071522;box-shadow:var(--shadow-soft);
}
.v128-review-rail-label{padding:8px 9px 6px;color:#6f879b;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.09em}
.v128-review-rail button{display:flex;align-items:center;gap:9px;width:100%;min-height:41px;padding:9px 10px;border:0;background:transparent;color:#9db1c0;text-align:left;box-shadow:none}
.v128-review-rail button svg{width:17px;height:17px;flex:0 0 auto;color:#5fd772}
.v128-review-rail button:hover,.v128-review-rail button.v128-current{background:#10283c;color:#fff;transform:none}
#gameReview>.review-section-tabs,#gameReview>.card.compact:not(.topbar),#gameReview>#reviewGameStatsTab,#gameReview>#reviewPlayerCardTab{grid-column:2}
.v128-export-wrap{position:relative}
.v128-export-button{display:flex!important;align-items:center;gap:7px;background:#102a40!important}
.v128-export-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:80;width:230px;padding:7px;border:1px solid #294a63;border-radius:13px;background:#081827;box-shadow:var(--shadow)}
.v128-export-menu button{display:flex;width:100%;border:0;background:transparent;text-align:left;color:#cbd8e1;padding:10px 11px}
.v128-export-menu button:hover{background:#10283d;transform:none}
.review-match-overview-card{background:linear-gradient(135deg,#071a2c,#0c2a3d)!important}
.review-score-headline{font-size:48px!important;color:#70df80!important;letter-spacing:-.055em;text-align:center;margin:10px 0}
.comparison-stat-grid{gap:8px!important}
.score-timeline-canvas{background:#061521!important;border-color:#24445c!important}
.professional-player-card>.card:first-child,.defense-overview{background:linear-gradient(135deg,#071b2e,#0d3046)!important}
.professional-player-card .player-card-basic .stat{background:#0b2539!important;border-color:#284a61!important}
.professional-player-card .player-card-basic .stat strong{color:#70df80!important}
.defense-overview .stat strong{color:#70df80!important}
.defense-court-map{background:linear-gradient(90deg,#071725,#0c2639,#071725)!important;border-color:#2b4c64!important}
.defense-corridor{background:#0b2234!important;border-color:#294a61!important}
.defense-corridor small{color:#849aad!important}

/* Manage team and modals */
.modal-backdrop{padding:18px!important;background:rgba(0,5,10,.78)!important;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.modal-card{
  border:1px solid #28475f!important;border-radius:18px!important;background:linear-gradient(145deg,#0a1c2c,#071522)!important;color:#fff!important;box-shadow:0 28px 80px rgba(0,0,0,.48)!important;
}
.wide-modal{width:min(1120px,100%)!important}
.fullscreen-modal .wide-modal{max-height:calc(100vh - 36px)!important;overflow:auto}
.v128-manage-tabs{display:flex;gap:5px;padding:5px;margin:12px 0;border:1px solid var(--line-soft);border-radius:13px;background:#061522}
.v128-manage-tabs button{flex:1;border:0;background:transparent;color:#8fa5b7}
.v128-manage-tabs button.active{background:#2f9f4b!important;color:#041309!important}
.roster-management{padding:0!important}
.roster-list{gap:7px!important}
.roster-row{padding:11px 12px!important;border-color:#24445b!important;background:#081a29!important;border-radius:12px!important}
.roster-row strong{color:#e9f0f5}
.roster-row span{color:#8198aa!important}
.logo-management-row img{background:#061522!important;border-color:#294a62!important}
.organization-danger-zone{border-color:rgba(239,98,98,.35)!important;background:rgba(91,23,31,.18)!important}
.action-history-list>*{border-color:var(--line-soft)!important}

/* Help */
.help-card{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
.help-hero{padding:22px!important;border:1px solid #25455e!important;border-radius:18px!important;background:linear-gradient(135deg,#07192b,#0d3045)!important;box-shadow:var(--shadow-soft)}
.help-hero img{width:68px!important;height:68px!important}
.help-hero h2{font-size:27px!important}
.help-hero p{color:#9eb2c1!important}
.help-index{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
.help-index a{min-height:55px!important;border-color:#213e54!important;background:#071624!important;color:#b6cad7!important}
.help-index a:hover{border-color:#4cab5b!important;background:#0d293b!important;color:#fff}
.help-section{border-color:#203e54!important;background:#071522!important;border-radius:15px!important}
.help-section>summary{background:#0a2032!important;color:#dce7ee!important}
.help-section>summary::before{background:rgba(89,213,109,.12)!important;color:#70df80!important}
.help-section-content{color:#c9d5de}
.help-section-content p,.help-section-content li{color:#aebfcb!important}
.help-callout{border-left-color:#59d56d!important;background:rgba(44,137,61,.13)!important;color:#bdd0db}
.help-mini-card{border-color:#24445b!important;background:#081a29!important}
.help-mini-card h4{color:#7be78b!important}

/* Mobile navigation */
.mobile-bottom-nav{
  position:fixed!important;left:8px!important;right:8px!important;bottom:8px!important;z-index:3100!important;
  display:none;grid-template-columns:repeat(4,1fr)!important;gap:3px!important;padding:5px calc(5px + env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) calc(5px + env(safe-area-inset-left))!important;
  border:1px solid #29475f!important;border-radius:16px!important;background:rgba(4,16,27,.94)!important;box-shadow:0 18px 45px rgba(0,0,0,.4)!important;backdrop-filter:blur(16px);
}
.mobile-bottom-nav button{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:49px!important;padding:5px!important;border:0!important;background:transparent!important;color:#859bad!important;font-size:10px!important;box-shadow:none!important}
.mobile-bottom-nav button.v128-active{color:#75e486!important}
.mobile-bottom-nav svg{width:18px;height:18px}

/* Responsive */
@media(max-width:1100px){
  #gamePanel>.card.compact.topbar{grid-template-columns:minmax(140px,1fr) auto auto!important}
  #gamePanel>.card.compact.topbar>.button-row{grid-column:1/-1;justify-content:center}
  .tracking-stage-layout{grid-template-columns:minmax(160px,.6fr) minmax(460px,2.4fr) minmax(160px,.6fr)!important}
  .team-action-card{grid-column:span 6}
  .team-action-card.primary-card{grid-column:span 6}
}
@media(max-width:900px){
  :root{--header-h:62px}
  body{padding-bottom:76px}
  .professional-app-header{min-height:62px!important;grid-template-columns:minmax(0,1fr) auto 44px!important;padding:8px 10px!important;gap:8px!important}
  .brand-lockup img{width:40px!important;height:40px!important}
  .brand-lockup strong{font-size:15px!important}.brand-lockup span{font-size:9px!important}
  .header-context{display:none!important}.header-status{width:36px;padding:0!important;justify-content:center}.header-status span:last-child{display:none}
  .header-menu{top:56px!important;right:10px!important}
  #appShell>header{top:62px!important;padding:0 10px!important}
  #appShell>header .workspace-heading{display:none!important}
  #workspaceNav{width:100%;justify-content:space-around!important}
  #workspaceNav button{flex:1;padding:7px 5px;font-size:11px}
  main{padding:12px 9px 30px!important}
  .mobile-bottom-nav{display:grid!important}
  body:has(#teamHomePage.active) .mobile-bottom-nav,body:has(#reviewPage.active) .mobile-bottom-nav,body.manage-team-open .mobile-bottom-nav{display:none!important}
  .v128-team-hero{grid-template-columns:1fr;min-height:230px;padding:25px 20px}.v128-team-hero-mark{position:absolute;right:18px;bottom:10px;width:130px;opacity:.18}
  .team-action-grid{padding:12px!important}.team-action-card,.team-action-card.primary-card{grid-column:span 6;min-height:125px!important;padding:15px 14px 15px 57px!important}.v128-action-icon{left:14px;top:15px}
  .v128-start-group-grid{grid-template-columns:1fr}.lineup-setup-grid{grid-template-columns:repeat(3,1fr)!important}
  body.v128-live-mode{padding-bottom:0}
  body.v128-live-mode .mobile-bottom-nav{display:none!important}
  #gamePanel>.card.compact.topbar{grid-template-columns:1fr auto!important;gap:8px!important}
  #gamePanel>.card.compact.topbar>div:first-child{min-width:0}
  .live-score-board{grid-column:1/-1;grid-row:2;min-width:0!important;width:100%;order:2}
  .match-clock-panel{grid-column:2;grid-row:1;min-width:125px!important}
  #gamePanel>.card.compact.topbar>.button-row{grid-column:1/-1;grid-row:3;overflow-x:auto;justify-content:flex-start;flex-wrap:nowrap;width:100%}
  #gamePanel>.card.compact.topbar>.button-row button{white-space:nowrap}
  .tracking-stage-layout{display:flex!important;flex-direction:column!important}.tracking-main-card{order:1;width:100%}.lineup-panel{order:2;position:static!important;width:100%}
  .lineup-position-list{grid-template-columns:repeat(3,1fr)!important}
  #gameReview{grid-template-columns:1fr!important;gap:9px}
  #gameReview>.card.compact.topbar,#gameReview>.review-section-tabs,#gameReview>.card.compact:not(.topbar),#gameReview>#reviewGameStatsTab,#gameReview>#reviewPlayerCardTab{grid-column:1!important}
  .v128-review-rail{grid-column:1!important;grid-row:auto!important;position:sticky;top:62px;z-index:40;display:flex;overflow-x:auto;padding:5px;border-radius:13px}
  .v128-review-rail-label{display:none}.v128-review-rail button{width:auto;min-width:max-content;white-space:nowrap}
  .v128-oldgames-toolbar{grid-template-columns:1fr}.v128-scope-tabs{justify-content:stretch}.v128-scope-tabs button{flex:1}
  .help-index{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:620px){
  body{font-size:14px}
  .professional-app-header:has(> .review-header-back:not(.hidden)),.professional-app-header:has(> .team-home-header-btn:not(.hidden)){grid-template-columns:auto minmax(0,1fr) auto 42px!important}
  .review-header-back,.team-home-header-btn{padding:8px 9px!important;font-size:11px!important}
  .brand-lockup strong{font-size:13px!important}.brand-lockup span{display:none}
  main{padding:8px 7px 25px!important}
  .card{padding:13px!important;border-radius:15px!important}
  .v128-auth-features{grid-template-columns:1fr}.auth-gate{padding:25px 9px 30px!important}.auth-card,.auth-gate>#teamGate{padding:20px 16px!important}
  .v128-team-hero{min-height:205px;padding:22px 17px}.v128-team-hero h2{font-size:30px}.v128-team-status{gap:5px}.v128-status-pill{font-size:10px}
  .team-action-grid{grid-template-columns:1fr!important}.team-action-card,.team-action-card.primary-card{grid-column:1!important;min-height:104px!important}.team-action-card span{font-size:11px}
  .v128-start-header{padding:19px 16px}.v128-start-header h2{font-size:23px}#newGamePanel>.auth-grid{padding:12px 12px 2px}.v128-start-group{padding:13px;margin-bottom:10px}#lineupSetup{margin:0 12px 12px!important;padding:13px!important}#startGameBtn{width:calc(100% - 24px);margin:0 12px 13px}.lineup-setup-grid{grid-template-columns:repeat(2,1fr)!important}
  #gamePanel>.card.compact.topbar{padding:9px!important}.match-clock-panel{min-width:105px!important}.score-control-row strong{font-size:26px!important}.score-side{min-width:90px}.score-team-name{font-size:9px!important}
  #trackerSessionPanel .topbar{display:block}.tracker-session-panel .button-row{margin-top:7px}
  .tracking-main-card{padding:9px!important}.court-quick-actions{grid-template-columns:1fr 20px 1fr!important}.court-action-side button{font-size:9px!important;padding:5px 3px!important}.responsive-court-wrap canvas,#courtCanvas,#goalCanvas{max-height:58vh!important}
  .details-grid{grid-template-columns:1fr!important}.filter-grid{grid-template-columns:1fr 1fr!important;padding:9px!important}.filter-grid label{font-size:10px}.sticky-actions{bottom:4px!important}.sticky-actions button{flex:1 1 43%;font-size:10px;padding:7px 5px}#nextStepBtn,#saveShotBtn{margin-left:0;min-width:0}
  #gamesPage>.card>.topbar{padding:15px 13px 9px}.v128-oldgames-toolbar{padding:0 13px 12px}.selection-toolbar{padding:9px 13px!important}#gamesList{padding:10px}
  .game-item{grid-template-columns:1fr!important;padding:11px!important}.game-actions{justify-content:stretch!important;margin-top:6px!important}.game-actions .review-btn,.game-actions .resume-btn{flex:1}.menu-wrap{margin-left:0!important}.tracking-badge{display:inline-flex;margin-top:3px}
  #gameReview>.card.compact.topbar{grid-template-columns:1fr!important}.v128-export-wrap{margin-left:auto}.review-score-headline{font-size:38px!important}.comparison-stat-grid{grid-template-columns:repeat(2,1fr)!important}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.stat{min-height:75px;padding:10px!important}.stat strong{font-size:19px!important}
  .help-index{grid-template-columns:1fr!important}.help-hero{grid-template-columns:1fr!important;text-align:center}.help-hero img{margin:auto}
  .modal-backdrop{padding:7px!important}.modal-card{padding:14px!important;border-radius:15px!important}.roster-row{grid-template-columns:1fr!important}.roster-row>div{display:flex;gap:5px}
  .contact-floating{right:10px!important;bottom:84px!important;font-size:11px;padding:8px 11px!important}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
.v128-orientation-row{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;margin:4px 0 8px;color:#829bad;font-size:10px;text-transform:uppercase;letter-spacing:.055em}.v128-orientation-row span{display:flex;align-items:center;gap:6px}.v128-orientation-row span:first-child::before,.v128-orientation-row span:last-child::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--home-team-color,#59d56d)}.v128-orientation-row span:last-child{justify-content:flex-end}.v128-orientation-row span:last-child::after{background:var(--away-team-color,#4d9cff)}.v128-orientation-row span:nth-child(2){padding:4px 8px;border-radius:999px;background:#102a40;color:#a6bac8}@media(max-width:620px){.v128-orientation-row{font-size:8px;gap:4px}.v128-orientation-row span:nth-child(2){padding:3px 5px}}
/* v1.28 visual refinements after responsive validation */
.brand-lockup strong .brand-accent{display:inline!important;color:var(--primary)!important;font-style:normal}
body:has(#teamHomePage.active) #appShell>header,
body:has(#reviewPage.active) #appShell>header{display:none!important}
.team-action-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.team-action-card{grid-column:span 1!important}
.team-action-card.primary-card{grid-column:span 2!important}
@media(max-width:900px){
  #appShell>header{display:none!important}
  .team-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .team-action-card{grid-column:span 1!important}
  .team-action-card.primary-card{grid-column:span 2!important}
}
@media(max-width:620px){
  .team-action-grid{grid-template-columns:1fr!important}
  .team-action-card,.team-action-card.primary-card{grid-column:1!important}
  #gamePanel>.card.compact.topbar>.button-row{display:grid!important;grid-template-columns:1fr 1fr!important;overflow:visible!important;width:100%}
  #gamePanel>.card.compact.topbar>.button-row button{white-space:normal!important;width:100%}
}