/* ═══════════════════════════════════════════════════════════════
   CORSAIR SHARED CSS
   Used by all role-specific command pages (AT, Coach, Athlete, Parent, S&C).
   Design tokens, typography, color system, base components.
   Sport-neutral — no soccer- or football-specific class names.
   ═══════════════════════════════════════════════════════════════ */

:root, [data-theme="light"] {
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem;
  --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem; --space-12:3rem;
  --bg:#f4f7fa; --surface:#ffffff; --surface-2:#eef3f8; --surface-3:#e6edf5;
  --border:rgba(15,23,42,.10);
  --text:#0f172a; --muted:#5b6b7f; --faint:#8fa0b4;
  --cyan:#0ea5c6; --green:#16a34a; --amber:#d97706; --red:#dc2626; --blue:#2563eb; --purple:#7c3aed;
  --shadow:0 10px 30px rgba(15,23,42,.08);
  --radius:18px; --radius-sm:12px; --radius-pill:999px;
  --font-body:'Inter',sans-serif; --font-display:'Barlow Condensed',sans-serif;
}
[data-theme="dark"] {
  --bg:#071018; --surface:#0d1722; --surface-2:#111f2e; --surface-3:#16283b;
  --border:rgba(255,255,255,.08);
  --text:#e8f1fb; --muted:#9db0c5; --faint:#6f849a;
  --cyan:#22d3ee; --green:#22c55e; --amber:#f59e0b; --red:#f43f5e; --blue:#60a5fa; --purple:#a78bfa;
  --shadow:0 18px 50px rgba(0,0,0,.32);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--font-body);font-size:var(--text-base);
  background:linear-gradient(180deg,var(--bg),#091522 55%,var(--bg));
  color:var(--text);min-height:100vh;}
button{font:inherit;}
img{max-width:100%;}
.app{max-width:1440px;margin:0 auto;padding:var(--space-6);}

/* ───────────────────────────────────────────────────────────────
   TOPBAR — used by every role page
   ─────────────────────────────────────────────────────────────── */
.topbar{display:flex;justify-content:space-between;gap:var(--space-4);align-items:center;
  padding:var(--space-4) var(--space-5);background:rgba(255,255,255,.02);
  border:1px solid var(--border);border-radius:var(--radius);backdrop-filter:blur(14px);
  position:sticky;top:16px;z-index:20;}
