:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}
/* Layout: blue nav bar, horizontal match ticker, quick-link chips, then main column + right rail (2fr / 1fr) */
:root{
  --bg:#FFFFFF;--surface:#FFFFFF;--sunk:#F3F3FA;--ink:#16152B;--muted:#5E5D78;--line:#E4E3F0;
  --brand:#3730A3;--brand-ink:#FFFFFF;--brand-soft:#E8E7FB;--link:#3730A3;--live:#E0322B;--adbar:#1E1B4B;
  --ok:#1E7A46;--ok-soft:#E1F3E8;--no:#C3271F;--no-soft:#FBE4E2;--maybe:#946300;--maybe-soft:#FBF0D4;
  --shadow:0 1px 3px rgba(20,26,38,.12),0 1px 2px rgba(20,26,38,.06);
  --display:"Big Shoulders Display",Impact,"Arial Narrow",sans-serif;
  --body:"Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0F0F1A;--surface:#191928;--sunk:#141422;--ink:#ECECF6;--muted:#A3A2BC;--line:#2A2A40;
  --brand:#3B34A8;--brand-ink:#FFFFFF;--brand-soft:#24224F;--link:#AAA6FF;--live:#FF5A52;--adbar:#13123A;
  --ok:#6BC891;--ok-soft:#183427;--no:#F07068;--no-soft:#3A1D1C;--maybe:#E8B84E;--maybe-soft:#372C12;
  --shadow:0 1px 3px rgba(5,4,20,.6);color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0F0F1A;--surface:#191928;--sunk:#141422;--ink:#ECECF6;--muted:#A3A2BC;--line:#2A2A40;
  --brand:#3B34A8;--brand-ink:#FFFFFF;--brand-soft:#24224F;--link:#AAA6FF;--live:#FF5A52;--adbar:#13123A;
  --ok:#6BC891;--ok-soft:#183427;--no:#F07068;--no-soft:#3A1D1C;--maybe:#E8B84E;--maybe-soft:#372C12;
  --shadow:0 1px 3px rgba(5,4,20,.6);color-scheme:dark}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.45}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--brand)}
.wrap{max-width:1240px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{text-wrap:balance;margin:0}
h2{font-size:1.4rem;font-weight:700}
h3{font-size:1.05rem;font-weight:700;line-height:1.3}
.label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.num{font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--link);outline-offset:2px}

