/* 4Soccer module styles. Every selector is scr- prefixed so nothing collides with the host theme (app.css).
   Tokens mirror the live site, read from www.4soccer.us on 2026-09-20: chrome #232F3E, accent #1abc9c, body #fafbfd, Inter.
   Surfaces and text read tokens; the colour modes (hybrid is these defaults, light is the same, dark is the block
   at the end of this file) repaint them through html[data-fs-theme]. New colour rules need a dark counterpart. */
:root{
  --scr-chrome:#232F3E; --scr-chrome-2:#1a2330; --scr-ink:#0e1116; --scr-muted:#5b6472; --scr-line:#e3e7ee; --scr-bg:#fafbfd; --scr-card:#fff;
  --scr-accent:#1abc9c; --scr-accent-ink:#0b7a64; --scr-link:#0b57d0; --scr-live:#d92d20; --scr-warn-bg:#fff6dd; --scr-warn:#8a5a00;
  --scr-win:#0a7a3e; --scr-draw:#8a6d00; --scr-loss:#b42318;
  --scr-inset:#f5f7fa; --scr-hover:#f8fafc; --scr-me:#f0f8ff; --scr-chip:#eef1f6; --scr-chip-ink:#3b4554; --scr-text-2:#2b3442; --scr-line-2:#cfd6e0; --scr-line-3:#b8c1cf;
  --scr-quote:#f3fbf9; --scr-src-bg:#e8f8f4; --scr-out-bg:#fdecea; --scr-ok-bg:#e8f5ee;
  --scr-radius:12px; --scr-radius-sm:8px; --scr-shadow:0 1px 2px rgba(16,24,40,.05),0 6px 20px rgba(16,24,40,.06);
  --scr-font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
.scr-wrap{max-width:1240px;margin:0 auto;padding:0 16px}
.scr-main{padding-top:20px;padding-bottom:48px;font-family:var(--scr-font);color:var(--scr-ink);line-height:1.5}
.scr-main a{color:var(--scr-link);text-decoration:none}.scr-main a:hover{text-decoration:underline}
.scr-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.scr-skip{position:absolute;left:-999px;top:0;background:var(--scr-card);color:var(--scr-ink);padding:8px 12px;z-index:100}.scr-skip:focus{left:8px;top:8px}

/* ---------- club marks ---------- */
.scr-logo{object-fit:contain;flex:0 0 auto;vertical-align:middle}
.scr-badge{--scr-sz:24px;display:inline-grid;place-items:center;flex:0 0 auto;width:calc(var(--scr-sz)*1.3);height:var(--scr-sz);border-radius:5px;background:var(--scr-c1,#334);color:#fff;
  font:800 calc(var(--scr-sz)*.4)/1 var(--scr-font);letter-spacing:.02em;box-shadow:inset 0 -3px 0 var(--scr-c2,#fff3);text-shadow:0 1px 1px #0006;vertical-align:middle}
.scr-teamlink{display:inline-flex;align-items:center;gap:8px;color:inherit!important;font-weight:600}
.scr-rank{font-size:.75em;color:var(--scr-muted);font-weight:700}

/* ---------- ticker ---------- */
.scr-ticker{background:#10161f;color:#fff;font-family:var(--scr-font)}
.scr-ticker__tabs{display:flex;gap:6px;align-items:center;padding:8px 16px 0;max-width:1240px;margin:0 auto;overflow-x:auto;scrollbar-width:none}
.scr-ticker__tab{background:#1c2633;color:#c6d0dc;border:0;border-radius:999px;padding:4px 12px;font:600 12px var(--scr-font);cursor:pointer;white-space:nowrap;display:inline-flex;gap:6px;align-items:center}
.scr-ticker__tab.is-active{background:var(--scr-accent);color:#04241d}
.scr-ticker__tab:focus-visible,.scr-follow:focus-visible,.scr-match:focus-visible{outline:2px solid #fff;outline-offset:2px}
.scr-dot{width:7px;height:7px;border-radius:50%;background:var(--scr-live);box-shadow:0 0 0 0 #d92d2088;animation:scr-pulse 1.6s infinite}
.scr-ticker__all{margin-left:auto;color:#9fe8d8;font-size:12px;font-weight:600;text-decoration:none;white-space:nowrap;padding-left:12px}
.scr-ticker__strip{display:none;gap:8px;padding:8px 16px 10px;max-width:1240px;margin:0 auto;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#334 transparent}
.scr-ticker__strip.is-active{display:flex}
.scr-ticker__empty{color:#9fb0c3;font-size:13px;padding:10px 0}
@keyframes scr-pulse{70%{box-shadow:0 0 0 7px #d92d2000}100%{box-shadow:0 0 0 0 #d92d2000}}

/* ---------- match card ---------- */
.scr-match{display:block;text-decoration:none!important;color:inherit;font-family:var(--scr-font)}
.scr-match__row{display:flex;align-items:center;gap:8px;font-weight:500;opacity:.88}
.scr-match__row.is-winner,.scr-match.is-live .scr-match__row,.scr-match.is-pre .scr-match__row{opacity:1}
.scr-match__row.is-winner{font-weight:800}
.scr-match__name{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scr-match__score{font-variant-numeric:tabular-nums;font-weight:800;min-width:1.2em;text-align:right}
.scr-match__score.scr-flash{animation:scr-flash 2.4s ease-out}
.scr-pens{font-size:.8em;color:var(--scr-muted);font-weight:700}
@keyframes scr-flash{0%{background:var(--scr-accent);color:#04241d;border-radius:4px}100%{background:transparent}}
.scr-match__status{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:11px;margin-top:4px}
.scr-match__meta{opacity:.75}
.scr-live{color:var(--scr-live);font-weight:800;text-transform:uppercase;font-size:.92em;letter-spacing:.04em}
.scr-live::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:4px;vertical-align:1px;animation:scr-pulse 1.6s infinite}
.scr-pending{color:var(--scr-warn);font-weight:700}
.scr-off{color:var(--scr-muted);font-weight:700;text-transform:uppercase;font-size:.92em}
.scr-match--ticker{flex:0 0 auto;min-width:150px;max-width:210px;background:#1c2633;color:#fff;border-radius:var(--scr-radius-sm);padding:7px 10px;font-size:13px;scroll-snap-align:start;border:1px solid transparent}
.scr-match--ticker:hover{border-color:#3a4a5e}
.scr-match--ticker .scr-match__status{color:#9fb0c3;flex-wrap:nowrap;white-space:nowrap;overflow:hidden}
.scr-match--ticker .scr-live{color:#ff7a6e}
.scr-match--ticker.is-mine{border-color:var(--scr-accent)}
/* dark crests need a light chip on the dark ticker */
.scr-match--ticker .scr-logo{background:#fff;border-radius:4px;padding:1px;box-sizing:border-box}
.scr-board{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin:12px 0 24px}
.scr-match--board{background:var(--scr-card);border:1px solid var(--scr-line);border-radius:var(--scr-radius);padding:12px 14px;box-shadow:var(--scr-shadow);font-size:15px;color:var(--scr-ink)!important}
.scr-match--board:hover{border-color:var(--scr-line-3)}
.scr-match--board .scr-match__row{padding:3px 0}
.scr-match--board .scr-match__status{color:var(--scr-muted);font-size:12px;border-top:1px solid var(--scr-line);margin-top:8px;padding-top:8px}
.scr-match--board.is-mine{box-shadow:0 0 0 2px var(--scr-accent),var(--scr-shadow)}
.scr-dayhead{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--scr-muted);margin:22px 0 0}
.scr-matchhead .scr-match__row--big{padding:8px 0;font-size:20px;opacity:1}
.scr-matchhead .scr-match__score{font-size:32px}
.scr-matchhead__comp{margin:0 0 10px}
.scr-match__status--big{font-size:14px}

/* ---------- sub navigation ---------- */
.scr-subnav{background:var(--scr-card);border-bottom:1px solid var(--scr-line);font-family:var(--scr-font);position:sticky;top:0;z-index:20}
.scr-subnav__in{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;align-items:center}
.scr-subnav a{padding:11px;font-size:14px;font-weight:600;color:var(--scr-text-2);text-decoration:none;white-space:nowrap;border-bottom:2px solid transparent}
.scr-subnav a:hover{color:#000;border-color:var(--scr-line-2)}.scr-subnav a.is-active{color:var(--scr-accent-ink);border-color:var(--scr-accent)}
.scr-subnav__my{margin-left:auto;color:var(--scr-accent-ink)!important}

/* ---------- layout + cards ---------- */
.scr-h1{font-size:clamp(24px,3.2vw,32px);line-height:1.2;margin:4px 0 6px;letter-spacing:-.4px}
.scr-h2{font-size:18px;margin:0 0 12px;letter-spacing:-.2px}
.scr-lede{color:var(--scr-muted);margin:0 0 18px;max-width:820px}
.scr-sechead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:8px}
.scr-sechead .scr-h2{margin-bottom:8px}
.scr-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:0 0 10px;font-size:13px;color:var(--scr-muted)}
.scr-crumbs li+li::before{content:"›";margin-right:6px;opacity:.6}
.scr-card{background:var(--scr-card);border:1px solid var(--scr-line);border-radius:var(--scr-radius);box-shadow:var(--scr-shadow);padding:16px 18px;margin:0 0 16px}
.scr-grid{display:grid;gap:16px}.scr-grid--2{grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr))}.scr-grid--3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.scr-cols{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;align-items:start}
.scr-home{display:grid;grid-template-columns:200px minmax(0,1fr) 320px;gap:20px;align-items:start}
@media(max-width:1080px){.scr-home{grid-template-columns:minmax(0,1fr) 300px}.scr-home__topics{display:none}}
@media(max-width:860px){.scr-cols,.scr-home{grid-template-columns:minmax(0,1fr)}}
.scr-note{font-size:13px;color:var(--scr-muted);margin:8px 0}
.scr-note--warn{background:var(--scr-warn-bg);color:var(--scr-warn);padding:8px 12px;border-radius:var(--scr-radius-sm);border:1px solid #f2dca0}
.scr-source{font-size:12px;color:var(--scr-muted);margin:18px 0 0}
.scr-empty{text-align:center;padding:60px 0}
.scr-cardlabel{margin:0 0 6px;font-weight:700}
.scr-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px;padding:0;list-style:none}
.scr-chip,.scr-chips a{display:inline-block;padding:5px 12px;border-radius:999px;border:1px solid var(--scr-line);background:var(--scr-card);font-size:13px;font-weight:600;color:var(--scr-text-2)!important;text-decoration:none!important;cursor:pointer;font-family:var(--scr-font)}
.scr-chips a:hover,.scr-chip:hover{border-color:var(--scr-line-3)}.scr-chips a.is-active,.scr-chip.is-active{background:var(--scr-chrome);color:#fff!important;border-color:var(--scr-chrome)}
.scr-chip.is-active .scr-meta{color:#c6d0dc}
.scr-btn{display:inline-block;padding:7px 14px;border-radius:999px;border:1px solid var(--scr-line);background:var(--scr-card);font:600 13px var(--scr-font);color:var(--scr-text-2)!important;text-decoration:none!important;cursor:pointer}
.scr-btn:hover{border-color:var(--scr-line-3)}.scr-btn--primary{background:var(--scr-link);border-color:var(--scr-link);color:#fff!important}
.scr-actions{display:flex;flex-wrap:wrap;gap:8px}
.scr-kv{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0;font-size:14px}.scr-kv dt{color:var(--scr-muted)}.scr-kv dd{margin:0;font-weight:600}
.scr-kv--wide{grid-template-columns:minmax(120px,auto) 1fr}.scr-kv--wide dd{font-weight:500}
.scr-stat{display:flex;flex-direction:column;gap:2px}.scr-stat b{font-size:22px;letter-spacing:-.4px;font-variant-numeric:tabular-nums}.scr-stat span{font-size:12px;color:var(--scr-muted)}
.scr-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:14px}
.scr-src{display:inline-block;font-size:11px;font-weight:700;color:var(--scr-accent-ink);background:var(--scr-src-bg);border-radius:999px;padding:1px 7px;margin-left:4px;vertical-align:1px}
.scr-standfirst{font-size:19px;color:var(--scr-text-2)}

/* ---------- tables ---------- */
.scr-tablewrap{overflow-x:auto;margin:0 0 16px;border:1px solid var(--scr-line);border-radius:var(--scr-radius);background:var(--scr-card);box-shadow:var(--scr-shadow)}
.scr-table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.scr-table caption{text-align:left;font-weight:800;padding:12px 14px 8px;font-size:15px}
.scr-table th,.scr-table td{padding:8px 12px;border-top:1px solid var(--scr-line);text-align:left;white-space:nowrap}
.scr-table thead th{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--scr-muted);background:var(--scr-inset);border-top:0;font-weight:700}
.scr-table tbody th{font-weight:600}
.scr-table .n{text-align:right}.scr-table .c{text-align:center}.scr-table tbody tr:hover{background:var(--scr-hover)}
.scr-table tbody tr[data-me]{background:var(--scr-me);box-shadow:inset 2px 0 0 var(--scr-link)}
.scr-table--compact th,.scr-table--compact td{padding:6px 10px}
.scr-table [data-sort]{cursor:pointer;user-select:none}.scr-table [data-sort]::after{content:" ↕";opacity:.35}
.scr-table [aria-sort=ascending]::after{content:" ↑";opacity:1}.scr-table [aria-sort=descending]::after{content:" ↓";opacity:1}
.scr-strong{font-weight:800}
.scr-w{color:var(--scr-win);font-weight:800}.scr-l{color:var(--scr-loss);font-weight:800}.scr-d{color:var(--scr-draw);font-weight:800}
.scr-tag{display:inline-block;font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px;background:var(--scr-chip);color:var(--scr-chip-ink)}
.scr-tag--out{background:var(--scr-out-bg);color:#b42318}.scr-tag--ok{background:var(--scr-ok-bg);color:#0a7a3e}
.scr-form{display:inline-flex;gap:3px}
.scr-form i{font-style:normal;font-size:10px;font-weight:800;width:16px;height:16px;border-radius:3px;display:grid;place-items:center;color:#fff}
.scr-form__w{background:var(--scr-win)}.scr-form__d{background:#9a8600}.scr-form__l{background:var(--scr-loss)}
/* table zones: a coloured left edge plus a key — never colour alone */
.scr-z-ucl td:first-child,.scr-z-ucl th:first-child{box-shadow:inset 3px 0 0 #0b57d0}
.scr-z-ucl-q td:first-child,.scr-z-ucl-q th:first-child{box-shadow:inset 3px 0 0 #6aa2f7}
.scr-z-uel td:first-child,.scr-z-uel th:first-child{box-shadow:inset 3px 0 0 #f59e0b}
.scr-z-uecl td:first-child,.scr-z-uecl th:first-child{box-shadow:inset 3px 0 0 #10b981}
.scr-z-playoff td:first-child,.scr-z-playoff th:first-child{box-shadow:inset 3px 0 0 #1abc9c}
.scr-z-playoff-2 td:first-child,.scr-z-playoff-2 th:first-child{box-shadow:inset 3px 0 0 #7dd3c0}
.scr-z-rel td:first-child,.scr-z-rel th:first-child{box-shadow:inset 3px 0 0 #b42318}
.scr-z-rel-po td:first-child,.scr-z-rel-po th:first-child{box-shadow:inset 3px 0 0 #f08a80}
.scr-zonekey{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;color:var(--scr-muted);margin:-8px 0 16px}
.scr-zonekey__item{display:inline-flex;align-items:center;gap:6px}
.scr-zonekey__item i{width:10px;height:10px;border-radius:2px;display:inline-block}
.scr-zonekey .scr-z-ucl{background:#0b57d0}.scr-zonekey .scr-z-ucl-q{background:#6aa2f7}.scr-zonekey .scr-z-uel{background:#f59e0b}.scr-zonekey .scr-z-uecl{background:#10b981}
.scr-zonekey .scr-z-playoff{background:#1abc9c}.scr-zonekey .scr-z-playoff-2{background:#7dd3c0}.scr-zonekey .scr-z-rel{background:#b42318}.scr-zonekey .scr-z-rel-po{background:#f08a80}

/* ---------- hero ---------- */
.scr-hero{border-radius:var(--scr-radius);padding:22px;color:#fff;background:linear-gradient(120deg,var(--scr-c1,#232F3E) 0%,color-mix(in srgb,var(--scr-c1,#232F3E) 70%,#000) 100%);display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:16px;border-bottom:4px solid var(--scr-c2,#1abc9c)}
.scr-hero__mark{background:#fff;border-radius:12px;padding:8px;display:grid;place-items:center;flex:0 0 auto}
.scr-hero h1{margin:0;font-size:clamp(22px,3vw,30px);letter-spacing:-.4px}
.scr-hero p{margin:4px 0 0;opacity:.92;font-size:14px}
.scr-hero a{color:#fff!important}
.scr-hero__side{margin-left:auto;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.scr-follow{background:#ffffff22;border:1px solid #ffffff55;color:#fff;border-radius:999px;padding:7px 14px;font:700 13px var(--scr-font);cursor:pointer}
.scr-follow[aria-pressed=true]{background:#fff;color:#111}.scr-follow[aria-pressed=true] .scr-follow__star{color:#e6a700}
.scr-tabs{display:flex;gap:4px;border-bottom:1px solid var(--scr-line);margin:0 0 16px;overflow-x:auto}
.scr-tabs a{padding:9px 12px;font-weight:600;font-size:14px;color:var(--scr-text-2)!important;border-bottom:2px solid transparent;text-decoration:none!important;white-space:nowrap}
.scr-tabs a:hover{border-color:var(--scr-line-2)}

/* ---------- goals list ---------- */
.scr-goals{list-style:none;padding:0;margin:0;font-size:15px}
.scr-goals li{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--scr-line)}
.scr-goals li:first-child{border:0}
.scr-goals__min{font-variant-numeric:tabular-nums;font-weight:800;min-width:42px;color:var(--scr-muted)}
.scr-goals__who{flex:1}
.scr-goals__away{flex-direction:row-reverse;text-align:right}

/* ---------- news / blog ---------- */
.scr-news__list{list-style:none;padding:0;margin:0 0 12px}.scr-news__list li{padding:8px 0;border-top:1px solid var(--scr-line)}.scr-news__list li:first-child{border:0}
.scr-news__src{display:block;font-size:12px;color:var(--scr-muted)}
.scr-posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr));gap:16px}
.scr-post-card{background:var(--scr-card);border:1px solid var(--scr-line);border-radius:var(--scr-radius);overflow:hidden;box-shadow:var(--scr-shadow);display:flex;flex-direction:column}
.scr-post-card__art{height:96px;background:linear-gradient(135deg,var(--scr-chrome),#0b7a64);display:grid;place-items:center;color:#ffffffcc;font:800 12px var(--scr-font);letter-spacing:.12em;text-transform:uppercase}
.scr-post-card__body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.scr-post-card h3{margin:0;font-size:17px;line-height:1.3}.scr-post-card h3 a{color:var(--scr-ink)!important}
.scr-post-card p{margin:0;color:var(--scr-muted);font-size:14px}
.scr-meta{font-size:12px;color:var(--scr-muted)}
.scr-article{max-width:760px;font-size:17px;line-height:1.7}
.scr-article h2{font-size:24px;margin:34px 0 10px;letter-spacing:-.3px}.scr-article h3{font-size:19px;margin:26px 0 8px}
.scr-article blockquote{border-left:4px solid var(--scr-accent);margin:18px 0;padding:4px 16px;color:var(--scr-text-2);background:var(--scr-quote);border-radius:0 8px 8px 0}
.scr-article table{font-size:15px}
.scr-article code{background:var(--scr-chip);padding:1px 5px;border-radius:4px;font-size:.9em}
.scr-article__after{max-width:760px;margin-top:28px}
.scr-embed{margin:22px 0}

/* ---------- diagrams ---------- */
.scr-diagram{margin:22px 0;max-width:520px}
.scr-diagram svg,.scr-sizes__draw svg{width:100%;height:auto;border-radius:var(--scr-radius);border:1px solid var(--scr-line)}
.scr-diagram figcaption,.scr-sizes__draw figcaption{font-size:13px;color:var(--scr-muted);margin-top:8px;font-style:italic}
.scr-d-grass{fill:#eaf5ee}
.scr-d-line{stroke:#9bb3a6;stroke-width:1.5;fill:none}
.scr-d-half{stroke:#9bb3a6;stroke-width:1.5;stroke-dasharray:4 3}
.scr-d-goal{stroke:#5b6472;stroke-width:2}
.scr-d-off{stroke:#e8590c;stroke-width:2;stroke-dasharray:5 4}
.scr-d-pass{stroke:#0b57d0;stroke-width:2;stroke-dasharray:4 3}
.scr-d-small{fill:#d6efe0;stroke:#0b7a64;stroke-width:2}
.scr-d-att circle{fill:#0b57d0}.scr-d-def circle{fill:#b42318}
.scr-d-att text,.scr-d-def text{fill:#fff;font:700 10px var(--scr-font);text-anchor:middle}
.scr-d-ball{fill:#111}
.scr-d-label{fill:#5b6472;font:600 9px var(--scr-font)}
.scr-d-big{fill:#0b7a64;font:800 16px var(--scr-font)}

/* ---------- field size tool ---------- */
.scr-sizes__tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.scr-sizes__panel{display:none}.scr-sizes__panel.is-active{display:block}
.scr-sizes__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
@media(max-width:820px){.scr-sizes__grid{grid-template-columns:1fr}}

/* ---------- planner ---------- */
.scr-planner{display:grid;grid-template-columns:340px minmax(0,1fr);gap:20px;align-items:start}
@media(max-width:860px){.scr-planner{grid-template-columns:1fr}}
.scr-planner textarea{width:100%;border:1px solid var(--scr-line);border-radius:var(--scr-radius-sm);padding:10px 12px;font:15px/1.6 var(--scr-font);resize:vertical}
.scr-planner__opts{display:grid;grid-template-columns:auto 1fr;gap:8px 12px;align-items:center;margin-top:12px;font-size:14px}
.scr-planner__opts select,.scr-planner__opts input{padding:6px 10px;border:1px solid var(--scr-line);border-radius:var(--scr-radius-sm);font:14px var(--scr-font);background:var(--scr-card);width:100%}
.scr-plan th[scope=row]{white-space:nowrap}
@media print{
  .scr-ticker,.scr-subnav,.sa-topbar,.sa-header,.sa-footer,.scr-crumbs,.scr-planner__setup,.scr-actions,.scr-cols aside{display:none!important}
  .scr-planner{grid-template-columns:1fr}.scr-tablewrap{box-shadow:none;border-color:#999}
}

/* ---------- fantasy grid ---------- */
.scr-fdr td.c{padding:4px 6px}
.scr-fdr__cell{display:inline-flex;flex-direction:column;align-items:center;min-width:42px;padding:3px 4px;border-radius:5px;font:700 11px var(--scr-font);color:#fff;margin:1px}
.scr-fdr__cell i{font-style:normal;font-size:9px;opacity:.85;font-weight:600}
.scr-fdr__d1{background:#0a7a3e}.scr-fdr__d2{background:#5cb85c;color:#06280f}.scr-fdr__d3{background:#e9ecef;color:var(--scr-chip-ink)}.scr-fdr__d4{background:#e8590c}.scr-fdr__d5{background:#a4161a}
.scr-fdr__none{color:var(--scr-muted)}
.scr-fdr td.is-blank{background:#fff6dd}.scr-fdr td.is-double{background:var(--scr-ok-bg)}

/* ---------- home ---------- */
.scr-doors{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 20px}
@media(max-width:760px){.scr-doors{grid-template-columns:1fr}}
.scr-door{background:var(--scr-card);border:1px solid var(--scr-line);border-radius:var(--scr-radius);box-shadow:var(--scr-shadow);overflow:hidden}
.scr-door__head{display:flex;gap:14px;align-items:center;padding:16px 18px;text-decoration:none!important;color:var(--scr-ink)!important;border-bottom:1px solid var(--scr-line)}
.scr-door__head:hover{background:var(--scr-hover)}
.scr-door__icon{font-size:30px;line-height:1}
.scr-door__head b{display:block;font-size:18px}
.scr-door__head span span{font-size:14px;color:var(--scr-muted)}
.scr-door__links{display:flex;flex-wrap:wrap;gap:6px;padding:12px 18px 16px}
.scr-door__links a{font-size:13px;font-weight:600;padding:4px 10px;border-radius:999px;background:#f1f4f9;color:var(--scr-text-2)!important;text-decoration:none!important}
.scr-door__links a:hover{background:#e3e9f2}
.scr-rail .scr-card{padding:14px}
.scr-rail h2{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--scr-muted);margin:0 0 10px}
.scr-rail .scr-tablewrap{box-shadow:none;margin:0;border:0}
.scr-list{list-style:none;padding:0;margin:0;font-size:14px}.scr-list li{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-top:1px solid var(--scr-line)}.scr-list li:first-child{border:0}
.scr-topics{background:var(--scr-chrome);color:#dfe7ef;border-radius:var(--scr-radius);padding:12px;font-size:14px}
.scr-topics h2{font-size:11px;letter-spacing:.1em;color:#9fb0c3;margin:0 0 8px}
.scr-topics a{display:block;color:#dfe7ef!important;padding:6px 4px;border-top:1px solid #ffffff14;text-decoration:none!important}.scr-topics a:hover{color:#fff!important;background:#ffffff0d}
.scr-feeditem{padding:12px 0;border-top:1px solid var(--scr-line)}.scr-feeditem:first-of-type{border:0}
.scr-feeditem a{font-weight:600;font-size:16px}
.scr-hubgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-bottom:16px}
.scr-hubgrid a{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid var(--scr-line);border-radius:var(--scr-radius-sm);background:var(--scr-card);color:var(--scr-ink)!important;font-weight:600;font-size:14px;text-decoration:none!important}
.scr-hubgrid a:hover{border-color:var(--scr-line-3)}
.scr-hubgrid a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scr-filter{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 4px}
.scr-filter input,.scr-filter select{padding:8px 12px;border:1px solid var(--scr-line);border-radius:999px;font:14px var(--scr-font);background:var(--scr-card);min-width:0}
.scr-filter input{flex:1 1 220px}
.scr-tile{display:block;text-decoration:none!important;color:var(--scr-ink)!important;margin:0}a.scr-tile:hover{border-color:var(--scr-line-3)}
.scr-tile b{display:block;font-size:17px;margin-bottom:4px}.scr-tile span{font-size:14px;color:var(--scr-muted)}
.scr-tile--tool{border-left:4px solid var(--scr-accent)}
.scr-champ{display:flex;flex-wrap:wrap;gap:24px;align-items:center}
.scr-champ b{display:block;font-size:22px;letter-spacing:-.3px}
.scr-champ__final{flex:1 1 100%;border-top:1px solid var(--scr-line);padding-top:12px}
.scr-champ__final b{font-size:18px}

@media (prefers-reduced-motion:reduce){.scr-dot,.scr-live::before,.scr-match__score.scr-flash{animation:none}}
/* the hidden attribute must win over display:flex/grid on filtered rows */
.scr-main [hidden]{display:none!important}
.scr-empty-state{border-left:4px solid var(--scr-warn);background:#fffdf6}
.scr-empty-state p{font-size:15px}
.scr-matchhead__h1{margin-bottom:2px}

/* ---------- inside the engine's page ---------- */
/* The engine lays the page out as a flex column and gives <main> flex:1; a flex item with auto side margins
   shrinks to its content, so the module's own column would collapse to the width of its widest block. */
main.scr-main{width:100%;box-sizing:border-box;color:var(--scr-ink)}
/* blocks the kit places inside the home feed's column */
.scr-homeblock{margin:12px 0 16px;font-family:var(--scr-font)}
.scr-homeblock .scr-ticker{border-radius:var(--scr-radius);overflow:hidden;margin:0 0 12px}
.scr-homeblock .scr-ticker__tabs,.scr-homeblock .scr-ticker__strip{max-width:none}
.scr-homeblock .scr-card{color:var(--scr-ink)}
.scr-homeblock a{color:var(--scr-link)}
/* the label on a card's art is the one link that stays pale: '.scr-main a' would turn it into a blue word on dark blue */
.scr-main .scr-post-card__art,.scr-homeblock .scr-post-card__art{color:#ffffffcc}
.scr-glance .scr-rail{column-width:270px;column-gap:14px;display:block}
.scr-glance .scr-rail .scr-card{margin:0 0 14px;break-inside:avoid}
.scr-home__blog{margin:0 0 16px}
.scr-main .scr-h1,.scr-main .scr-h2{color:var(--scr-ink)}
/* the engine colours every heading; a club's hero is dark in all three modes */
.scr-main .scr-hero h1{color:#fff}

/* ---------- dark mode ---------- */
/* The chrome (ticker, club heroes, badges) is already dark and stays as it is; the surfaces and the text flip.
   Values are the engine's own dark tokens (app.css section 14), with fallbacks so a missing token cannot paint white. */
html[data-fs-theme="dark"]{
  --scr-ink:var(--fs-ink,#c6d0dc); --scr-muted:var(--fs-ink-3,#8fa2b8); --scr-line:var(--fs-line-3,#2a3542); --scr-bg:var(--fs-page-bg,#10151c);
  --scr-card:var(--fs-surface,#161d26); --scr-link:var(--fs-link,#79b8ff); --scr-accent-ink:#3fe0c0;
  --scr-inset:var(--fs-surface-2,#1d2631); --scr-hover:var(--fs-surface-3,#232e3c); --scr-me:#16263a; --scr-chip:#243040; --scr-chip-ink:#c6d0dc; --scr-text-2:var(--fs-ink-2,#b4bfcd);
  --scr-line-2:var(--fs-line-2,#2f3c4c); --scr-line-3:#3a4a5e; --scr-quote:#14262a; --scr-src-bg:#12302a; --scr-warn-bg:#3a2e12; --scr-warn:#f2c46b;
  --scr-win:#4ade80; --scr-draw:#e6c34a; --scr-loss:#ff8a80; --scr-out-bg:#3a1c1a; --scr-ok-bg:#12301f;
  --scr-shadow:0 1px 2px rgba(0,0,0,.4),0 6px 20px rgba(0,0,0,.28);
}
html[data-fs-theme="dark"] .scr-logo{background:#fff;border-radius:4px;padding:1px;box-sizing:border-box}
html[data-fs-theme="dark"] .scr-subnav a:hover{color:#fff}
html[data-fs-theme="dark"] .scr-chips a.is-active,html[data-fs-theme="dark"] .scr-chip.is-active{background:var(--scr-accent);color:#04241d!important;border-color:var(--scr-accent)}
html[data-fs-theme="dark"] .scr-btn--primary{background:#2f6fd6;border-color:#2f6fd6;color:#fff!important}
html[data-fs-theme="dark"] .scr-article h2,html[data-fs-theme="dark"] .scr-article h3{color:var(--fs-heading,#dde5ef)}
html[data-fs-theme="dark"] .scr-post-card h3 a{color:var(--scr-ink)!important}
html[data-fs-theme="dark"] .scr-planner textarea,html[data-fs-theme="dark"] .scr-planner select,html[data-fs-theme="dark"] .scr-planner input{background:var(--scr-inset);color:var(--scr-ink);border-color:var(--scr-line-2)}