.brand{display:flex;align-items:center;gap:var(--space-4);}
.mark{width:44px;height:44px;border-radius:14px;
  background:linear-gradient(135deg,var(--cyan),#0f3550);display:grid;place-items:center;
  box-shadow:var(--shadow);color:#071018;font-weight:900;font-size:22px;}
.eyebrow{font-size:var(--text-xs);letter-spacing:.16em;text-transform:uppercase;
  color:var(--faint);font-weight:700;}
.title{font-family:var(--font-display);font-size:var(--text-xl);letter-spacing:.06em;
  text-transform:uppercase;line-height:1;}
.title small{color:var(--cyan);}
.actions{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap;}

/* ───────────────────────────────────────────────────────────────
   PAGE TOOLBAR — operational sub-bar that sits below the brand
   header rendered by corsairRenderHeader. Carries page-specific
   chips/buttons that are not brand chrome (date, team, refresh,
   theme, view-switchers). Horizontal padding matches the brand
   bar (22px) for visual continuity; vertical padding is tighter
   so the sub-bar reads as secondary. Theme-aware via shared tokens.
   ─────────────────────────────────────────────────────────────── */
.page-toolbar{padding:12px 22px;border-bottom:1px solid var(--border);
  background:var(--surface);}
.page-toolbar .actions{display:flex;gap:var(--space-2);align-items:center;
  flex-wrap:wrap;justify-content:flex-start;}

/* Role badge in topbar — shows current role context */
.role-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .85rem;
  border-radius:var(--radius-pill);background:rgba(167,139,250,.10);
  color:var(--purple);border:1px solid rgba(167,139,250,.18);
  font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;}

/* ───────────────────────────────────────────────────────────────
   COMMON CHIPS, BUTTONS, PILLS
   ─────────────────────────────────────────────────────────────── */
.chip,.ghost-btn,.role-btn,.seg-btn,.panel-tag,.athlete-score,.status-pill,.role-badge{
  display:inline-flex;align-items:center;gap:.5rem;border-radius:var(--radius-pill);
  font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;
}
.chip{padding:.55rem .85rem;background:rgba(34,211,238,.10);color:var(--cyan);
  border:1px solid rgba(34,211,238,.18);}
.ghost-btn{padding:.65rem 1rem;background:var(--surface);border:1px solid var(--border);
  color:var(--text);cursor:pointer;text-decoration:none;}
.ghost-btn:hover{border-color:var(--cyan);}
.primary-btn{padding:.65rem 1rem;background:var(--cyan);color:#071018;
  border:1px solid var(--cyan);border-radius:var(--radius-pill);
  font-size:var(--text-xs);font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem;}
.primary-btn:hover{filter:brightness(1.1);}

/* Header buttons (Menu / Sign out) injected by corsairRenderHeader use
   class="btn", which was previously undefined at shared scope — command
   pages rendered them browser-default. Sport dashboards define their own
   .btn locally; their <style> loads after this file and still wins. */
.btn{display:inline-flex;align-items:center;gap:.4rem;
  font-family:var(--font-display);font-size:11px;font-weight:700;
  letter-spacing:1.5px;text-transform:uppercase;
  padding:7px 13px;border-radius:6px;border:1px solid var(--border);
  background:transparent;color:var(--muted);cursor:pointer;
  text-decoration:none;transition:all .15s;white-space:nowrap;}
.btn:hover{border-color:var(--cyan);color:var(--text);}
.btn-accent{background:var(--cyan);border-color:var(--cyan);color:#071018;font-weight:800;}
.btn-accent:hover{filter:brightness(1.1);}

/* ───────────────────────────────────────────────────────────────
   HERO — top section on most role pages
   ─────────────────────────────────────────────────────────────── */
.hero{display:grid;grid-template-columns:1.55fr 1fr;gap:var(--space-5);margin-top:var(--space-5);}
.hero-card,.summary-card,.panel,.athlete-hero,.workflow-card{
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));
  border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);
}
.hero-card{padding:var(--space-6);min-height:270px;display:flex;flex-direction:column;
  justify-content:space-between;overflow:hidden;position:relative;}
.hero-card::after{content:"";position:absolute;inset:auto -60px -80px auto;
  width:240px;height:240px;
  background:radial-gradient(circle at center,rgba(34,211,238,.24),transparent 70%);
  pointer-events:none;}
.hero-card h1{font-family:var(--font-display);font-size:clamp(2rem,1.4rem + 2vw,3.2rem);
  line-height:.95;letter-spacing:.03em;text-transform:uppercase;margin:.45rem 0 0;max-width:14ch;}
.hero-card p.lede{margin:1rem 0 0;color:var(--muted);max-width:62ch;line-height:1.6;}
.hero-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3);margin-top:var(--space-5);}
.summary-card{padding:var(--space-4);background:var(--surface);}
.summary-label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.14em;
  color:var(--faint);font-weight:800;}
.summary-value{font-family:var(--font-display);font-size:clamp(2rem,1.4rem + 1.6vw,3rem);
  line-height:1;margin-top:.35rem;}
.summary-note{font-size:var(--text-sm);color:var(--muted);margin-top:.35rem;}

.hero-right{display:grid;gap:var(--space-4);}
.workflow-card{padding:var(--space-5);}
.workflow-steps{display:grid;gap:var(--space-3);margin-top:var(--space-4);}
.workflow-step{display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-3);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);}
.step-num{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  background:rgba(34,211,238,.12);color:var(--cyan);font-weight:800;
  font-size:var(--text-sm);flex-shrink:0;}
.workflow-step strong{display:block;font-size:var(--text-sm);}
.workflow-step .panel-sub{font-size:var(--text-xs);color:var(--muted);margin-top:.3rem;line-height:1.45;}

