/*
 * STC Blocks — front-end + editor styles.
 *
 * Everything below the "lifted from" markers is the static site's own CSS,
 * rule for rule, with class names namespaced per source page:
 *   stc-   index.html        stca-  article pages (NBA / QB data deep-dives)
 *   stcm-  MLB predictions   stcab- about.html
 *   stcl-  listen.html       stcan- analysis.html      stcd- draft-board.html
 * That keeps every block pixel-identical to the page it came from, and means
 * a pasted HTML article (which brings its own un-prefixed CSS) can never
 * collide with a block.
 */
:root {
  --stc-blue: #0B3FC4;
  --stc-blue-deep: #072680;
  --stc-blue-ink: #050F2E;
  --stc-cyan: #00E5FF;
  --stc-magenta: #FF1A8C;
  --stc-bone: #F4F3EE;
  --stc-white: #FFFFFF;
  --stc-grid: rgba(11, 63, 196, 0.08);
  --font-display: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --font-body: 'Archivo', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --edge: clamp(20px, 4vw, 64px);
  --content-max: 860px;
}

/* The static pages all start from "* { margin: 0; padding: 0 }". Blocks get
   the same clean slate, at zero specificity so nothing else is disturbed. */
:where(.stc-block, .stc-block *) { margin: 0; padding: 0; box-sizing: border-box; }
:where(.stc-block)::before, :where(.stc-block)::after,
:where(.stc-block) *::before, :where(.stc-block) *::after { box-sizing: border-box; }
:where(.stc-block) { font-family: var(--font-body); line-height: 1.55; -webkit-font-smoothing: antialiased; }
:where(.stc-block) :where(a) { color: inherit; }
.stc-block a { text-decoration: none; }
:where(.stc-block) :where(img) { max-width: 100%; display: block; }
:where(.stc-block) :where(button) { font-family: inherit; cursor: pointer; border: none; background: none; }
:where(.stc-block) :where(ul, ol) { list-style-position: outside; }

