/* 4Football module styles. Every selector is fb- prefixed so nothing collides with the host theme (app.css).
   Tokens mirror the live site: chrome #232F3E, accent #1abc9c, 12px radius, 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{
  --fb-chrome:#232F3E; --fb-chrome-2:#1a2330; --fb-ink:#0e1116; --fb-muted:#5b6472; --fb-line:#e3e7ee; --fb-bg:#fafbfd; --fb-card:#fff;
  --fb-accent:#1abc9c; --fb-accent-ink:#0b7a64; --fb-link:#0b57d0; --fb-live:#d92d20; --fb-win:#0e1116; --fb-warn-bg:#fff6dd; --fb-warn:#8a5a00;
  --fb-inset:#f5f7fa; --fb-hover:#f8fafc; --fb-chip:#eef1f6; --fb-chip-ink:#3b4554; --fb-text-2:#2b3442; --fb-line-2:#cfd6e0; --fb-line-3:#b8c1cf; --fb-quote:#f3fbf9; --fb-warn-line:#f2dca0;
  --fb-win-ink:#0a7a3e; --fb-loss-ink:#b42318; --fb-out-bg:#fdecea; --fb-q-bg:#fff6dd; --fb-ok-bg:#e8f5ee;
  --fb-radius:12px; --fb-radius-sm:8px; --fb-shadow:0 1px 2px rgba(16,24,40,.05),0 6px 20px rgba(16,24,40,.06);
  --fb-font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
.fb-wrap{max-width:1240px;margin:0 auto;padding:0 16px}
.fb-main{padding-top:20px;padding-bottom:48px;font-family:var(--fb-font);color:var(--fb-ink);line-height:1.5}
.fb-main a{color:var(--fb-link);text-decoration:none}.fb-main a:hover{text-decoration:underline}
.fb-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fb-skip{position:absolute;left:-999px;top:0;background:var(--fb-card);color:var(--fb-ink);padding:8px 12px;z-index:100}.fb-skip:focus{left:8px;top:8px}

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

/* ---------- ticker ---------- */
.fb-ticker{background:#10161f;color:#fff;font-family:var(--fb-font)}
.fb-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}
.fb-ticker__tab{background:#1c2633;color:#c6d0dc;border:0;border-radius:999px;padding:4px 12px;font:600 12px var(--fb-font);cursor:pointer;white-space:nowrap;display:inline-flex;gap:6px;align-items:center}
.fb-ticker__tab.is-active{background:var(--fb-accent);color:#04241d}
.fb-ticker__tab:focus-visible,.fb-follow:focus-visible,.fb-game:focus-visible{outline:2px solid #fff;outline-offset:2px}
.fb-dot{width:7px;height:7px;border-radius:50%;background:var(--fb-live);box-shadow:0 0 0 0 #d92d2088;animation:fb-pulse 1.6s infinite}
.fb-ticker__all{margin-left:auto;color:#9fe8d8;font-size:12px;font-weight:600;text-decoration:none;white-space:nowrap;padding-left:12px}
.fb-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}
.fb-ticker__strip.is-active{display:flex}
.fb-ticker__empty{color:#9fb0c3;font-size:13px;padding:10px 0}
@keyframes fb-pulse{70%{box-shadow:0 0 0 7px #d92d2000}100%{box-shadow:0 0 0 0 #d92d2000}}

/* ---------- game card ---------- */
.fb-game{display:block;text-decoration:none!important;color:inherit;font-family:var(--fb-font)}
.fb-game__row{display:flex;align-items:center;gap:8px;font-weight:500;opacity:.86}
.fb-game__row.is-winner,.fb-game.is-live .fb-game__row,.fb-game.is-pre .fb-game__row{opacity:1}
.fb-game__row.is-winner{font-weight:800}
.fb-game__name{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fb-game__score{font-variant-numeric:tabular-nums;font-weight:800;min-width:1.6em;text-align:right}
.fb-game__score.fb-flash{animation:fb-flash 2.4s ease-out}
@keyframes fb-flash{0%{background:var(--fb-accent);color:#04241d;border-radius:4px}100%{background:transparent}}
.fb-game__status{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:11px;margin-top:4px}
.fb-game__meta{opacity:.75}
.fb-game__sit{display:inline-flex;align-items:center;gap:5px;font-variant-numeric:tabular-nums}
.fb-poss{display:inline-block;padding:0 5px;border-radius:3px;background:var(--fb-accent-ink);color:#fff;font-weight:700;font-size:.92em;letter-spacing:.02em}
.fb-poss.is-rz{background:var(--fb-live)}
.fb-lastplay{margin:10px 0 0;font-size:13px;color:var(--fb-muted);line-height:1.45}
.fb-game--ticker .fb-game__sit{display:none}
.fb-live{color:var(--fb-live);font-weight:800;text-transform:uppercase;font-size:.92em;letter-spacing:.04em}
.fb-live::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:4px;vertical-align:1px}
.fb-game--ticker{flex:0 0 auto;min-width:148px;max-width:200px;background:#1c2633;color:#fff;border-radius:var(--fb-radius-sm);padding:7px 10px;font-size:13px;scroll-snap-align:start;border:1px solid transparent}
.fb-game--ticker:hover{border-color:#3a4a5e}
.fb-game--ticker .fb-game__status{color:#9fb0c3}
.fb-game--ticker .fb-live{color:#ff7a6e}
.fb-game--ticker.is-mine{border-color:var(--fb-accent)}
.fb-board{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px;margin:12px 0 24px}
.fb-game--board{background:var(--fb-card);border:1px solid var(--fb-line);border-radius:var(--fb-radius);padding:12px 14px;box-shadow:var(--fb-shadow);font-size:15px;color:var(--fb-ink)!important}
.fb-game--board:hover{border-color:var(--fb-line-3)}
.fb-game--board .fb-game__row{padding:3px 0}
.fb-game--board .fb-game__status{color:var(--fb-muted);font-size:12px;border-top:1px solid var(--fb-line);margin-top:8px;padding-top:8px}
.fb-game--board.is-mine{box-shadow:0 0 0 2px var(--fb-accent),var(--fb-shadow)}
.fb-dayhead{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--fb-muted);margin:22px 0 0}

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

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

/* ---------- tables ---------- */
.fb-tablewrap{overflow-x:auto;margin:0 0 16px;border:1px solid var(--fb-line);border-radius:var(--fb-radius);background:var(--fb-card);box-shadow:var(--fb-shadow)}
.fb-table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.fb-table caption{text-align:left;font-weight:800;padding:12px 14px 8px;font-size:15px}
.fb-table th,.fb-table td{padding:8px 12px;border-top:1px solid var(--fb-line);text-align:left;white-space:nowrap}
.fb-table thead th{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--fb-muted);background:var(--fb-inset);border-top:0;font-weight:700}
.fb-table tbody th{font-weight:600}
.fb-table .n{text-align:right}.fb-table tbody tr:hover{background:var(--fb-hover)}
.fb-table--compact th,.fb-table--compact td{padding:6px 10px}
.fb-table [data-sort]{cursor:pointer;user-select:none}.fb-table [data-sort]::after{content:" ↕";opacity:.35}
.fb-table [aria-sort=ascending]::after{content:" ↑";opacity:1}.fb-table [aria-sort=descending]::after{content:" ↓";opacity:1}
.fb-w{color:var(--fb-win-ink);font-weight:700}.fb-l{color:var(--fb-loss-ink);font-weight:700}.fb-t{color:var(--fb-muted);font-weight:700}
.fb-tag{display:inline-block;font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px;background:var(--fb-chip);color:var(--fb-chip-ink)}
.fb-tag--out{background:var(--fb-out-bg);color:var(--fb-loss-ink)}.fb-tag--q{background:var(--fb-q-bg);color:var(--fb-warn)}.fb-tag--ok{background:var(--fb-ok-bg);color:var(--fb-win-ink)}

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

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

/* ---------- home ---------- */
.fb-rail .fb-card{padding:14px}
.fb-rail h2{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--fb-muted);margin:0 0 10px}
.fb-rail .fb-tablewrap{box-shadow:none;margin:0;border:0}
.fb-list{list-style:none;padding:0;margin:0;font-size:14px}.fb-list li{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-top:1px solid var(--fb-line)}.fb-list li:first-child{border:0}
.fb-topics{background:var(--fb-chrome);color:#dfe7ef;border-radius:var(--fb-radius);padding:12px;font-size:14px}
.fb-topics h2{font-size:11px;letter-spacing:.1em;color:#9fb0c3;margin:0 0 8px}
.fb-topics a{display:block;color:#dfe7ef!important;padding:6px 4px;border-top:1px solid #ffffff14;text-decoration:none!important}.fb-topics a:hover{color:#fff!important;background:#ffffff0d}
.fb-feeditem{padding:12px 0;border-top:1px solid var(--fb-line)}.fb-feeditem:first-of-type{border:0}
.fb-feeditem a{font-weight:600;font-size:16px}
.fb-hubgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.fb-hubgrid a{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid var(--fb-line);border-radius:var(--fb-radius-sm);background:var(--fb-card);color:var(--fb-ink)!important;font-weight:600;font-size:14px;text-decoration:none!important}
.fb-hubgrid a:hover{border-color:var(--fb-line-3)}
.fb-filter{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.fb-filter input,.fb-filter select{padding:8px 12px;border:1px solid var(--fb-line);border-radius:999px;font:14px var(--fb-font);background:var(--fb-card);color:var(--fb-ink);min-width:0}
.fb-filter input{flex:1 1 220px}
@media (prefers-reduced-motion:reduce){.fb-dot,.fb-game__score.fb-flash{animation:none}}

/* the hidden attribute must win over display:flex/grid on filtered rows */
.fb-main [hidden]{display:none!important}

/* dark logos (Panthers, Falcons, Raiders...) need a light chip on the dark ticker */
.fb-game--ticker .fb-logo{background:#fff;border-radius:4px;padding:1px;box-sizing:border-box}
.fb-game--ticker .fb-game__status{flex-wrap:nowrap;white-space:nowrap;overflow:hidden}

/* Play hub tiles */
a.fb-tile{display:block;text-decoration:none!important;color:var(--fb-ink)!important;margin:0}a.fb-tile:hover{border-color:var(--fb-line-3)}
.fb-tile b{display:block;font-size:17px;margin-bottom:4px}.fb-tile span{font-size:14px;color:var(--fb-muted)}

/* ---------- 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.fb-main{width:100%;box-sizing:border-box;color:var(--fb-ink)}
/* blocks the kit places inside the home feed's column */
.fb-homeblock{margin:12px 0 16px;font-family:var(--fb-font)}
.fb-homeblock .fb-ticker{border-radius:var(--fb-radius);overflow:hidden;margin:0 0 12px}
.fb-homeblock .fb-ticker__tabs,.fb-homeblock .fb-ticker__strip{max-width:none}
.fb-homeblock .fb-card{color:var(--fb-ink)}
.fb-glance .fb-rail{column-width:270px;column-gap:14px}
.fb-glance .fb-rail .fb-card{margin:0 0 14px;break-inside:avoid}
.fb-home__blog{margin:0 0 16px}
.fb-home__blog a{color:var(--fb-link)}
.fb-main .fb-h1,.fb-main .fb-h2{color:var(--fb-ink)}

/* ---------- dark mode ---------- */
/* The chrome (ticker, team 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"]{
  --fb-ink:var(--fs-ink,#c6d0dc); --fb-muted:var(--fs-ink-3,#8fa2b8); --fb-line:var(--fs-line-3,#2a3542); --fb-bg:var(--fs-page-bg,#10151c);
  --fb-card:var(--fs-surface,#161d26); --fb-link:var(--fs-link,#79b8ff); --fb-accent-ink:#3fe0c0;
  --fb-inset:var(--fs-surface-2,#1d2631); --fb-hover:var(--fs-surface-3,#232e3c); --fb-chip:#243040; --fb-chip-ink:#c6d0dc; --fb-text-2:var(--fs-ink-2,#b4bfcd);
  --fb-line-2:var(--fs-line-2,#2f3c4c); --fb-line-3:#3a4a5e; --fb-quote:#14262a; --fb-warn-bg:#3a2e12; --fb-warn:#f2c46b; --fb-warn-line:#5a4720;
  --fb-win-ink:#4ade80; --fb-loss-ink:#ff8a80; --fb-out-bg:#3a1c1a; --fb-q-bg:#3a2e12; --fb-ok-bg:#12301f;
  --fb-win:#e6edf5; --fb-shadow:0 1px 2px rgba(0,0,0,.4),0 6px 20px rgba(0,0,0,.28);
}
html[data-fs-theme="dark"] .fb-subnav a:hover{color:#fff}
html[data-fs-theme="dark"] .fb-chips a.is-active,html[data-fs-theme="dark"] .fb-chip.is-active{background:var(--fb-accent);color:#04241d!important;border-color:var(--fb-accent)}
html[data-fs-theme="dark"] .fb-btn--primary{background:#2f6fd6;border-color:#2f6fd6;color:#fff!important}
html[data-fs-theme="dark"] .fb-game__score.fb-flash{color:#04241d}
html[data-fs-theme="dark"] .fb-article h2,html[data-fs-theme="dark"] .fb-article h3{color:var(--fs-heading,#dde5ef)}
html[data-fs-theme="dark"] .fb-post-card h3 a{color:var(--fb-ink)!important}