/* ───────────────────────────────────────────────────────────────
   HEADLINE BANNER — top-priority alert (used by AT, S&C views)
   ─────────────────────────────────────────────────────────────── */
.headline-banner{display:grid;grid-template-columns:1fr auto;gap:var(--space-4);
  align-items:center;padding:var(--space-5);
  background:linear-gradient(135deg,rgba(244,63,94,.12),rgba(245,158,11,.08));
  border:1px solid rgba(244,63,94,.22);border-radius:var(--radius);
  margin-top:var(--space-5);}
.headline-banner.is-clear{
  background:linear-gradient(135deg,rgba(34,197,94,.10),rgba(34,211,238,.06));
  border-color:rgba(34,197,94,.20);}
.headline-banner.is-warning{
  background:linear-gradient(135deg,rgba(245,158,11,.12),rgba(244,63,94,.06));
  border-color:rgba(245,158,11,.22);}
.headline-eyebrow{font-size:var(--text-xs);letter-spacing:.16em;text-transform:uppercase;
  color:var(--red);font-weight:800;}
.headline-banner.is-clear .headline-eyebrow{color:var(--green);}
.headline-banner.is-warning .headline-eyebrow{color:var(--amber);}
.headline-text{font-size:var(--text-lg);font-weight:800;line-height:1.25;margin-top:.4rem;}
.headline-sub{font-size:var(--text-sm);color:var(--muted);margin-top:.4rem;line-height:1.5;}

/* ───────────────────────────────────────────────────────────────
   TREND STRIP — 7-day rolling team status (AT, S&C views)
   ─────────────────────────────────────────────────────────────── */
.trend-strip{margin-top:var(--space-5);padding:var(--space-5);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);}
.trend-strip-head{display:flex;justify-content:space-between;align-items:baseline;
  gap:var(--space-3);margin-bottom:var(--space-4);flex-wrap:wrap;}
.trend-days{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--space-2);}
.trend-day{padding:var(--space-3);background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--radius-sm);text-align:center;display:flex;flex-direction:column;
  align-items:center;gap:.35rem;min-height:88px;justify-content:center;}
.trend-day .dow{font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;
  color:var(--faint);font-weight:700;}
.trend-day .stack{display:flex;flex-direction:column;gap:2px;width:36px;align-items:center;}
.trend-day .stack-row{display:flex;gap:2px;align-items:center;font-size:10px;
  color:var(--faint);font-weight:700;}
.trend-day .dot{width:10px;height:10px;border-radius:50%;}
.trend-day .dot.green{background:var(--green);}
.trend-day .dot.amber{background:var(--amber);}
.trend-day .dot.red{background:var(--red);}
.trend-day .dot.empty{background:var(--surface-3);}

/* ───────────────────────────────────────────────────────────────
   LAYOUT — sidebar + main on AT page; main-only on others
   ─────────────────────────────────────────────────────────────── */
.layout{display:grid;grid-template-columns:220px 1fr;gap:var(--space-5);margin-top:var(--space-5);}
.layout.no-sidebar{grid-template-columns:1fr;}
.sidebar{position:sticky;top:108px;height:max-content;padding:var(--space-4);
  background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:var(--radius);}
.role-group,.segment-group{display:grid;gap:var(--space-2);}
.role-btn,.seg-btn{width:100%;justify-content:flex-start;padding:.85rem 1rem;
  background:transparent;border:1px solid var(--border);color:var(--muted);cursor:pointer;}
.role-btn:hover,.seg-btn:hover{color:var(--text);border-color:var(--border);}
.role-btn.active,.seg-btn.active{background:rgba(34,211,238,.10);
  border-color:rgba(34,211,238,.25);color:var(--text);}
.role-btn:disabled{opacity:.4;cursor:not-allowed;}

.main{display:grid;gap:var(--space-5);min-width:0;}
.section-head{display:flex;justify-content:space-between;align-items:end;
  gap:var(--space-3);flex-wrap:wrap;}
.section-title{font-family:var(--font-display);font-size:var(--text-xl);letter-spacing:.04em;
  text-transform:uppercase;}
.section-copy{font-size:var(--text-sm);color:var(--muted);max-width:72ch;}