@keyframes stc-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(1.3); } }
@keyframes stc-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---- from index.html (stc-) ---- */
.stc-chroma { position: relative; display: inline-block; color: var(--stc-blue); }
.stc-chroma::before, .stc-chroma::after { content: attr(data-text); position: absolute; top: 0; left: 0; width: 100%; pointer-events: none; }
.stc-chroma::before { color: var(--stc-cyan); transform: translate(-3px, 0); mix-blend-mode: multiply; z-index: -1; }
.stc-chroma::after { color: var(--stc-magenta); transform: translate(3px, 0); mix-blend-mode: multiply; z-index: -1; }
.stc-hero { min-height: 100vh; padding: 140px var(--edge) 80px; position: relative; display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; align-items: center; background: linear-gradient(180deg, var(--stc-bone) 0%, var(--stc-bone) 100%); overflow: hidden; }
.stc-hero::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(var(--stc-grid) 1px, transparent 1px), linear-gradient(90deg, var(--stc-grid) 1px, transparent 1px); background-size: 60px 60px; mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%); -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%); pointer-events: none; }
.stc-hero-content { position: relative; z-index: 2; }
.stc-hero-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue); margin-bottom: 24px; padding: 6px 12px; background: var(--stc-white); border: 2px solid var(--stc-blue); }
.stc-hero-eyebrow .stc-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--stc-magenta); animation: stc-pulse 1.4s ease-in-out infinite; }
.stc-hero h1 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(56px, 9vw, 140px); line-height: 0.88; letter-spacing: -0.02em; text-transform: uppercase; color: var(--stc-blue); margin-bottom: 32px; }
.stc-hero h1 .stc-line { display: block; }
.stc-hero h1 .stc-line-alt { color: var(--stc-blue-ink); -webkit-text-stroke: 2px var(--stc-blue); color: transparent; }
.stc-hero-lede { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.5; max-width: 520px; margin-bottom: 40px; color: var(--stc-blue-ink); }
.stc-hero-cta-row { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.stc-btn-primary { font-family: var(--font-display); font-weight: 800; font-size: 17px; text-transform: uppercase; letter-spacing: 0.08em; padding: 16px 28px; background: var(--stc-blue); color: var(--stc-white); display: inline-flex; align-items: center; gap: 10px; transition: transform 0.15s, box-shadow 0.15s; border: 2px solid var(--stc-blue); }
.stc-btn-primary:hover { transform: translate(-3px, -3px); box-shadow: 6px 6px 0 var(--stc-magenta), 6px 6px 0 2px var(--stc-blue); }
.stc-btn-ghost { font-family: var(--font-display); font-weight: 800; font-size: 17px; text-transform: uppercase; letter-spacing: 0.08em; padding: 16px 28px; background: transparent; color: var(--stc-blue); border: 2px solid var(--stc-blue); transition: background 0.15s, color 0.15s; }
.stc-btn-ghost:hover { background: var(--stc-blue); color: var(--stc-white); }
.stc-hero-art-wrapper { position: relative; z-index: 1; }
.stc-hero-art { position: relative; aspect-ratio: 1 / 1.05; background: var(--stc-blue); padding: 0; display: grid; grid-template-rows: 1fr 1fr; overflow: hidden; box-shadow: -12px 12px 0 var(--stc-magenta), 12px -12px 0 var(--stc-cyan); }
.stc-hero-art-tracker-label { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.25em; color: var(--stc-magenta); margin-bottom: 10px; }
.stc-hero-art-tracker-label::before { content: '// '; opacity: 0.6; }
.stc-hero-art-top, .stc-hero-art-bot { padding: 28px 32px; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; }
.stc-hero-art-top { background: var(--stc-blue); color: var(--stc-white); }
.stc-hero-art-bot { background: var(--stc-white); color: var(--stc-blue); }
.stc-hero-art-label { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; opacity: 0.75; }
.stc-hero-art-team { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(48px, 6vw, 90px); line-height: 0.9; text-transform: uppercase; letter-spacing: -0.02em; }
.stc-hero-art-score { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(60px, 8vw, 110px); line-height: 1; align-self: flex-end; letter-spacing: -0.03em; }
.stc-hero-art-divider { position: absolute; top: 50%; left: 0; right: 0; height: 3px; background: var(--stc-magenta); transform: translateY(-50%); z-index: 2; }
.stc-hero-art-divider::before { content: 'VS'; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: var(--stc-bone); padding: 4px 14px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 14px; letter-spacing: 0.15em; color: var(--stc-blue-ink); border: 2px solid var(--stc-blue-ink); }
.stc-ticker { background: var(--stc-blue-ink); color: var(--stc-white); padding: 14px 0; overflow: hidden; white-space: nowrap; border-top: 3px solid var(--stc-magenta); border-bottom: 3px solid var(--stc-cyan); }
.stc-ticker-track { display: inline-flex; animation: stc-scroll 40s linear infinite; font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 18px; text-transform: uppercase; letter-spacing: 0.05em; }
.stc-ticker-item { padding: 0 24px; display: inline-flex; align-items: center; gap: 12px; }
.stc-ticker-item::after { content: '★'; color: var(--stc-magenta); margin-left: 24px; }
@media (max-width: 900px) {
  .stc-hero { grid-template-columns: 1fr; padding-top: 110px; }
  .stc-hero-art { max-width: 480px; margin: 0 auto; width: 100%; }
}
.stc-about { padding: 120px var(--edge); background: var(--stc-bone); color: var(--stc-blue-ink); position: relative; }
.stc-about .stc-section-label { color: var(--stc-magenta); }
.stc-about .stc-section-title { color: var(--stc-blue); }
.stc-about .stc-section-header { margin-bottom: 0; }
.stc-section-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 60px; flex-wrap: wrap; gap: 20px; }
.stc-section-label { font-family: var(--font-mono); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-magenta); }
.stc-section-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(44px, 6vw, 84px); line-height: 0.9; text-transform: uppercase; color: var(--stc-blue); letter-spacing: -0.02em; margin-top: 8px; }
.stc-about-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto 1fr; gap: 40px 60px; align-items: start; position: relative; z-index: 1; }
.stc-about-grid .stc-section-header { grid-column: 1; grid-row: 1; margin-bottom: 0; }
.stc-about-grid .stc-about-text { grid-column: 1; grid-row: 2; align-self: start; }
.stc-about-grid .stc-hosts { grid-column: 2; grid-row: 1 / span 2; align-self: start; }
.stc-about-text p { font-size: 18px; line-height: 1.65; margin-bottom: 20px; color: var(--stc-blue-ink); }
.stc-about-text p:first-of-type::first-letter { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 84px; line-height: 0.85; float: left; padding: 4px 12px 0 0; color: var(--stc-magenta); }
.stc-hosts { display: grid; gap: 20px; align-content: start; position: relative; z-index: 1; }
.stc-host-card { background: var(--stc-white); padding: 28px; border-left: 6px solid var(--stc-blue); position: relative; transition: transform 0.2s; }
.stc-host-card:hover { transform: translateX(6px); }
.stc-host-card.stc-hudson { border-left-color: var(--stc-magenta); }
.stc-host-role { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-blue); margin-bottom: 6px; }
.stc-host-card.stc-hudson .stc-host-role { color: var(--stc-magenta); }
.stc-host-name { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 42px; text-transform: uppercase; color: var(--stc-blue-ink); line-height: 1; margin-bottom: 12px; }
.stc-host-bio { font-size: 15px; line-height: 1.55; color: var(--stc-blue-ink); }
@media (max-width: 900px) {
  .stc-about-grid { grid-template-columns: 1fr; gap: 40px; }
}
.stc-episodes { padding: 120px var(--edge); background: var(--stc-blue-ink); color: var(--stc-white); position: relative; overflow: hidden; }
.stc-episodes::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px); background-size: 60px 60px; pointer-events: none; }
.stc-episodes .stc-section-title { color: var(--stc-white); }
.stc-episodes .stc-section-label { color: var(--stc-cyan); }
.stc-episodes-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; position: relative; z-index: 1; }
.stc-episode-card { background: var(--stc-white); color: var(--stc-blue-ink); padding: 28px; display: flex; flex-direction: column; gap: 16px; transition: transform 0.25s; cursor: pointer; position: relative; }
.stc-episode-card:hover { transform: translate(-4px, -4px); box-shadow: 8px 8px 0 var(--stc-magenta); }
.stc-episode-meta { display: flex; justify-content: space-between; align-items: center; font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue); }
.stc-episode-number { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 12px; background: var(--stc-blue); color: var(--stc-white); padding: 4px 10px; letter-spacing: 0.1em; }
.stc-episode-tag { padding: 4px 10px; background: var(--stc-bone); color: var(--stc-blue-ink); }
.stc-episode-tag.stc-nfl { background: #E8F0FF; color: var(--stc-blue); }
.stc-episode-tag.stc-nba { background: #FFE4F1; color: var(--stc-magenta); }
.stc-episode-tag.stc-ncaa { background: #DDF9FF; color: #006D85; }
.stc-episode-title { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 28px; line-height: 1; text-transform: uppercase; color: var(--stc-blue-ink); letter-spacing: -0.01em; }
.stc-episode-desc { font-size: 14px; line-height: 1.5; color: #3a3a5a; flex-grow: 1; }
.stc-episode-play { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 800; font-size: 14px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--stc-blue); margin-top: 4px; }
.stc-episode-play-icon { width: 28px; height: 28px; background: var(--stc-blue); color: var(--stc-white); border-radius: 50%; display: grid; place-items: center; font-size: 11px; padding-left: 2px; }
.stc-episodes-footer { margin-top: 50px; text-align: center; position: relative; z-index: 1; }
@media (max-width: 900px) {
  .stc-episodes-grid { grid-template-columns: 1fr; }
}
.stc-tracker { padding: 120px var(--edge); background: var(--stc-bone); position: relative; }
.stc-tracker-header { max-width: 800px; margin-bottom: 60px; }
.stc-tracker-intro { font-size: 18px; line-height: 1.6; margin-top: 20px; max-width: 640px; }
.stc-tracker-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; background: var(--stc-blue); margin-bottom: 60px; border: 2px solid var(--stc-blue); }
.stc-stat { background: var(--stc-white); padding: 32px 24px; text-align: left; }
.stc-stat-value { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(44px, 5vw, 72px); line-height: 0.9; color: var(--stc-blue); letter-spacing: -0.02em; }
.stc-stat-value.stc-hit { color: var(--stc-blue); }
.stc-stat-value.stc-miss { color: var(--stc-magenta); }
.stc-stat-label { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue-ink); margin-top: 8px; }
.stc-predictions-list { display: grid; gap: 0; border-top: 2px solid var(--stc-blue-ink); }
.stc-pred-row { display: grid; grid-template-columns: 80px 1fr 120px 100px; gap: 20px; padding: 22px 8px; border-bottom: 1px solid rgba(5, 15, 46, 0.15); align-items: center; transition: background 0.2s; }
.stc-pred-row:hover { background: var(--stc-white); }
.stc-pred-date { font-family: var(--font-mono); font-size: 12px; font-weight: 700; color: var(--stc-blue); letter-spacing: 0.05em; }
.stc-pred-text { font-family: var(--font-display); font-weight: 700; font-style: italic; font-size: 20px; text-transform: uppercase; line-height: 1.1; color: var(--stc-blue-ink); }
.stc-pred-category { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue); }
.stc-pred-result { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 16px; text-transform: uppercase; padding: 8px 14px; text-align: center; letter-spacing: 0.05em; }
.stc-pred-result.stc-hit { background: var(--stc-blue); color: var(--stc-white); }
.stc-pred-result.stc-miss { background: var(--stc-magenta); color: var(--stc-white); }
.stc-pred-result.stc-pending { background: transparent; color: var(--stc-blue-ink); border: 2px solid var(--stc-blue-ink); }
@media (max-width: 900px) {
  .stc-tracker-stats { grid-template-columns: repeat(2, 1fr); }
  .stc-pred-row { grid-template-columns: 1fr; gap: 8px; padding: 18px 8px; }
  .stc-pred-result { justify-self: start; }
}
.stc-listen { padding: 120px var(--edge); background: var(--stc-blue); color: var(--stc-white); position: relative; overflow: hidden; }
.stc-listen::before { content: attr(data-bg); position: absolute; bottom: -40px; right: -20px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(200px, 30vw, 500px); line-height: 0.8; color: rgba(255,255,255,0.06); pointer-events: none; letter-spacing: -0.04em; }
.stc-listen-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: center; }
.stc-listen h2 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(48px, 6vw, 88px); line-height: 0.9; text-transform: uppercase; letter-spacing: -0.02em; }
.stc-listen h2 em { font-style: italic; color: var(--stc-cyan); }
.stc-listen p { font-size: 17px; line-height: 1.6; margin-top: 20px; max-width: 440px; opacity: 0.9; }
.stc-platforms { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.stc-platform { background: var(--stc-white); color: var(--stc-blue-ink); padding: 22px 24px; display: flex; align-items: center; gap: 16px; transition: transform 0.2s; font-family: var(--font-display); font-weight: 800; font-size: 20px; font-style: italic; text-transform: uppercase; letter-spacing: 0.01em; }
.stc-platform:hover { transform: translate(-4px, -4px); box-shadow: 6px 6px 0 var(--stc-magenta); }
.stc-platform-icon { width: 36px; height: 36px; background: var(--stc-blue); display: grid; place-items: center; color: var(--stc-white); font-size: 18px; flex-shrink: 0; }
@media (max-width: 900px) {
  .stc-listen-inner { grid-template-columns: 1fr; gap: 40px; }
  .stc-platforms { grid-template-columns: 1fr; }
}
.stc-analysis { padding: 120px var(--edge); background: var(--stc-blue-ink); color: var(--stc-white); position: relative; overflow: hidden; }
.stc-analysis::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px); background-size: 60px 60px; pointer-events: none; }
.stc-analysis .stc-section-label { color: var(--stc-cyan); }
.stc-analysis .stc-section-title { color: var(--stc-white); }
.stc-analysis .stc-section-see-all { color: var(--stc-cyan); border-bottom-color: var(--stc-cyan); }
.stc-analysis .stc-section-see-all:hover { color: var(--stc-magenta); }
.stc-analysis-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 24px; align-items: stretch; }
.stc-analysis-card { background: var(--stc-bone); padding: 32px; display: flex; flex-direction: column; gap: 16px; position: relative; transition: transform 0.25s, box-shadow 0.25s; color: var(--stc-blue-ink); overflow: hidden; min-height: 280px; }
.stc-analysis-card:hover { transform: translate(-4px, -4px); box-shadow: 8px 8px 0 var(--stc-magenta); }
.stc-analysis-card.stc-featured { background: var(--stc-blue); color: var(--stc-white); grid-row: span 2; }
.stc-analysis-card.stc-featured:hover { box-shadow: 8px 8px 0 var(--stc-cyan); }
.stc-analysis-card.stc-placeholder { opacity: 0.85; }
.stc-analysis-card.stc-placeholder:hover { opacity: 1; }
.stc-section-see-all { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 16px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--stc-blue); display: inline-flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 2px solid var(--stc-blue); transition: gap 0.2s, color 0.2s; }
.stc-section-see-all:hover { gap: 14px; color: var(--stc-magenta); border-bottom-color: var(--stc-magenta); }
.stc-section-see-all-arrow { transition: transform 0.2s; }
.stc-analysis-card-meta { display: flex; justify-content: space-between; align-items: center; font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; }
.stc-analysis-tag { padding: 5px 10px; background: var(--stc-white); color: var(--stc-blue); letter-spacing: 0.12em; }
.stc-analysis-card.stc-featured .stc-analysis-tag { background: var(--stc-cyan); color: var(--stc-blue-ink); }
.stc-analysis-tag.stc-nba { background: #FFE4F1; color: var(--stc-magenta); }
.stc-analysis-tag.stc-mlb { background: #DDF9FF; color: #006D85; }
.stc-analysis-tag.stc-soccer { background: #E8FFE8; color: #1A7A1A; }
.stc-analysis-tag.stc-nfl { background: #E8F0FF; color: var(--stc-blue); }
.stc-analysis-card.stc-featured .stc-analysis-tag.stc-nfl { background: var(--stc-cyan); color: var(--stc-blue-ink); }
.stc-analysis-status { color: var(--stc-magenta); font-weight: 700; }
.stc-analysis-card.stc-featured .stc-analysis-status { color: var(--stc-cyan); }
.stc-analysis-card-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(32px, 3.2vw, 48px); line-height: 0.95; text-transform: uppercase; letter-spacing: -0.01em; margin-top: 8px; }
.stc-analysis-card.stc-placeholder .stc-analysis-card-title { font-size: clamp(28px, 2.4vw, 36px); }
.stc-analysis-card-desc { font-size: 15px; line-height: 1.55; flex-grow: 1; opacity: 0.9; }
.stc-analysis-card.stc-featured .stc-analysis-card-desc { font-size: 17px; opacity: 0.92; }
.stc-analysis-card-link { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 16px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--stc-cyan); margin-top: 8px; }
.stc-analysis-card-arrow { transition: transform 0.25s; display: inline-block; }
.stc-analysis-card.stc-featured:hover .stc-analysis-card-arrow { transform: translateX(6px); }
@media (max-width: 900px) {
  .stc-analysis-grid { grid-template-columns: 1fr; }
  .stc-analysis-card.stc-featured { grid-row: auto; }
}
.stc-section-divider { background: var(--stc-bone); display: flex; align-items: center; gap: 20px; padding: 0 var(--edge); }
.stc-section-divider-line { flex: 1; height: 1px; background: rgba(11, 63, 196, 0.15); }
.stc-section-divider-mark { font-size: 12px; color: rgba(11, 63, 196, 0.25); line-height: 1; }
.stc-newsletter { padding: 120px var(--edge); background: var(--stc-bone); }
.stc-newsletter-inner { max-width: 860px; margin: 0 auto; text-align: center; }
.stc-newsletter h2 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(48px, 7vw, 96px); line-height: 0.88; text-transform: uppercase; color: var(--stc-blue); letter-spacing: -0.02em; margin-bottom: 24px; }
.stc-newsletter p { font-size: 18px; max-width: 560px; margin: 0 auto 40px; line-height: 1.6; }
.stc-newsletter-form { display: flex; gap: 0; max-width: 560px; margin: 0 auto; border: 2px solid var(--stc-blue); background: var(--stc-white); }
.stc-newsletter-form input { flex: 1; padding: 18px 20px; border: none; font-family: var(--font-body); font-size: 16px; background: transparent; color: var(--stc-blue-ink); }
.stc-newsletter-form input:focus { outline: none; }
.stc-newsletter-form input::placeholder { color: #888; }
.stc-newsletter-form button { padding: 0 28px; background: var(--stc-blue); color: var(--stc-white); font-family: var(--font-display); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 18px; letter-spacing: 0.08em; transition: background 0.2s; }
.stc-newsletter-form button:hover { background: var(--stc-magenta); }
.stc-newsletter-fine { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.15em; margin-top: 20px !important; color: #666; }
@media (max-width: 600px) {
  .stc-newsletter-form { flex-direction: column; }
  .stc-newsletter-form button { padding: 16px; }
}
.stc-datalab { padding: 80px var(--edge); background: var(--stc-blue-ink); color: var(--stc-white); position: relative; overflow: hidden; }
.stc-datalab::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px); background-size: 60px 60px; pointer-events: none; }
.stc-datalab::after { content: attr(data-bg); position: absolute; right: -20px; bottom: -40px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(160px, 22vw, 340px); line-height: 0.8; color: rgba(255,255,255,0.04); pointer-events: none; letter-spacing: -0.04em; text-transform: uppercase; }
.stc-datalab-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto; gap: 60px; align-items: center; }
.stc-datalab-label { font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-cyan); margin-bottom: 12px; }
.stc-datalab h2 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(40px, 5vw, 72px); line-height: 0.9; text-transform: uppercase; letter-spacing: -0.02em; color: var(--stc-white); margin-bottom: 16px; }
.stc-datalab h2 em { color: var(--stc-cyan); font-style: italic; }
.stc-datalab-lede { font-size: 16px; line-height: 1.6; opacity: 0.8; max-width: 560px; }
.stc-btn-datalab { font-family: var(--font-display); font-weight: 800; font-size: 17px; text-transform: uppercase; letter-spacing: 0.08em; padding: 18px 32px; background: var(--stc-cyan); color: var(--stc-blue-ink); display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; transition: transform 0.15s, box-shadow 0.15s; border: 2px solid var(--stc-cyan); flex-shrink: 0; }
.stc-btn-datalab:hover { transform: translate(-3px, -3px); box-shadow: 6px 6px 0 var(--stc-magenta); }
@media (max-width: 860px) {
  .stc-datalab-inner { grid-template-columns: 1fr; gap: 32px; }
}

