/* Tecumseh Soccer Player Hub, look D (ruled 2026-09-22):
   the game menu is the app; Coach's dark glass board is where teaching happens;
   fields and players are drawn C-style (dark green pitch, angled tokens). */

@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/ChakraPetch-600.woff2) format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/ChakraPetch-700.woff2) format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:italic;font-weight:700;font-display:swap;src:url(assets/fonts/ChakraPetch-700i.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/Barlow-400.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/Barlow-500.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/Barlow-600.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/Barlow-700.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/AtkinsonHyperlegible-400.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/AtkinsonHyperlegible-700.woff2) format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url(assets/fonts/BricolageGrotesque-800.woff2) format('woff2')}
@font-face{font-family:'Kalam';font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/Kalam-700.woff2) format('woff2')}

:root{
  color-scheme:dark;
  /* game menu */
  --bg:#0C1016;--p1:#151B24;--p2:#1E2632;--p3:#28323F;--line:#2B3543;--line-hi:#3A4556;
  --ink:#F2F4F7;--ink-2:#D1D6DE;--muted:#9AA5B5;
  --acc:#DB402A;--acc-hi:#FF7A5C;--acc-deep:#3A1A14;--teal:#2EC4B6;--amber:#F2B950;
  /* coach's glass board */
  --b-bg:#161A1F;--b-grid:rgba(255,255,255,.045);--b-ink:#ECEFF3;--b-muted:#A5AFBC;--b-cyan:#6CCBFF;--b-orange:#FF7A5C;
  --b-line:rgba(236,239,243,.18);--b-edge:rgba(236,239,243,.55);--b-card:rgba(255,255,255,.035);--b-note:rgba(242,201,76,.10);--b-note-line:#F2C94C;
  /* the pitch */
  --pitch:#123321;--pitch-edge:#2A5A3E;--pitch-line:rgba(255,255,255,.35);--them:#E6E9EE;--them-ink:#0C1016;
  /* type */
  --display:'Chakra Petch','Arial Narrow',system-ui,sans-serif;
  --body:'Barlow',system-ui,-apple-system,'Segoe UI',sans-serif;
  --b-body:'Atkinson Hyperlegible',system-ui,sans-serif;
  --b-head:'Bricolage Grotesque','Atkinson Hyperlegible',system-ui,sans-serif;
  --hand:'Kalam','Segoe Print','Comic Sans MS',cursive;
  --tabbar:64px;--gutter:16px;
  --cut:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);
  --cut2:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 20px));
  --slant:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;background:radial-gradient(120% 60% at 100% 0%,#1A2230 0%,var(--bg) 55%) fixed,var(--bg);color:var(--ink);font:500 16px/1.5 var(--body);-webkit-font-smoothing:antialiased;min-height:100vh}
img,svg{max-width:100%}
a{color:var(--acc-hi)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
[hidden]{display:none!important}
h1,h2,h3{margin:0;text-wrap:balance}
p{margin:0}
.skip-link{position:absolute;left:-999px;top:8px;z-index:99;background:var(--ink);color:var(--bg);padding:10px 14px;font-weight:700}
.skip-link:focus{left:8px}
.vis{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- shell ---------- */
.app-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;display:flex;align-items:center;gap:10px;padding:10px var(--gutter);background:rgba(12,16,22,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.brand-crest{width:40px;height:40px;flex:none}
.brand-wordmark{height:22px;width:auto;max-width:58vw}
.icon-button{margin-left:auto;width:44px;height:44px;display:grid;place-items:center;color:var(--ink);background:var(--p2);border:1px solid var(--line);clip-path:var(--cut)}
.icon-button svg,.primary-nav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.primary-nav{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(4,1fr);background:#0A0D12;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
.primary-nav a{min-height:var(--tabbar);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:var(--muted);font:700 11px/1 var(--display);letter-spacing:.06em;text-transform:uppercase}
.primary-nav a[aria-current=page]{color:var(--ink);box-shadow:inset 0 3px 0 var(--acc)}
main{display:block;max-width:760px;margin:0 auto;padding:0 0 calc(var(--tabbar) + 32px + env(safe-area-inset-bottom,0px))}
main:focus{outline:none}
.app-footer{max-width:760px;margin:0 auto;padding:0 var(--gutter) calc(var(--tabbar) + 24px);display:flex;flex-wrap:wrap;gap:6px 10px;font-size:14px;color:var(--muted)}
.app-footer a{color:var(--muted)}
#connection-status{flex-basis:100%}
.system-notice{max-width:760px;margin:10px auto 0;padding:10px 14px;background:rgba(242,185,80,.12);border-left:3px solid var(--amber);font-size:14px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--tabbar) + 16px + env(safe-area-inset-bottom,0px));z-index:30;background:var(--ink);color:var(--bg);padding:10px 16px;font-weight:700;max-width:calc(100% - 32px);clip-path:var(--slant);padding-inline:22px}
.loading-state{padding:40px var(--gutter)}
.loading-state h1{font:700 italic 22px/1 var(--display);text-transform:uppercase;color:var(--muted)}
@media (min-width:64rem){
  body{padding-left:200px}
  .primary-nav{top:0;right:auto;width:200px;display:flex;flex-direction:column;gap:4px;padding:84px 12px 16px;border-top:0;border-right:1px solid var(--line)}
  .primary-nav a{flex-direction:row;justify-content:flex-start;gap:12px;min-height:48px;padding:0 14px;font-size:14px}
  .primary-nav a[aria-current=page]{background:var(--p2);box-shadow:inset 3px 0 0 var(--acc)}
  .app-header{margin-left:-200px;padding-left:24px;z-index:25}
  main{padding-bottom:48px}
  .app-footer{padding-bottom:32px}
  .toast{bottom:24px}
}

/* ---------- page parts ---------- */
.pad{padding-inline:var(--gutter)}
.subbar{position:sticky;top:calc(61px + env(safe-area-inset-top,0px));z-index:10;display:flex;align-items:center;gap:10px;padding:10px var(--gutter);background:rgba(12,16,22,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);font:700 13px/1 var(--display);letter-spacing:.06em;text-transform:uppercase}
.subbar a{color:var(--acc-hi);text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
.subbar span{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.page-head{padding:18px var(--gutter) 4px}
.kick{font:700 12px/1.2 var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--acc-hi)}
.page-head h1{margin-top:6px;font:700 italic clamp(28px,7.5vw,38px)/.98 var(--display);text-transform:uppercase}
.lead{margin-top:8px;color:var(--ink-2);font-size:16.5px;max-width:60ch}
.section-title{display:flex;align-items:center;gap:8px;margin:26px var(--gutter) 10px;font:700 italic 18px/1.1 var(--display);text-transform:uppercase;letter-spacing:.04em}
.section-title::before{content:"";flex:none;width:14px;height:4px;background:var(--acc);transform:skewX(-30deg)}
.section-title .more{margin-left:auto;font:700 12px/1 var(--display);letter-spacing:.06em;color:var(--acc-hi);text-decoration:none;font-style:normal}
.muted{color:var(--muted)}
.small{font-size:14px}
.stack>*+*{margin-top:10px}

/* chips + buttons */
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;font:700 11.5px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;padding:7px 9px;background:var(--p2);border:1px solid var(--line);color:var(--ink)}
.chip.solo,.chip.hot{background:var(--teal);border-color:var(--teal);color:#0C1016}
.cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:56px;padding:0 24px;border:0;background:var(--acc);color:#fff;font:700 italic 19px/1 var(--display);text-transform:uppercase;letter-spacing:.04em;text-decoration:none;clip-path:var(--slant);text-align:center}
.cta:hover{background:#E8503A}
.cta:active{transform:translateY(1px)}
.cta[aria-pressed=true],.cta.done{background:var(--teal);color:#0C1016}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;background:var(--p2);border:1px solid var(--line-hi);color:var(--ink);font:700 13px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;clip-path:var(--cut)}
.btn:hover{border-color:var(--acc-hi)}
.btn[aria-pressed=true]{background:var(--acc-deep);border-color:var(--acc);color:var(--acc-hi)}
.text-link{background:none;border:0;padding:0;color:var(--acc-hi);font:700 13px/1.3 var(--display);letter-spacing:.05em;text-transform:uppercase;text-decoration:none}
.actions{display:flex;flex-wrap:wrap;gap:8px;padding:0 var(--gutter);margin-top:14px}
.actions .cta{flex:1 1 100%}

/* home: today + weekly + tiles */
.mission{margin:0 var(--gutter);background:linear-gradient(135deg,#261614 0%,var(--p1) 55%);border:1px solid #4A2A24;clip-path:var(--cut2)}
.mission-head{display:flex;justify-content:space-between;align-items:center;padding:12px 14px 6px;font:700 13px/1 var(--display);letter-spacing:.08em;text-transform:uppercase}
.mission-head b{color:var(--acc-hi)}
.mission-head span{color:var(--muted)}
.today-list{list-style:none;margin:0;padding:0}
.trow{display:flex;align-items:center;gap:12px;padding:6px 14px;border-top:1px solid rgba(255,255,255,.06)}
.tick{flex:none;width:34px;height:34px;display:grid;place-items:center;background:none;border:0;padding:0}
.tick i{width:24px;height:24px;border:2px solid #56627A;transform:skewX(-10deg);display:grid;place-items:center;font:700 14px/1 var(--display);font-style:normal;color:transparent}
.tick[aria-pressed=true] i{background:var(--teal);border-color:var(--teal);color:#0C1016}
.tlink{flex:1;min-width:0;display:flex;align-items:center;gap:10px;min-height:52px;text-decoration:none;color:var(--ink)}
.tlink b{display:block;font:600 16px/1.2 var(--body)}
.tlink small{display:block;color:var(--muted);font-size:13.5px;line-height:1.3}
.trow.done .tlink b{color:var(--muted);text-decoration:line-through}
.tlink .min{margin-left:auto;flex:none;font:700 14px/1 var(--display)}
.xp{margin:12px var(--gutter) 0}
.xp-lab{display:flex;justify-content:space-between;font:700 12px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.xp-lab b{color:var(--teal)}
.xp-track{display:grid;gap:4px}
.xp-track i{height:8px;background:var(--p2);transform:skewX(-30deg)}
.xp-track i.on{background:var(--teal);box-shadow:0 0 12px rgba(46,196,182,.45)}
.home-resume{margin:16px var(--gutter) 0;display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--p1);border:1px solid var(--line);border-left:3px solid var(--teal)}
.home-resume h2{font:600 16px/1.25 var(--body)}
.home-resume .meta{font:700 11px/1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--teal);margin-bottom:4px}
.home-resume a{margin-left:auto;flex:none}
.activity-grid{list-style:none;margin:0 var(--gutter);padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (min-width:40rem){.activity-grid{grid-template-columns:repeat(3,1fr)}}
.activity-tile{position:relative;display:flex;flex-direction:column;gap:6px;height:100%;min-height:112px;padding:14px 12px;background:var(--p1);border:1px solid var(--line);color:var(--ink);text-decoration:none;clip-path:var(--cut);overflow:hidden}
.activity-tile:hover{border-color:var(--line-hi);background:#18202B}
.activity-tile svg{width:24px;height:24px;fill:none;stroke:var(--acc-hi);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.activity-tile h3{font:700 16px/1.05 var(--display);text-transform:uppercase;letter-spacing:.02em}
.activity-tile p{color:var(--muted);font-size:13.5px;line-height:1.3}
.activity-tile.me{background:linear-gradient(160deg,#3A1A14,#1B1216 70%);border-color:#6A2C22}
.activity-tile .ghost-num{position:absolute;right:8px;bottom:-10px;font:700 italic 64px/1 var(--display);color:rgba(219,64,42,.35);pointer-events:none}
.home-positions{margin:14px var(--gutter) 0}
.home-positions .role-list{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:8px 0 0;padding:0}
.home-positions .role-list a{display:inline-flex;align-items:center;min-height:40px;padding:0 12px;background:var(--p2);border:1px solid var(--line);color:var(--ink);text-decoration:none;font:700 12px/1 var(--display);letter-spacing:.05em;text-transform:uppercase}

/* rows (lists of lessons, roles, practices, search results) */
.rows{list-style:none;margin:0 var(--gutter);padding:0;display:grid;gap:6px}
.rows a{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 12px;background:var(--p1);border:1px solid var(--line);color:var(--ink);text-decoration:none}
.rows a:hover{border-color:var(--line-hi)}
.rows .lv{flex:none;width:58px;font:700 11px/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--teal)}
.rows .num{flex:none;width:34px;height:34px;display:grid;place-items:center;background:var(--p2);font:700 italic 17px/1 var(--display);color:var(--acc-hi)}
.rows .num.done{background:var(--teal);color:#0C1016;font-style:normal}
.rows .txt{flex:1;min-width:0}
.rows b{display:block;font:600 15.5px/1.25 var(--body)}
.rows small{display:block;color:var(--muted);font-size:13px;line-height:1.35}
.rows .go{flex:none;color:var(--acc-hi);font:700 18px/1 var(--display)}

/* the player card */
.player-card{position:relative;overflow:hidden;margin:14px var(--gutter) 0;padding:16px;background:linear-gradient(165deg,#3B1B15 0%,#171C25 58%);border:1px solid #6A2C22;clip-path:var(--cut2)}
.player-card .bignum{position:absolute;right:-4px;top:-22px;font:700 italic 150px/1 var(--display);color:rgba(255,255,255,.06);pointer-events:none}
.player-card h1{position:relative;margin:6px 0 8px;font:700 italic clamp(30px,8.5vw,40px)/.95 var(--display);text-transform:uppercase}
.player-card p{position:relative;color:var(--ink-2);max-width:52ch}
.player-card .card-actions{position:relative;display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.needs{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin:14px 0 0;padding:0;list-style:none}
.needs li{display:flex;align-items:center;gap:7px;font:600 14px/1.25 var(--body);color:#E6E9EE}
.needs li::before{content:"";flex:none;width:6px;height:6px;background:var(--teal);transform:rotate(45deg)}

/* segmented controls: level + phases + easier/harder */
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px}
.seg button,.seg label{display:flex;align-items:center;justify-content:center;text-align:center;min-height:44px;padding:6px 4px;background:var(--p1);border:1px solid var(--line);color:var(--muted);font:700 12px/1.15 var(--display);letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.seg button[aria-pressed=true],.seg label:has(input:checked){background:var(--acc);border-color:var(--acc);color:#fff}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label:has(input:focus-visible){outline:3px solid var(--ink);outline-offset:2px}
.level-control{border:0;margin:0 var(--gutter);padding:0}
.level-control legend{padding:0;margin-bottom:8px;font:700 12px/1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.level-description{margin-top:8px;font-size:14px;color:var(--muted)}

/* ---------- Coach's board ---------- */
.board{margin:16px 12px 0;border-radius:6px;overflow:hidden;box-shadow:0 0 0 1px #3A414B,0 14px 28px -12px rgba(0,0,0,.8)}
.board-rim{height:9px;background:linear-gradient(#59616C,#2A3038)}
.board-tray{height:14px;display:flex;align-items:center;gap:6px;padding:0 12px;background:linear-gradient(#2A3038,#1C2127)}
.board-tray i{width:26px;height:5px;border-radius:3px;background:var(--b-ink)}
.board-tray i:nth-child(2){background:var(--b-cyan)}
.board-tray i:nth-child(3){background:var(--b-orange)}
.board-body{padding:6px 12px 16px;background-color:var(--b-bg);background-image:linear-gradient(var(--b-grid) 1px,transparent 1px),linear-gradient(90deg,var(--b-grid) 1px,transparent 1px);background-size:24px 24px;color:var(--b-ink);font:400 16px/1.55 var(--b-body)}
.board-body>*+*{margin-top:12px}
.board h2,.board .board-title{margin-top:14px;font:800 21px/1.1 var(--b-head);letter-spacing:-.01em}
.board h2:first-child{margin-top:8px}
.board h3{font:800 17px/1.2 var(--b-head)}
.board p{max-width:62ch}
.hand{font-family:var(--hand);font-weight:700;color:var(--b-cyan)}
.board .kick{color:var(--b-cyan);font:700 17px/1 var(--hand);letter-spacing:0;text-transform:none}
.chalk-list{list-style:none;margin:0;padding:2px 12px;background:var(--b-card);border:2px solid var(--b-edge);border-radius:4px}
.chalk-list li{position:relative;padding:10px 0 10px 24px;border-top:1.5px dashed var(--b-line)}
.chalk-list li:first-child{border-top:0}
.chalk-list li::before{content:"→";position:absolute;left:0;top:9px;font:700 18px/1 var(--hand);color:var(--b-orange)}
.chalk-list.checks li::before{content:"✓";color:var(--teal)}
.cue-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.cue-list li{font:700 18px/1.15 var(--hand);color:var(--b-cyan);border:2px solid var(--b-cyan);border-radius:4px;padding:8px 10px;transform:rotate(-1.2deg)}
.cue-list li:nth-child(2n){transform:rotate(1deg)}
.step-list{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:12px}
.step-list li{counter-increment:s;display:grid;grid-template-columns:30px 1fr;gap:10px}
.step-list li::before{content:counter(s);width:28px;height:28px;border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center;font:700 15px/1 var(--b-body);box-shadow:inset 0 -3px 0 rgba(0,0,0,.2)}
.coach-note{padding:10px 12px;background:var(--b-note);border:2px dashed var(--b-note-line);border-radius:4px}
.coach-note .chalk-list{background:none;border:0;padding:0}
.coach-note .chalk-list li{border-top:0;padding:6px 0 6px 24px}
details.plain .board{margin:4px -2px 0}
.coach-note b,.coach-note .hand-label{display:block;font:700 18px/1 var(--hand);color:var(--b-orange);margin-bottom:4px}
.mistake-list{margin:0;display:grid;gap:10px}
.mistake-list div{padding:10px 12px;background:var(--b-card);border:2px solid var(--b-edge);border-radius:4px}
.mistake-list dt{font-weight:700}
.mistake-list dd{margin:4px 0 0;color:var(--b-muted)}
.mistake-list dd::before{content:"Fix: ";font:700 16px/1 var(--hand);color:var(--b-orange)}
.lesson-body p+p{margin-top:12px}
.board .hint{font:700 16px/1.25 var(--hand);color:var(--b-cyan)}
.board .source-note{font-size:13px;color:var(--b-muted)}
.board a{color:var(--b-cyan)}

/* the pitch (C style) inside or outside the board */
.pitch-frame{margin:0;background:var(--pitch);border:1px solid var(--pitch-edge);border-radius:4px;padding:6px}
.pitch-direction{font:700 11px/1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.7);padding:4px 2px 6px}
.formation-pitch{position:relative;aspect-ratio:68/80;max-height:440px;margin:0 auto;border:1px solid var(--pitch-line)}
.formation-pitch .pitch-half{position:absolute;left:0;right:0;top:50%;border-top:1px solid var(--pitch-line)}
.formation-pitch .pitch-circle{position:absolute;left:50%;top:50%;width:24%;aspect-ratio:1;border:1px solid var(--pitch-line);border-radius:50%;transform:translate(-50%,-50%)}
.formation-pitch .pitch-box{position:absolute;left:28%;width:44%;height:13%;border:1px solid var(--pitch-line)}
.formation-pitch .pitch-box.top{top:-1px;border-top:0}
.formation-pitch .pitch-box.bottom{bottom:-1px;border-bottom:0}
.pitch-slot{position:absolute;transform:translate(-50%,-50%);min-width:46px;height:30px;display:grid;place-items:center;padding:0 8px;background:#1E2632;border:1px solid #3A4556;color:#fff;font:700 12px/1 var(--display);letter-spacing:.03em;text-decoration:none;clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.pitch-slot:hover{background:#2A3444}
.pitch-slot.active{background:var(--acc);border-color:var(--acc-hi)}
.pitch-note{position:absolute;font:700 17px/1 var(--hand);color:var(--b-cyan);pointer-events:none}
.pitch-caption{margin-top:6px;font-size:13px;color:rgba(255,255,255,.75)}
.drawing{display:block;width:100%;height:auto}
.drawing-frame{margin:0;background:var(--pitch);border:1px solid var(--pitch-edge);border-radius:4px;padding:4px}
.drawing-frame figcaption{padding:6px 4px 2px;font-size:13px;color:rgba(255,255,255,.78)}
.drawing-frame img{display:block;width:100%;height:auto;background:#fff;border-radius:2px}

/* teaching picture (teaching.js) sits on the board */
.teaching-picture figure{margin:0}
.teaching-picture svg{display:block;width:100%;height:auto;background:var(--pitch);border:1px solid var(--pitch-edge);border-radius:4px}
.teaching-picture figcaption{margin-top:8px;font-size:14.5px;color:var(--b-ink)}
.picture-key,.picture-names{font-size:13px;color:var(--b-muted)}
.quick-steps{list-style:none;counter-reset:q;margin:0;padding:0;display:grid;gap:8px}
.quick-steps li{counter-increment:q;display:grid;grid-template-columns:26px 1fr;gap:8px}
.quick-steps li::before{content:counter(q);width:24px;height:24px;border-radius:50%;border:2px solid var(--b-cyan);color:var(--b-cyan);display:grid;place-items:center;font:700 13px/1 var(--b-body)}

/* drill page */
.kit{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;margin:12px var(--gutter) 0}
@media (min-width:30rem){.kit{grid-template-columns:repeat(4,1fr)}}
.kit div{background:var(--p1);border:1px solid var(--line);padding:9px 10px}
.kit dt{font:700 10.5px/1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.kit dd{margin:0;font:600 14px/1.25 var(--body)}
.lvl-wrap{margin:14px var(--gutter) 0}
.lvl-note{margin-top:8px;min-height:44px;color:var(--ink-2);font-size:15px}
.safety{margin:14px var(--gutter) 0;background:var(--p1);border:1px solid var(--line)}
.safety summary{padding:12px 14px;min-height:44px;font:700 13px/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--amber);cursor:pointer}
.safety div{padding:0 14px 14px;color:var(--ink-2);font-size:15px}
.log-form{margin:18px var(--gutter) 0;padding:14px;background:var(--p1);border:1px solid var(--line);clip-path:var(--cut)}
.log-form h2{font:700 italic 18px/1.1 var(--display);text-transform:uppercase}
.log-form form{display:grid;gap:12px;margin-top:10px}

/* forms */
label{display:block}
.field-label,.filters label>span{display:block;margin-bottom:6px;font:700 12px/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
input[type=text],input[type=search],input[type=number],select,textarea{width:100%;min-height:46px;padding:10px 12px;background:var(--bg);border:1px solid var(--line-hi);color:var(--ink);border-radius:0}
textarea{min-height:96px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--acc-hi);outline:none;box-shadow:0 0 0 2px rgba(255,122,92,.3)}
input[type=checkbox]{width:20px;height:20px;accent-color:var(--acc)}
.filters{margin:14px var(--gutter) 0;display:grid;gap:10px}
@media (min-width:36rem){.filters{grid-template-columns:2fr 1fr 1fr}.filters .filter-search{grid-column:1/-1}}
.filter-results{display:flex;justify-content:space-between;align-items:center;margin:12px var(--gutter) 8px;font-size:14px;color:var(--muted)}
.search-box{margin:14px var(--gutter) 10px}

/* practice cards */
.practice-grid{display:grid;gap:8px;margin:0 var(--gutter)}
.practice-card{position:relative;display:grid;gap:6px;padding:14px;background:var(--p1);border:1px solid var(--line);clip-path:var(--cut)}
.practice-card h2{font:700 17px/1.15 var(--display);text-transform:uppercase}
.practice-card h2 a{color:var(--ink);text-decoration:none}
.practice-card h2 a::after{content:"";position:absolute;inset:0}
.practice-card p{color:var(--muted);font-size:14px}
.practice-card .facts{font:700 12px/1 var(--display);letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.practice-card [data-save]{position:relative;z-index:1;justify-self:start}

/* progress */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:12px var(--gutter) 0}
.stat-grid div{background:var(--p1);border:1px solid var(--line);padding:12px}
.stat-grid strong{display:block;font:700 italic 30px/1 var(--display)}
.stat-grid span{font:700 11px/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.panel{margin:12px var(--gutter) 0;padding:14px;background:var(--p1);border:1px solid var(--line)}
.panel>*+*{margin-top:10px}
.panel h3{font:700 15px/1.2 var(--display);text-transform:uppercase;letter-spacing:.03em}
.journal-entry{padding:12px 0;border-top:1px solid var(--line)}
.journal-entry:first-child{border-top:0;padding-top:0}
.journal-entry h3{font:600 16px/1.3 var(--body);text-transform:none;letter-spacing:0}
.journal-entry .meta{font-size:13px;color:var(--muted)}
.role-picks{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.role-picks label{display:flex;align-items:center;gap:8px;min-height:44px;padding:6px 10px;background:var(--bg);border:1px solid var(--line);font-size:15px}
.switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.empty-state{margin:10px var(--gutter);padding:18px 14px;border:1px dashed var(--line-hi);text-align:left}
.empty-state>*+*{margin-top:10px}
.empty-state h1,.empty-state h2{font:700 italic 20px/1.1 var(--display);text-transform:uppercase}
.row-between{display:flex;justify-content:space-between;align-items:center;gap:10px}

/* details, glossary, sources, bank */
details.plain{margin:12px var(--gutter) 0;background:var(--p1);border:1px solid var(--line)}
details.plain summary{padding:12px 14px;min-height:44px;font:700 13px/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
details.plain>div{padding:0 14px 14px}
.source-list{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:14px}
.source-list p{color:var(--muted)}
.source-note{font-size:13px;color:var(--muted)}
.gloss{margin:12px var(--gutter) 0;display:grid;gap:6px}
.gloss div{background:var(--p1);border:1px solid var(--line);padding:12px 14px}
.gloss dt{font:700 15px/1.2 var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--acc-hi)}
.gloss dd{margin:6px 0 0;color:var(--ink-2)}
.bank-list{display:grid;gap:6px;margin:0 var(--gutter)}
.bank-list details{background:var(--p1);border:1px solid var(--line)}
.bank-list summary{padding:12px 14px;cursor:pointer;font-weight:600}
.bank-list summary .meta{color:var(--muted);font-weight:500;font-size:13px}
.bank-list details>div{padding:0 14px 14px}
.bank-list h3{margin-top:10px;font:700 13px/1.2 var(--display);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.callout{margin:16px var(--gutter) 0;padding:14px;background:rgba(242,185,80,.08);border-left:3px solid var(--amber)}
.callout>*+*{margin-top:8px}
.about-crest{width:88px;height:88px}
.prose{padding:0 var(--gutter)}
.prose>*+*{margin-top:10px}
.prose h2{margin-top:22px;font:700 italic 18px/1.1 var(--display);text-transform:uppercase}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
.step-key{list-style:none;margin:6px 4px 0;padding:0;display:flex;flex-wrap:wrap;gap:4px 14px}
.step-key li{display:flex;align-items:center;gap:6px;font:700 13.5px/1.3 var(--display);color:#fff}
.step-key i{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font:700 12px/1 var(--display);font-style:normal;color:#0C1016}

/* Critic-fix round (2026-09-22) */
.seg label.on{background:var(--acc);border-color:var(--acc);color:#fff}
.formation-pitch{height:0;padding-bottom:117.6%;aspect-ratio:auto}
@supports (aspect-ratio:1){.formation-pitch{height:auto;padding-bottom:0;aspect-ratio:68/80}}
.pitch-slot{height:44px;min-width:50px;background:none!important;border:0;clip-path:none;isolation:isolate}
.pitch-slot::before{content:"";position:absolute;left:0;right:0;top:7px;bottom:7px;z-index:-1;background:#1E2632;box-shadow:inset 0 0 0 1px #3A4556;clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.pitch-slot:hover::before{background:#2A3444}
.pitch-slot.active::before{background:var(--acc);box-shadow:inset 0 0 0 1px var(--acc-hi)}
.pitch-key{margin:8px 2px 2px;font-size:12.5px;line-height:1.4;color:rgba(255,255,255,.78)}
.first-run{border-left-color:var(--acc)}
.first-run .meta{color:var(--acc-hi)}
.first-run p.small{margin-top:4px}
.hide-today{margin-left:10px;min-height:32px;font-size:12px}
.done-block{margin:18px var(--gutter) 0}
.done-block .cta{width:100%}
.logged{margin-top:10px;display:grid;gap:8px}
.logged-big{font:700 italic 20px/1.1 var(--display);color:var(--teal);text-transform:uppercase}
.coach-note.plain-note{margin-top:12px}
.coach-note.plain-note p{margin:0;font-size:15px;line-height:1.5}
.gloss div.hit{border-color:var(--acc);box-shadow:inset 3px 0 0 var(--acc)}
#import-file{width:100%;max-width:100%;min-width:0}
.panel{min-width:0}
@media (max-width:400px){.phase-seg{grid-auto-flow:row;grid-template-columns:1fr 1fr}}

/* Saved progress (2026-09-22) */
.signin-card{border-left-color:var(--acc)}
.signin-card .meta{color:var(--acc-hi)}
.signin-card p.small{margin-top:4px}
.account p+p{margin-top:4px}
.account .btn{margin-top:10px}
.signin-form{display:grid;gap:12px}
.signin-form input{font-size:18px}
.signin-form input[name=code]{letter-spacing:.3em;max-width:9rem}
.signin-error{min-height:1.2em;color:var(--amber);font-size:14px}

/* Polish (2026-09-22) */
.subbar a{display:inline-flex;align-items:center;min-height:44px}
.app-footer a{display:inline-block;padding:12px 0}
.tick{width:44px;height:44px;display:grid;place-items:center}
.rows .num.shirt{width:auto;min-width:34px;padding:0 6px;background:none;border:1.5px solid var(--acc-hi);color:var(--acc-hi);font-style:italic;clip-path:polygon(22% 0,78% 0,100% 18%,88% 34%,88% 100%,12% 100%,12% 34%,0 18%)}
.level-line{margin:8px var(--gutter) 0}
.level-line>summary{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;gap:6px;color:var(--muted);font-size:15px}
.level-line>summary::-webkit-details-marker{display:none}
.level-line>summary b{color:var(--ink)}
.level-line .level-control{margin:6px 0 0}

/* Final review (2026-09-22) */
.signed-strip{margin:12px var(--gutter) 0;font-size:14px;color:var(--muted)}
.signed-strip b{color:var(--ink)}
.signed-strip a{color:var(--acc-hi)}

/* Position card: four even boxes, two by two */
.player-card .card-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}
.player-card .card-actions .btn{width:100%;justify-content:center;text-align:center}

/* Today as a fold-out bar under the Menu heading (Coach 2026-09-23) */
.today-fold{margin:0 0 12px}
.today-fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;margin:0 var(--gutter);min-height:52px;padding:0 14px;background:linear-gradient(135deg,#261614 0%,var(--p1) 55%);border:1px solid #4A2A24;clip-path:var(--cut2)}
.today-fold>summary::-webkit-details-marker{display:none}
.today-fold .tf-label{font:700 italic 17px/1 var(--display);text-transform:uppercase;letter-spacing:.04em;color:var(--acc-hi)}
.today-fold .tf-count{margin-left:auto;font:700 12px/1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.today-fold .tf-chev{color:var(--acc-hi);font:700 20px/1 var(--display);transition:transform .2s}
.today-fold[open] .tf-chev{transform:rotate(90deg)}
.today-fold[open]>summary{margin-bottom:8px}
.today-fold .mission{margin-top:0}
@media (prefers-reduced-motion:reduce){.today-fold .tf-chev{transition:none}}
.activity-tile .ghost-num.pair{font-size:44px;right:8px;bottom:4px}