.role-view{display:none;gap:var(--space-5);}
.role-view.active{display:grid;}

/* ───────────────────────────────────────────────────────────────
   PANELS — used everywhere
   ─────────────────────────────────────────────────────────────── */
.panel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4);}
.panel-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4);}
.panel{padding:var(--space-5);background:var(--surface);}
.panel-top{display:flex;justify-content:space-between;align-items:flex-start;
  gap:var(--space-3);margin-bottom:var(--space-4);}
.panel-title{font-size:var(--text-lg);font-weight:800;line-height:1.1;}
.panel-sub{font-size:var(--text-sm);color:var(--muted);margin-top:.3rem;}
.panel-tag{padding:.45rem .72rem;border:1px solid var(--border);
  background:var(--surface-2);color:var(--faint);}

.kpi{display:flex;align-items:end;gap:.7rem;margin-bottom:var(--space-4);}
.kpi-value{font-family:var(--font-display);font-size:clamp(2.2rem,1.5rem + 1.2vw,3.2rem);
  line-height:.95;}
.kpi-note{font-size:var(--text-sm);color:var(--muted);padding-bottom:.28rem;}

.meter{height:12px;background:var(--surface-3);border-radius:999px;overflow:hidden;
  margin-bottom:var(--space-4);}
.meter > span{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,var(--cyan),var(--blue));}

/* ───────────────────────────────────────────────────────────────
   LIST ITEMS — used in panels
   ─────────────────────────────────────────────────────────────── */
.list,.coach-list,.athlete-list{display:grid;gap:var(--space-3);}
.item{display:grid;grid-template-columns:1fr auto;gap:var(--space-3);align-items:center;
  padding:var(--space-3);background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--radius-sm);}
.item strong{display:block;font-size:var(--text-sm);}
.item span{display:block;font-size:var(--text-xs);color:var(--muted);
  margin-top:.2rem;line-height:1.45;}
.status-pill{padding:.42rem .68rem;}
.status-red{background:rgba(244,63,94,.12);color:var(--red);}
.status-amber{background:rgba(245,158,11,.14);color:var(--amber);}
.status-green{background:rgba(34,197,94,.12);color:var(--green);}
.status-blue{background:rgba(96,165,250,.12);color:var(--blue);}
.status-purple{background:rgba(167,139,250,.12);color:var(--purple);}

.action-stack{display:grid;gap:var(--space-3);}
.action{padding:var(--space-3);border-radius:var(--radius-sm);
  background:rgba(34,211,238,.08);border:1px solid rgba(34,211,238,.14);}
.action strong{display:block;font-size:var(--text-sm);margin-bottom:.2rem;}
.action p{margin:0;color:var(--muted);font-size:var(--text-sm);line-height:1.45;}

/* ───────────────────────────────────────────────────────────────
   COACH BANNER + SCORE STRIP (Coach view)
   ─────────────────────────────────────────────────────────────── */
.coach-banner{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--space-4);}
.score-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);
  margin-top:var(--space-4);}
.score-card{padding:var(--space-4);border-radius:var(--radius-sm);
  background:var(--surface-2);border:1px solid var(--border);}
.score-card .num{font-family:var(--font-display);font-size:2.3rem;line-height:1;}

/* ───────────────────────────────────────────────────────────────
   ATHLETE HERO + RING + MICRO GRID (Athlete + Parent views)
   ─────────────────────────────────────────────────────────────── */
.athlete-shell{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);
  gap:var(--space-4);}
.athlete-hero{padding:var(--space-6);
  background:linear-gradient(160deg,rgba(34,211,238,.12),rgba(124,58,237,.10) 75%),var(--surface);
  position:relative;overflow:hidden;}
.athlete-score{padding:.6rem .9rem;background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.12);color:var(--text);}
.score-ring{width:180px;height:180px;border-radius:50%;margin:var(--space-5) auto;
  border:6px solid var(--green);display:grid;place-items:center;
  position:relative;background:var(--surface);
  transition:border-color .2s ease;}