/* ---- from nba-scoring-revolution.html (stca-) ---- */
.stca-page-hero { padding: 140px var(--edge) 72px; position: relative; overflow: hidden; background: var(--stc-bone); }
.stca-page-hero::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(var(--stc-grid) 1px, transparent 1px), linear-gradient(90deg, var(--stc-grid) 1px, transparent 1px); background-size: 60px 60px; mask-image: radial-gradient(ellipse at 30% 50%, black 30%, transparent 75%); -webkit-mask-image: radial-gradient(ellipse at 30% 50%, black 30%, transparent 75%); pointer-events: none; }
.stca-page-hero::after { content: attr(data-bg); position: absolute; right: -20px; top: 40px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(160px, 22vw, 340px); line-height: 0.85; color: rgba(11, 63, 196, 0.06); pointer-events: none; letter-spacing: -0.04em; text-transform: uppercase; }
.stca-page-hero-inner { position: relative; z-index: 2; max-width: 820px; }
.stca-breadcrumb { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.18em; color: var(--stc-blue); margin-bottom: 24px; opacity: 0.7; }
.stca-breadcrumb a { opacity: 1; transition: color 0.2s; }
.stca-breadcrumb a:hover { color: var(--stc-magenta); }
.stca-breadcrumb-sep { color: var(--stc-magenta); }
.stca-hero-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue); margin-bottom: 24px; padding: 6px 12px; background: var(--stc-white); border: 2px solid var(--stc-blue); }
.stca-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--stc-magenta); animation: stc-pulse 1.4s ease-in-out infinite; }
.stca-page-hero h1 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(52px, 8vw, 120px); line-height: 0.88; letter-spacing: -0.02em; text-transform: uppercase; color: var(--stc-blue); margin-bottom: 28px; }
.stca-page-hero h1 .stca-outline { -webkit-text-stroke: 2px var(--stc-blue); color: transparent; }
.stca-page-hero h1 .stca-mag { color: var(--stc-magenta); -webkit-text-stroke: 0; }
.stca-hero-lede { font-size: clamp(16px, 1.3vw, 19px); line-height: 1.55; max-width: 580px; color: var(--stc-blue-ink); margin-bottom: 36px; }
.stca-hero-meta-row { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.stca-hero-meta-pill { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; padding: 6px 14px; border: 2px solid rgba(11,63,196,0.25); color: var(--stc-blue-ink); opacity: 0.7; }
.stca-ticker { background: var(--stc-blue-ink); color: var(--stc-white); padding: 14px 0; overflow: hidden; white-space: nowrap; border-top: 3px solid var(--stc-magenta); border-bottom: 3px solid var(--stc-cyan); }
.stca-ticker-track { display: inline-flex; animation: stc-scroll 38s linear infinite; font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 17px; text-transform: uppercase; letter-spacing: 0.05em; }
.stca-ticker-item { padding: 0 24px; display: inline-flex; align-items: center; gap: 12px; }
.stca-ticker-item::after { content: '★'; color: var(--stc-magenta); margin-left: 24px; }
.stca-section { padding: 80px var(--edge); }
.stca-section.stca-dark { background: var(--stc-blue-ink); color: var(--stc-white); }
.stca-section.stca-white { background: var(--stc-white); }
.stca-section.stca-bone { background: var(--stc-bone); }
.stca-section-label { font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-magenta); margin-bottom: 8px; }
.stca-section.stca-dark .stca-section-label { color: var(--stc-cyan); }
.stca-section-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(36px, 5vw, 64px); line-height: 0.9; text-transform: uppercase; color: var(--stc-blue); letter-spacing: -0.02em; margin-bottom: 40px; }
.stca-section.stca-dark .stca-section-title { color: var(--stc-white); }
.stca-stats-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; background: var(--stc-blue); border: 2px solid var(--stc-blue); margin-bottom: 60px; }
.stca-stat-box { background: var(--stc-white); padding: 28px 22px; transition: background 0.2s; }
.stca-stat-box:hover { background: var(--stc-bone); }
.stca-stat-val { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(36px, 4vw, 60px); line-height: 1; letter-spacing: -0.02em; color: var(--stc-blue); }
.stca-stat-val.stca-mag { color: var(--stc-magenta); }
.stca-stat-val.stca-teal { color: #007899; }
.stca-stat-lbl { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.18em; color: var(--stc-blue-ink); margin-top: 8px; opacity: 0.65; }
.stca-chart-panel { background: var(--stc-white); border: 2px solid var(--stc-blue); padding: 36px; margin-bottom: 32px; position: relative; transition: box-shadow 0.2s, transform 0.2s; }
.stca-chart-panel:hover { box-shadow: 8px 8px 0 var(--stc-magenta); transform: translate(-2px, -2px); }
.stca-chart-panel.stca-dark-panel { background: var(--stc-blue-ink); border-color: var(--stc-blue-ink); color: var(--stc-white); }
.stca-chart-panel.stca-dark-panel:hover { box-shadow: 8px 8px 0 var(--stc-cyan); }
.stca-chart-panel-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 28px; gap: 20px; flex-wrap: wrap; }
.stca-chart-eyebrow { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.18em; color: var(--stc-magenta); margin-bottom: 6px; }
.stca-chart-panel.stca-dark-panel .stca-chart-eyebrow { color: var(--stc-cyan); }
.stca-chart-panel-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 28px; text-transform: uppercase; color: var(--stc-blue-ink); line-height: 1; }
.stca-chart-panel.stca-dark-panel .stca-chart-panel-title { color: var(--stc-white); }
.stca-chart-meta { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; color: var(--stc-blue-ink); opacity: 0.5; text-align: right; white-space: nowrap; }
.stca-chart-wrap { position: relative; height: 380px; }
.stca-chart-source { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue-ink); opacity: 0.4; text-align: right; margin-top: 16px; }
.stca-chart-panel.stca-dark-panel .stca-chart-source { color: var(--stc-white); opacity: 0.3; }
.stca-tab-row { display: flex; gap: 0; border: 2px solid var(--stc-blue); background: var(--stc-blue); flex-wrap: wrap; margin-bottom: 32px; }
.stca-tab { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 16px; text-transform: uppercase; letter-spacing: 0.06em; padding: 13px 20px; background: var(--stc-white); color: var(--stc-blue); cursor: pointer; border: none; transition: background 0.15s, color 0.15s; flex: 1; min-width: 80px; }
.stca-tab:hover { background: var(--stc-bone); }
.stca-tab.active { background: var(--stc-blue); color: var(--stc-white); }
.stca-tab.stca-era-modern.active { background: var(--stc-magenta); }
.stca-insight-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 48px; }
.stca-insight-card { background: var(--stc-blue); color: var(--stc-white); padding: 28px 24px; position: relative; overflow: hidden; }
.stca-insight-card::before { content: ''; position: absolute; bottom: -30px; right: -30px; width: 100px; height: 100px; border-radius: 50%; background: rgba(255,255,255,0.06); }
.stca-insight-card.stca-mag { background: var(--stc-magenta); }
.stca-insight-card.stca-ink { background: var(--stc-blue-ink); }
.stca-insight-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.18em; opacity: 0.7; margin-bottom: 10px; }
.stca-insight-body { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 21px; text-transform: uppercase; line-height: 1.1; }
.stca-kobe-block { background: var(--stc-blue-ink); color: var(--stc-white); padding: 56px var(--edge); position: relative; overflow: hidden; }
.stca-kobe-block::before { content: attr(data-bg); position: absolute; right: -20px; top: -20px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(140px, 20vw, 280px); line-height: 0.85; color: rgba(255, 26, 140, 0.1); pointer-events: none; letter-spacing: -0.04em; }
.stca-kobe-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1.4fr; gap: 60px; align-items: start; max-width: 1100px; }
.stca-kobe-label { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-magenta); margin-bottom: 16px; }
.stca-kobe-headline { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(44px, 6vw, 88px); line-height: 0.88; text-transform: uppercase; color: var(--stc-white); letter-spacing: -0.02em; margin-bottom: 24px; }
.stca-kobe-headline em { color: var(--stc-magenta); font-style: italic; }
.stca-kobe-stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; background: rgba(255,255,255,0.15); border: 2px solid rgba(255,255,255,0.2); margin-top: 32px; }
.stca-kobe-stat { background: var(--stc-blue-ink); padding: 20px 18px; }
.stca-kobe-stat-val { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(28px, 3vw, 44px); line-height: 1; letter-spacing: -0.02em; color: var(--stc-magenta); }
.stca-kobe-stat-lbl { font-family: var(--font-mono); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: rgba(255,255,255,0.5); margin-top: 6px; }
.stca-kobe-body p { font-size: 17px; line-height: 1.65; color: rgba(255,255,255,0.85); margin-bottom: 20px; }
.stca-kobe-body p:first-of-type::first-letter { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 80px; line-height: 0.85; float: left; padding: 4px 12px 0 0; color: var(--stc-magenta); }
.stca-kobe-verdict { display: flex; align-items: flex-start; gap: 16px; background: rgba(255, 26, 140, 0.12); border-left: 4px solid var(--stc-magenta); padding: 20px 24px; margin-top: 8px; }
.stca-kobe-verdict-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-magenta); white-space: nowrap; padding-top: 2px; }
.stca-kobe-verdict-text { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 20px; text-transform: uppercase; color: var(--stc-white); line-height: 1.1; }
.stca-era-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 48px; }
.stca-era-card { background: var(--stc-bone); border-top: 6px solid var(--stc-blue); padding: 28px 24px; transition: transform 0.2s; }
.stca-era-card:hover { transform: translateY(-4px); }
.stca-era-card.stca-era-dead { border-top-color: var(--stc-blue-deep); }
.stca-era-card.stca-era-modern { border-top-color: var(--stc-magenta); }
.stca-era-name { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 32px; text-transform: uppercase; color: var(--stc-blue-ink); line-height: 1; margin-bottom: 6px; }
.stca-era-years { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-magenta); margin-bottom: 16px; }
.stca-era-card.stca-era-dead .stca-era-years { color: var(--stc-blue); }
.stca-era-pts { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 52px; line-height: 1; letter-spacing: -0.02em; color: var(--stc-blue); margin-bottom: 4px; }
.stca-era-card.stca-era-modern .stca-era-pts { color: var(--stc-magenta); }
.stca-era-pts-lbl { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue-ink); opacity: 0.5; margin-bottom: 16px; }
.stca-era-desc { font-size: 14px; line-height: 1.55; color: var(--stc-blue-ink); opacity: 0.8; }
.stca-prose-section { padding: 80px var(--edge); background: var(--stc-white); }
.stca-prose-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start; max-width: 1100px; }
.stca-prose-body p { font-size: 17px; line-height: 1.7; margin-bottom: 20px; color: var(--stc-blue-ink); }
.stca-prose-body p:first-of-type::first-letter { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 80px; line-height: 0.85; float: left; padding: 4px 12px 0 0; color: var(--stc-blue); }
.stca-pull-quote { border-left: 6px solid var(--stc-magenta); padding: 24px 28px; margin: 32px 0; background: var(--stc-bone); }
.stca-pull-quote-text { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: clamp(22px, 2.5vw, 30px); text-transform: uppercase; color: var(--stc-blue-ink); line-height: 1.1; }
.stca-pull-quote-attr { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-magenta); margin-top: 10px; }
.stca-sidebar-facts { display: grid; gap: 16px; }
.stca-fact-card { background: var(--stc-bone); border-left: 4px solid var(--stc-blue); padding: 20px 20px; }
.stca-fact-card.stca-hot { border-left-color: var(--stc-magenta); }
.stca-fact-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.18em; color: var(--stc-blue); margin-bottom: 8px; }
.stca-fact-card.stca-hot .stca-fact-label { color: var(--stc-magenta); }
.stca-fact-text { font-family: var(--font-display); font-weight: 700; font-style: italic; font-size: 18px; text-transform: uppercase; color: var(--stc-blue-ink); line-height: 1.15; }
.stca-method-note { padding: 48px var(--edge); background: var(--stc-blue-ink); color: var(--stc-white); }
.stca-method-inner { max-width: 860px; display: grid; grid-template-columns: 200px 1fr; gap: 40px; align-items: start; }
.stca-method-heading { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 40px; text-transform: uppercase; color: var(--stc-cyan); line-height: 1; }
.stca-method-text { font-size: 14px; line-height: 1.65; opacity: 0.8; }
.stca-method-text p { margin-bottom: 12px; }
.stca-method-text p:last-child { margin-bottom: 0; }
.stca-back-home-section { padding: 80px var(--edge); background: var(--stc-blue); position: relative; overflow: hidden; text-align: center; }
.stca-back-home-section::before { content: attr(data-bg); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(180px, 28vw, 400px); color: rgba(255,255,255,0.06); letter-spacing: -0.05em; pointer-events: none; }
.stca-back-home-inner { position: relative; z-index: 1; }
.stca-back-home-label { font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-cyan); margin-bottom: 16px; }
.stca-back-home-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(40px, 5vw, 72px); text-transform: uppercase; color: var(--stc-white); line-height: 0.95; letter-spacing: -0.02em; margin-bottom: 32px; }
.stca-back-home-title em { color: var(--stc-cyan); font-style: italic; }
.stca-btn-primary { font-family: var(--font-display); font-weight: 800; font-size: 17px; text-transform: uppercase; letter-spacing: 0.08em; padding: 16px 32px; background: var(--stc-white); color: var(--stc-blue); display: inline-flex; align-items: center; gap: 10px; transition: transform 0.15s, box-shadow 0.15s; border: 2px solid var(--stc-white); }
.stca-btn-primary:hover { transform: translate(-3px, -3px); box-shadow: 6px 6px 0 var(--stc-magenta); }
.stca-btn-ghost-white { font-family: var(--font-display); font-weight: 800; font-size: 17px; text-transform: uppercase; letter-spacing: 0.08em; padding: 16px 32px; background: transparent; color: var(--stc-white); border: 2px solid rgba(255,255,255,0.5); display: inline-flex; align-items: center; gap: 10px; transition: border-color 0.15s, background 0.15s; margin-left: 16px; }
.stca-btn-ghost-white:hover { border-color: var(--stc-white); background: rgba(255,255,255,0.1); }
@media (max-width: 900px) {
  .stca-stats-strip { grid-template-columns: repeat(2, 1fr); }
  .stca-insight-strip { grid-template-columns: 1fr; }
  .stca-era-grid { grid-template-columns: 1fr; }
  .stca-kobe-inner { grid-template-columns: 1fr; gap: 36px; }
  .stca-kobe-stat-grid { grid-template-columns: repeat(3, 1fr); }
  .stca-prose-grid { grid-template-columns: 1fr; gap: 40px; }
  .stca-method-inner { grid-template-columns: 1fr; gap: 20px; }
  .stca-chart-wrap { height: 300px; }
  .stca-btn-ghost-white { margin-left: 0; margin-top: 12px; }
}
@media (max-width: 600px) {
  .stca-kobe-stat-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---- from qb-career-data.html (stca-) ---- */
.stca-tab.active.stca-r1 { background: #0B3FC4; }
.stca-tab.active.stca-r2 { background: #1454CA; }
.stca-tab.active.stca-r3 { background: #2070D0; }
.stca-tab.active.stca-r4 { background: #0099BB; }
.stca-tab.active.stca-r5 { background: #007899; }
.stca-tab.active.stca-r6 { background: var(--stc-magenta); }
.stca-tab.active.stca-r7 { background: #CC1070; }
.stca-tab.active.stca-all { background: var(--stc-blue-ink); }
.stca-breakdown-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; margin-bottom: 48px; }
.stca-round-card { background: var(--stc-white); border: 2px solid var(--stc-blue); padding: 20px 10px; text-align: center; cursor: pointer; transition: transform 0.15s, box-shadow 0.15s; }
.stca-round-card:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 var(--stc-magenta); }
.stca-round-card-num { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-magenta); margin-bottom: 6px; }
.stca-round-card-avg { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 36px; line-height: 1; color: var(--stc-blue); letter-spacing: -0.02em; }
.stca-round-card-unit { font-family: var(--font-mono); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; color: var(--stc-blue-ink); opacity: 0.5; margin-top: 4px; }
.stca-round-card-bar { height: 4px; background: var(--stc-bone); margin-top: 12px; }
.stca-round-card-bar-fill { height: 100%; background: var(--stc-blue); transition: width 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
.stca-notable-section { padding: 80px var(--edge); background: var(--stc-white); }
.stca-notable-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.stca-notable-round-block { background: var(--stc-bone); border-left: 6px solid var(--stc-blue); padding: 24px 20px; transition: border-color 0.2s; }
.stca-notable-round-block:hover { border-left-color: var(--stc-magenta); }
.stca-notable-round-label { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 36px; text-transform: uppercase; color: var(--stc-blue); line-height: 1; margin-bottom: 4px; }
.stca-notable-round-stat { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-magenta); margin-bottom: 16px; }
.stca-notable-list { list-style: none; }
.stca-notable-list li { display: flex; justify-content: space-between; align-items: baseline; padding: 8px 0; border-bottom: 1px solid rgba(5,15,46,0.1); font-size: 14px; }
.stca-notable-list li:last-child { border-bottom: none; }
.stca-notable-name { font-family: var(--font-display); font-weight: 700; font-style: italic; font-size: 17px; text-transform: uppercase; color: var(--stc-blue-ink); }
.stca-notable-years { font-family: var(--font-mono); font-size: 12px; font-weight: 700; color: var(--stc-blue); white-space: nowrap; }
.stca-notable-years.stca-outlier { color: var(--stc-magenta); }
@media (max-width: 900px) {
  .stca-stats-strip { grid-template-columns: repeat(2, 1fr); }
  .stca-breakdown-grid { grid-template-columns: repeat(4, 1fr); }
  .stca-insight-strip { grid-template-columns: 1fr; }
  .stca-notable-grid { grid-template-columns: 1fr; }
  .stca-method-inner { grid-template-columns: 1fr; gap: 20px; }
  .stca-chart-wrap { height: 280px; }
  .stca-tab { font-size: 14px; padding: 11px 12px; }
  .stca-btn-ghost-white { margin-left: 0; margin-top: 12px; }
}
@media (max-width: 600px) {
  .stca-breakdown-grid { grid-template-columns: repeat(4, 1fr); }
  .stca-tab { font-size: 12px; padding: 10px 8px; min-width: 44px; }
}

/* ---- from mlb-award-predictions-2026.html (stcm-) ---- */
.stcm-article-hero { padding: 130px var(--edge) 72px; background: var(--stc-blue-ink); color: var(--stc-white); position: relative; overflow: hidden; }
.stcm-article-hero::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px); background-size: 60px 60px; pointer-events: none; }
.stcm-article-hero::after { content: attr(data-bg); position: absolute; right: -20px; bottom: -40px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(160px, 22vw, 360px); line-height: 0.8; color: rgba(255,255,255,0.05); pointer-events: none; letter-spacing: -0.04em; }
.stcm-article-hero-inner { max-width: var(--content-max); margin: 0 auto; position: relative; z-index: 1; }
.stcm-article-tag { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-cyan); margin-bottom: 20px; }
.stcm-article-tag::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--stc-magenta); }
.stcm-article-hero h1 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(40px, 6vw, 80px); line-height: 0.9; text-transform: uppercase; letter-spacing: -0.02em; margin-bottom: 24px; color: var(--stc-white); }
.stcm-article-hero h1 span { color: var(--stc-cyan); }
.stcm-article-byline { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.stcm-byline-author { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 18px; text-transform: uppercase; color: var(--stc-white); }
.stcm-byline-author span { color: var(--stc-magenta); }
.stcm-byline-date { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: rgba(255,255,255,0.5); border-left: 2px solid rgba(255,255,255,0.15); padding-left: 16px; }
.stcm-article-body { max-width: var(--content-max); margin: 0 auto; padding: 72px var(--edge); }
.stcm-award-section { margin-bottom: 80px; padding-bottom: 80px; border-bottom: 2px solid rgba(5,15,46,0.1); }
.stcm-award-section:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.stcm-award-header { margin-bottom: 32px; }
.stcm-award-label { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-magenta); margin-bottom: 8px; }
.stcm-award-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(36px, 5vw, 64px); line-height: 0.9; text-transform: uppercase; color: var(--stc-blue); letter-spacing: -0.02em; }
.stcm-award-pick { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: clamp(20px, 2.5vw, 28px); color: var(--stc-blue-ink); margin-top: 8px; text-transform: uppercase; letter-spacing: -0.01em; }
.stcm-award-pick span { color: var(--stc-magenta); }
.stcm-article-body p { font-size: 17px; line-height: 1.7; color: var(--stc-blue-ink); margin-bottom: 20px; }
.stcm-article-body p:last-child { margin-bottom: 0; }
.stcm-drop-cap::first-letter { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 80px; line-height: 0.85; float: left; padding: 4px 10px 0 0; color: var(--stc-magenta); }
.stcm-sub-heading { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 26px; text-transform: uppercase; color: var(--stc-blue-ink); margin: 36px 0 12px; border-left: 4px solid var(--stc-cyan); padding-left: 12px; letter-spacing: -0.01em; }
.stcm-stat-table-wrap { margin: 28px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.stcm-stat-table { width: 100%; border-collapse: collapse; background: var(--stc-white); border: 2px solid var(--stc-blue); font-size: 14px; }
.stcm-stat-table thead { background: var(--stc-blue); color: var(--stc-white); }
.stcm-stat-table thead th { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; padding: 12px 16px; text-align: left; white-space: nowrap; }
.stcm-stat-table tbody td { padding: 12px 16px; border-bottom: 1px solid rgba(5,15,46,0.08); color: var(--stc-blue-ink); white-space: nowrap; }
.stcm-stat-table tbody tr:last-child td { border-bottom: none; }
.stcm-stat-table tbody tr:nth-child(even) td { background: rgba(11,63,196,0.03); }
.stcm-stat-table .stcm-stat-num { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 18px; color: var(--stc-blue); }
.stcm-stat-table .stcm-rank { font-family: var(--font-mono); font-size: 11px; color: #666; }
.stcm-odds-box { display: flex; gap: 2px; background: var(--stc-blue-ink); margin: 24px 0; flex-wrap: wrap; }
.stcm-odds-item { flex: 1; min-width: 140px; background: var(--stc-white); padding: 20px; display: flex; flex-direction: column; gap: 4px; }
.stcm-odds-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: #888; }
.stcm-odds-value { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 36px; line-height: 1; color: var(--stc-blue); letter-spacing: -0.02em; }
.stcm-odds-value.stcm-hudson { color: var(--stc-magenta); }
.stcm-contenders-table { width: 100%; border-collapse: collapse; background: var(--stc-white); border: 2px solid var(--stc-blue-ink); margin: 28px 0; font-size: 14px; }
.stcm-contenders-table thead { background: var(--stc-blue-ink); color: var(--stc-white); }
.stcm-contenders-table thead th { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; padding: 12px 16px; text-align: left; }
.stcm-contenders-table tbody td { padding: 14px 16px; border-bottom: 1px solid rgba(5,15,46,0.08); vertical-align: top; line-height: 1.5; }
.stcm-contenders-table tbody tr:last-child td { border-bottom: none; }
.stcm-contenders-table tbody tr:hover td { background: rgba(11,63,196,0.03); }
.stcm-contenders-table .stcm-player-name { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 18px; color: var(--stc-blue-ink); text-transform: uppercase; letter-spacing: -0.01em; white-space: nowrap; }
.stcm-contenders-table .stcm-key-stats { font-family: var(--font-mono); font-size: 11px; color: var(--stc-blue); white-space: nowrap; }
.stcm-postseason-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 28px 0; }
.stcm-postseason-card { background: var(--stc-blue); color: var(--stc-white); padding: 24px; position: relative; overflow: hidden; }
.stcm-postseason-card::after { content: attr(data-league); position: absolute; right: -10px; bottom: -20px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 80px; line-height: 0.8; color: rgba(255,255,255,0.07); letter-spacing: -0.04em; pointer-events: none; }
.stcm-postseason-card.stcm-ws { grid-column: 1 / -1; background: var(--stc-blue-ink); border: 3px solid var(--stc-magenta); }
.stcm-postseason-card-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; opacity: 0.6; margin-bottom: 8px; }
.stcm-postseason-card-pick { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(28px, 4vw, 48px); line-height: 0.9; text-transform: uppercase; letter-spacing: -0.02em; }
.stcm-postseason-card.stcm-ws .stcm-postseason-card-pick { color: var(--stc-cyan); }
.stcm-postseason-odds { margin-top: 12px; display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.stcm-postseason-odds-item { font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.05em; }
.stcm-postseason-odds-item .stcm-val { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 20px; }
.stcm-postseason-odds-item .stcm-lbl { opacity: 0.6; margin-right: 4px; }
.stcm-postseason-card p { margin-top: 14px; font-size: 14px; line-height: 1.6; opacity: 0.85; color: var(--stc-white); }
@media (max-width: 600px) {
  .stcm-postseason-grid { grid-template-columns: 1fr; }
  .stcm-postseason-card.stcm-ws { grid-column: 1; }
}
.stcm-roy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 28px 0; }
.stcm-roy-card { background: var(--stc-white); padding: 24px; border-left: 6px solid var(--stc-blue); display: flex; flex-direction: column; gap: 8px; }
.stcm-roy-card.stcm-nl { border-left-color: var(--stc-magenta); }
.stcm-roy-card-league { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-blue); }
.stcm-roy-card.stcm-nl .stcm-roy-card-league { color: var(--stc-magenta); }
.stcm-roy-card-name { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 32px; text-transform: uppercase; color: var(--stc-blue-ink); line-height: 1; letter-spacing: -0.01em; }
.stcm-roy-odds-row { display: flex; gap: 20px; margin-top: 4px; }
.stcm-roy-odds-item { font-family: var(--font-mono); font-size: 11px; font-weight: 700; }
.stcm-roy-odds-item .stcm-lbl { opacity: 0.5; margin-right: 4px; }
.stcm-roy-odds-item .stcm-book { color: var(--stc-blue); font-size: 15px; }
.stcm-roy-card.stcm-nl .stcm-roy-odds-item .stcm-book { color: var(--stc-magenta); }
.stcm-roy-odds-item .stcm-mine { color: var(--stc-blue-ink); font-size: 15px; }
@media (max-width: 500px) {
  .stcm-roy-grid { grid-template-columns: 1fr; }
}