/* top bar */
header.top{background:var(--brand);color:var(--brand-ink);position:sticky;top:env(safe-area-inset-top,0px);z-index:6}
.bar{display:flex;align-items:center;gap:20px;min-height:58px}
.wordmark{color:var(--brand-ink);font-family:var(--display);font-weight:800;font-size:1.55rem;letter-spacing:.02em;line-height:1;white-space:nowrap;text-transform:uppercase}
.wordmark:hover{text-decoration:none}
.wordmark small{display:block;font-family:var(--body);font-weight:600;font-size:.68rem;letter-spacing:.14em;opacity:.85}
.navscroll{overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.navscroll::-webkit-scrollbar{display:none}
nav.tabs{display:flex;gap:2px}
nav.tabs a{color:var(--brand-ink);font-weight:600;font-size:.98rem;padding:18px 10px;white-space:nowrap;border-bottom:3px solid transparent;opacity:.9}
nav.tabs a:hover{text-decoration:none;opacity:1}
nav.tabs a[aria-current="page"]{border-bottom-color:var(--brand-ink);opacity:1}
.adminpill{color:var(--brand-ink);border:1px solid rgba(255,255,255,.55);border-radius:99px;padding:5px 12px;font-weight:600;font-size:.9rem;white-space:nowrap}
.adminpill:hover{text-decoration:none;background:rgba(255,255,255,.12)}
@media (max-width:640px){.bar{flex-wrap:wrap;gap:0;padding-top:10px}.wordmark{flex:1}.navscroll{flex-basis:100%;order:3}nav.tabs a{padding:10px 10px 12px}}

/* ticker */
.tickerband{background:var(--sunk);border-bottom:1px solid var(--line)}
.ticker{display:flex;gap:12px;overflow-x:auto;padding-block:14px;scroll-snap-type:x proximity}
.tcard{flex:0 0 280px;scroll-snap-align:start;background:var(--surface);border-radius:8px;box-shadow:var(--shadow);padding:12px 14px 0;display:grid;gap:6px;color:var(--ink)}
.tcard:hover{text-decoration:none}
.thead{display:flex;justify-content:space-between;gap:8px;font-size:.72rem}
.thead b{text-transform:uppercase;letter-spacing:.06em}
.thead span{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-result{color:var(--muted)}.st-up{color:var(--link)}.st-today{color:var(--live)}
.tteam{display:flex;justify-content:space-between;gap:10px;align-items:baseline;font-size:.98rem}
.tteam .nm{display:flex;gap:8px;align-items:center;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tteam .sc{font-weight:700;white-space:nowrap}
.tteam.lose{color:var(--muted)}
.flag{width:22px;height:16px;border-radius:2px;flex:none;background:var(--brand);display:grid;place-items:center;color:#fff;font-size:.55rem;font-weight:800}
.flag.opp{background:var(--muted)}
.tline{font-size:.85rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:1.3em}
.tline.win{color:var(--link)}
.tfoot{display:flex;gap:16px;border-top:1px solid var(--line);padding-block:8px;font-size:.85rem;font-weight:600}
.tfoot a{color:var(--ink)}

header.adminhead{background:var(--brand)}
/* ads bar */
.adbar{display:flex;align-items:center;gap:12px;background:var(--adbar);color:#FFFFFF;border-bottom:1px solid rgba(255,255,255,.08);padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));font-size:.92rem;min-height:38px}
.adtag{flex:none;background:#F5C518;color:#141A26;font-weight:800;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;padding:2px 7px;border-radius:3px}
.admask{overflow:hidden;flex:1;min-width:0;mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 24px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 24px),transparent)}
.adtrack{display:flex;width:max-content;animation:adscroll var(--dur,30s) linear infinite}
.adbar:hover .adtrack,.adbar:focus-within .adtrack{animation-play-state:paused}
.adset{display:flex;align-items:center;gap:22px;padding-right:22px;white-space:nowrap;padding-block:9px}
.aditem{color:#FFFFFF;display:inline-flex;align-items:center;gap:6px}
.adlogo{height:22px;width:auto;max-width:60px;border-radius:3px;background:#fff;object-fit:contain}
.aditem b{color:#F5C518}
.adsep{opacity:.4;font-size:.5rem}
@keyframes adscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.adtrack{animation:none}.admask{overflow-x:auto}}

/* chips */
.chips{display:flex;gap:10px;overflow-x:auto;padding-block:16px;scrollbar-width:thin}
.chip{flex:none;border:1px solid var(--line);border-radius:6px;padding:7px 12px;color:var(--ink);font-size:.92rem;white-space:nowrap;background:var(--surface)}
.chip:hover{text-decoration:none;border-color:var(--muted)}
.chip::after{content:" ›";color:var(--muted)}

/* page grid */
.page{display:grid;grid-template-columns:minmax(0,2.15fr) minmax(0,1fr);gap:0 36px;padding-block:12px 64px}
.page>.rail{border-left:1px solid var(--line);padding-left:28px;display:grid;gap:28px;align-content:start}
.page>.mainc{display:grid;gap:36px;align-content:start;min-width:0}
@media (max-width:900px){.page{grid-template-columns:minmax(0,1fr);gap:36px}.page>.rail{border-left:0;padding-left:0}}
section{display:grid;gap:14px;min-width:0}
.sechead{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.seeall{color:var(--ink);font-weight:600;font-size:.92rem;white-space:nowrap}
.seeall::after{content:" ›"}
.rule{border:0;border-top:1px solid var(--line);margin:0}
.single{padding-block:24px 64px;display:grid;gap:28px;max-width:1240px}

/* match coverage */
.covtabs{display:flex;gap:28px;overflow-x:auto;border-bottom:1px solid var(--line)}
.covtabs button{flex:none;background:none;border:0;border-bottom:3px solid transparent;padding:4px 0 10px;text-align:left;cursor:pointer;font:inherit;color:var(--muted)}
.covtabs button b{display:block;font-size:1.05rem;color:var(--muted)}
.covtabs button span{font-size:.85rem}
.covtabs button[aria-selected="true"]{border-bottom-color:var(--link)}
.covtabs button[aria-selected="true"] b{color:var(--ink)}
.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:640px){.feature{grid-template-columns:minmax(0,1fr)}}
.feature h1{font-size:clamp(1.5rem,3vw,2rem);line-height:1.15;font-weight:700}
.livebox{background:var(--sunk);border-radius:6px;padding:10px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;color:var(--ink)}
.livebox:hover{text-decoration:none}
.livebox .k{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;display:flex;gap:8px;align-items:center}
.dot{width:8px;height:8px;border-radius:50%;background:var(--live);display:inline-block}
.dot.g{background:var(--ok)}.dot.b{background:var(--link)}
.bullets{list-style:none;margin:0;padding:0}
.bullets li{border-bottom:1px solid var(--line);padding:10px 0 10px 22px;position:relative;font-weight:600}
.bullets li::before{content:"";position:absolute;left:4px;top:18px;width:6px;height:6px;border-radius:50%;background:var(--link)}
.bullets a{color:var(--ink)}

/* images */
.img{position:relative;border-radius:6px;overflow:hidden;background:var(--brand);aspect-ratio:16/10;max-width:100%}
.img img{width:100%;height:100%;object-fit:cover;display:block}
.img .ph{position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.9);font-family:var(--display);font-weight:800;font-size:2rem;letter-spacing:.06em;background:radial-gradient(circle at 75% 30%,rgba(255,255,255,.18) 0 18%,transparent 19%),linear-gradient(135deg,var(--brand),var(--brand-deep,#1E1B4B))}
.img .play{position:absolute;left:10px;bottom:10px;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.6);display:grid;place-items:center}
.img .play::before{content:"";border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}

/* stories */
.stories{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 22px}
@media (max-width:640px){.stories{grid-template-columns:minmax(0,1fr)}}
.story{display:grid;grid-template-columns:150px minmax(0,1fr);gap:14px;color:var(--ink)}
.story:hover{text-decoration:none}.story:hover h3{text-decoration:underline}
.story .img{aspect-ratio:16/9}
.story .img .ph{font-size:1.1rem}
.meta{font-size:.85rem;color:var(--muted);margin-top:4px}
.hgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px}
.hcard{display:grid;gap:8px;color:var(--ink)}
.hcard:hover{text-decoration:none}.hcard:hover h3{text-decoration:underline}

/* rail */
.crunch{background:var(--brand-soft);border-radius:8px;padding:18px;text-align:center;display:grid;gap:4px}
.crunch .big{font-size:3.2rem;font-weight:700;color:var(--link);line-height:1}
.dots{display:flex;gap:8px;justify-content:center;margin-top:6px}
.dots button{width:10px;height:10px;border-radius:50%;border:0;padding:0;background:var(--line);cursor:pointer}
.dots button[aria-pressed="true"]{background:var(--link)}
.evcard{border-radius:8px;overflow:hidden;background:var(--adbar);color:#fff;display:grid}
.evcard .body{padding:12px 16px}
.evcard .body .label{color:rgba(255,255,255,.7)}
.evcard .img{border-radius:0}
.qlinks{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.qlinks li{padding-left:22px;position:relative}
.qlinks li::before{content:"";position:absolute;left:4px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--link)}
.qlinks a{color:var(--ink)}
.promo{border:1px solid var(--line);border-radius:8px;overflow:hidden;display:grid;color:var(--ink)}
.promo .body{padding:12px 16px;display:grid;gap:6px}
.list .row2{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.list .row2:last-child{border-bottom:0}
.datebox{text-align:center;border:1px solid var(--line);border-radius:6px;padding:4px 2px}
.datebox b{display:block;font-size:1.3rem;line-height:1.1}
.datebox span{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}

/* subpages */
.sample{background:var(--maybe-soft);border-radius:6px;padding:10px 14px;font-size:.92rem}
.empty{color:var(--muted);padding:22px;border:1px dashed var(--line);border-radius:8px;text-align:center}
.card{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:16px;min-width:0}
.match{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:14px;align-items:start;padding:14px 0;border-bottom:1px solid var(--line)}
.match:last-child{border-bottom:0}
@media (max-width:520px){.match{grid-template-columns:52px minmax(0,1fr)}.match>.right{grid-column:2}}
.pill{display:inline-block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:3px 8px;border-radius:99px;white-space:nowrap}
.pill.won{background:var(--ok-soft);color:var(--ok)}.pill.lost{background:var(--no-soft);color:var(--no)}
.pill.other{background:var(--maybe-soft);color:var(--maybe)}.pill.up{background:var(--brand-soft);color:var(--link)}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.player{display:grid;gap:10px;align-content:start}
.player .top{display:flex;gap:12px;align-items:center}
.avatar{width:56px;height:56px;border-radius:50%;flex:none;overflow:hidden;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:700;font-size:1.2rem}
.avatar img{width:100%;height:100%;object-fit:cover}
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;text-align:center;border-top:1px solid var(--line);padding-top:10px}
.stats b{display:block;font-size:1rem}
.stats span{font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.article{max-width:760px;display:grid;gap:14px}
.article h1{font-size:clamp(1.6rem,4vw,2.3rem);line-height:1.15}
.article p{margin:0;white-space:pre-line;font-size:1.08rem;line-height:1.6}
.scroller{overflow-x:auto;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
table.matrix{border-collapse:collapse;width:100%;min-width:520px}
.matrix th,.matrix td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:center;font-size:.92rem}
.matrix th:first-child,.matrix td:first-child{text-align:left;position:sticky;left:0;background:var(--surface);white-space:nowrap}
.matrix thead th{font-weight:600;vertical-align:bottom}
.matrix thead th small{display:block;color:var(--muted);font-weight:400}
.matrix tfoot td{font-weight:700;border-bottom:0}
.cell{display:inline-grid;place-items:center;min-width:44px;height:30px;border-radius:4px;font-weight:700;font-size:.85rem;border:1px solid transparent}
.cell.y{background:var(--ok-soft);color:var(--ok)}.cell.n{background:var(--no-soft);color:var(--no)}
.cell.m{background:var(--maybe-soft);color:var(--maybe)}.cell.u{color:var(--muted);border-color:var(--line)}
button.cell{font:inherit;font-weight:700;font-size:.85rem;cursor:pointer}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.88rem;color:var(--muted);align-items:center}

/* buttons + admin */
.btn{display:inline-flex;align-items:center;gap:6px;font:inherit;font-weight:600;font-size:.95rem;padding:8px 14px;border-radius:6px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;justify-self:start}
.btn:hover{text-decoration:none}
.btn.primary{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.btn.danger{color:var(--no)}
.btn:disabled{opacity:.5;cursor:default}
.btn.sm{padding:5px 10px;font-size:.85rem}
.admintabs{display:flex;gap:6px;flex-wrap:wrap}
.admintabs button{font:inherit;font-weight:600;padding:7px 12px;border-radius:99px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.admintabs button[aria-pressed="true"]{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)}
.rows{display:grid}
.row{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.row:last-child{border-bottom:0}
.row .t{min-width:0;flex:1 1 200px;display:flex;gap:10px;align-items:center}
.row .t img{width:56px;height:36px;object-fit:cover;border-radius:4px;flex:none}
.row .t b{display:block;overflow-wrap:anywhere}
form.edit{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
form.edit .full{grid-column:1/-1}
form.edit label{display:grid;gap:4px;font-size:.88rem;font-weight:600}
input,select,textarea{font:inherit;font-weight:400;padding:8px 10px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--ink);width:100%;box-sizing:border-box}
textarea{min-height:110px;resize:vertical}
.imgfield{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-weight:400}
.imgfield img{width:120px;height:75px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
.imgfield .noimg{width:120px;height:75px;border-radius:6px;border:1px dashed var(--line);display:grid;place-items:center;color:var(--muted);font-size:.8rem}
.imgfield input[type=file]{width:auto;flex:1 1 200px}
.actions{display:flex;gap:8px;flex-wrap:wrap;grid-column:1/-1}
.savebar{position:sticky;bottom:0;background:var(--surface);border-top:1px solid var(--line);padding-block:12px calc(12px + env(safe-area-inset-bottom,0px));z-index:5}
.savebar .wrap{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.toast{position:fixed;left:50%;bottom:calc(80px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:6px;font-size:.92rem;z-index:20;max-width:calc(100% - 32px)}
footer{background:var(--sunk);border-top:1px solid var(--line);padding-block:22px;color:var(--muted);font-size:.88rem}
/* match card extras */
.flag.logo{object-fit:contain;background:#fff;border:1px solid var(--line);padding:1px}
.tcard.live{box-shadow:var(--shadow),inset 3px 0 0 var(--live)}
.st-today .dot{width:7px;height:7px;vertical-align:middle;margin-right:2px}
.tfoot a{color:var(--ink)}
.tfoot a:hover{color:var(--link)}
.formhead{border-top:1px solid var(--line);padding-top:14px;margin-top:4px;font-size:1rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:.8rem}
form.edit .formhead:first-child,form.edit h3.full+.formhead{border-top:0;padding-top:0;margin-top:0}
.dot.grey{background:var(--muted)}
.bullets a{color:var(--ink)}
.bullets a:hover{color:var(--link)}
/* players list + profile */
.plink{color:var(--ink);text-decoration:none}
.plink:hover{text-decoration:none;border-color:var(--link)}
.plink-more{font-size:.88rem;font-weight:600;color:var(--link)}
.pwrap{display:grid;grid-template-columns:300px minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:860px){.pwrap{grid-template-columns:minmax(0,1fr)}}
.pside{display:grid;gap:16px;min-width:0}
.pmain{display:grid;gap:16px;min-width:0}
.phero{position:relative;border-radius:10px;overflow:hidden;background:linear-gradient(160deg,var(--adbar),var(--brand));color:#fff;min-height:300px;display:grid}
.phero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,16,28,.75) 0,rgba(10,16,28,.1) 45%,rgba(10,16,28,.85) 100%)}
.phero-ph{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:5rem;color:rgba(255,255,255,.25)}
.phero-top{position:relative;z-index:1;padding:20px;align-self:start}
.phero-top h1{font-size:1.7rem;line-height:1.1;margin-bottom:6px}
.phero-top div{font-size:.95rem;opacity:.92}
.phero-foot{position:relative;z-index:1;align-self:end;background:rgba(10,16,28,.7);padding:12px 16px;font-size:.9rem;letter-spacing:.03em}
.plist{padding:0;overflow:hidden}
.plist h3{padding:14px 16px;border-bottom:1px solid var(--line)}
.plist a{display:flex;align-items:center;gap:12px;padding:8px 16px;color:var(--ink)}
.plist a:hover{background:var(--sunk);text-decoration:none}
.avatar.sm{width:32px;height:32px;font-size:.75rem}
.ptabs{display:flex;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:4px 12px;overflow-x:auto}
.ptabs button{font:inherit;font-weight:600;background:none;border:0;border-bottom:3px solid transparent;padding:10px 18px;color:var(--muted);cursor:pointer;white-space:nowrap}
.ptabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--link)}
.pcard{padding:0;overflow:hidden}
.pcard.pad{padding:18px}
.pch{padding:16px;border-bottom:1px solid var(--line)}
.pinfo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 20px}
@media (max-width:640px){.pinfo{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pval{font-weight:700;margin-top:2px;overflow-wrap:anywhere}
.pteams{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 20px;margin-top:12px}
@media (max-width:640px){.pteams{grid-template-columns:minmax(0,1fr)}}
.pteam{display:flex;gap:10px;align-items:center;font-weight:700}
.pbioh{font-size:1.25rem;margin-top:24px;margin-bottom:10px}
.pbio{white-space:pre-line;line-height:1.6;max-width:none}
.pbio.clip{max-height:7.5em;overflow:hidden;mask-image:linear-gradient(180deg,#000 60%,transparent);-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent)}
.linkbtn{font:inherit;font-weight:600;color:var(--link);background:none;border:0;padding:6px 0;cursor:pointer}
.stathead{padding:12px 16px;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line)}
.pch+.stathead{border-top:0}
.scroller.flat{border:0;border-radius:0}
table.stattable{border-collapse:collapse;width:100%;min-width:760px;font-size:.92rem}
.stattable th,.stattable td{padding:9px 10px;border-top:1px solid var(--line);text-align:right;white-space:nowrap}
.stattable thead th{background:var(--sunk);color:var(--muted);font-weight:600}
.stattable th:first-child{text-align:left;position:sticky;left:0;background:var(--surface);font-weight:700;padding-left:16px}
.stattable thead th:first-child{background:var(--sunk);font-weight:600}
.stattable td.strong{font-weight:700}
.stattable tfoot th,.stattable tfoot td{font-weight:700;background:var(--sunk)}
/* admin stats grid */
.statgrid{overflow-x:auto;border:1px solid var(--line);border-radius:8px}
.statgrid table{border-collapse:collapse;min-width:820px;width:100%}
.statgrid th,.statgrid td{padding:4px;border-bottom:1px solid var(--line);font-size:.82rem;text-align:center}
.statgrid th:first-child{text-align:left;padding-left:10px;white-space:nowrap}
.statgrid input{padding:6px 4px;text-align:center;min-width:46px}
/* theme toggle */
.themebtn{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.45);background:transparent;color:var(--brand-ink);cursor:pointer}
.themebtn:hover{background:rgba(255,255,255,.14)}
.themebtn:focus-visible{outline:2px solid var(--brand-ink);outline-offset:2px}
@media (max-width:640px){.bar .themebtn{order:2;margin-left:8px}}
.pchrow{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.pcbtn{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-size:.88rem;padding:6px 12px}
.pside .pcbtn{justify-self:stretch;justify-content:center}
/* KCCP teams */
.teamfilter{display:flex;gap:6px;flex-wrap:wrap}
.teamfilter button{font:inherit;font-weight:600;padding:7px 14px;border-radius:99px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.teamfilter button[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.teamtag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.04em;padding:2px 7px;border-radius:4px;background:var(--brand-soft);color:var(--link);vertical-align:middle}
@media (prefers-reduced-motion:no-preference){.crunch .big,.crunch>div{animation:crunchIn .35s ease}}
@keyframes crunchIn{from{opacity:.2;transform:translateY(4px)}to{opacity:1;transform:none}}
/* player spotlight */
.spot{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);border-radius:12px;overflow:hidden;background:linear-gradient(135deg,var(--brand),var(--adbar));color:#fff;min-height:320px}
@media (max-width:640px){.spot{grid-template-columns:minmax(0,1fr)}}
.spphoto{position:relative;min-height:260px;background:rgba(0,0,0,.15)}
.spphoto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center}
.spph{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:5rem;color:rgba(255,255,255,.3)}
.spbody{padding:26px 26px 24px;display:grid;gap:12px;align-content:center}
.spbody .muted{color:rgba(255,255,255,.75)}
.speyebrow{font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#F5C518}
.speyebrow span{color:rgba(255,255,255,.75);font-weight:600;letter-spacing:.06em;margin-left:6px}
.spname{font-family:var(--display);font-weight:800;font-size:clamp(2.2rem,5vw,3.2rem);line-height:.95;text-transform:uppercase;letter-spacing:.01em}
.spchips{display:flex;flex-wrap:wrap;gap:10px}
.spstat{display:grid;background:rgba(255,255,255,.12);border-radius:8px;padding:8px 14px;min-width:84px}
.spstat b{font-size:1.6rem;line-height:1.1}
.spstat span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;opacity:.8}
.spchip{background:rgba(255,255,255,.14);border-radius:99px;padding:6px 12px;font-weight:700}
.spquote{margin:0;padding-left:14px;border-left:3px solid #F5C518;font-style:italic;font-size:1.05rem;line-height:1.5;max-width:56ch}
.spbody .btn.primary{background:#fff;border-color:#fff;color:var(--brand)}
.spdots{margin-top:10px}
@media (prefers-reduced-motion:no-preference){#spotbox .spot{animation:crunchIn .4s ease}}
/* visit counter */
.views{flex:none;display:inline-flex;align-items:center;gap:6px;color:var(--brand-ink);font-size:.88rem;font-weight:600;opacity:.92;white-space:nowrap;margin-right:4px}
@media (max-width:640px){.bar .views{order:2;margin-left:auto}.vlabel{display:none}}
/* theme colour picker (admin) */
input[type=color]{height:42px;padding:3px;cursor:pointer}
.swatches{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-size:.82rem;color:var(--muted)}
.swatch{width:18px;height:18px;border-radius:50%;display:inline-block;border:1px solid var(--line)}
.swname{margin-right:6px}
/* Play-Cricket paste import */
.pcimport{display:grid;gap:10px;background:var(--sunk);border:1px dashed var(--line);border-radius:8px;padding:14px}
.pcimport ol{margin:0;padding-left:20px;font-size:.9rem;display:grid;gap:2px}
.pcimport textarea{min-height:120px;font-family:var(--mono);font-size:.82rem}
.pcboxes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:760px){.pcboxes{grid-template-columns:minmax(0,1fr)}}
.pcbox{display:grid;gap:8px;min-width:0}
.pcbox h4{margin:0;font-size:.95rem}
/* stats grid row controls */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.rowdel{width:30px;height:30px;border-radius:6px;border:1px solid var(--line);background:var(--surface);color:var(--no);cursor:pointer;font-size:.85rem}
.rowdel:hover{background:var(--no-soft);border-color:var(--no)}
.addrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:-4px}
.addrow input{width:auto;flex:0 1 220px}
.addrow .muted{font-size:.85rem}
/* spotlight stat picker */
fieldset.checks{border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin:0;display:flex;flex-wrap:wrap;gap:8px 16px}
fieldset.checks legend{font-size:.88rem;font-weight:600;padding:0 4px}
fieldset.checks label{display:inline-flex;align-items:center;gap:6px;font-weight:400;font-size:.92rem}
fieldset.checks input{width:auto}
.pchead{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.pcopen{font-size:.82rem;padding:4px 10px}
/* Number Crunching with player photo */
.crunch{grid-template-columns:auto;justify-items:center}
.crav{width:72px;height:72px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:var(--brand);color:var(--brand-ink);font-weight:700;font-size:1.2rem;border:3px solid var(--surface);box-shadow:var(--shadow);text-decoration:none}
.crav:hover{text-decoration:none;outline:2px solid var(--link)}
.crav img{width:100%;height:100%;object-fit:cover;object-position:top center}
.crtext{display:grid;gap:4px}
.uprow{color:var(--ink)}
.uprow:hover{text-decoration:none}
.uprow:hover h3{text-decoration:underline}
/* ===== extra features ===== */
.mlink{color:inherit}
.mlink:hover{color:var(--link)}
/* match centre */
.mcwrap{display:grid;gap:18px}
.mchead{display:grid;gap:8px}
.mchead h1{font-size:clamp(1.6rem,4vw,2.3rem);line-height:1.1}
.mcscore{display:grid;gap:6px;background:var(--sunk);border-radius:8px;padding:14px 16px;max-width:520px;margin-top:6px}
.mcscore.live{box-shadow:inset 3px 0 0 var(--live)}
.mcrow{display:flex;justify-content:space-between;gap:12px;font-size:1.1rem}
.mcrow b{font-size:1.25rem}
.mcmargin{color:var(--link);font-weight:600}
.mcbtns{display:flex;gap:8px;flex-wrap:wrap}
.mcgrid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:860px){.mcgrid{grid-template-columns:minmax(0,1fr)}}
.mcmain,.mcside{display:grid;gap:18px;min-width:0}
.xilist{margin:0;padding-left:22px;display:grid;gap:6px}
.xilist a{display:flex;align-items:center;gap:10px;color:var(--ink)}
.xilist a:hover{text-decoration:none;color:var(--link)}
.selnext{display:grid;gap:2px;color:var(--ink);border-left:4px solid var(--brand)}
.selnext:hover{text-decoration:none;border-color:var(--link)}
/* calendar */
.calcard{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
/* milestones */
.mslist{display:grid;gap:4px}
.msrow{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);color:var(--ink);font-size:.95rem;line-height:1.35}
.msrow:last-child{border-bottom:0}
.msrow:hover{text-decoration:none;color:var(--link)}
.msrow b.num{color:var(--link)}
/* leaderboards + compare */
.lbbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.lbsel{display:flex;gap:8px;align-items:center;font-weight:600}
.lbsel select{width:auto}
table.lbtable{min-width:560px}
.lbtable td:first-child,.lbtable th:first-child{text-align:center;width:48px;position:static}
.lbtable th[scope=row]{text-align:left;position:static}
.lbp{display:inline-flex;align-items:center;gap:10px;color:var(--ink)}
.lbp:hover{text-decoration:none;color:var(--link)}
.cmpbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.cmpbar select{width:auto;flex:1 1 140px;min-width:0;max-width:260px}
.cmpheads{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.cmphead{min-width:0}.cmphead div:last-child{min-width:0}
.cmphead{display:flex;align-items:center;gap:12px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px}
.cmphead:hover{text-decoration:none;border-color:var(--link)}
.cmphead b{display:block}
table.cmptable{min-width:420px}
.cmptable th,.cmptable td{text-align:center}
.cmptable th[scope=row]{text-align:center;position:static;color:var(--muted);font-weight:600;background:var(--sunk)}
.cmptable thead th:first-child{position:static}
.cmptable td.win{font-weight:800;color:var(--ok);background:var(--ok-soft)}
/* birthdays + on this day */
.bday{display:flex;gap:10px;align-items:center;background:var(--brand-soft);border-radius:8px;padding:12px 16px;font-weight:600}
.otd{display:grid;gap:8px}
.otd a{display:grid;grid-template-columns:52px minmax(0,1fr);gap:10px;color:var(--ink);padding:6px 0;border-bottom:1px solid var(--line)}
.otd a:last-child{border-bottom:0}
.otd a:hover{text-decoration:none;color:var(--link)}
.otd b{color:var(--link)}
/* player of the match */
.potmform{display:grid;gap:6px}
.potmform label{display:flex;align-items:center;gap:10px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;cursor:pointer}
.potmform label:has(input:checked){border-color:var(--link);background:var(--brand-soft)}
.potmform input{width:auto}
.potmform .btn{justify-self:start;margin-top:6px}
.potmres{display:grid;gap:8px}
.pbar{display:grid;grid-template-columns:minmax(0,9rem) minmax(0,1fr) 3rem;gap:10px;align-items:center;font-size:.92rem}
.pbar .bar{height:10px;border-radius:99px;background:var(--sunk);overflow:hidden}
.pbar .bar i{display:block;height:100%;background:var(--brand);border-radius:99px}
.pbar b{text-align:right}
/* gallery */
.agrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.acard{display:grid;gap:8px;color:var(--ink)}
.acard:hover{text-decoration:none}.acard:hover h3{text-decoration:underline}
.pgal{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.pthumb{padding:0;border:0;border-radius:6px;overflow:hidden;cursor:zoom-in;aspect-ratio:1;background:var(--sunk)}
.pthumb img{width:100%;height:100%;object-fit:cover;display:block}
.lbox{position:fixed;inset:0;z-index:50;background:rgba(5,6,12,.92);display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(16px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.lbox img{max-width:100%;max-height:86vh;border-radius:6px;object-fit:contain}
.lbclose,.lbnav{position:absolute;background:rgba(255,255,255,.14);color:#fff;border:0;border-radius:50%;width:44px;height:44px;font-size:1.4rem;cursor:pointer}
.lbclose{top:calc(14px + env(safe-area-inset-top,0px));right:calc(14px + env(safe-area-inset-right,0px))}
.lbnav{top:50%;transform:translateY(-50%);font-size:2rem}
.lbnav.prev{left:calc(12px + env(safe-area-inset-left,0px))}.lbnav.next{right:calc(12px + env(safe-area-inset-right,0px))}
.lbcount{position:absolute;bottom:calc(14px + env(safe-area-inset-bottom,0px));left:0;right:0;text-align:center;color:#fff;font-size:.9rem;opacity:.8}
/* join form */
.consent{display:flex!important;gap:10px;align-items:flex-start;font-weight:400!important}
.consent input{width:auto;margin-top:4px}
/* sponsors */
.stier{display:grid;gap:10px;margin-top:6px}
.stier h3{font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.sgrid.tier-0{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.sgrid.tier-1{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.scard{display:grid;gap:6px;align-content:start;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px;color:var(--ink)}
a.scard:hover{text-decoration:none;border-color:var(--link)}
.slogo{height:90px;display:grid;place-items:center;background:#fff;border-radius:8px;border:1px solid var(--line);overflow:hidden}
.tier-0 .slogo{height:140px}
.slogo img{max-width:85%;max-height:80%;object-fit:contain}
.slogo span{font-weight:800;color:#222;padding:0 10px;text-align:center}
.slink{font-size:.88rem;font-weight:600;color:var(--link)}
/* admin: gallery editor, join requests, live scoring */
.galedit{display:flex;flex-wrap:wrap;gap:8px}
.galitem{position:relative;width:96px;height:72px;border-radius:6px;overflow:hidden;border:1px solid var(--line)}
.galitem img{width:100%;height:100%;object-fit:cover}
.galitem .rowdel{position:absolute;top:3px;right:3px;width:24px;height:24px;font-size:.75rem;background:rgba(255,255,255,.92)}
.joins{display:grid;gap:12px}
.joincard{display:grid;gap:8px}
.joincard.done{opacity:.65}
.joindl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:4px 14px;margin:0;font-size:.92rem}
.joindl dt{color:var(--muted)}
.joindl dd{margin:0;white-space:pre-line;overflow-wrap:anywhere}
.livepanel{display:grid;gap:14px}
.livescore{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lside{display:grid;gap:4px;text-align:left;font:inherit;padding:12px 14px;border-radius:10px;border:2px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.lside.on{border-color:var(--brand);background:var(--brand-soft)}
.lside b{font-size:1.5rem}
.lpad{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
@media (max-width:520px){.lpad{grid-template-columns:repeat(4,minmax(0,1fr))}.livescore{grid-template-columns:minmax(0,1fr)}}
.lbtn{font:inherit;font-weight:800;font-size:1.4rem;min-height:64px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;display:grid;place-items:center;line-height:1.1;padding:6px}
.lbtn small{display:block;font-size:.7rem;font-weight:600;color:var(--muted)}
.lbtn:active{transform:scale(.97)}
.lbtn.four{background:var(--brand-soft)}.lbtn.six{background:var(--brand);color:var(--brand-ink)}
.lbtn.extra{background:var(--maybe-soft)}.lbtn.wkt{background:var(--no);color:#fff}.lbtn.wkt small{color:#fff}
.lbtn.undo{background:var(--sunk)}
.mcbtns .lbtn{font-size:.95rem;min-height:44px;padding:8px 14px}
.lbtn.go{background:var(--ok);color:#fff}.lbtn.fin{background:var(--ink);color:var(--bg)}
.liveopts{display:flex;flex-wrap:wrap;gap:10px 16px;font-size:.88rem}
.liveopts label{display:flex;align-items:center;gap:6px}
.liveopts input{width:80px}
.cmphead{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;align-items:center}
.cmphead .avatar{grid-row:span 2}
.cmphead b,.cmphead span{grid-column:2;overflow-wrap:anywhere}
table.cmptable{min-width:0}


/* Featured row (under Player Spotlight) */
#featured h2{margin-bottom:10px}
.fwrap{position:relative}
.frow{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 4*12px)/4.4);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 6px;overscroll-behavior-x:contain}
.frow::-webkit-scrollbar{display:none}
.fwide .frow{grid-auto-columns:calc((100% - 2*12px)/2.3)}
.fcard{position:relative;display:block;aspect-ratio:var(--fshape,2/3);border-radius:10px;overflow:hidden;background:linear-gradient(150deg,var(--brand),var(--adbar));scroll-snap-align:start;color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.15);transition:transform .2s}
.fcard:hover{text-decoration:none;transform:translateY(-2px)}
.fcard:focus-visible{outline:3px solid var(--link);outline-offset:2px}
.fcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fblank{position:absolute;inset:0;display:grid;place-items:center;font-family:"Big Shoulders Display",sans-serif;font-weight:800;font-size:1.8rem;letter-spacing:.04em;opacity:.85}
.fbadge{position:absolute;top:8px;left:8px;background:#f4c430;color:#111;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 7px;border-radius:4px}
.ftitle{position:absolute;left:0;right:0;bottom:0;padding:32px 10px 10px;background:linear-gradient(transparent,rgba(0,0,0,.82));font-weight:700;font-size:.95rem;line-height:1.25}
.farrow{position:absolute;top:calc(50% - 22px);z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:#111;font-size:1.6rem;line-height:1;display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.3);padding:0 0 3px}
.farrow:hover{background:#fff}
.fprev{left:-10px}.fnext{right:-10px}
.fwrap.fits .farrow{display:none}
@media (max-width:700px){.frow{grid-auto-columns:42%}.fwide .frow{grid-auto-columns:80%}.fprev{left:2px}.fnext{right:2px}.farrow{width:36px;height:36px}}
@media (prefers-reduced-motion:reduce){.fcard{transition:none}}

/* Admin: Coming Up tab */
.uprowadm{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.uprowadm .pill{margin-top:4px;display:inline-block}
.uprowadm.dim b{opacity:.6}
.upctl{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.upctl input{width:72px;margin-left:4px}

/* Milestones: rolling window */
.msview{overflow:hidden;position:relative;outline-offset:4px}
.msview .msrow{border-bottom:1px solid var(--line);box-sizing:border-box}
.msview .msrow span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media (prefers-reduced-motion:reduce){.msview{overflow-y:auto}}

/* Admin: Home layout */
.laycols{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;align-items:start}
.laylist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.layrow{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--card,transparent)}
.layrow b{flex:1;min-width:0}
.laynum{width:24px;height:24px;border-radius:50%;background:var(--brand-soft);color:var(--link);display:grid;place-items:center;font-size:.8rem;font-weight:700;flex:none}
.layctl{display:flex;gap:4px;align-items:center}
.layctl .btn{padding:4px 10px}

/* Admin sign-in links */
.linkbtn{background:none;border:0;padding:4px 0;color:var(--link);font:inherit;font-weight:600;cursor:pointer;justify-self:start;text-decoration:underline;text-underline-offset:3px}
.linkbtn:hover{text-decoration-thickness:2px}