.score-ring.tier-amber{border-color:var(--amber);}
.score-ring.tier-red{border-color:var(--red);}
.score-ring.tier-grey{border-color:var(--text3);}
.score-ring::after{content:"";position:absolute;inset:10px;background:var(--surface);
  border-radius:50%;border:1px solid var(--border);}
.score-ring strong,.score-ring span{position:relative;z-index:1;text-align:center;}
.score-ring strong{display:block;font-family:var(--font-display);font-size:3.5rem;line-height:1;}
.score-ring span{font-size:var(--text-xs);text-transform:uppercase;
  letter-spacing:.14em;color:var(--muted);}
.encouragement{font-size:var(--text-lg);font-weight:700;line-height:1.25;max-width:22ch;
  margin-top:var(--space-4);}
.subcards{display:grid;gap:var(--space-4);}
.micro-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3);}
.micro{padding:var(--space-4);background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--radius-sm);}
.micro .label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.12em;
  color:var(--faint);font-weight:800;}
.micro .value{font-size:var(--text-lg);font-weight:800;margin-top:.35rem;}

/* Trend arrow (week-over-week deltas in athlete view) */
.delta-arrow{display:inline-flex;align-items:center;gap:.25rem;font-size:var(--text-xs);
  font-weight:800;letter-spacing:.06em;}
.delta-up{color:var(--green);}
.delta-down{color:var(--red);}
.delta-flat{color:var(--muted);}

/* Streak badge (athlete view gamification) */
.streak-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .85rem;
  border-radius:var(--radius-pill);background:rgba(245,158,11,.12);
  border:1px solid rgba(245,158,11,.22);color:var(--amber);
  font-size:var(--text-xs);font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
.streak-badge.gold{background:rgba(245,158,11,.18);border-color:rgba(245,158,11,.40);
  box-shadow:0 0 24px rgba(245,158,11,.25);}

/* ───────────────────────────────────────────────────────────────
   ATHLETE PICKER — selectable list (used by AT, parent multi-child)
   ─────────────────────────────────────────────────────────────── */
.athlete-picker{display:flex;align-items:center;gap:var(--space-3);
  margin-bottom:var(--space-4);flex-wrap:wrap;}
.athlete-picker label{font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;
  color:var(--faint);font-weight:700;}
.athlete-picker select{padding:.65rem 1rem;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);
  font-family:inherit;font-size:var(--text-sm);min-width:240px;}

/* ───────────────────────────────────────────────────────────────
   PARENT — child cards on landing
   ─────────────────────────────────────────────────────────────── */
.child-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:var(--space-4);margin-top:var(--space-5);}
.child-card{padding:var(--space-5);background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);
  cursor:pointer;transition:transform .15s ease,border-color .15s ease;
  display:flex;flex-direction:column;gap:var(--space-3);min-height:200px;}
.child-card:hover{transform:translateY(-2px);border-color:var(--cyan);}
.child-card-head{display:flex;justify-content:space-between;align-items:flex-start;
  gap:var(--space-3);}
.child-name{font-family:var(--font-display);font-size:var(--text-lg);
  letter-spacing:.04em;text-transform:uppercase;line-height:1.1;}
.child-school{font-size:var(--text-xs);color:var(--faint);
  letter-spacing:.10em;text-transform:uppercase;font-weight:700;margin-top:.3rem;}
.child-status-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;margin-top:6px;}
.child-status-dot.green{background:var(--green);box-shadow:0 0 12px rgba(34,197,94,.5);}
.child-status-dot.amber{background:var(--amber);box-shadow:0 0 12px rgba(245,158,11,.5);}
.child-status-dot.red{background:var(--red);box-shadow:0 0 12px rgba(244,63,94,.5);}
.child-summary{font-size:var(--text-sm);color:var(--muted);line-height:1.5;flex:1;}
.child-cta{font-size:var(--text-xs);color:var(--cyan);
  font-weight:800;letter-spacing:.10em;text-transform:uppercase;margin-top:auto;}

/* Child switcher (top of single-child detail view) */
.child-switcher{display:flex;gap:var(--space-2);flex-wrap:wrap;
  padding:var(--space-3);background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);margin-top:var(--space-5);}