/* ---- from about.html (stcab-) ---- */
.stcab-about-hero { padding: 160px var(--edge) 80px; position: relative; background: var(--stc-bone); overflow: hidden; border-bottom: 3px solid var(--stc-blue-ink); }
.stcab-about-hero::before { content: attr(data-bg); position: absolute; top: 100px; right: -40px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(200px, 32vw, 520px); line-height: 0.8; color: var(--stc-blue); opacity: 0.06; pointer-events: none; letter-spacing: -0.04em; user-select: none; }
.stcab-crumb { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue); margin-bottom: 32px; position: relative; z-index: 2; transition: color 0.2s, gap 0.2s; }
.stcab-crumb:hover { color: var(--stc-magenta); gap: 12px; }
.stcab-crumb-arrow { font-size: 16px; transform: rotate(180deg); }
.stcab-about-hero-inner { position: relative; z-index: 1; max-width: 1100px; }
.stcab-about-hero h1 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(64px, 11vw, 180px); line-height: 0.85; letter-spacing: -0.03em; text-transform: uppercase; color: var(--stc-blue); margin-bottom: 40px; }
.stcab-about-hero h1 .stcab-line { display: block; }
.stcab-about-hero h1 .stcab-line-stroke { color: transparent; -webkit-text-stroke: 2px var(--stc-blue); }
.stcab-about-hero h1 .stcab-line-mag { color: var(--stc-magenta); }
.stcab-about-hero-lede { font-size: clamp(18px, 1.6vw, 24px); line-height: 1.5; max-width: 680px; color: var(--stc-blue-ink); margin-bottom: 12px; }
.stcab-section-label { font-family: var(--font-mono); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-magenta); }
.stcab-section-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(44px, 6vw, 84px); line-height: 0.9; text-transform: uppercase; color: var(--stc-blue); letter-spacing: -0.02em; margin-top: 8px; }
.stcab-show { padding: 120px var(--edge); background: var(--stc-white); position: relative; }
.stcab-show-header { max-width: 900px; margin-bottom: 72px; }
.stcab-show-header p { font-size: 18px; line-height: 1.6; margin-top: 24px; max-width: 640px; }
.stcab-show-list { display: grid; gap: 2px; background: var(--stc-blue); border: 2px solid var(--stc-blue); }
.stcab-show-item { background: var(--stc-bone); padding: 40px clamp(24px, 4vw, 56px); display: grid; grid-template-columns: 120px 1fr; gap: clamp(20px, 4vw, 60px); align-items: start; transition: background 0.2s; }
.stcab-show-item:hover { background: var(--stc-white); }
.stcab-show-num { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(60px, 7vw, 96px); line-height: 0.9; color: var(--stc-blue); letter-spacing: -0.03em; -webkit-text-stroke: 0; }
.stcab-show-item:nth-child(even) .stcab-show-num { color: transparent; -webkit-text-stroke: 2px var(--stc-blue); }
.stcab-show-body h3 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(28px, 3vw, 42px); line-height: 0.95; text-transform: uppercase; color: var(--stc-blue-ink); letter-spacing: -0.01em; margin-bottom: 12px; }
.stcab-show-body p { font-size: 16px; line-height: 1.6; max-width: 580px; color: var(--stc-blue-ink); }
.stcab-show-tag { display: inline-block; font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-magenta); margin-top: 14px; }
@media (max-width: 720px) {
  .stcab-show-item { grid-template-columns: 1fr; gap: 8px; padding: 32px 24px; }
  .stcab-show-num { font-size: 56px; }
}
.stcab-hosts-section { padding: 120px var(--edge); background: var(--stc-blue-ink); color: var(--stc-white); position: relative; overflow: hidden; }
.stcab-hosts-section::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px); background-size: 60px 60px; pointer-events: none; }
.stcab-hosts-section .stcab-section-title { color: var(--stc-white); }
.stcab-hosts-section .stcab-section-label { color: var(--stc-cyan); }
.stcab-hosts-intro { max-width: 900px; margin-bottom: 72px; position: relative; z-index: 1; }
.stcab-hosts-intro p { font-size: 17px; line-height: 1.6; margin-top: 24px; max-width: 620px; opacity: 0.85; }
.stcab-host-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; position: relative; z-index: 1; }
.stcab-host { background: var(--stc-white); color: var(--stc-blue-ink); padding: 40px; position: relative; overflow: hidden; transition: transform 0.25s, box-shadow 0.25s; }
.stcab-host:hover { transform: translate(-4px, -4px); box-shadow: 8px 8px 0 var(--stc-magenta); }
.stcab-host.stcab-two:hover { box-shadow: 8px 8px 0 var(--stc-cyan); }
.stcab-host-number { position: absolute; top: 20px; right: 24px; font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.2em; color: var(--stc-blue); opacity: 0.5; }
.stcab-host-name { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(64px, 7vw, 110px); line-height: 0.85; letter-spacing: -0.03em; color: var(--stc-blue); text-transform: uppercase; margin-bottom: 8px; }
.stcab-host.stcab-two .stcab-host-name { color: var(--stc-blue-ink); }
.stcab-host-role { font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-magenta); margin-bottom: 24px; }
.stcab-host-bio { font-size: 16px; line-height: 1.65; color: var(--stc-blue-ink); margin-bottom: 20px; }
.stcab-host-meta { display: flex; flex-wrap: wrap; gap: 12px; padding-top: 20px; border-top: 2px solid rgba(5, 15, 46, 0.1); }
.stcab-host-meta-item { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; padding: 6px 12px; background: var(--stc-bone); color: var(--stc-blue); }
@media (max-width: 860px) {
  .stcab-host-grid { grid-template-columns: 1fr; }
}
.stcab-cta { padding: 120px var(--edge); background: var(--stc-blue); color: var(--stc-white); text-align: center; position: relative; overflow: hidden; }
.stcab-cta::before { content: attr(data-bg); position: absolute; bottom: -60px; left: 50%; transform: translateX(-50%); font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(220px, 34vw, 560px); line-height: 0.8; color: rgba(255,255,255,0.07); pointer-events: none; letter-spacing: -0.04em; user-select: none; white-space: nowrap; }
.stcab-cta-inner { position: relative; z-index: 1; }
.stcab-cta h2 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(48px, 7vw, 96px); line-height: 0.9; text-transform: uppercase; letter-spacing: -0.02em; margin-bottom: 24px; }
.stcab-cta h2 em { font-style: italic; color: var(--stc-cyan); }
.stcab-cta p { font-size: 17px; line-height: 1.6; max-width: 520px; margin: 0 auto 40px; opacity: 0.9; }
.stcab-cta-row { display: inline-flex; gap: 16px; flex-wrap: wrap; justify-content: center; }
.stcab-cta-btn { font-family: var(--font-display); font-weight: 800; font-size: 17px; text-transform: uppercase; letter-spacing: 0.08em; padding: 16px 28px; background: var(--stc-white); color: var(--stc-blue); border: 2px solid var(--stc-white); transition: transform 0.15s, box-shadow 0.15s; }
.stcab-cta-btn:hover { transform: translate(-3px, -3px); box-shadow: 6px 6px 0 var(--stc-magenta); }
.stcab-cta-btn.stcab-ghost { background: transparent; color: var(--stc-white); }
.stcab-cta-btn.stcab-ghost:hover { background: var(--stc-white); color: var(--stc-blue); box-shadow: 6px 6px 0 var(--stc-cyan); }