.child-switcher-btn{padding:.55rem .85rem;background:transparent;
  border:1px solid var(--border);color:var(--muted);cursor:pointer;
  border-radius:var(--radius-pill);font-size:var(--text-xs);
  font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.child-switcher-btn:hover{color:var(--text);}
.child-switcher-btn.active{background:rgba(34,211,238,.10);
  border-color:rgba(34,211,238,.25);color:var(--text);}

/* ───────────────────────────────────────────────────────────────
   STATES — empty, loading, fail
   ─────────────────────────────────────────────────────────────── */
.empty,.loading,.fail{padding:var(--space-8);text-align:center;color:var(--muted);
  background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius-sm);
  font-size:var(--text-sm);}
.spinner{width:24px;height:24px;border:2px solid var(--border);border-top-color:var(--cyan);
  border-radius:50%;animation:spin .8s linear infinite;display:inline-block;
  vertical-align:middle;margin-right:.6rem;}
@keyframes spin{to{transform:rotate(360deg);}}

#auth-screen{display:none;flex-direction:column;align-items:center;justify-content:center;
  min-height:60vh;gap:var(--space-4);text-align:center;padding:var(--space-8);}

#wrong-role-screen{display:none;flex-direction:column;align-items:center;justify-content:center;
  min-height:60vh;gap:var(--space-4);text-align:center;padding:var(--space-8);}

.legacy-link{font-size:var(--text-xs);color:var(--faint);margin-top:var(--space-4);
  text-align:center;}
.legacy-link a{color:var(--muted);}

/* ───────────────────────────────────────────────────────────────
   RESPONSIVE
   ─────────────────────────────────────────────────────────────── */
@media (max-width:1120px){
  .hero,.coach-banner,.athlete-shell,.layout{grid-template-columns:1fr;}
  .sidebar{position:static;}
  .hero-grid,.panel-grid,.score-strip,.micro-grid{grid-template-columns:repeat(2,1fr);}
  .panel-grid-3{grid-template-columns:1fr;}
  .headline-banner{grid-template-columns:1fr;}
}
@media (max-width:720px){
  .app{padding:var(--space-4);
    padding-left:max(var(--space-4),env(safe-area-inset-left));
    padding-right:max(var(--space-4),env(safe-area-inset-right));}
  .topbar,.hero-card,.workflow-card,.panel,.athlete-hero{padding:var(--space-4);}
  .topbar{position:static;}
  .page-toolbar{padding:var(--space-2) var(--space-4);}
  .hero-grid,.panel-grid{grid-template-columns:1fr;}
  /* Compact numeric strips stay multi-column — stacking three small
     number cards 1-wide triples scroll length for no readability gain. */
  .score-strip{grid-template-columns:repeat(3,1fr);}
  .micro-grid{grid-template-columns:repeat(2,1fr);}
  .hero-card{min-height:0;}
  .actions{width:100%;justify-content:flex-start;}
  .title{font-size:1.6rem;}
  .trend-days{grid-template-columns:repeat(7,1fr);gap:4px;}
  .trend-day{padding:var(--space-2);min-height:64px;}
  .kpi{flex-wrap:wrap;}
  /* 44px minimum touch targets on interactive controls. */
  .ghost-btn,.primary-btn,.btn,.role-btn,.seg-btn,.child-switcher-btn{min-height:44px;}
  /* 16px form controls prevent iOS Safari zoom-on-focus. Page-local
     styles load after this file and can still override. */
  select,input,textarea{font-size:16px;}
  .athlete-picker{flex-direction:column;align-items:stretch;}
  .athlete-picker select{min-width:0;width:100%;}
}
@media (max-width:480px){
  .app{padding:var(--space-3);
    padding-left:max(var(--space-3),env(safe-area-inset-left));
    padding-right:max(var(--space-3),env(safe-area-inset-right));}
  .score-card{padding:var(--space-3);}
  .score-card .num{font-size:1.9rem;}
  .headline-banner{padding:var(--space-4);}
  .panel-top{flex-wrap:wrap;}
  .score-ring{width:150px;height:150px;}
  .score-ring strong{font-size:2.8rem;}
}