/* ---- from listen.html (stcl-) ---- */
.stcl-listen-hero { padding: 140px var(--edge) 80px; background: var(--stc-blue-ink); color: var(--stc-white); position: relative; overflow: hidden; }
.stcl-listen-hero::before { content: attr(data-bg); position: absolute; bottom: -60px; right: -30px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(160px, 25vw, 420px); line-height: 0.8; color: rgba(255,255,255,0.04); pointer-events: none; letter-spacing: -0.04em; }
.stcl-listen-hero::after { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px); background-size: 60px 60px; pointer-events: none; }
.stcl-listen-hero-inner { position: relative; z-index: 1; max-width: 860px; }
.stcl-hero-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-cyan); margin-bottom: 24px; padding: 6px 12px; background: rgba(0, 229, 255, 0.1); border: 2px solid var(--stc-cyan); }
.stcl-listen-hero h1 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(56px, 9vw, 120px); line-height: 0.88; letter-spacing: -0.02em; text-transform: uppercase; margin-bottom: 24px; }
.stcl-listen-hero h1 em { color: var(--stc-cyan); font-style: italic; }
.stcl-listen-hero p { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; max-width: 560px; opacity: 0.85; }
.stcl-ticker { background: var(--stc-blue); color: var(--stc-white); padding: 14px 0; overflow: hidden; white-space: nowrap; border-top: 3px solid var(--stc-magenta); border-bottom: 3px solid var(--stc-cyan); }
.stcl-ticker-track { display: inline-flex; animation: stc-scroll 40s linear infinite; font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 18px; text-transform: uppercase; letter-spacing: 0.05em; }
.stcl-ticker-item { padding: 0 24px; display: inline-flex; align-items: center; gap: 12px; }
.stcl-ticker-item::after { content: '★'; color: var(--stc-magenta); margin-left: 24px; }
.stcl-spotify-section { padding: 80px var(--edge); background: var(--stc-bone); }
.stcl-section-label { font-family: var(--font-mono); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-magenta); margin-bottom: 12px; }
.stcl-section-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(44px, 6vw, 80px); line-height: 0.9; text-transform: uppercase; color: var(--stc-blue); letter-spacing: -0.02em; margin-bottom: 40px; }
.stcl-spotify-embed-wrap { background: var(--stc-white); border: 2px solid var(--stc-blue); padding: 32px; box-shadow: 8px 8px 0 var(--stc-blue); max-width: 900px; }
.stcl-spotify-embed-wrap iframe { display: block; width: 100%; border: none; border-radius: 0; }
.stcl-spotify-open-link { display: inline-flex; align-items: center; gap: 10px; margin-top: 20px; font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 17px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--stc-blue); border-bottom: 2px solid var(--stc-blue); padding-bottom: 2px; transition: color 0.2s, border-color 0.2s; }
.stcl-spotify-open-link:hover { color: var(--stc-magenta); border-color: var(--stc-magenta); }
.stcl-youtube-section { padding: 80px var(--edge); background: var(--stc-blue-ink); position: relative; overflow: hidden; }
.stcl-youtube-section::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px); background-size: 60px 60px; pointer-events: none; }
.stcl-youtube-section .stcl-section-label { color: var(--stc-cyan); }
.stcl-youtube-section .stcl-section-title { color: var(--stc-white); }
.stcl-youtube-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1.2fr; gap: 60px; align-items: center; }
.stcl-youtube-text p { font-size: 18px; line-height: 1.65; opacity: 0.85; color: var(--stc-white); margin-bottom: 32px; }
.stcl-btn-primary { font-family: var(--font-display); font-weight: 800; font-size: 17px; text-transform: uppercase; letter-spacing: 0.08em; padding: 16px 28px; background: var(--stc-magenta); color: var(--stc-white); display: inline-flex; align-items: center; gap: 10px; transition: transform 0.15s, box-shadow 0.15s; border: 2px solid var(--stc-magenta); }
.stcl-btn-primary:hover { transform: translate(-3px, -3px); box-shadow: 6px 6px 0 var(--stc-cyan); }
.stcl-youtube-card { background: var(--stc-bone); padding: 40px; position: relative; display: flex; flex-direction: column; gap: 20px; box-shadow: -8px 8px 0 var(--stc-magenta); }
.stcl-youtube-card-icon { width: 64px; height: 64px; background: var(--stc-magenta); display: grid; place-items: center; color: var(--stc-white); font-size: 28px; }
.stcl-youtube-card-name { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 36px; text-transform: uppercase; color: var(--stc-blue-ink); line-height: 1; }
.stcl-youtube-card-handle { font-family: var(--font-mono); font-size: 13px; font-weight: 700; letter-spacing: 0.1em; color: var(--stc-blue); }
.stcl-youtube-card-desc { font-size: 15px; line-height: 1.6; color: var(--stc-blue-ink); max-width: 340px; }
.stcl-youtube-card-cta { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 16px; text-transform: uppercase; letter-spacing: 0.08em; padding: 14px 22px; background: var(--stc-blue); color: var(--stc-white); display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; transition: transform 0.15s, box-shadow 0.15s; border: 2px solid var(--stc-blue); }
.stcl-youtube-card-cta:hover { transform: translate(-3px, -3px); box-shadow: 5px 5px 0 var(--stc-magenta); }
@media (max-width: 860px) {
  .stcl-youtube-inner { grid-template-columns: 1fr; gap: 40px; }
}
.stcl-platforms-section { padding: 80px var(--edge); background: var(--stc-white); }
.stcl-platforms-section .stcl-section-label { color: var(--stc-magenta); }
.stcl-platforms-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 40px; }
.stcl-platform-card { background: var(--stc-bone); padding: 28px 24px; display: flex; align-items: center; gap: 18px; border: 2px solid transparent; transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s; cursor: pointer; }
.stcl-platform-card:hover { transform: translate(-4px, -4px); border-color: var(--stc-blue); box-shadow: 6px 6px 0 var(--stc-magenta); }
.stcl-platform-card-icon { width: 48px; height: 48px; display: grid; place-items: center; font-size: 22px; flex-shrink: 0; background: var(--stc-blue); color: var(--stc-white); }
.stcl-platform-card-icon.stcl-spotify-icon { background: #1DB954; }
.stcl-platform-card-icon.stcl-apple-icon { background: #fc3c44; }
.stcl-platform-card-icon.stcl-youtube-icon { background: #FF0000; }
.stcl-platform-card-text { flex: 1; }
.stcl-platform-card-name { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 24px; text-transform: uppercase; color: var(--stc-blue-ink); line-height: 1; margin-bottom: 4px; }
.stcl-platform-card-sub { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--stc-blue); }
.stcl-platform-card-arrow { font-size: 20px; color: var(--stc-blue); font-weight: 700; transition: transform 0.2s; }
.stcl-platform-card:hover .stcl-platform-card-arrow { transform: translate(4px, -4px); }
@media (max-width: 860px) {
  .stcl-platforms-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 540px) {
  .stcl-platforms-grid { grid-template-columns: 1fr; }
}

/* ---- from analysis.html (stcan-) ---- */
.stcan-page-head { padding: 160px var(--edge) 80px; position: relative; background: var(--stc-bone); overflow: hidden; border-bottom: 3px solid var(--stc-blue-ink); }
.stcan-page-head::before { content: attr(data-bg); position: absolute; top: 80px; right: -40px; font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(180px, 28vw, 500px); line-height: 0.8; color: var(--stc-blue); opacity: 0.06; pointer-events: none; letter-spacing: -0.04em; user-select: none; }
.stcan-page-head-inner { position: relative; z-index: 1; max-width: 1100px; }
.stcan-crumb { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue); margin-bottom: 32px; transition: color 0.2s, gap 0.2s; }
.stcan-crumb:hover { color: var(--stc-magenta); gap: 12px; }
.stcan-crumb-arrow { font-size: 16px; transform: rotate(180deg); }
.stcan-page-head h1 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(56px, 10vw, 160px); line-height: 0.85; letter-spacing: -0.03em; text-transform: uppercase; color: var(--stc-blue); margin-bottom: 28px; }
.stcan-page-head h1 .stcan-line { display: block; }
.stcan-page-head h1 .stcan-line-stroke { color: transparent; -webkit-text-stroke: 2px var(--stc-blue); }
.stcan-page-head-lede { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; max-width: 620px; color: var(--stc-blue-ink); }
.stcan-grid-section { padding: 80px var(--edge) 120px; background: var(--stc-bone); }
.stcan-filter-row { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 40px; padding-bottom: 24px; border-bottom: 2px solid rgba(5, 15, 46, 0.12); align-items: baseline; }
.stcan-filter-label { font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-blue-ink); opacity: 0.6; margin-right: 8px; }
.stcan-filter-chip { font-family: var(--font-display); font-weight: 700; font-style: italic; font-size: 14px; text-transform: uppercase; letter-spacing: 0.08em; padding: 6px 14px; background: transparent; color: var(--stc-blue-ink); border: 2px solid rgba(5, 15, 46, 0.2); transition: all 0.2s; }
.stcan-filter-chip:hover { border-color: var(--stc-blue); color: var(--stc-blue); }
.stcan-filter-chip.active { background: var(--stc-blue); color: var(--stc-white); border-color: var(--stc-blue); }
.stcan-tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: 24px; grid-auto-rows: minmax(280px, auto); }
.stcan-tile { position: relative; overflow: hidden; padding: 32px; display: flex; flex-direction: column; gap: 16px; transition: transform 0.25s, box-shadow 0.25s; background: var(--stc-white); color: var(--stc-blue-ink); }
.stcan-tile:hover { transform: translate(-4px, -4px); box-shadow: 8px 8px 0 var(--stc-magenta); }
.stcan-tile.stcan-featured { grid-column: span 4; grid-row: span 2; }
.stcan-tile.stcan-wide { grid-column: span 3; }
.stcan-tile.stcan-regular { grid-column: span 2; }
.stcan-tile.stcan-featured { background: var(--stc-blue); color: var(--stc-white); }
.stcan-tile.stcan-featured:hover { box-shadow: 8px 8px 0 var(--stc-cyan); }
.stcan-tile.stcan-placeholder { opacity: 0.7; cursor: default; background: var(--stc-bone); border: 2px dashed rgba(5, 15, 46, 0.25); }
.stcan-tile.stcan-placeholder:hover { transform: none; box-shadow: none; opacity: 0.8; }
.stcan-tile-meta { display: flex; justify-content: space-between; align-items: center; font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; flex-wrap: wrap; gap: 8px; }
.stcan-tile-tag { padding: 5px 10px; background: var(--stc-bone); color: var(--stc-blue); letter-spacing: 0.12em; }
.stcan-tile-tag.stcan-nfl { background: #E8F0FF; color: var(--stc-blue); }
.stcan-tile-tag.stcan-nba { background: #FFE4F1; color: var(--stc-magenta); }
.stcan-tile-tag.stcan-mlb { background: #DDF9FF; color: #006D85; }
.stcan-tile-tag.stcan-ncaa { background: #FFF3DD; color: #8B6A00; }
.stcan-tile-tag.stcan-soccer { background: #E8FFE8; color: #1A7A1A; }
.stcan-tile.stcan-featured .stcan-tile-tag { background: var(--stc-cyan); color: var(--stc-blue-ink); }
.stcan-tile-status { color: var(--stc-magenta); font-weight: 700; }
.stcan-tile.stcan-featured .stcan-tile-status { color: var(--stc-cyan); }
.stcan-tile-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(28px, 2.6vw, 44px); line-height: 0.95; text-transform: uppercase; letter-spacing: -0.01em; margin-top: 4px; }
.stcan-tile.stcan-featured .stcan-tile-title { font-size: clamp(40px, 4.5vw, 68px); }
.stcan-tile-desc { font-size: 14px; line-height: 1.55; flex-grow: 1; opacity: 0.9; }
.stcan-tile.stcan-featured .stcan-tile-desc { font-size: 16px; opacity: 0.92; max-width: 520px; }
.stcan-tile-footer { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; font-family: var(--font-mono); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; opacity: 0.75; }
.stcan-tile-cta { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 16px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--stc-cyan); margin-top: 8px; }
.stcan-tile-cta-arrow { transition: transform 0.25s; display: inline-block; }
.stcan-tile.stcan-featured:hover .stcan-tile-cta-arrow { transform: translateX(6px); }
.stcan-tile.stcan-featured::before { content: '★'; position: absolute; top: -40px; right: -30px; font-size: 280px; color: rgba(255,255,255,0.07); line-height: 1; pointer-events: none; font-family: serif; }
@media (max-width: 1000px) {
  .stcan-tiles { grid-template-columns: repeat(4, 1fr); }
  .stcan-tile.stcan-featured { grid-column: span 4; grid-row: span 2; }
  .stcan-tile.stcan-wide { grid-column: span 2; }
  .stcan-tile.stcan-regular { grid-column: span 2; }
  .stcan-tile.stcan-featured .stcan-tile-title { font-size: clamp(36px, 6vw, 56px); }
}
@media (max-width: 640px) {
  .stcan-tiles { grid-template-columns: 1fr; gap: 16px; }
  .stcan-tile.stcan-featured, .stcan-tile.stcan-wide, .stcan-tile.stcan-regular { grid-column: span 1; grid-row: auto; }
}

/* ---- from draft-board.html (stcd-) ---- */
.stcd-hero { padding: 140px var(--edge) 60px; position: relative; overflow: hidden; border-bottom: 3px solid var(--stc-blue-ink); }
.stcd-hero::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(var(--stc-grid) 1px, transparent 1px), linear-gradient(90deg, var(--stc-grid) 1px, transparent 1px); background-size: 60px 60px; mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%); -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%); pointer-events: none; }
.stcd-hero-inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1.4fr 1fr; gap: 60px; align-items: end; }
.stcd-hero-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue); margin-bottom: 24px; padding: 6px 12px; background: var(--stc-white); border: 2px solid var(--stc-blue); }
.stcd-hero-eyebrow .stcd-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--stc-magenta); animation: stc-pulse 1.4s ease-in-out infinite; }
.stcd-hero h1 { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(56px, 10vw, 160px); line-height: 0.86; letter-spacing: -0.025em; text-transform: uppercase; color: var(--stc-blue); margin-bottom: 24px; }
.stcd-hero h1 .stcd-line { display: block; }
.stcd-hero h1 .stcd-line-alt { color: transparent; -webkit-text-stroke: 2px var(--stc-blue); }
.stcd-hero h1 .stcd-chroma { position: relative; display: inline-block; color: var(--stc-blue); }
.stcd-hero h1 .stcd-chroma::before, .stcd-hero h1 .stcd-chroma::after { content: attr(data-text); position: absolute; top: 0; left: 0; width: 100%; pointer-events: none; }
.stcd-hero h1 .stcd-chroma::before { color: var(--stc-cyan); transform: translate(-4px, 0); mix-blend-mode: multiply; z-index: -1; }
.stcd-hero h1 .stcd-chroma::after { color: var(--stc-magenta); transform: translate(4px, 0); mix-blend-mode: multiply; z-index: -1; }
.stcd-hero-lede { font-size: clamp(16px, 1.3vw, 18px); line-height: 1.55; max-width: 520px; color: var(--stc-blue-ink); }
.stcd-hero-meta { display: grid; gap: 12px; }
.stcd-meta-card { background: var(--stc-blue); color: var(--stc-white); padding: 20px 24px; position: relative; }
.stcd-meta-card.stcd-alt { background: var(--stc-white); color: var(--stc-blue); border: 2px solid var(--stc-blue); }
.stcd-meta-card-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; opacity: 0.8; margin-bottom: 4px; }
.stcd-meta-card-value { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 36px; line-height: 1; text-transform: uppercase; letter-spacing: -0.01em; }
.stcd-meta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 900px) {
  .stcd-hero { padding-top: 110px; }
  .stcd-hero-inner { grid-template-columns: 1fr; gap: 40px; }
  .stcd-hero-meta { max-width: 480px; }
}
.stcd-ticker { background: var(--stc-blue-ink); color: var(--stc-white); padding: 12px 0; overflow: hidden; white-space: nowrap; border-top: 3px solid var(--stc-magenta); border-bottom: 3px solid var(--stc-cyan); }
.stcd-ticker-track { display: inline-flex; animation: stc-scroll 40s linear infinite; font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 16px; text-transform: uppercase; letter-spacing: 0.05em; }
.stcd-ticker-item { padding: 0 24px; display: inline-flex; align-items: center; gap: 12px; }
.stcd-ticker-item::after { content: '★'; color: var(--stc-magenta); margin-left: 24px; }
.stcd-stats { padding: 40px var(--edge); background: var(--stc-white); }
.stcd-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; background: var(--stc-blue); border: 2px solid var(--stc-blue); max-width: 1100px; margin: 0 auto; }
.stcd-stat { background: var(--stc-white); padding: 24px 20px; }
.stcd-stat-value { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(36px, 4vw, 56px); line-height: 0.9; color: var(--stc-blue); letter-spacing: -0.02em; }
.stcd-stat-value.stcd-accent { color: var(--stc-magenta); }
.stcd-stat-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue-ink); margin-top: 6px; }
@media (max-width: 700px) {
  .stcd-stats-grid { grid-template-columns: repeat(2, 1fr); }
}
.stcd-board-section { padding: 80px var(--edge) 120px; background: var(--stc-bone); }
.stcd-section-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 36px; flex-wrap: wrap; gap: 20px; }
.stcd-section-label { font-family: var(--font-mono); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--stc-magenta); }
.stcd-section-title { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: clamp(44px, 6vw, 84px); line-height: 0.9; text-transform: uppercase; color: var(--stc-blue); letter-spacing: -0.02em; margin-top: 8px; }
.stcd-section-note { font-family: var(--font-mono); font-size: 12px; text-transform: uppercase; letter-spacing: 0.15em; color: var(--stc-blue-ink); max-width: 340px; text-align: right; line-height: 1.6; }
.stcd-board-wrap { background: var(--stc-white); border: 2px solid var(--stc-blue-ink); overflow: hidden; box-shadow: -8px 8px 0 var(--stc-magenta), 8px -8px 0 var(--stc-cyan); }
table.stcd-board { width: 100%; border-collapse: collapse; }
table.stcd-board thead { background: var(--stc-blue-ink); color: var(--stc-white); }
table.stcd-board thead th { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 14px; text-transform: uppercase; letter-spacing: 0.15em; padding: 16px 18px; text-align: left; white-space: nowrap; border-bottom: 3px solid var(--stc-magenta); }
table.stcd-board thead th.stcd-center { text-align: center; }
table.stcd-board tbody tr { border-bottom: 1px solid rgba(5, 15, 46, 0.1); transition: background 0.15s ease; }
table.stcd-board tbody tr:hover { background: var(--stc-bone); }
table.stcd-board tbody tr.stcd-empty { background: repeating-linear-gradient( 45deg, rgba(11, 63, 196, 0.02), rgba(11, 63, 196, 0.02) 8px, transparent 8px, transparent 16px ); }
table.stcd-board tbody tr.stcd-empty:hover { background: rgba(11, 63, 196, 0.04); }
table.stcd-board td { padding: 20px 18px; vertical-align: top; font-size: 15px; line-height: 1.55; color: var(--stc-blue-ink); }
.stcd-col-pick { width: 84px; text-align: center; padding-top: 16px !important; }
.stcd-pick-num { font-family: var(--font-display); font-weight: 900; font-style: italic; font-size: 42px; line-height: 1; color: var(--stc-blue); letter-spacing: -0.02em; }
tr.stcd-empty .stcd-pick-num { color: rgba(5, 15, 46, 0.35); }
.stcd-col-team { width: 150px; }
.stcd-team-name { font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 22px; text-transform: uppercase; line-height: 1.05; color: var(--stc-blue-ink); letter-spacing: -0.005em; }
tr.stcd-empty .stcd-team-name { color: rgba(5, 15, 46, 0.35); font-style: italic; font-size: 16px; }
.stcd-col-player { width: 220px; }
.stcd-player-name { font-family: var(--font-display); font-weight: 700; font-size: 20px; line-height: 1.1; color: var(--stc-blue-ink); letter-spacing: 0.005em; }
tr.stcd-empty .stcd-player-name { color: rgba(5, 15, 46, 0.3); }
.stcd-col-pos { width: 100px; text-align: center; }
.stcd-pos-chip { display: inline-block; font-family: var(--font-display); font-weight: 800; font-style: italic; font-size: 14px; letter-spacing: 0.08em; padding: 5px 10px; text-transform: uppercase; white-space: nowrap; border: 2px solid var(--stc-blue-ink); }
.stcd-pos-QB { background: var(--stc-blue); color: var(--stc-white); border-color: var(--stc-blue); }
.stcd-pos-RB { background: #DDF9E5; color: #0B7239; border-color: #0B7239; }
.stcd-pos-WR { background: #E8F0FF; color: var(--stc-blue); border-color: var(--stc-blue); }
.stcd-pos-TE { background: #F5E8FF; color: #6B2A9E; border-color: #6B2A9E; }
.stcd-pos-OT { background: #FFEDD8; color: #A04A00; border-color: #A04A00; }
.stcd-pos-OG { background: #FFEDD8; color: #A04A00; border-color: #A04A00; }
.stcd-pos-EDGE { background: var(--stc-magenta); color: var(--stc-white); border-color: var(--stc-magenta); }
.stcd-pos-LB { background: #FFF1D0; color: #8B5E00; border-color: #8B5E00; }
.stcd-pos-DT { background: var(--stc-blue-ink); color: var(--stc-cyan); border-color: var(--stc-blue-ink); }
.stcd-team-via { font-family: var(--font-mono); font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--stc-magenta); margin-top: 6px; line-height: 1.35; display: block; }
.stcd-team-via.stcd-done { color: rgba(5, 15, 46, 0.5); }
.stcd-col-notes { font-size: 14px; line-height: 1.6; color: #2A2A4A; }
.stcd-col-notes.stcd-pending { font-style: italic; color: rgba(5, 15, 46, 0.45); font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; }
.stcd-legend { max-width: 1400px; margin: 28px auto 0; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--stc-blue-ink); }
.stcd-legend-label { font-weight: 700; color: var(--stc-magenta); margin-right: 8px; }
@media (max-width: 820px) {
  table.stcd-board thead { display: none; }
  table.stcd-board, table.stcd-board tbody, table.stcd-board tr, table.stcd-board td { display: block; width: 100%; }
  table.stcd-board tbody tr { padding: 18px 18px 20px; border-bottom: 2px solid rgba(5, 15, 46, 0.12); position: relative; }
  table.stcd-board td { padding: 4px 0 !important; width: auto !important; }
  .stcd-col-pick { position: absolute; top: 14px; right: 16px; padding: 0 !important; }
  .stcd-pick-num { font-size: 36px; }
  .stcd-col-team { margin-bottom: 2px; padding-right: 70px !important; }
  .stcd-team-name { font-size: 20px; }
  .stcd-col-player { margin-bottom: 6px; }
  .stcd-player-name { font-size: 17px; }
  .stcd-col-pos { text-align: left; margin-bottom: 10px; }
  .stcd-col-notes { margin-top: 10px !important; padding-top: 12px !important; border-top: 1px solid rgba(5, 15, 46, 0.1); font-size: 13.5px; }
  .stcd-section-note { text-align: left; max-width: none; }
  .stcd-board-wrap { box-shadow: -5px 5px 0 var(--stc-magenta), 5px -5px 0 var(--stc-cyan); }
}

/* ============================================================
   ADDITIONS — the few things the static CSS did not need
   ============================================================ */

/* Scroll reveal: hidden only while JS is running; always visible in the editor */
.stc-js .stc-reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease, transform 0.8s ease; }
.stc-js .stc-reveal.in { opacity: 1; transform: translateY(0); }
.editor-styles-wrapper .stc-reveal, .block-editor-block-list__layout .stc-reveal { opacity: 1 !important; transform: none !important; }
@media (prefers-reduced-motion: reduce) {
  .stc-js .stc-reveal { opacity: 1; transform: none; transition: none; }
  .stc-ticker-track, .stcl-ticker-track { animation: none; }
}

/* Any number of items in the number / card rows (desktop only; the static
   breakpoints still take over on small screens) */
@media (min-width: 901px) {
  .stca-stats-strip[data-cols="1"] { grid-template-columns: 1fr; }
  .stca-stats-strip[data-cols="2"] { grid-template-columns: repeat(2, 1fr); }
  .stca-stats-strip[data-cols="3"], .stca-stats-strip[data-cols="6"] { grid-template-columns: repeat(3, 1fr); }
  .stca-stats-strip[data-cols="5"] { grid-template-columns: repeat(5, 1fr); }
  .stca-insight-strip[data-cols="1"], .stca-era-grid[data-cols="1"] { grid-template-columns: 1fr; }
  .stca-insight-strip[data-cols="2"], .stca-era-grid[data-cols="2"],
  .stca-insight-strip[data-cols="4"], .stca-era-grid[data-cols="4"] { grid-template-columns: repeat(2, 1fr); }
  .stca-breakdown-grid[data-cols="1"] { grid-template-columns: 1fr; }
  .stca-breakdown-grid[data-cols="2"] { grid-template-columns: repeat(2, 1fr); }
  .stca-breakdown-grid[data-cols="3"] { grid-template-columns: repeat(3, 1fr); }
  .stca-breakdown-grid[data-cols="4"] { grid-template-columns: repeat(4, 1fr); }
  .stca-breakdown-grid[data-cols="5"] { grid-template-columns: repeat(5, 1fr); }
  .stca-breakdown-grid[data-cols="6"] { grid-template-columns: repeat(6, 1fr); }
  .stca-breakdown-grid[data-cols="8"] { grid-template-columns: repeat(8, 1fr); }
}
.stc-stats > .stca-section-label { margin-bottom: 12px; }
.stc-stats > .stca-stats-strip:last-child { margin-bottom: 0; }
:where(.stc-content, .is-root-container) > .stc-stats { margin-bottom: 40px; }
.stc-flow > .stc-stats { margin-bottom: 60px; }
.stc-flow > .stc-stats:last-child { margin-bottom: 0; }

/* Section container */
.stc-flow--narrow { max-width: var(--content-max); }
.stc-flow > :last-child { margin-bottom: 0; }
.stca-section > .stca-section-title:last-child, .stca-section > .stc-flow:empty { margin-bottom: 0; }
.stca-section.stca-dark .stc-flow > :where(p, ul, ol) { color: rgba(255, 255, 255, 0.85); }
.stca-section.stca-dark .stc-flow > :where(h2, h3, h4) { color: var(--stc-white); }
.stca-section .wp-block-columns.alignwide { max-width: 1100px; }

/* Pieces that were designed on white look right on bone too */
:where(.stc-content, .is-root-container) > .stca-pull-quote,
.stca-section.stca-bone .stca-pull-quote,
:where(.stc-content, .is-root-container) > .stca-sidebar-facts .stca-fact-card,
.stca-section.stca-bone .stca-fact-card { background: var(--stc-white); }
:where(.stc-content, .is-root-container) > .stca-era-grid .stca-era-card { background: var(--stc-white); }

/* Verdict on a light background */
.stca-kobe-verdict.stc-on-light { margin-top: 28px; margin-bottom: 28px; }
.stca-kobe-verdict.stc-on-light .stca-kobe-verdict-text { color: var(--stc-blue-ink); }

/* Spotlight body accepts any blocks */
.stca-kobe-body > :where(ul, ol) { color: rgba(255, 255, 255, 0.85); font-size: 17px; line-height: 1.65; margin: 0 0 20px; padding-left: 1.4em; }
.stca-kobe-body > :where(h2, h3, h4) { color: var(--stc-white); }
.stca-kobe-body > p.wp-block-paragraph a, .stca-kobe-body > p a { color: var(--stc-cyan); }

/* Section heading */
.stc-heading { margin-bottom: 32px; }
.stc-heading--rule { margin-top: 80px; padding-top: 80px; border-top: 2px solid rgba(5, 15, 46, 0.1); }
.stc-heading .stc-section-title { margin-top: 8px; }

/* Article hero: optional intro paragraph */
.stc-article-hero-lede { font-size: clamp(16px, 1.3vw, 19px); line-height: 1.55; max-width: 620px; color: rgba(255, 255, 255, 0.8); margin: 0 0 28px; }

/* Home hero without the scoreboard panel */
.stc-hero.stc-hero--solo { grid-template-columns: 1fr; }

/* Podcast player inside an article */
.stc-podcast { margin-top: 32px; margin-bottom: 32px; }
.stc-podcast .stcl-spotify-embed-wrap { max-width: none; }
.stcl-spotify-embed-wrap audio { display: block; width: 100%; }
.stc-podcast-empty { font-family: var(--font-mono); font-size: 12px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--stc-blue); }

/* Tables, cards and charts placed straight into the reading column */
:where(.stc-content, .is-root-container, .stc-flow) > .stcm-stat-table-wrap { margin-top: 28px; margin-bottom: 28px; }
.stcm-stat-table-wrap > .stcm-contenders-table { margin: 0; }
.stcm-roy-card .stc-roy-text { font-size: 14px; line-height: 1.6; margin-top: 6px; }
.stc-chart { display: block; }
:where(.stc-content, .is-root-container) > .stca-chart-panel:hover { transform: none; }

/* Filterable tiles */
.stcan-tile[hidden] { display: none; }
.stcan-filter-chip { cursor: pointer; }

/* Newsletter wrapper is a plain full-width box */
.stc-newsletter-wrap { background: var(--stc-bone); }

/* Editor canvas: tame viewport-height heroes and the fixed-nav clearance */
.editor-styles-wrapper .stc-hero { min-height: 0; }
.editor-styles-wrapper .stc-block[class*="alignfull"] { max-width: none; }
.stc-editor-form { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 13px; line-height: 1.4; color: #1e1e1e; background: #fff; border: 1px solid #1e1e1e; padding: 16px; text-align: left; text-transform: none; letter-spacing: 0; font-style: normal; }
.stc-editor-form * { box-sizing: border-box; }
.stc-editor-chip { position: absolute; top: 0; left: 0; z-index: 5; font: 600 11px/1 -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; letter-spacing: 0.02em; text-transform: none; padding: 6px 8px; background: #1e1e1e; color: #fff; pointer-events: none; opacity: 0; transition: opacity 0.15s; }
.is-selected > .stc-editor-preview .stc-editor-chip, .is-hovered > .stc-editor-preview .stc-editor-chip { opacity: 1; }
.stc-editor-preview { position: relative; }
.stc-editor-inner { position: relative; }