/* Prop Firm Duel · theme 8.0 · "the slash" (IndyCar livery)
   8.0: carbon black, lime, livery white. Barlow Condensed italic for headlines like a car number, Barlow for text, JetBrains Mono for data. A lime slash with a white pinstripe, clipped corners, angled buttons. Hero: the logline over a timing tower.
   7.0:
   7.0: carbon black, warm white, one racing red. Mature, livery-ready. No lime, no alerts, grouped menus.
   6.0:
   6.0: neutral near-black, lime as the only accent, Manrope for words and JetBrains Mono for every number, label and cell. Tighter radii. Built to look nothing like a light editorial site.
   5.0 notes (light):
   5.0: light, neutral surfaces (warm white paper, white cards) with Geist for everything. Lime is the accent: buttons, the verified mark, meters, focus. Never body text.
   4.0:
   4.0: the directory is the hero. Data first, search everywhere, a monogram per firm, and a meter that shows how much of each row we have verified.
   Theme 3.0 notes:
   Big Shoulders (Chicago city signage, where futures were born) over Libre Franklin (American financial print).
   The main color (lime #9EF03A by default) is reserved for actions and the "verified" mark. Everything else stays quiet. */

@layer reset, tokens, base, layout, components, pages, utilities;

@layer tokens {
  :root {
    color-scheme: dark;
    --bg:      #0A0A0B;                 /* carbon black */
    --bg-2:    #121214;                 /* cards, table, inputs */
    --bg-3:    #1A1A1D;                 /* raised rows, hover, control tracks */
    --line:    #232326;
    --line-2:  #34343A;
    --ink:     #F5F5F2;                 /* livery white */
    --ink-2:   #B8B8B3;
    --mut:     #7E7E79;
    --accent:  var(--pfd-main, #9EF03A);  /* the main color (Design › Brand › Accent color). The only accent. */
    --accent-2:var(--pfd-main-2, #B4F765);
    --lime:    var(--accent);
    --lime-2:  var(--accent-2);
    --on-lime: var(--pfd-on, #0A0A0B);   /* text on the main color */
    --deep:    var(--pfd-deep, #3E7A00); /* the main color, darkened */
    --on-soft: var(--pfd-on-soft, #132A00);
    --neg:     var(--pfd-neg, var(--neg));  /* fail / negative, kept apart from the main color */
    --red:     #E4322B;                 /* racing red: tiny accents only (live dot, pinstripe, rule-change flash) */
    --warn:    #F5B14C;
    --shadow:  0 1px 0 rgb(255 255 255 / .03) inset, 0 20px 40px -24px rgb(0 0 0 / .8);
    --shadow-s: 0 1px 0 rgb(255 255 255 / .03) inset;
    --display: var(--gh-font-heading, "Barlow Condensed", "Arial Narrow", Impact, sans-serif);
    --sans:    var(--gh-font-body, "Barlow", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
    --mono:    "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;
    --logo:    var(--display);
    --step--1: clamp(0.83rem, 0.80rem + 0.15vw, 0.92rem);
    --step-0:  clamp(1.00rem, 0.96rem + 0.20vw, 1.06rem);
    --step-1:  clamp(1.15rem, 1.06rem + 0.40vw, 1.35rem);
    --step-2:  clamp(1.40rem, 1.20rem + 0.90vw, 1.85rem);
    --step-3:  clamp(1.80rem, 1.40rem + 1.70vw, 2.60rem);
    --step-4:  clamp(2.30rem, 1.60rem + 3.00vw, 4.20rem);
    --step-5:  clamp(2.60rem, 1.70rem + 4.00vw, 5.20rem);
    --space:   clamp(1rem, 0.7rem + 1.4vw, 1.75rem);
    --section: clamp(3.5rem, 2.2rem + 5vw, 7rem);
    --radius-s: 6px; --radius: 10px; --radius-l: 14px;
    --max: 1280px;
    --ease: cubic-bezier(.2,.7,.2,1);
  }
}

@layer reset {
  *,*::before,*::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scrollbar-color: var(--line-2) var(--bg); accent-color: var(--lime); }
  body, h1, h2, h3, p, dl, dd, figure, ul, ol { margin: 0; }
  img, svg { display: block; max-width: 100%; height: auto; }
  button, input, select, textarea { font: inherit; color: inherit; }
}

@layer base {
  body { background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: var(--step-0); line-height: 1.6; font-variant-numeric: tabular-nums lining-nums; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
  a { color: var(--ink); text-decoration-color: color-mix(in oklch, var(--lime) 70%, transparent); text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
  a:hover { color: var(--lime); }
  :focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; border-radius: 4px; }
  ::selection { background: var(--lime); color: var(--on-lime); }
  h1, h2, h3 { text-wrap: balance; }
  p, li { text-wrap: pretty; }
  @view-transition { navigation: auto; }
  @media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } *, *::before, *::after { animation: none !important; transition: none !important; } }
}

@layer layout {
  .wrap { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: clamp(1.1rem, 4vw, 3rem); }
  .block { padding-block-start: var(--section); }
  .page-top { padding-block-start: clamp(2.5rem, 6vw, 5rem); }
  .block-head { display: flex; justify-content: space-between; align-items: end; gap: 1.5rem; margin-block-end: clamp(1.25rem, 2.5vw, 2rem); flex-wrap: wrap; }
  .more { font-weight: 600; font-size: var(--step--1); white-space: nowrap; }
}

@layer components {
  /* type */
  .display { font-family: var(--display); font-weight: 800; line-height: .92; letter-spacing: -0.005em; text-transform: none; margin: 0; }
  .page-top .display { font-size: var(--step-4); max-width: 18ch; }
  .block-head .display, .sub-h, .method-sum .display { font-size: var(--step-3); max-width: 20ch; }
  .k { display: block; margin: 0 0 .9rem; font-size: var(--step--1); font-weight: 600; color: var(--mut); letter-spacing: .01em; }
  .lead { font-size: var(--step-1); line-height: 1.5; color: var(--ink-2); max-width: 60ch; margin-block-start: 1.1rem; }
  .small { font-size: var(--step--1); color: var(--mut); margin-block-start: .5rem; }
  .muted { color: var(--mut); }
  .note { padding: 1rem 1.2rem; border-radius: var(--radius); background: var(--bg-2); color: var(--ink-2); border: 1px solid var(--line); margin-block-end: 1rem; }
  /* unverified values: a quiet dash, explained by a legend, instead of a pill in every cell */
  .pending { color: var(--mut); cursor: help; text-decoration: underline dotted color-mix(in oklch, var(--mut) 60%, transparent); text-underline-offset: 4px; }
  .legend { display: inline-flex; align-items: center; gap: .5rem; font-size: var(--step--1); color: var(--mut); }
  .legend .pending { text-decoration: none; }

  /* buttons */
  .btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 46px; padding: 0 1.25rem; border-radius: 999px; border: 1.5px solid transparent; font-weight: 700; font-size: .98rem; text-decoration: none; cursor: pointer; white-space: nowrap; transition: background-color .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease), translate .18s var(--ease); }
  .btn:active { translate: 0 1px; }
  .btn--lime, .btn--lime:hover { background: var(--lime); color: var(--on-lime); }
  .btn--lime:hover { background: var(--lime-2); }
  .btn--ink { background: var(--on-lime); color: var(--lime); } .btn--ink:hover { color: var(--lime-2); }
  .btn--line { border-color: var(--line-2); color: var(--ink); background: transparent; } .btn--line:hover { border-color: var(--lime); color: var(--ink); }
  .btn--ghost { border-color: var(--line); color: var(--ink-2); background: transparent; } .btn--ghost:hover { color: var(--ink); border-color: var(--line-2); }
  .btn--coral { background: var(--bg-3); color: var(--ink); }
  .btn--sm { min-height: 40px; padding: 0 1rem; font-size: .9rem; }
  .btn--xl { min-height: 56px; padding: 0 1.6rem; font-size: 1.05rem; border-radius: var(--radius); }
  .pill { display: inline-flex; align-items: center; min-height: 40px; padding: 0 1rem; border-radius: 999px; border: 1px solid var(--line); background: transparent; color: var(--ink-2); font-weight: 600; font-size: .92rem; text-decoration: none; cursor: pointer; transition: border-color .15s, color .15s, background-color .15s; }
  .pill:hover { border-color: var(--line-2); color: var(--ink); }
  .pill.is-on { background: var(--ink); border-color: var(--ink); color: var(--bg); }
  .chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-block: 1rem; }
  .chip { display: inline-flex; align-items: center; gap: .4rem; padding: .2rem .65rem; border-radius: 999px; border: 1px solid var(--line); font-size: .8rem; font-weight: 600; color: var(--ink-2); }

  /* header: glass, and it tightens once stuck (scroll-state queries; others keep the default look) */
  .site-head { position: sticky; top: 0; z-index: 50; container-type: scroll-state; container-name: head; view-transition-name: site-head; }
  .head-in { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 76px; transition: min-height .25s var(--ease); }
  .site-head::before { content: ""; position: absolute; inset: 0; z-index: -1; background: color-mix(in oklch, var(--bg) 82%, transparent); backdrop-filter: blur(14px) saturate(140%); -webkit-backdrop-filter: blur(14px) saturate(140%); border-block-end: 1px solid transparent; transition: border-color .25s; }
  @container head scroll-state(stuck: top) { .head-in { min-height: 62px; } .brand-tile { width: 36px; height: 36px; font-size: 18px; } }
  @supports not (container-type: scroll-state) { .site-head::before { border-block-end-color: var(--line); } }
  .brand { display: inline-flex; align-items: center; gap: .7rem; color: var(--ink); text-decoration: none; }
  .brand-tile { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 11px; background: var(--lime); color: var(--on-lime); font-family: var(--logo); font-size: 20px; letter-spacing: .02em; transition: width .25s var(--ease), height .25s var(--ease); }
  .brand-name { font-family: var(--logo); font-size: 22px; letter-spacing: .03em; }
  .nav { display: flex; gap: clamp(1rem, 2vw, 1.75rem); }
  .nav a, .head-link { color: var(--ink-2); text-decoration: none; font-weight: 600; font-size: .95rem; }
  .nav a:hover, .head-link:hover { color: var(--ink); }
  .head-cta { display: flex; align-items: center; gap: 1rem; }
  .menu-btn { display: none; width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--line); background: transparent; color: var(--ink); place-items: center; cursor: pointer; }
  .mnav { display: none; flex-direction: column; padding: .5rem clamp(1.1rem, 4vw, 3rem) 1.5rem; border-block-start: 1px solid var(--line); background: var(--bg); }
  .mnav a { padding: .8rem 0; color: var(--ink); text-decoration: none; font-weight: 700; font-size: 1.15rem; border-block-end: 1px solid var(--line); }
  .mnav .btn { margin-block-start: 1rem; border: 0; }
  .menu-open .mnav { display: flex; }

  /* firm finder */
  .picker { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem; align-items: end; max-width: 620px; margin-block-start: 2rem; }
  .pick { display: grid; gap: .45rem; }
  .pick label { font-weight: 600; font-size: var(--step--1); color: var(--ink-2); }
  .pick select, .size-pick select, .tool-in select, .cmp-firm select { appearance: none; min-height: 56px; width: 100%; padding: 0 2.75rem 0 1rem; border-radius: var(--radius); border: 1px solid var(--line-2); background: var(--bg-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23C8CFC2' stroke-width='1.6'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 1rem center; color: var(--ink); font-weight: 600; font-size: 1rem; cursor: pointer; }
  .pick select:hover, .size-pick select:hover, .tool-in select:hover { border-color: var(--ink-2); }
  .size-pick { display: inline-flex; align-items: center; gap: .6rem; font-weight: 600; font-size: .92rem; color: var(--ink-2); flex-wrap: wrap; }
  .size-pick select { min-height: 42px; width: auto; min-width: 110px; font-size: .95rem; }

  /* data tables */
  .table-wrap { position: relative; overflow-x: auto; overflow-y: hidden; border-radius: var(--radius-l); border: 1px solid var(--line); background: var(--bg-2); overscroll-behavior-x: contain; }
  .rank-table { width: 100%; border-collapse: collapse; min-width: 820px; }
  .rank-table th { text-align: left; padding: .9rem 1rem; font-size: .8rem; font-weight: 700; color: var(--mut); letter-spacing: .01em; border-block-end: 1px solid var(--line); white-space: nowrap; background: var(--bg-2); }
  .rank-table td { padding: .85rem 1rem; border-block-start: 1px solid color-mix(in oklch, var(--line) 70%, transparent); color: var(--ink); font-size: .95rem; vertical-align: middle; }
  .rank-table tbody tr { transition: background-color .12s; }
  .rank-table tbody tr:hover { background: color-mix(in oklch, var(--bg-3) 70%, transparent); }
  .rank-table .fm { min-width: 220px; }
  .fm-in { display: flex; align-items: center; gap: .75rem; }
  .fm-n small .tag { white-space: nowrap; }
  .firm-table td.fm, .firm-table th:first-child, .list-table td.fm { position: sticky; left: 0; background: var(--bg-2); z-index: 1; }
  .firm-table tbody tr:hover td.fm { background: var(--bg-3); }
  .fm-n { display: grid; gap: 1px; } .fm-n a { font-weight: 700; text-decoration: none; } .fm-n a:hover { color: var(--lime); }
  .fm-n small { color: var(--mut); font-size: .82rem; }
  .rank-table .sub { display: block; color: var(--mut); font-size: .8rem; }
  .rank-table small { color: var(--mut); }
  .tile { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: var(--bg-3); color: var(--ink-2); font-family: var(--display); font-weight: 800; font-size: 18px; flex-shrink: 0; }
  .tile--lg { width: 46px; height: 46px; border-radius: 12px; font-size: 24px; }
  .rank-ctrl { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-block-end: 1rem; }
  .filters { display: flex; flex-wrap: wrap; gap: .45rem; }

  /* facts (definition rows) */
  .facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-block-start: 1px solid var(--line); }
  .facts div { padding: .9rem .25rem .9rem 0; border-block-end: 1px solid var(--line); }
  .facts dt { font-size: .8rem; font-weight: 600; color: var(--mut); }
  .facts dd { margin: .2rem 0 0; font-weight: 600; font-size: 1rem; color: var(--ink); }
  .rule-list { padding-inline-start: 1.1rem; display: grid; gap: .55rem; color: var(--ink-2); margin-block: .8rem 1rem; }
  .rule-list li::marker { color: var(--lime); }

  /* cards used sparingly: tools and changes only */
  .tools { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); grid-auto-rows: auto; gap: 1rem; }
  .tool { position: relative; display: flex; flex-direction: column; gap: .6rem; padding: clamp(1.25rem, 2.4vw, 1.8rem); border-radius: var(--radius-l); background: var(--bg-2); border: 1px solid var(--line); color: var(--ink); text-decoration: none; transition: border-color .2s var(--ease), background-color .2s var(--ease); }
  .tool:hover { border-color: var(--line-2); background: var(--bg-3); color: var(--ink); }
  .tool:first-child { grid-row: span 3; justify-content: end; min-height: 100%; background: radial-gradient(120% 90% at 100% 0%, color-mix(in oklch, var(--lime) 16%, transparent), transparent 60%), var(--bg-2); }
  .tool .k { margin: 0; color: var(--lime); }
  .tool b { font-family: var(--display); font-weight: 800; font-size: var(--step-2); line-height: .98; }
  .tool:first-child b { font-size: var(--step-3); max-width: 12ch; }
  .tool span:not(.k) { color: var(--ink-2); font-size: .95rem; }
  .tool em { font-style: normal; font-weight: 700; color: var(--lime); font-size: .92rem; margin-block-start: auto; }
  .changes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-block-start: 1px solid var(--line); }
  .changes--list { grid-template-columns: 1fr; }
  .change { display: grid; gap: .25rem; padding: 1.1rem 1rem 1.1rem 0; border-block-end: 1px solid var(--line); color: var(--ink); text-decoration: none; }
  .change:hover b { color: var(--lime); }
  .change time { font-size: .82rem; font-weight: 600; color: var(--mut); }
  .change b { font-size: 1.08rem; } .change span { color: var(--ink-2); font-size: .95rem; }

  /* the alerts band: a quiet panel with one lime action */
  .alerts { margin-block-start: var(--section); display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; padding-block: clamp(2rem, 5vw, 3.5rem); border-block: 1px solid var(--line); }
  .alerts .display { font-size: var(--step-3); max-width: 16ch; }
  .alerts-copy p { color: var(--ink-2); margin-block-start: .9rem; max-width: 52ch; }
  .alerts-form { display: grid; gap: .55rem; }
  .alerts-form label { font-weight: 600; font-size: var(--step--1); color: var(--ink-2); }
  .alerts-row { display: flex; gap: .5rem; padding: .35rem; border-radius: 999px; border: 1px solid var(--line-2); background: var(--bg-2); }
  .alerts-row:focus-within { border-color: var(--lime); }
  .alerts-row input { flex: 1; min-width: 0; border: 0; background: transparent; padding: 0 1rem; min-height: 46px; color: var(--ink); outline: none; }
  .alerts-row input::placeholder { color: var(--mut); }
  .alerts-row .btn { border-radius: 999px; background: var(--lime); color: var(--on-lime); }
  .alerts-note { font-size: var(--step--1); color: var(--mut); }
  .alerts-ok, .alerts-err { display: none; font-weight: 600; }
  .alerts-form.success .alerts-ok, .alerts-form.error .alerts-err { display: block; }
  .alerts-form.success .alerts-row { display: none; }

  /* footer */
  .site-foot { margin-block-start: var(--section); padding-block: 3rem 2.5rem; border-block-start: 1px solid var(--line); background: color-mix(in oklch, var(--bg) 70%, black); }
  .foot-top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1.25rem; margin-block-end: 1.75rem; }
  .foot-nav { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; }
  .foot-nav a { color: var(--ink-2); text-decoration: none; font-weight: 600; font-size: .92rem; } .foot-nav a:hover { color: var(--ink); }
  .disclaimer { font-size: .84rem; line-height: 1.65; color: var(--mut); max-width: 110ch; margin-block-end: .75rem; }
  .foot-copy { font-size: .84rem; color: var(--mut); }

  /* prose */
  .prose { padding-block-start: 1.75rem; max-width: 68ch; color: var(--ink-2); font-size: 1.05rem; line-height: 1.7; }
  .prose > * + * { margin-block-start: 1.1em; }
  .prose h2 { font-family: var(--display); font-weight: 800; font-size: var(--step-2); color: var(--ink); margin-block-start: 2em; line-height: 1; }
  .prose h3 { color: var(--ink); font-size: var(--step-1); margin-block-start: 1.6em; }
  .prose blockquote { margin: 1.5em 0; padding-inline-start: 1.25rem; border-inline-start: 3px solid var(--lime); color: var(--ink); }
  .post-foot { margin-block-start: 2.5rem; padding-block-start: 1.25rem; border-block-start: 1px solid var(--line); }
  .kg-width-wide { width: min(1100px, 92vw); max-width: none; margin-left: 50%; transform: translateX(-50%); }
  .kg-width-full { width: 100vw; max-width: none; margin-left: 50%; transform: translateX(-50%); }
  .kg-width-full img, .kg-width-wide img { width: 100%; }
  .kg-image { border-radius: var(--radius); }
  .page-img { margin-block-start: 1.75rem; border-radius: var(--radius-l); width: 100%; }
  .kg-callout-card, .kg-bookmark-container, .kg-toggle-card { background: var(--bg-2) !important; color: var(--ink) !important; border: 1px solid var(--line) !important; border-radius: var(--radius) !important; }
}

@layer pages {
  /* hero: the headline carries the page; the rule sheet is the one bold moment */
  .hero { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; padding-block: clamp(2.5rem, 7vw, 6rem) 0; }
  .hero-h { font-size: var(--step-5); line-height: .86; letter-spacing: -0.012em; max-width: 14ch; }
  .hero .lead { max-width: 46ch; }
  .hero-status { margin-block-start: 1.25rem; font-size: var(--step--1); color: var(--mut); display: flex; align-items: center; gap: .55rem; }
  .hero-status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 4px color-mix(in oklch, var(--lime) 20%, transparent); }

  .sheet { position: relative; border-radius: var(--radius-l); background: var(--ink); color: oklch(0.2 0.02 160); padding: clamp(1.25rem, 2.6vw, 1.9rem); box-shadow: 0 1px 0 rgb(255 255 255 / .6) inset, 0 30px 60px -30px rgb(0 0 0 / .8); rotate: -1.2deg; }
  .sheet-top { display: flex; justify-content: space-between; align-items: start; gap: 1rem; padding-block-end: 1rem; border-block-end: 2px solid oklch(0.2 0.02 160); }
  .sheet-firm { font-family: var(--display); font-weight: 800; font-size: var(--step-2); line-height: .95; }
  .sheet-prog { font-weight: 600; font-size: .9rem; color: oklch(0.42 0.02 150); margin-block-start: .25rem; }
  .sheet-ok { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .7rem; border-radius: 999px; background: var(--lime); color: var(--on-lime); font-size: .78rem; font-weight: 800; white-space: nowrap; }
  .sheet-rows { display: grid; margin-block: .25rem; }
  .sheet-rows div { display: flex; justify-content: space-between; gap: 1rem; padding-block: .62rem; border-block-end: 1px solid oklch(0.85 0.01 110); }
  .sheet-rows dt { color: oklch(0.42 0.02 150); font-size: .92rem; }
  .sheet-rows dd { margin: 0; font-weight: 700; text-align: right; }
  .sheet-foot { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding-block-start: .9rem; font-size: .8rem; color: oklch(0.42 0.02 150); }
  .sheet-foot a { color: oklch(0.2 0.02 160); font-weight: 700; }
  .sheet-cap { margin-block-start: .9rem; font-size: var(--step--1); color: var(--mut); text-align: center; }
  @media (prefers-reduced-motion: no-preference) {
    .sheet-rows div { animation: tick .5s var(--ease) both; animation-delay: calc(var(--i, 0) * 70ms + 250ms); }
    .sheet { animation: settle .8s var(--ease) both; }
    @keyframes tick { from { opacity: 0; translate: 0 6px; } }
    @keyframes settle { from { opacity: 0; rotate: 0deg; translate: 0 14px; } }
  }

  /* how it works: plain rows, not cards */
  .trust { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 2rem; margin-block-start: var(--section); border-block-start: 1px solid var(--line); }
  .trust div { padding-block: 1.4rem; display: grid; gap: .35rem; align-content: start; }
  .trust b { font-size: 1.05rem; color: var(--ink); }
  .trust span { color: var(--mut); font-size: .95rem; line-height: 1.5; }

  /* lists index: reads like the index at the back of a rulebook */
  .list-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(1.5rem, 3vw, 3rem); }
  .list-group { padding: 0; background: none; border: 0; }
  .list-group h3 { font-family: var(--display); font-weight: 800; font-size: var(--step-2); color: var(--ink); padding-block-end: .6rem; margin: 0 0 .25rem; border-block-end: 2px solid var(--ink); letter-spacing: 0; text-transform: none; }
  .list-group ul { list-style: none; margin: 0; padding: 0; display: block; }
  .list-group li { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding-block: .6rem; border-block-end: 1px solid var(--line); }
  .list-group a { color: var(--ink-2); text-decoration: none; font-weight: 600; }
  .list-group a:hover { color: var(--lime); }
  .list-group small { color: var(--mut); font-weight: 600; margin: 0; }
  .list-why { font-size: var(--step-1); color: var(--ink-2); max-width: 62ch; margin-block-end: .4rem; }
  .list-table { min-width: 900px; }

  /* firm profile: a spec sheet */
  .prof-over .facts { margin-block-start: .5rem; }
  .prof-sum { margin-block-start: 1.4rem; max-width: 62ch; }
  .prof-block { margin-block-start: clamp(2.5rem, 5vw, 3.75rem); }
  .prof-block > .display, .prof-h { font-size: var(--step-3); margin-block-end: 1rem; }
  .prof-h { margin-block-start: clamp(2.5rem, 5vw, 3.75rem); }
  .prog { padding: clamp(1.25rem, 3vw, 2rem); border-radius: var(--radius-l); background: var(--bg-2); border: 1px solid var(--line); scroll-margin-top: 90px; }
  .prog + .prog { margin-block-start: 1rem; }
  .prog-head { display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; margin-block-end: .4rem; }
  .prog-head .display { font-size: var(--step-2); }
  .prog > p { color: var(--ink-2); max-width: 68ch; margin-block-end: 1rem; }
  .facts--sm { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-block-end: 1rem; }
  .facts--sm div { background: none; }
  .prog .table-wrap { background: var(--bg); border-radius: var(--radius); margin-block-start: 1rem; }
  .prog-table { min-width: 720px; }
  .prog-table th { background: var(--bg); }
  .prog-jump { display: flex; flex-wrap: wrap; gap: .5rem; margin-block: -.25rem 1.25rem; }
  .profile-cta { display: flex; gap: .75rem; flex-wrap: wrap; margin-block-start: 2rem; }
  .firm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 0 1.5rem; border-block-start: 1px solid var(--line); }
  .firm-card { display: flex; align-items: center; gap: .9rem; padding-block: 1rem; border-block-end: 1px solid var(--line); text-decoration: none; color: var(--ink); background: none; border-radius: 0; }
  .firm-card b { font-size: 1.02rem; } .firm-card small { display: block; color: var(--mut); font-size: .82rem; }
  .firm-card:hover b { color: var(--lime); }
  .firm-card > b, .firm-card > small { display: block; }

  /* tools */
  .tool-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 1.25rem; align-items: start; }
  .tool-in, .tool-out, .quiz { padding: clamp(1.25rem, 2.5vw, 1.75rem); border-radius: var(--radius-l); background: var(--bg-2); border: 1px solid var(--line); min-width: 0; }
  .tool-in { display: grid; gap: 1rem; }
  .tool-in label { display: grid; gap: .45rem; font-weight: 600; font-size: .92rem; color: var(--ink-2); min-width: 0; }
  .tool-in .size-pick { display: inline-flex; }
  .tool-in textarea { padding: .9rem 1rem; border-radius: var(--radius); background: var(--bg); color: var(--ink); border: 1px solid var(--line-2); font-size: .95rem; line-height: 1.7; resize: vertical; }
  .tool-in input[type=range] { width: 100%; }
  output { color: var(--ink); font-weight: 700; }
  .tool-out { min-height: 220px; }
  .chart { width: 100%; height: auto; margin-block-end: .75rem; }
  .sv-line { margin-block-start: .5rem; } .sv-a b { color: var(--lime); }
  .cost-lines { display: grid; gap: .1rem; border-block-start: 1px solid var(--line); margin-block-start: .5rem; }
  .cost-lines div { display: flex; justify-content: space-between; gap: 1rem; padding: .8rem 0; border-block-end: 1px solid var(--line); border-radius: 0; background: none; }
  .cost-lines dt { color: var(--ink-2); } .cost-lines dd { margin: 0; font-weight: 700; }
  .cost-total { border: 0 !important; } .cost-total dt { color: var(--ink); font-weight: 800; } .cost-total dd { font-family: var(--display); font-weight: 800; font-size: var(--step-3); color: var(--lime); line-height: 1; }
  .quiz { display: grid; gap: 1.4rem; margin-block-end: 1rem; }
  .quiz fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
  .quiz legend { font-weight: 700; margin-block-end: .7rem; font-size: 1.05rem; }
  .opt { position: relative; display: inline-flex; align-items: center; min-height: 42px; padding: 0 1rem; border-radius: 999px; border: 1px solid var(--line); cursor: pointer; font-weight: 600; color: var(--ink-2); transition: border-color .15s, background-color .15s, color .15s; }
  .opt:hover { border-color: var(--line-2); color: var(--ink); }
  .opt input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
  .opt:has(input:checked) { background: var(--ink); border-color: var(--ink); color: var(--bg); }
  .opt:has(input:focus-visible) { outline: 2px solid var(--lime); outline-offset: 2px; }
  .quiz .btn { justify-self: start; }

  /* method */
  .method-list { margin: 0 0 3rem; padding: 0; list-style: none; display: grid; max-width: 78ch; counter-reset: rule; border-block-start: 1px solid var(--line); }
  .method-list li { padding: 1.1rem 0; border-block-end: 1px solid var(--line); color: var(--ink-2); }
  .method-list b { color: var(--ink); display: block; margin-block-end: .2rem; }
  .method .display { font-size: var(--step-3); margin-block: 3rem 1rem; }
  .method-sum .lead { max-width: 62ch; }
}

@layer utilities {
  .skip { position: absolute; left: -999px; top: 8px; z-index: 100; padding: .6rem .9rem; border-radius: 10px; background: var(--lime); color: var(--on-lime); font-weight: 700; }
  .skip:focus { left: 8px; }
  .sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .lime { color: var(--lime); }
}

/* responsive */
@media (max-width: 1080px) {
  .nav { display: none; } .menu-btn { display: inline-grid; } .head-cta .btn, .head-link { display: none; }
  .hero { grid-template-columns: 1fr; } .sheet { max-width: 560px; }
  .tools { grid-template-columns: 1fr; } .tool:first-child { grid-row: auto; min-height: 320px; }
  .trust { grid-template-columns: 1fr 1fr; }
  .facts, .facts--sm { grid-template-columns: 1fr 1fr; }
  .list-links { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .picker { grid-template-columns: 1fr; }
  .alerts, .tool-grid, .changes { grid-template-columns: 1fr; }
  .list-links { grid-template-columns: 1fr; gap: 2rem; }
  .sheet { rotate: 0deg; }
}
@media (max-width: 520px) {
  .tools, .trust, .facts { grid-template-columns: 1fr; } .facts--sm { grid-template-columns: 1fr 1fr; gap: 0 1rem; } .tool:first-child { grid-column: auto; }
  .brand-name { font-size: 19px; }
  .alerts-row { flex-direction: column; border-radius: var(--radius); } .alerts-row .btn { border-radius: var(--radius); }
}
@layer components {
  .rank-table td a { text-decoration: none; font-weight: 600; }
  .rank-table td a:hover { color: var(--lime); text-decoration: underline; }
  @media (max-width: 760px) { .rank-table .fm { min-width: 170px; } .rank-table td, .rank-table th { padding-inline: .75rem; } }
}
@layer components {
  .tool-art { width: 100%; max-width: 440px; color: var(--ink-2); margin-block: auto 1.25rem; }
  .tool:first-child { justify-content: flex-start; }
}

/* ================= 4.0: the board ================= */
@layer components {
  /* monogram: a quiet colored tile per firm, generated from its ID (no logos without permission) */
  .mono { --h: 150; display: inline-grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border-radius: 10px;
    background: oklch(0.34 0.07 var(--h)); color: oklch(0.94 0.05 var(--h)); box-shadow: inset 0 0 0 1px oklch(0.46 0.08 var(--h) / .55);
    font-family: var(--display); font-weight: 800; font-size: 17px; letter-spacing: .02em; line-height: 1; }
  .mono--lg { width: 48px; height: 48px; border-radius: 12px; font-size: 21px; }
  .mono--xl { width: 92px; height: 92px; border-radius: 22px; font-size: 40px; }
  .mono--page { background: var(--bg-3); color: var(--mut); box-shadow: none; font-family: var(--sans); font-size: 16px; }

  /* data meter: how much of a row is verified. It measures our data, not the firm. */
  .meter { display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; cursor: help; }
  .meter-bar { position: relative; width: 46px; height: 6px; border-radius: 99px; background: var(--line); overflow: hidden; }
  .meter-bar i { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: color-mix(in oklch, var(--lime) 75%, var(--ink-2)); }
  .meter-n { font-size: .8rem; font-weight: 600; color: var(--ink-2); font-variant-numeric: tabular-nums; }

  .tag { display: inline-block; margin-inline-start: .35rem; padding: 0 .45rem; border-radius: 99px; border: 1px solid color-mix(in oklch, var(--lime) 55%, transparent); color: var(--lime); font-size: .72rem; font-weight: 700; line-height: 1.5; vertical-align: 1px; }
  .chip--hi { border-color: color-mix(in oklch, var(--lime) 55%, transparent); color: var(--lime); }
  .pill[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--bg); }
  kbd { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 .35rem; border-radius: 6px; border: 1px solid var(--line-2); font: 600 .75rem/1 var(--sans); color: var(--mut); }
  .linkish { background: none; border: 0; padding: 0; color: var(--ink); text-decoration: underline; text-decoration-color: var(--lime); cursor: pointer; }

  /* ticker: the "live" line above the header */
  .ticker { background: color-mix(in oklch, var(--bg) 55%, black); border-block-end: 1px solid var(--line); font-size: .8rem; color: var(--mut); }
  .tick-in { display: flex; align-items: center; gap: 1.5rem; min-height: 34px; overflow: hidden; white-space: nowrap; }
  .tick-live { display: inline-flex; align-items: center; gap: .5rem; color: var(--ink-2); font-weight: 600; }
  .tick-live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 3px color-mix(in oklch, var(--lime) 22%, transparent); }
  .tick-news { overflow: hidden; text-overflow: ellipsis; color: var(--ink-2); text-decoration: none; }
  .tick-news span { color: var(--lime); font-weight: 700; margin-inline-end: .35rem; }
  .tick-news:hover { color: var(--ink); }
  .tick-meta { margin-inline-start: auto; }
  @media (prefers-reduced-motion: no-preference) { .tick-live::before { animation: beat 2.4s ease-in-out infinite; } @keyframes beat { 50% { box-shadow: 0 0 0 6px color-mix(in oklch, var(--lime) 0%, transparent); } } }

  /* header search */
  .find-btn { display: inline-flex; align-items: center; gap: .6rem; min-height: 40px; padding: 0 .55rem 0 .85rem; border-radius: 999px; border: 1px solid var(--line-2); background: var(--bg-2); color: var(--mut); font-weight: 600; font-size: .9rem; cursor: pointer; transition: border-color .15s, color .15s; }
  .find-btn:hover { border-color: var(--ink-2); color: var(--ink); }
  .find-lab { min-width: 7.5rem; text-align: left; }

  /* quick find dialog */
  .find { width: min(640px, calc(100vw - 2rem)); max-height: min(560px, 80vh); margin: 12vh auto auto; padding: 0; border: 1px solid var(--line-2); border-radius: var(--radius-l); background: var(--bg-2); color: var(--ink); box-shadow: 0 40px 80px -30px rgb(0 0 0 / .8); overflow: hidden; }
  .find::backdrop { background: rgb(0 0 0 / .55); backdrop-filter: blur(3px); }
  .find-in { display: flex; align-items: center; gap: .75rem; padding: .5rem .75rem .5rem 1.1rem; border-block-end: 1px solid var(--line); color: var(--mut); }
  .find-in input { flex: 1; min-width: 0; min-height: 54px; border: 0; background: transparent; outline: none; font-size: 1.1rem; font-weight: 600; color: var(--ink); }
  .find-in input::-webkit-search-cancel-button { display: none; }
  .find-in input::placeholder { color: var(--mut); font-weight: 500; }
  .find-x { min-height: 32px; padding: 0 .6rem; border-radius: 8px; border: 1px solid var(--line-2); background: transparent; color: var(--mut); font-size: .78rem; font-weight: 700; cursor: pointer; }
  .find-list { list-style: none; margin: 0; padding: .5rem; overflow-y: auto; max-height: calc(min(560px, 80vh) - 72px); }
  .find-list a { display: flex; align-items: center; gap: .85rem; padding: .6rem .7rem; border-radius: 12px; color: var(--ink); text-decoration: none; }
  .find-list a span:last-child { display: grid; min-width: 0; }
  .find-list b { font-weight: 700; } .find-list small { color: var(--mut); font-size: .82rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .find-list [aria-selected="true"] a, .find-list a:hover { background: var(--bg-3); }
  .find-list [aria-selected="true"] a { box-shadow: inset 3px 0 0 var(--lime); }
  .find-empty { padding: 1rem; color: var(--mut); }

  /* breadcrumb */
  .crumbs { display: flex; gap: .5rem; align-items: center; margin-block-end: .9rem; font-size: var(--step--1); color: var(--mut); font-weight: 600; }
  .crumbs a { color: var(--ink-2); text-decoration: none; } .crumbs a:hover { color: var(--lime); }
}

@layer pages {
  /* hero: shorter, so the board shows on the first screen */
  .hero { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); align-items: end; padding-block: clamp(1.75rem, 3.5vw, 2.75rem) 0; gap: clamp(1.5rem, 4vw, 4rem); }
  .hero-h { font-size: clamp(2.5rem, 1.7rem + 2.9vw, 4.5rem); line-height: .9; max-width: 20ch; }
  .hero .lead { max-width: 58ch; margin-block-start: 1rem; }
  .stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-block-start: 1px solid var(--line); }
  .stats div { display: flex; flex-direction: column-reverse; gap: .15rem; padding: .8rem 1rem .8rem 0; border-block-end: 1px solid var(--line); }
  .stats div:nth-child(odd) { border-inline-end: 1px solid var(--line); }
  .stats div:nth-child(even) { padding-inline-start: 1.25rem; }
  .stats dt { font-size: .85rem; font-weight: 600; color: var(--mut); }
  .stats dd { margin: 0; font-family: var(--display); font-weight: 800; font-size: clamp(2rem, 1.5rem + 1.5vw, 3rem); line-height: .95; color: var(--ink); font-variant-numeric: tabular-nums; }

  /* the board */
  .board-sec { padding-block-start: clamp(1.75rem, 3.5vw, 2.75rem); scroll-margin-top: 80px; }
  .board-bar { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
  .search { position: relative; flex: 1 1 320px; display: flex; align-items: center; color: var(--mut); }
  .search svg { position: absolute; left: 1.05rem; pointer-events: none; }
  .search input { width: 100%; min-height: 54px; padding: 0 1rem 0 2.9rem; border-radius: var(--radius); border: 1px solid var(--line-2); background: var(--bg-2); color: var(--ink); font-size: 1.02rem; font-weight: 600; outline: none; transition: border-color .15s; }
  .search input::placeholder { color: var(--mut); font-weight: 500; }
  .search input:focus { border-color: var(--lime); }
  .seg { display: inline-flex; padding: 4px; gap: 2px; border-radius: var(--radius); border: 1px solid var(--line-2); background: var(--bg-2); }
  .seg button { min-height: 44px; min-width: 56px; padding: 0 .8rem; border: 0; border-radius: 10px; background: transparent; color: var(--ink-2); font-weight: 700; font-size: .95rem; cursor: pointer; font-variant-numeric: tabular-nums; }
  .seg button:hover { color: var(--ink); background: var(--bg-3); }
  .seg button[aria-pressed="true"] { background: var(--ink); color: var(--bg); }
  .board-sub { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .75rem 1.5rem; margin-block: .85rem 1.1rem; }
  .board-sub .pill { min-height: 36px; font-size: .88rem; }
  .switch { display: inline-flex; align-items: center; gap: .6rem; font-size: .9rem; font-weight: 600; color: var(--ink-2); cursor: pointer; }
  .switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
  .switch span { position: relative; width: 38px; height: 22px; border-radius: 99px; background: var(--line-2); transition: background-color .15s; flex-shrink: 0; }
  .switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--ink); transition: translate .15s var(--ease); }
  .switch input:checked + span { background: var(--lime); } .switch input:checked + span::after { translate: 16px 0; background: var(--on-lime); }
  .switch input:focus-visible + span { outline: 2px solid var(--lime); outline-offset: 3px; }
  .board-count { font-size: var(--step--1); color: var(--mut); margin-block-end: .7rem; } .board-count b { color: var(--ink); }
  .board { min-width: 1080px; }
  .board thead th { position: relative; padding-block: .75rem; background: color-mix(in oklch, var(--bg-2) 60%, var(--bg)); }
  .sort { display: inline-flex; align-items: center; gap: .4rem; padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
  .sort:hover { color: var(--ink); }
  .sort svg path { fill: currentColor; opacity: .35; }
  [aria-sort="ascending"] .sort, [aria-sort="descending"] .sort { color: var(--ink); }
  [aria-sort="ascending"] .sort .up, [aria-sort="descending"] .sort .dn { opacity: 1; fill: var(--lime); }
  .board tbody th, .board tbody td { padding-block: .8rem; }
  .board tbody th { font-weight: 400; text-align: left; }
  .rank-table tbody th { border-block-start: 1px solid color-mix(in oklch, var(--line) 70%, transparent); padding: .85rem 1rem; text-align: left; }
  .prog-table tbody th b { font-family: var(--display); font-size: 1.15rem; }
  .board td { white-space: nowrap; font-weight: 600; }
  .board td small { font-weight: 500; }
  .board .fm { min-width: 300px; }
  .board tbody th.fm { white-space: normal; border-block-end: 0; }
  .board { border-collapse: separate; border-spacing: 0; }
  .board tbody tr > th, .board tbody tr > td { border-block-start: 1px solid var(--line); }
  .board tbody tr:first-child > th, .board tbody tr:first-child > td { border-block-start: 0; }
  .board .plats { white-space: nowrap; }
  .board .fm-n a { font-size: 1rem; }
  .board .plats { font-weight: 500; color: var(--ink-2); font-size: .9rem; }
  .board .data-c .sub { margin-block-start: .2rem; }
  .board tbody tr:hover th.fm { background: var(--bg-3); }
  .firm-table th.fm { position: sticky; left: 0; background: var(--bg-2); z-index: 1; }
  .board-more { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; margin-block-start: 1.1rem; }
  .board-sec .legend { margin-block-start: .9rem; }

  /* trust row sits under the board now */
  .trust { margin-block-start: clamp(2.5rem, 5vw, 4rem); }
  .trust span a { font-weight: 600; white-space: nowrap; }

  /* firm grid: name, country, how much is verified */
  .firm-grid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0 2rem; }
  .firm-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .9rem; }
  .fc-n { display: grid; min-width: 0; } .fc-n small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

  /* firm profile */
  .page-top--tight { padding-block-start: clamp(1.75rem, 4vw, 3rem); }
  .page-top--tight .display { font-size: clamp(2.6rem, 1.7rem + 3.4vw, 5rem); }
  .prof-wrap { padding-block-start: 1.5rem; }
  .prof-hero { padding: clamp(1.25rem, 3vw, 2rem); border-radius: var(--radius-l); border: 1px solid var(--line); background: radial-gradient(90% 120% at 0% 0%, oklch(0.30 0.05 var(--ph, 150) / .35), transparent 60%), var(--bg-2); }
  .ph-id { display: flex; gap: clamp(1rem, 2.5vw, 1.75rem); align-items: flex-start; }
  .ph-sum { font-size: var(--step-1); line-height: 1.45; color: var(--ink); max-width: 60ch; }
  .ph-cta { display: flex; flex-wrap: wrap; gap: .6rem; margin-block-start: 1.1rem; }
  .ph-cta:empty { display: none; }
  .ph-stats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin-block-start: clamp(1.25rem, 3vw, 2rem); border-block-start: 1px solid var(--line); }
  .ph-stats div { padding: .95rem 1rem .2rem 0; min-width: 0; }
  .ph-stats div + div { padding-inline-start: 1rem; border-inline-start: 1px solid var(--line); }
  .ph-stats dt { font-size: .8rem; font-weight: 600; color: var(--mut); }
  .ph-stats dd { margin: .3rem 0 0; font-weight: 700; font-size: 1.05rem; overflow-wrap: anywhere; }
  .ph-plats { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin-block-start: 1.25rem; }
  .ph-lab { font-size: .8rem; font-weight: 600; color: var(--mut); margin-inline-end: .35rem; }
  .prof-hero > .small { margin-block-start: .9rem; }
  .prog-jump { position: sticky; top: 62px; z-index: 5; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 1.25rem 0 0; padding-block: .6rem; background: color-mix(in oklch, var(--bg) 88%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
  .prog-jump .pill { flex-shrink: 0; min-height: 36px; font-size: .88rem; }
  .prog-head .meter { margin-inline-start: auto; }
  .prof-block, .prog { scroll-margin-top: 130px; }
  .src-list { padding-inline-start: 1.4rem; display: grid; gap: .5rem; color: var(--ink-2); }
  .src-list small { color: var(--mut); }
  .prof-foot { margin-block-start: 2rem; }
  .list-table th.fm { font-weight: 600; white-space: nowrap; }
  .list-table th.fm .mono { display: inline-grid; vertical-align: middle; margin-inline-end: .7rem; }
  .list-table th.fm a { font-weight: 700; font-size: 1rem; text-decoration: none; }
  .list-table th.fm a:hover { color: var(--lime); }
  .list-table td { white-space: nowrap; }
  .list-why { font-size: var(--step-1); line-height: 1.5; margin-block-end: .6rem; }
}

/* 4.0 responsive */
@media (max-width: 1180px) {
  .find-lab { display: none; } .find-btn { padding: 0 .75rem; } .find-btn kbd { display: none; }
  .ph-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ph-stats div:nth-child(4) { border-inline-start: 0; padding-inline-start: 0; }
}
@media (max-width: 1080px) {
  .head-cta .find-btn { display: inline-flex; }
  .hero { grid-template-columns: 1fr; align-items: start; }
  .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .stats div:nth-child(odd) { border-inline-end: 0; }
  .stats div + div { padding-inline-start: 1rem; border-inline-start: 1px solid var(--line); }
  .tick-meta { display: none; }
}
@media (max-width: 760px) {
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stats div:nth-child(3) { border-inline-start: 0; padding-inline-start: 0; }
  .seg { width: 100%; } .seg button { flex: 1; min-width: 0; padding: 0 .3rem; }
  .board-sub .filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(-1 * clamp(1.1rem, 4vw, 3rem)); padding-inline: clamp(1.1rem, 4vw, 3rem); width: calc(100% + 2 * clamp(1.1rem, 4vw, 3rem)); }
  .board-sub .pill { flex-shrink: 0; }
  /* the board becomes one card per program */
  .board-wrap { overflow: visible; border: 0; background: none; border-radius: 0; }
  .board { min-width: 0; display: block; }
  .board thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .board tbody { display: grid; gap: .75rem; }
  .board tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .1rem 1rem; padding: 1rem; border-radius: var(--radius); border: 1px solid var(--line); background: var(--bg-2); }
  .board tbody tr:hover { background: var(--bg-2); }
  .board th.fm { grid-column: 1 / -1; position: static; min-width: 0; padding: 0 0 .75rem; margin-block-end: .25rem; border: 0; border-block-end: 1px solid var(--line); background: none !important; }
  .board td { display: block; padding: .45rem 0; border: 0; white-space: normal; }
  .board td::before { content: attr(data-l); display: block; font-size: .75rem; font-weight: 600; color: var(--mut); margin-block-end: .1rem; }
  .board td.data-c { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .75rem; padding-block-start: .7rem; margin-block-start: .25rem; border-block-start: 1px solid var(--line); }
  .board td.data-c::before { margin: 0; }
  .board td.data-c .sub { margin: 0 0 0 auto; }
  .ph-id > .mono--xl { display: none; }
  .ph-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ph-stats div + div { border-inline-start: 0; padding-inline-start: 0; }
  .ph-stats div:nth-child(even) { padding-inline-start: 1rem; border-inline-start: 1px solid var(--line); }
  .prog-jump { margin-inline: calc(-1 * clamp(1.1rem, 4vw, 3rem)); padding-inline: clamp(1.1rem, 4vw, 3rem); }
  .prog-head .meter { margin-inline-start: 0; width: 100%; }
  .firm-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .head-cta .find-btn { min-height: 44px; }
  .tick-in { gap: 1rem; font-size: .76rem; }
  .tick-news { display: none; }
}

/* ================= 5.0: light, Geist ================= */
@layer pages {
  body { background: var(--bg); }
  a:hover { color: var(--ink); text-decoration-color: var(--lime); text-decoration-thickness: 2.5px; }
  .display { font-weight: 650; letter-spacing: -0.035em; line-height: 1.02; }
  .page-top .display, .hero-h, .page-top--tight .display { letter-spacing: -0.04em; line-height: .98; }
  .hero-h { font-size: clamp(2.3rem, 1.5rem + 2.7vw, 4.1rem); max-width: 16ch; }
  .lead { color: var(--ink-2); }
  .block-head .display, .sub-h { font-size: var(--step-3); }

  /* header and ticker */
  .ticker { background: var(--bg-3); border-block-end: 1px solid var(--line); }
  .tick-news span { display: inline-block; padding: .05rem .5rem; border-radius: 999px; background: var(--lime); color: var(--on-lime); font-weight: 700; font-size: .72rem; margin-inline-end: .45rem; vertical-align: 1px; }
  .site-head::before { background: color-mix(in srgb, var(--bg-2) 84%, transparent); border-block-end-color: transparent; }
  @container head scroll-state(stuck: top) { .site-head::before { border-block-end-color: var(--line); box-shadow: 0 6px 24px -20px rgb(17 18 20 / .25); } }
  .brand-tile { font-weight: 800; letter-spacing: -0.02em; font-size: 17px; border-radius: 12px; }
  .brand-name { font-weight: 750; font-size: 19px; letter-spacing: -0.03em; }
  .nav a { color: var(--ink-2); } .nav a:hover, .nav a[aria-current] { color: var(--ink); }
  .find-btn { background: var(--bg-2); border-color: var(--line); box-shadow: var(--shadow-s); }
  .find-btn:hover { border-color: var(--line-2); }
  .menu-btn { background: var(--bg-2); }
  .mnav { background: var(--bg-2); }

  /* buttons, chips */
  .btn--lime, .btn--lime:hover { box-shadow: 0 1px 0 rgb(17 18 20 / .06), 0 8px 20px -10px color-mix(in srgb, var(--lime) 90%, var(--deep)); }
  .btn--line { background: var(--bg-2); border-color: var(--line-2); box-shadow: var(--shadow-s); } .btn--line:hover { border-color: var(--ink); }
  .pill { background: var(--bg-2); border-color: var(--line); } .pill:hover { border-color: var(--line-2); background: var(--bg-3); }
  .pill[aria-pressed="true"], .pill.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
  .chip { background: var(--bg-2); }
  .tag { background: var(--lime); border-color: var(--lime); color: var(--on-lime); }
  .chip--hi { background: var(--lime); border-color: var(--lime); color: var(--on-lime); }
  kbd { background: var(--bg-3); border-color: transparent; }

  /* stats: four white tiles */
  .stats { gap: .6rem; border: 0; }
  .stats div { border: 1px solid var(--line) !important; border-radius: var(--radius); background: var(--bg-2); padding: .9rem 1rem !important; box-shadow: var(--shadow-s); }
  .stats dd { font-family: var(--display); font-weight: 650; letter-spacing: -0.04em; font-size: clamp(1.9rem, 1.4rem + 1.3vw, 2.6rem); }

  /* board */
  .search input { background: var(--bg-2); border-color: var(--line); box-shadow: var(--shadow-s); }
  .search input:focus { border-color: var(--ink); box-shadow: 0 0 0 4px color-mix(in srgb, var(--lime) 45%, transparent); }
  .seg { background: var(--bg-3); border-color: transparent; }
  .seg button { color: var(--ink-2); }
  .seg button:hover { background: color-mix(in srgb, var(--bg-2) 60%, transparent); color: var(--ink); }
  .seg button[aria-pressed="true"] { background: var(--bg-2); color: var(--ink); box-shadow: var(--shadow-s); }
  .switch span { background: var(--line-2); } .switch span::after { background: #fff; box-shadow: 0 1px 2px rgb(0 0 0 / .2); }
  .switch input:checked + span::after { background: #fff; }
  .table-wrap { background: var(--bg-2); border-color: var(--line); box-shadow: var(--shadow); }
  .rank-table th { background: var(--bg-2); color: var(--mut); }
  .board thead th { background: #FAFAF8; border-block-end: 1px solid var(--line); }
  .rank-table td, .rank-table tbody th { border-block-start-color: var(--line); }
  .rank-table tbody tr:hover { background: #FAFAF6; }
  .board tbody tr:hover th.fm { background: #FAFAF6; }
  .firm-table th.fm { background: var(--bg-2); }
  .prog .table-wrap { background: var(--bg-2); box-shadow: none; }
  .meter-bar { background: var(--bg-3); } .meter-bar i { background: color-mix(in srgb, var(--lime) 85%, var(--deep)); }
  .meter-n { color: var(--ink-2); }
  .pending { color: var(--mut); }
  .board-count b { color: var(--ink); }
  [aria-sort="ascending"] .sort .up, [aria-sort="descending"] .sort .dn { fill: var(--ink); }

  /* monograms: pastel tile, deep letter */
  .mono { background: oklch(0.93 0.045 var(--h)); color: oklch(0.42 0.12 var(--h)); box-shadow: inset 0 0 0 1px oklch(0.86 0.06 var(--h)); }
  .mono--page { background: var(--bg-3); color: var(--mut); box-shadow: none; }

  /* cards */
  .tool { background: var(--bg-2); border-color: var(--line); box-shadow: var(--shadow); }
  .tool:hover { border-color: var(--line-2); translate: 0 -2px; }
  .tool .k { color: var(--mut); }
  .tool b { font-family: var(--display); font-weight: 650; letter-spacing: -0.03em; line-height: 1.08; }
  .tool em { color: var(--ink); text-decoration: underline; text-decoration-color: var(--lime); text-decoration-thickness: 2px; text-underline-offset: 4px; }
  .tool-art { color: var(--ink-2); }
  .change:hover b { color: var(--ink); text-decoration: underline; text-decoration-color: var(--lime); text-decoration-thickness: 2px; }
  .firm-card { background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--radius); padding: .9rem 1rem; margin-block-end: .6rem; box-shadow: var(--shadow-s); transition: border-color .15s, translate .15s var(--ease); }
  .firm-card:hover { border-color: var(--line-2); translate: 0 -1px; }
  .firm-grid { gap: 0 .75rem; }
  .note { background: var(--bg-2); }
  .prof-hero { background: var(--bg-2); box-shadow: var(--shadow); }
  .prof-hero::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(70% 90% at 0% 0%, oklch(0.93 0.05 var(--ph, 150) / .9), transparent 60%); pointer-events: none; }
  .prof-hero { position: relative; } .prof-hero > * { position: relative; }
  .prog { background: var(--bg-2); box-shadow: var(--shadow); }
  .prog-jump { background: color-mix(in srgb, var(--bg) 88%, transparent); }
  .find { background: var(--bg-2); border-color: var(--line); box-shadow: 0 30px 80px -20px rgb(17 18 20 / .35); }
  .find::backdrop { background: rgb(17 18 20 / .35); }
  .find-list [aria-selected="true"] a, .find-list a:hover { background: var(--bg-3); }
  .alerts-row { background: var(--bg-2); border-color: var(--line-2); box-shadow: var(--shadow-s); }
  .alerts-row:focus-within { border-color: var(--ink); }
  .trust b { color: var(--ink); }

  /* hero glow, one, and quiet */
  .hero { position: relative; }
  .hero::before { content: ""; position: absolute; z-index: -1; inset: -40% -10% auto auto; width: 60%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--lime) 28%, transparent), transparent 70%); pointer-events: none; }
  html { background: var(--bg); }

  /* footer: neutral ink, not green */
  .site-foot { background: var(--ink); color: #C9CBD1; border: 0; }
  .site-foot .brand { color: #fff; } .site-foot .foot-nav a { color: #C9CBD1; } .site-foot .foot-nav a:hover { color: #fff; }
  .site-foot .foot-copy, .site-foot .disclaimer { color: #9A9DA6; }
  .site-foot a { color: #E6E7EA; }

  /* list groups as cards */
  .list-group { background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--radius-l); padding: 1.1rem 1.25rem .5rem; box-shadow: var(--shadow-s); }
  .list-group h3 { font-family: var(--display); font-weight: 650; letter-spacing: -0.02em; font-size: var(--step-1); border: 0; padding: 0 0 .6rem; }
  .list-group li:last-child, .list-group li:last-child a { border-block-end: 0; }
  .list-links { gap: .75rem; }
  .prof-block > .display, .prof-h { font-size: var(--step-2); }
  .hero { isolation: isolate; }
  /* prose */
  .prose h2 { font-weight: 650; letter-spacing: -0.03em; }
}

/* ================= 5.1: homepage order ================= */
@layer pages {
  .proof { list-style: none; margin: 1.1rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; font-size: var(--step--1); font-weight: 600; color: var(--ink-2); }
  .proof li { display: inline-flex; align-items: center; gap: .45rem; }
  .proof li::before { content: ""; width: 18px; height: 18px; border-radius: 50%; background: var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111214' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7'/%3E%3C/svg%3E") center / 11px no-repeat; flex-shrink: 0; }
  .steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; counter-reset: step; }
  .steps li { display: grid; gap: .45rem; align-content: start; padding: 1.25rem 1.25rem 1.4rem; border-radius: var(--radius-l); background: var(--bg-2); border: 1px solid var(--line); box-shadow: var(--shadow-s); }
  .step-n { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: var(--lime); color: var(--on-lime); font-weight: 750; font-size: .95rem; margin-block-end: .5rem; }
  .steps b { font-size: 1.08rem; letter-spacing: -0.01em; line-height: 1.3; }
  .steps span:not(.step-n) { color: var(--ink-2); font-size: .95rem; line-height: 1.55; }
  .steps a { font-weight: 600; }
}
@media (max-width: 1080px) { .steps { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .steps { grid-template-columns: 1fr; } .proof { flex-direction: column; gap: .45rem; } }

/* ================= 5.2: markets ================= */
@layer pages {
  .markets { display: flex; flex-wrap: wrap; gap: .35rem; margin-block-end: .75rem; }
  .mkt { display: inline-flex; align-items: center; gap: .45rem; min-height: 38px; padding: 0 .9rem; border-radius: 999px; border: 1px solid transparent; background: transparent; color: var(--ink-2); font-weight: 650; font-size: .95rem; cursor: pointer; }
  .mkt:hover { background: var(--bg-3); color: var(--ink); }
  .mkt[aria-pressed="true"] { background: var(--ink); color: #fff; }
  .mkt-n { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 .4rem; border-radius: 999px; background: var(--bg-3); color: var(--ink-2); font-size: .74rem; font-weight: 700; }
  .mkt[aria-pressed="true"] .mkt-n { background: var(--lime); color: var(--on-lime); }
  .mkt--soon { color: var(--mut); cursor: default; }
  .mkt--soon .mkt-n { background: transparent; border: 1px dashed var(--line-2); color: var(--mut); text-transform: uppercase; letter-spacing: .04em; font-size: .66rem; }
  .fm-n .mk { color: var(--mut); }
  .fm-n .mk::after { content: " \00b7 "; }
}
@media (max-width: 520px) { .markets { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .mkt { flex-shrink: 0; } }

/* ================= 5.3: second accent, size picker, FAQ ================= */
@layer pages {
  /* indigo = "know": navigation, market context, sort state, live tags. lime = "do": actions and verified. */
  a:hover { text-decoration-color: var(--ink-2b); }
  .nav a[aria-current], .nav a:hover { color: var(--ink-2b); }
  .tick-news span { background: var(--ink-2b); color: #fff; }
  .mkt[aria-pressed="true"] { background: var(--ink-2b); }
  .mkt[aria-pressed="true"] .mkt-n { background: #fff; color: var(--ink-2b); }
  .fm-n .mk { color: var(--ink-2b); font-weight: 600; }
  .pill[aria-pressed="true"], .pill.is-on { background: var(--ink-2b); border-color: var(--ink-2b); }
  [aria-sort="ascending"] .sort .up, [aria-sort="descending"] .sort .dn { fill: var(--ink-2b); }
  [aria-sort="ascending"] .sort, [aria-sort="descending"] .sort { color: var(--ink-2b); }
  .find-list [aria-selected="true"] a { box-shadow: inset 3px 0 0 var(--ink-2b); }
  .crumbs a:hover, .more:hover, .tool em { color: var(--ink-2b); text-decoration-color: var(--ink-2b); }
  .step-n { background: var(--ink-2b-soft); color: var(--ink-2b); }
  .tag { background: var(--ink-2b-soft); border-color: transparent; color: var(--ink-2b); }
  .chip--hi { background: var(--ink-2b-soft); border-color: transparent; color: var(--ink-2b); }
  .hero::before { background: radial-gradient(closest-side, color-mix(in srgb, var(--lime) 26%, transparent), transparent 70%); }
  .hero::after { content: ""; position: absolute; z-index: -1; inset: auto auto -30% 20%; width: 40%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--ink-2b) 10%, transparent), transparent 70%); pointer-events: none; }
  .search input:focus { box-shadow: 0 0 0 4px color-mix(in srgb, var(--ink-2b) 18%, transparent); border-color: var(--ink-2b); }
  .size-sel { display: inline-flex; align-items: center; gap: .6rem; min-height: 54px; padding: 0 .5rem 0 1rem; border-radius: var(--radius); border: 1px solid var(--line); background: var(--bg-2); box-shadow: var(--shadow-s); font-weight: 650; color: var(--ink-2); }
  .size-sel select { min-height: 44px; border: 0; background: var(--bg-3); border-radius: 10px; padding: 0 .75rem; font-weight: 700; color: var(--ink); }
  /* FAQ */
  .faq { display: grid; gap: .5rem; max-width: 62rem; }
  .faq details { border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg-2); box-shadow: var(--shadow-s); }
  .faq summary { list-style: none; cursor: pointer; padding: 1rem 1.25rem; font-weight: 650; font-size: 1.05rem; display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
  .faq summary::-webkit-details-marker { display: none; }
  .faq summary::after { content: "+"; font-weight: 500; color: var(--ink-2b); font-size: 1.4rem; line-height: 1; }
  .faq details[open] summary::after { content: "\2212"; }
  .faq details p { padding: 0 1.25rem 1.1rem; color: var(--ink-2); max-width: 70ch; }
}

@layer pages { .seg { flex-wrap: wrap; } }
@layer pages { .sort svg { flex-shrink: 0; } .board { min-width: 1000px; } .board .fm { min-width: 250px; } }
@layer pages { .board .plats { white-space: normal; max-width: 190px; } .board .data-c { white-space: normal; } .board .data-c .sub { white-space: nowrap; } .board .fm { min-width: 230px; } .board td { padding-inline: .8rem; } }

/* ================= 6.0: the terminal (dark, mono data, lime only) ================= */
@layer pages {
  :root { --ink-2b: var(--lime); --ink-2b-soft: color-mix(in srgb, var(--lime) 14%, transparent); }  /* retire the 2nd accent: anything still pointing at it becomes lime */
  html, body { background: var(--bg); }
  a { color: var(--ink); text-decoration-color: color-mix(in srgb, var(--lime) 70%, transparent); }
  a:hover { color: var(--lime); text-decoration-color: var(--lime); text-decoration-thickness: 2px; }
  .display { font-weight: 700; letter-spacing: -0.03em; }
  .lead { color: var(--ink-2); }
  /* mono for data and labels */
  .k, .ph-lab, .facts dt, .ph-stats dt, .stats dt, .steps span.step-n, .rank-table th, .board-count, .legend, .tick-in, kbd, .meter-n, .mkt-n, .chip, .tag, .crumbs, .sub, .rank-table small, .find-list small, .change time, .list-group li small, .hero-status, .alerts-note, .foot-copy { font-family: var(--mono); }
  .rank-table thead th { font-size: .68rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); }
  .rank-table tbody th { font-family: var(--sans); text-transform: none; letter-spacing: 0; }
  .sort { font: inherit; text-transform: inherit; letter-spacing: inherit; }
  .k, .ph-lab, .facts dt, .ph-stats dt, .stats dt, .steps > li > .step-n { font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
  .board td, .prog-table td, .prog-table th, .list-table td, .stats dd, .facts dd, .ph-stats dd, .fm-n small, .size-sel select, .seg button, .price, .board-count b, .quiz-out, .out b { font-family: var(--mono); font-feature-settings: "tnum" 1, "zero" 1; }
  .board td, .prog-table td, .list-table td { font-weight: 500; font-size: .86rem; }
  .board .plats { max-width: 170px; font-size: .8rem; }
  .board .data-c .sub { font-size: .72rem; }
  .board td small, .prog-table td small { font-family: var(--mono); }
  .stats dd { font-family: var(--mono); font-weight: 700; letter-spacing: -0.02em; font-size: clamp(1.9rem, 1.4rem + 1.3vw, 2.6rem); }
  .facts dd, .ph-stats dd { font-weight: 600; font-size: .95rem; }
  .fm-n a { font-family: var(--sans); font-weight: 700; }
  .fm-n small { font-size: .78rem; color: var(--mut); }
  .fm-n .mk { color: var(--lime); font-weight: 600; }
  .board-count { font-size: .8rem; }

  /* surfaces */
  .ticker { background: #000; border-block-end: 1px solid var(--line); color: var(--mut); font-size: .76rem; letter-spacing: .02em; }
  .tick-live { color: var(--ink); }
  .tick-news span { background: var(--lime); color: var(--on-lime); }
  .site-head::before { background: color-mix(in srgb, var(--bg) 84%, transparent); border-block-end-color: var(--line); }
  @container head scroll-state(stuck: top) { .site-head::before { border-block-end-color: var(--line-2); box-shadow: none; } }
  .brand-tile { border-radius: 8px; }
  .nav a { color: var(--ink-2); } .nav a:hover, .nav a[aria-current] { color: var(--lime); }
  .find-btn, .menu-btn { background: var(--bg-2); border-color: var(--line-2); color: var(--mut); box-shadow: none; }
  .find-btn:hover { border-color: var(--lime); color: var(--ink); }
  .mnav { background: var(--bg-2); }
  kbd { background: var(--bg-3); border: 1px solid var(--line-2); color: var(--mut); }
  .btn--lime, .btn--lime:hover { box-shadow: none; }
  .btn--line { background: transparent; border-color: var(--line-2); color: var(--ink); box-shadow: none; } .btn--line:hover { border-color: var(--lime); }
  .pill { background: transparent; border-color: var(--line-2); color: var(--ink-2); } .pill:hover { background: var(--bg-3); color: var(--ink); border-color: var(--line-2); }
  .pill[aria-pressed="true"], .pill.is-on { background: var(--lime); border-color: var(--lime); color: var(--on-lime); }
  .chip { background: var(--bg-3); border-color: transparent; color: var(--ink-2); font-size: .74rem; }
  .tag, .chip--hi { background: color-mix(in srgb, var(--lime) 16%, transparent); border-color: transparent; color: var(--lime); }
  .stats div { background: var(--bg-2); border: 1px solid var(--line) !important; box-shadow: var(--shadow-s); }
  .search input { background: var(--bg-2); border-color: var(--line-2); color: var(--ink); box-shadow: none; }
  .search input:focus { border-color: var(--lime); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lime) 22%, transparent); }
  .seg { background: var(--bg-2); border: 1px solid var(--line-2); }
  .seg button { color: var(--ink-2); font-weight: 600; } .seg button:hover { background: var(--bg-3); color: var(--ink); }
  .seg button[aria-pressed="true"] { background: var(--lime); color: var(--on-lime); box-shadow: none; }
  .size-sel { background: var(--bg-2); border-color: var(--line-2); box-shadow: none; } .size-sel select { background: var(--bg-3); color: var(--ink); }
  .switch span { background: var(--line-2); } .switch span::after { background: var(--ink); box-shadow: none; }
  .switch input:checked + span { background: var(--lime); } .switch input:checked + span::after { background: var(--on-lime); }
  .markets { border-block-end: 1px solid var(--line); padding-block-end: .5rem; margin-block-end: 1rem; }
  .mkt { color: var(--ink-2); border-radius: 6px; } .mkt:hover { background: var(--bg-3); color: var(--ink); }
  .mkt[aria-pressed="true"] { background: transparent; color: var(--lime); box-shadow: inset 0 -2px 0 var(--lime); border-radius: 0; }
  .mkt-n { background: var(--bg-3); color: var(--ink-2); } .mkt[aria-pressed="true"] .mkt-n { background: var(--lime); color: var(--on-lime); }
  .mkt--soon { color: var(--mut); } .mkt--soon .mkt-n { border-color: var(--line-2); color: var(--mut); }
  .table-wrap { background: var(--bg-2); border-color: var(--line); box-shadow: none; border-radius: var(--radius-l); }
  .rank-table th, .board thead th { background: #0A0B0D; border-block-end: 1px solid var(--line-2); }
  .rank-table td, .rank-table tbody th { border-block-start-color: var(--line); }
  .rank-table tbody tr:hover, .board tbody tr:hover th.fm { background: var(--bg-3); }
  .firm-table th.fm { background: var(--bg-2); }
  .prog .table-wrap { background: var(--bg); }
  .meter-bar { background: var(--line-2); } .meter-bar i { background: var(--lime); }
  .meter-n { color: var(--ink-2); }
  [aria-sort="ascending"] .sort, [aria-sort="descending"] .sort { color: var(--lime); }
  [aria-sort="ascending"] .sort .up, [aria-sort="descending"] .sort .dn { fill: var(--lime); }
  .mono { background: oklch(0.30 0.06 var(--h)); color: oklch(0.90 0.07 var(--h)); box-shadow: inset 0 0 0 1px oklch(0.40 0.08 var(--h)); border-radius: 8px; }
  .mono--page { background: var(--bg-3); color: var(--mut); box-shadow: none; }
  .tool, .firm-card, .list-group, .steps li, .faq details, .prof-hero, .prog, .note, .find { background: var(--bg-2); border-color: var(--line); box-shadow: var(--shadow-s); }
  .tool:hover, .firm-card:hover { border-color: var(--line-2); translate: 0 -2px; }
  .tool .k { color: var(--lime); } .tool em { color: var(--lime); text-decoration: none; } .tool-art { color: var(--ink-2); }
  .change:hover b { color: var(--lime); text-decoration: none; }
  .list-group h3 { color: var(--ink); }
  .steps > li > .step-n { background: var(--lime); color: var(--on-lime); }
  .prof-hero::before { background: radial-gradient(70% 90% at 0% 0%, oklch(0.30 0.06 var(--ph, 150) / .6), transparent 60%); }
  .prog-jump { background: color-mix(in srgb, var(--bg) 88%, transparent); border-block-end: 1px solid var(--line); }
  .find::backdrop { background: rgb(0 0 0 / .7); }
  .find-list [aria-selected="true"] a, .find-list a:hover { background: var(--bg-3); }
  .find-list [aria-selected="true"] a { box-shadow: inset 3px 0 0 var(--lime); }
  .alerts-row { background: var(--bg-2); border-color: var(--line-2); box-shadow: none; } .alerts-row:focus-within { border-color: var(--lime); }
  .faq summary::after { color: var(--lime); }
  .faq details p { color: var(--ink-2); }
  .crumbs a { color: var(--ink-2); } .crumbs a:hover { color: var(--lime); }
  .more { color: var(--ink); } .more:hover { color: var(--lime); }
  .hero::before { background: radial-gradient(closest-side, color-mix(in srgb, var(--lime) 12%, transparent), transparent 70%); }
  .hero::after { display: none; }
  .proof { color: var(--ink-2); }
  .site-foot { background: #000; color: var(--ink-2); border-block-start: 1px solid var(--line); }
  .site-foot .brand { color: var(--ink); } .site-foot .foot-nav a { color: var(--ink-2); } .site-foot .foot-nav a:hover { color: var(--lime); }
  .site-foot .foot-copy, .site-foot .disclaimer { color: var(--mut); }
  .site-foot a { color: var(--ink); }
  .prose { color: var(--ink-2); } .prose h2, .prose h3 { color: var(--ink); }
  ::selection { background: var(--lime); color: var(--on-lime); }
  .pending { color: var(--mut); }
  /* a terminal-style rule under section headings */
  .block-head { border-block-end: 1px solid var(--line); padding-block-end: .9rem; }
}
@media (max-width: 760px) {
  .board tr { background: var(--bg-2); border-color: var(--line); }
  .board th.fm { border-block-end-color: var(--line); }
  .board td::before { font-family: var(--mono); text-transform: uppercase; letter-spacing: .06em; font-size: .66rem; }
}

@layer pages {
  .list-links { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .board { min-width: 1000px; table-layout: auto; }
  .board td, .board tbody th { padding-inline: .65rem; }
  .board .fm { min-width: 215px; }
  .board td, .prog-table td, .list-table td { font-size: .82rem; }
  .board .plats { max-width: 150px; font-size: .76rem; }
  .board .data-c { min-width: 120px; }
}

@layer pages {
  .board thead th { padding-inline: .65rem; white-space: nowrap; }
  .board .fm { min-width: 200px; }
  .board .plats { max-width: 130px; }
  .board td.data-c { min-width: 0; white-space: nowrap; }
  .board .data-c .meter-bar { width: 36px; }
}
@layer pages { .board .fm { min-width: 186px; } .board td { padding-inline: .6rem; } }

/* ================= 6.1: Prop Firm Duel TV ================= */
@layer pages {
  .tv-cta { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
  .tv-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); grid-auto-rows: auto; gap: .75rem; }
  .tv-card { display: grid; grid-template-rows: auto 1fr; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); overflow: hidden; color: var(--ink); text-decoration: none; transition: border-color .15s, translate .15s var(--ease); }
  .tv-card:hover { border-color: var(--line-2); translate: 0 -2px; color: var(--ink); }
  .tv-card--lead { grid-row: span 3; }
  .tv-card:not(.tv-card--lead) { grid-template-columns: 180px minmax(0, 1fr); grid-template-rows: auto; grid-column: 2; }
  .tv-thumb { position: relative; display: block; aspect-ratio: 16 / 9; background: #000 linear-gradient(135deg, var(--bg-3), #000); overflow: hidden; }
  .tv-thumb img { width: 100%; height: 100%; object-fit: cover; }
  .tv-play { position: absolute; inset: 0; display: grid; place-items: center; }
  .tv-play svg { width: 48px; height: 48px; padding: 12px; border-radius: 50%; background: var(--lime); color: var(--on-lime); box-shadow: 0 8px 24px rgb(0 0 0 / .5); transition: scale .15s var(--ease); }
  .tv-card:not(.tv-card--lead) .tv-play svg { width: 34px; height: 34px; padding: 8px; }
  .tv-card:hover .tv-play svg { scale: 1.08; }
  .tv-meta { display: grid; gap: .3rem; align-content: start; padding: 1rem 1.1rem 1.1rem; }
  .tv-card--lead .tv-meta { padding: 1.25rem 1.4rem 1.4rem; }
  .tv-tags { font-family: var(--mono); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; color: var(--lime); }
  .tv-meta b { font-size: 1.05rem; line-height: 1.3; letter-spacing: -0.01em; }
  .tv-card--lead .tv-meta b { font-family: var(--display); font-size: var(--step-2); font-weight: 700; letter-spacing: -0.03em; line-height: 1.1; }
  .tv-ex { color: var(--ink-2); font-size: .92rem; }
  .tv-card:not(.tv-card--lead) .tv-ex { display: none; }
  .tv-meta time { font-family: var(--mono); font-size: .72rem; color: var(--mut); margin-block-start: .3rem; }
  .tv-grid--all { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tv-grid--all .tv-card, .tv-grid--all .tv-card--lead { grid-row: auto; grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .tv-grid--all .tv-play svg { width: 44px; height: 44px; padding: 11px; }
  .tv-grid--all .tv-meta b { font-family: var(--sans); font-size: 1.05rem; font-weight: 700; letter-spacing: -0.01em; }
  .tv-grid--all .tv-ex { display: block; }
  .tv-soon { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); }
  .tv-soon b { display: block; font-family: var(--display); font-size: var(--step-2); font-weight: 700; letter-spacing: -0.03em; line-height: 1.15; max-width: 28ch; }
  .tv-soon .k { margin-block-end: .4rem; }
  /* YouTube embeds inside posts */
  .prose .kg-embed-card, .prose .kg-video-card { margin: 1.5em 0; }
  .prose .kg-embed-card iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; border-radius: var(--radius); background: #000; }
}
@media (max-width: 1080px) { .tv-grid { grid-template-columns: 1fr 1fr; } .tv-card--lead { grid-column: 1 / -1; grid-row: auto; } .tv-card:not(.tv-card--lead) { grid-template-columns: 1fr; grid-template-rows: auto 1fr; } .tv-card:not(.tv-card--lead) .tv-play svg { width: 44px; height: 44px; padding: 11px; } }
@media (max-width: 640px) { .tv-grid, .tv-grid--all { grid-template-columns: 1fr; } }
@layer pages { .tv-grid { align-items: start; } .tv-card--lead { align-self: stretch; } }

/* 6.2: placeholder episodes */
@layer pages {
  .tv-thumb--soon { background: radial-gradient(80% 100% at 30% 20%, var(--bg-3), #000 70%); }
  .tv-thumb--soon::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, transparent 0 14px, rgb(255 255 255 / .025) 14px 15px); }
  .tv-thumb-ep { position: absolute; top: .75rem; left: .85rem; font-family: var(--mono); font-size: .68rem; letter-spacing: .08em; color: var(--mut); }
  .tv-card--soon .tv-play svg { background: var(--bg-3); color: var(--ink-2); box-shadow: none; }
  .tv-card--soon:hover .tv-play svg { background: var(--lime); color: var(--on-lime); }
  .tv .small { margin-block-start: 1rem; }
}
@layer pages { .tv-grid { align-items: stretch; grid-auto-rows: 1fr; } .tv-card:not(.tv-card--lead) { align-items: center; } .tv-card:not(.tv-card--lead) .tv-meta { align-content: center; } .tv-card:not(.tv-card--lead) .tv-thumb { align-self: stretch; aspect-ratio: auto; min-height: 100px; } .tv-grid--all { grid-auto-rows: auto; } }

/* ================= 7.0: the livery ================= */
@layer pages {
  ::selection { background: var(--accent); color: #fff; }
  .tick-live::before { background: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent); }
  .tick-news span { background: var(--accent); color: #fff; }
  .brand-tile { background: var(--accent); color: #fff; }
  .meter-bar i { background: var(--ink-2); }            /* progress is neutral; red would read as danger */
  .switch input:checked + span { background: var(--accent); } .switch input:checked + span::after { background: #fff; }
  .proof li::before { background: var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7'/%3E%3C/svg%3E") center / 11px no-repeat; }
  .tag, .chip--hi { background: color-mix(in srgb, var(--accent) 18%, transparent); color: var(--accent-2); }
  .fm-n .mk, .tv-tags, .tool .k, .tool em { color: var(--accent-2); }
  .steps > li > .step-n { background: var(--accent); color: #fff; }
  a:hover { color: var(--accent-2); }
  .hero::before { background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 14%, transparent), transparent 70%); }
  /* a livery stripe under section headings: one short red bar, then the hairline */
  .block-head { position: relative; }
  .block-head::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 56px; height: 3px; background: var(--accent); }
  .rule-list li::marker { color: var(--accent); }
  /* header dropdowns */
  .nav { display: flex; align-items: center; gap: 1.6rem; }
  .has-sub { position: relative; }
  .has-sub > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: .35rem; color: var(--ink-2); font-weight: 600; font-size: .95rem; padding: .4rem 0; }
  .has-sub > summary::-webkit-details-marker { display: none; }
  .has-sub > summary::after { content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; rotate: 45deg; translate: 0 -2px; opacity: .7; }
  .has-sub[open] > summary, .has-sub > summary:hover { color: var(--ink); }
  .has-sub[open] > summary::after { rotate: -135deg; translate: 0 2px; }
  .sub { position: absolute; top: calc(100% + .5rem); left: -.75rem; z-index: 60; min-width: 260px; list-style: none; margin: 0; padding: .45rem; border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--bg-2); box-shadow: 0 24px 48px -16px rgb(0 0 0 / .8); }
  .sub li a { display: block; padding: .55rem .75rem; border-radius: 6px; color: var(--ink-2); text-decoration: none; font-weight: 600; font-size: .92rem; }
  .sub li a:hover { background: var(--bg-3); color: var(--ink); }
  .mnav-h { font-family: var(--mono); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); margin: 1.1rem 0 .2rem; }
  .mnav a { font-size: 1.02rem; padding: .6rem 0; }
  /* footer columns */
  .foot-top--cols { display: grid; grid-template-columns: minmax(0, 1.1fr) repeat(4, minmax(0, 1fr)); align-items: start; gap: 2rem; margin-block-end: 2.5rem; }
  .foot-cols { display: contents; }
  .foot-cols > div { display: grid; gap: .45rem; align-content: start; }
  .foot-cols a { color: var(--ink-2); text-decoration: none; font-size: .92rem; } .foot-cols a:hover { color: var(--ink); }
  .foot-h { font-family: var(--mono); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); margin-block-end: .35rem; }
  .site-foot { padding-block-start: 3.5rem; }
}
@media (max-width: 1180px) { .nav { gap: 1.1rem; } }
@media (max-width: 1080px) { .foot-top--cols { grid-template-columns: 1fr 1fr; } .foot-top--cols > .brand { grid-column: 1 / -1; } }
@media (max-width: 520px) { .foot-top--cols { grid-template-columns: 1fr; } }
@layer pages { .sub li a, .mnav a { font-family: var(--sans); } }

/* ================= 8.0: the slash ================= */
@layer pages {
  :root { --cut: 10px; }
  body { background: var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Crect width='6' height='6' fill='%230A0A0B'/%3E%3Ccircle cx='1' cy='1' r='.7' fill='%23151516'/%3E%3Ccircle cx='4' cy='4' r='.7' fill='%23151516'/%3E%3C/svg%3E"); }
  html { background: var(--bg); }
  ::selection { background: var(--lime); color: var(--on-lime); }
  a:hover { color: var(--lime); }
  /* type: headlines like a number plate */
  .display { font-family: var(--display); font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: 0; line-height: .92; }
  .block-head .display, .sub-h, .prof-block > .display, .prof-h, .prog-head .display, .tool b, .tv-card--lead .tv-meta b, .tv-soon b, .list-group h3, .prose h2 { font-family: var(--display); font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: .005em; line-height: .95; }
  .block-head .display, .sub-h { font-size: clamp(2.2rem, 1.6rem + 2.2vw, 3.4rem); }
  .page-top .display, .page-top--tight .display { font-family: var(--display); font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: 0; line-height: .9; font-size: clamp(3rem, 2rem + 4vw, 6rem); }
  .tool b { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.4rem); } .list-group h3 { font-size: 1.5rem; } .prog-head .display { font-size: 1.9rem; } .prof-block > .display, .prof-h { font-size: 2.4rem; }
  .lead { font-family: var(--sans); font-size: var(--step-1); color: var(--ink-2); }
  .brand-name { font-family: var(--sans); font-weight: 700; font-size: 19px; letter-spacing: -0.01em; }
  .brand-tile { background: var(--lime); color: var(--on-lime); font-family: var(--display); font-style: italic; font-weight: 900; font-size: 21px; border-radius: 0; clip-path: polygon(0 0, 100% 0, 100% 70%, 70% 100%, 0 100%); }
  .mono { font-family: var(--display); font-style: italic; font-weight: 800; font-size: 18px; border-radius: 0; clip-path: polygon(0 0, 100% 0, 100% 74%, 74% 100%, 0 100%); box-shadow: none; }
  .mono--xl { font-size: 42px; } .mono--lg { font-size: 22px; }
  /* angled controls */
  .btn { border-radius: 0; font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.05rem; letter-spacing: .02em; clip-path: polygon(var(--cut) 0, 100% 0, calc(100% - var(--cut)) 100%, 0 100%); padding-inline: 1.5rem; }
  .btn--sm { font-size: .95rem; padding-inline: 1.3rem; } .btn--line { border: 0; background: var(--bg-3); color: var(--ink); } .btn--line:hover { background: var(--line-2); }
  .btn--lime, .btn--lime:hover { background: var(--lime); color: var(--on-lime); }
  .pill, .mkt, .seg button, .chip, .tag, .chip--hi, .find-btn, .search input, .seg, .size-sel, .table-wrap, .stats div, .tool, .firm-card, .list-group, .steps li, .faq details, .prof-hero, .prog, .note, .find, .tv-card, .tv-soon, .sub, .menu-btn, .alerts-row { border-radius: 0; }
  .pill[aria-pressed="true"], .pill.is-on, .seg button[aria-pressed="true"] { clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%); background: var(--lime); color: var(--on-lime); }
  .seg button[aria-pressed="true"] { border-radius: 0; }
  .tag, .chip--hi { background: var(--lime); color: var(--on-lime); }
  .tick-live::before { background: var(--lime); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lime) 22%, transparent); }
  .tick-news span { background: var(--lime); color: var(--on-lime); }
  .proof li::before { background: var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A0A0B' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7'/%3E%3C/svg%3E") center / 11px no-repeat; }
  .meter-bar i { background: var(--lime); }
  .steps > li > .step-n { background: var(--lime); color: var(--on-lime); font-family: var(--display); font-style: italic; font-weight: 900; font-size: 1.1rem; clip-path: polygon(5px 0, 100% 0, calc(100% - 5px) 100%, 0 100%); border-radius: 0; }
  .fm-n .mk, .tv-tags, .tool .k, .tool em, .hero-k { color: var(--lime); }
  .block-head::after { width: 64px; height: 4px; clip-path: polygon(0 0, 100% 0, calc(100% - 4px) 100%, 0 100%); background: var(--lime); }
  .find-btn, .menu-btn { border-color: var(--line-2); }
  .switch input:checked + span { background: var(--lime); } .switch input:checked + span::after { background: var(--on-lime); }
  /* hero: logline + slash + timing tower */
  .hero { display: block; padding-block: clamp(2.5rem, 4vw, 3.25rem) 0; position: relative; isolation: isolate; overflow: clip; }
  .hero::after { display: none; }
  .hero::before { content: ""; position: absolute; z-index: -1; inset: 0 -4% 0 auto; width: 48%; height: 100%; border-radius: 0; background: linear-gradient(112deg, transparent 0 40%, var(--lime) 40% 56%, transparent 56% 61%, var(--ink) 61% 62.5%, transparent 62.5%); pointer-events: none; }
  .hero-k { margin-block-end: 1rem; font-family: var(--mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; }
  .hero-h { font-size: clamp(3.2rem, 2rem + 5.2vw, 6.6rem); max-width: 14ch; line-height: .9; }
  .hero .lead { max-width: 54ch; margin-block-start: 1.4rem; font-size: clamp(1.1rem, 1rem + .5vw, 1.32rem); }
  .proof { margin-block-start: 1.1rem; }
  .tower { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 1.9rem 0 0; border-block: 1px solid var(--line-2); background: color-mix(in srgb, var(--bg) 78%, transparent); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
  .tower div { display: flex; align-items: baseline; gap: .8rem; padding: 1rem 1.25rem .9rem; border-inline-end: 1px solid var(--line); min-width: 0; }
  .tower div:last-child { border-inline-end: 0; }
  .tower dd { margin: 0; font-family: var(--display); font-style: italic; font-weight: 900; font-size: clamp(2.2rem, 1.6rem + 2vw, 3.6rem); line-height: 1; color: var(--lime); }
  .tower div:nth-child(2) dd { color: var(--ink); }
  .tower dt { font-family: var(--mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); }
  /* board */
  .board-sec { padding-block-start: 2.25rem; }
  .board thead th { background: #000; }
  [aria-sort="ascending"] .sort, [aria-sort="descending"] .sort, [aria-sort="ascending"] .sort .up, [aria-sort="descending"] .sort .dn { color: var(--lime); fill: var(--lime); }
  .mkt[aria-pressed="true"] { color: var(--lime); box-shadow: inset 0 -3px 0 var(--lime); }
  .mkt[aria-pressed="true"] .mkt-n { background: var(--lime); color: var(--on-lime); }
  .board td, .prog-table td, .list-table td { font-size: .86rem; }
  /* cards get a clipped corner */
  .tool, .stats div, .steps li, .tv-card, .prog, .prof-hero { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%); }
  .tool:hover, .firm-card:hover, .tv-card:hover { translate: 0; border-color: var(--lime); }
  .prof-hero::before { background: radial-gradient(70% 90% at 0% 0%, oklch(0.32 0.06 var(--ph, 150) / .6), transparent 60%); }
  .site-foot { background: #000; border-block-start: 3px solid var(--lime); }
  .faq summary::after { color: var(--lime); }
  .tv-play svg { background: var(--lime); color: var(--on-lime); clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); border-radius: 0; }
  .tv-card--soon .tv-play svg { background: var(--bg-3); color: var(--ink-2); }
  .tv-thumb-ep { font-family: var(--display); font-style: italic; font-weight: 900; font-size: 1rem; color: var(--ink-2); letter-spacing: .02em; }
  .rule-list li::marker { color: var(--lime); }
  .crumbs a:hover, .more:hover { color: var(--lime); }
  .sub li a, .mnav a, .nav a, .has-sub > summary { font-family: var(--sans); }
}
@media (max-width: 1080px) { .hero::before { width: 60%; inset: -8% -14% auto auto; opacity: .85; } .tower { grid-template-columns: 1fr 1fr; } .tower div:nth-child(2) { border-inline-end: 0; } .tower div:nth-child(-n+2) { border-block-end: 1px solid var(--line); } }
@media (max-width: 520px) { .hero::before { width: 80%; inset: -4% -30% auto auto; } .tower { grid-template-columns: 1fr; } .tower div { border-inline-end: 0; border-block-end: 1px solid var(--line); } .tower div:last-child { border-block-end: 0; } }
@media (max-width: 760px) { .hero::before { inset: 0 -50% auto auto; width: 100%; height: 30%; opacity: .85; } .hero-h { max-width: none; font-size: clamp(2.8rem, 12vw, 3.6rem); } .hero-h br { display: none; } }

/* ================= 8.1: flags and eligibility ================= */
@layer pages {
  .flag { display: inline-block; width: 20px; height: 15px; object-fit: cover; vertical-align: -2px; border-radius: 2px; box-shadow: 0 0 0 1px rgb(255 255 255 / .12); }
  .flag--s { width: 16px; height: 12px; margin-inline-end: .35rem; vertical-align: -1px; }
  .ph-stats dd .flag { margin-inline-end: .2rem; }
  .elig-sum { margin-block: .5rem 1rem; color: var(--ink-2); } .elig-sum b { color: var(--ink); font-family: var(--mono); }
  .flags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
  .flags li { display: inline-flex; align-items: center; gap: .5rem; padding: .35rem .7rem .35rem .45rem; background: var(--bg-2); border: 1px solid var(--line); font-size: .85rem; font-weight: 600; color: var(--ink-2); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%); }
  .flags li .flag { width: 22px; height: 16px; }
  .elig .small { max-width: 72ch; }
}

/* ================= 8.2: racing-red pinstripes ================= */
@layer pages {
  .tick-live::before { background: var(--red); box-shadow: 0 0 0 3px color-mix(in srgb, var(--red) 25%, transparent); }
  .tick-news span { background: var(--red); color: #fff; }
  .hero::before { background: linear-gradient(112deg, transparent 0 40%, var(--lime) 40% 56%, transparent 56% 60.5%, var(--ink) 60.5% 62%, transparent 62% 63.5%, var(--red) 63.5% 64.5%, transparent 64.5%); }
  .site-foot { border-block-start: 3px solid var(--lime); box-shadow: inset 0 4px 0 #000, inset 0 5px 0 var(--red); }
  .block-head::after { background: linear-gradient(90deg, var(--lime) 0 52px, transparent 52px 56px, var(--red) 56px 64px); }
  .brand-tile { box-shadow: inset 0 -3px 0 var(--red); }
  .tower div:last-child dd { color: var(--red); }   /* "0 paid placements" in red: the one number that should stay at zero */
  .mkt--soon .mkt-n { border-color: color-mix(in srgb, var(--red) 55%, transparent); color: var(--red); }
  .tv-thumb-ep { color: var(--red); }
}

/* ================= 9.0: the buying blocks ================= */
@layer pages {
  /* offer: a pit-board strip, never a flashing banner */
  .offer { margin-block: 1rem 1.25rem; border: 1px solid var(--line-2); background: var(--bg-2); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%); }
  .offer-in { display: flex; flex-wrap: wrap; align-items: center; gap: .9rem; padding: .9rem 1.1rem; border-block-end: 1px solid var(--line); }
  .offer-k { font-family: var(--mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--mut); }
  .offer code { font-family: var(--mono); font-weight: 700; font-size: 1.05rem; letter-spacing: .06em; padding: .35rem .8rem; background: var(--lime); color: var(--on-lime); clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%); }
  .offer-d { font-weight: 700; } .offer-x { margin-inline-start: auto; font-family: var(--mono); font-size: .76rem; color: var(--red); }
  .offer .small { padding: .6rem 1.1rem; margin: 0; }
  .offer .small + .small { padding-block-start: 0; }
  /* cost table */
  .cost-table { min-width: 720px; }
  .cost-table tbody th { font-family: var(--sans); font-weight: 700; }
  .cost-table td b { color: var(--lime); }
  /* disclosure line */
  .disc { margin-block-start: .85rem; font-size: .8rem; color: var(--mut); max-width: 62ch; }
  .disc--aff::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-inline-end: .5rem; background: var(--red); vertical-align: 1px; }
  /* payouts */
  .pay-card { padding: 1.1rem 1.25rem 1.25rem; border: 1px solid var(--line); background: var(--bg-2); margin-block-start: .75rem; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%); }
  .pay-card h3 { font-size: 1.5rem; margin-block-end: .3rem; }
  .pay-card .facts { border-block-start: 0; }
  /* related */
  .rel { display: flex; flex-wrap: wrap; gap: .5rem; margin-block-start: .9rem; }
  /* the exit: one button, same for every firm */
  .prof-exit { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem; margin-block-start: clamp(2rem, 4vw, 3rem); padding: clamp(1.25rem, 3vw, 1.9rem); border: 1px solid var(--line-2); background: linear-gradient(112deg, var(--bg-2) 0 62%, color-mix(in srgb, var(--lime) 10%, var(--bg-2)) 62%); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%); }
  .prof-exit b { display: block; font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: var(--step-2); line-height: 1; }
  .prof-exit span { display: block; margin-block-start: .4rem; color: var(--ink-2); font-size: .92rem; max-width: 56ch; }
  .prof-exit + .disc { margin-block-start: .6rem; }
}
@media (max-width: 760px) { .cost-table { min-width: 0; } .offer-x { margin-inline-start: 0; } }


/* ═══ v9.1: the PFD mark (replaces the VS tile). The tile, slash and letters live in the SVG. ═══ */
.brand-tile { display: block; flex: none; width: 42px; height: 42px; background: none !important; box-shadow: none !important; clip-path: none !important; border-radius: 0 !important; padding: 0; }
@container head scroll-state(stuck: top) { .brand-tile { width: 36px; height: 36px; } }
.site-foot .brand-tile, footer .brand-tile { width: 38px; height: 38px; }

/* ═══ v9.2: THE DUEL (homepage hero). Neutral: no winner colors. Lime is only the brand frame and the slash. ═══ */
.duel { position: relative; overflow: hidden; border-radius: var(--radius-l); border: 1px solid var(--line-2); background: linear-gradient(180deg, #141417, #0E0E10); padding: clamp(1rem, 2.4vw, 1.4rem); box-shadow: 0 30px 60px -30px rgba(0,0,0,.8); }
.duel > * { position: relative; }
.duel-top { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-block-end: .9rem; }
.duel-k { margin: 0; font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; letter-spacing: .02em; font-size: 1.35rem; color: var(--lime); }
.duel-h { margin: 0; font-size: .82rem; color: var(--ink-2); font-family: var(--mono); }
.duel-load { margin: .5rem 0 0; }
.duel-heads { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: start; gap: .6rem; }
.duel-vs { align-self: center; font-family: var(--display); font-style: italic; font-weight: 900; font-size: 1.6rem; color: var(--lime); padding-inline: .15rem; }
.duel-side { position: relative; display: grid; gap: .15rem; min-width: 0; background: #121214; padding: .7rem .8rem; border-radius: var(--radius); border: 1px solid var(--line-2); cursor: pointer; transition: border-color .15s; }
.duel-side:hover, .duel-side:focus-within { border-color: var(--lime); }
.duel-firm { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.25rem; line-height: 1; color: var(--ink); overflow-wrap: anywhere; }
.duel-prog { font-size: .82rem; font-weight: 600; color: var(--ink-2); }
.duel-prog span { color: var(--lime); }
.duel-side .duel-sel { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; opacity: 0; cursor: pointer; }
.duel-side--b { text-align: right; }
.duel-side select { appearance: none; width: 100%; min-height: 44px; padding: 0 .7rem; border-radius: var(--radius-s); border: 1px solid var(--line-2); background: var(--bg-3); color: var(--ink); font-weight: 700; font-size: .9rem; text-overflow: ellipsis; cursor: pointer; }
.duel-side--b select { text-align: right; text-align-last: right; }
.duel-side select:hover { border-color: var(--ink-2); }
.duel-meta { font-family: var(--mono); font-size: .72rem; color: var(--mut); }
.duel-na { font-size: .78rem; color: var(--ink-2); }
.duel-size { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .4rem; margin-block: .9rem .6rem; background: #111113; padding: .35rem; border-radius: 999px; }
.duel-size > span { font-family: var(--mono); font-size: .72rem; color: var(--mut); margin-inline-end: .2rem; }
.duel-size .pill { min-height: 32px; padding: 0 .75rem; font-size: .82rem; }
.duel-rows { display: grid; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); background: #0F0F11; }
.duel-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.1fr) minmax(0,1fr); align-items: center; gap: .5rem; padding: .55rem .75rem; border-block-start: 1px solid var(--line); }
.duel-row:first-child { border-block-start: 0; }
.duel-lab { text-align: center; font-family: var(--mono); font-size: .72rem; color: var(--mut); line-height: 1.3; }
.duel-v { font-family: var(--mono); font-weight: 600; font-size: .9rem; color: var(--ink); }
.duel-v--b { text-align: right; }
.duel-foot { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-block-start: .8rem; font-size: .82rem; background: #111113; padding: .35rem .5rem; border-radius: var(--radius-s); }
.duel-foot a { color: var(--ink-2); text-decoration: none; font-weight: 600; }
.duel-foot a:hover { color: var(--lime); }
.duel-shuffle { white-space: nowrap; border: 1px solid var(--line-2); background: transparent; color: var(--ink); border-radius: 999px; min-height: 34px; padding: 0 .9rem; font-weight: 700; font-size: .8rem; cursor: pointer; }
.duel-shuffle:hover { border-color: var(--lime); }
.duel-note { margin: .8rem 0 0; font-size: .75rem; line-height: 1.45; color: var(--mut); background: #0E0E10; }
.hero--duel { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); column-gap: clamp(2rem, 4vw, 3.5rem); align-items: center; }
.hero--duel .tower { grid-column: 1 / -1; }
.hero--duel .hero-h { font-size: clamp(2.8rem, 1.8rem + 3.6vw, 5.4rem); }
@media (max-width: 1080px) { .hero--duel { grid-template-columns: 1fr; } .hero--duel .duel { margin-block-start: 1.75rem; } }
@media (max-width: 560px) { .duel-top { flex-direction: column; align-items: flex-start; gap: .25rem; } .duel-row { grid-template-columns: 1fr 1fr; } .duel-lab { grid-column: 1 / -1; text-align: left; order: -1; } .duel-foot { flex-wrap: wrap; justify-content: center; } }

/* ═══ v9.3: conversion + guides ═══ */
.hero-h1 { margin: 0; font: inherit; }
.hero-h1 .hero-k { display: block; }
.hero-h1 .hero-h { display: block; }
.hero-cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-block-start: 1.5rem; }
.final-cta-in { padding: clamp(1.5rem, 4vw, 3rem); border: 1px solid var(--line-2); border-radius: var(--radius-l); background: linear-gradient(112deg, var(--bg-2) 0 62%, var(--lime) 62% 70%, var(--bg-2) 70%); }
.final-cta-in .display { font-size: var(--step-4); max-width: 18ch; }
.guides, .clusters { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.guide, .cluster { display: grid; gap: .45rem; align-content: start; padding: 1.2rem 1.25rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); color: var(--ink); text-decoration: none; transition: border-color .15s; }
.guide:hover, .cluster:hover { border-color: var(--lime); color: var(--ink); }
.guide-k { font-family: var(--mono); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--lime); }
.guide b, .cluster b { font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.35rem; line-height: 1.02; }
.guide span:not(.guide-k), .cluster span { color: var(--ink-2); font-size: .92rem; }
.guide em { font-style: normal; font-weight: 700; font-size: .88rem; color: var(--lime); margin-block-start: .3rem; }
.post-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-block: 1.5rem; padding: 1rem 1.2rem; border: 1px solid var(--line-2); border-inline-start: 4px solid var(--lime); border-radius: var(--radius); background: var(--bg-2); max-width: 72ch; }
.post-cta p { margin: 0; color: var(--ink-2); max-width: 52ch; } .post-cta b { color: var(--ink); }
.post-cta .hero-cta { margin: 0; }

/* ═══ v9.5: balance ═══ */
/* tools: the lead card spans as many rows as there are other cards */
.tools:has(> .tool:nth-child(3):last-child) > .tool:first-child { grid-row: span 2; }
.tools:has(> .tool:nth-child(2):last-child) > .tool:first-child { grid-row: span 1; }
/* firm lists: three equal columns; Market and Account size share the first */
@media (min-width: 1081px) {
  .list-links { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "a b d" "c b d"; align-items: stretch; }
  .list-links > .list-group:nth-child(1) { grid-area: a; }
  .list-links > .list-group:nth-child(2) { grid-area: b; }
  .list-links > .list-group:nth-child(3) { grid-area: c; }
  .list-links > .list-group:nth-child(4) { grid-area: d; }
}
/* guides: rows of three; clusters: two rows of four */
.guides { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.clusters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cluster--all { border-color: var(--lime); }
.cluster--all b { color: var(--lime); }
@media (max-width: 1080px) { .guides, .clusters { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .guides, .clusters { grid-template-columns: 1fr; } }
/* guide pages: article + sticky sidebar, so the page isn't empty on the right */
.post-grid { display: grid; grid-template-columns: minmax(0, 68ch) minmax(260px, 320px); justify-content: space-between; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.post-main .prose { max-width: none; }
.post-side { position: sticky; top: 96px; display: grid; gap: 1rem; padding-block-start: 1.75rem; }
.toc { padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); }
.toc-h, .side-cta-k { margin: 0 0 .6rem; font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--mut); }
.toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; counter-reset: t; }
.toc li { counter-increment: t; }
.toc a { display: flex; gap: .6rem; padding: .35rem 0; color: var(--ink-2); text-decoration: none; font-size: .9rem; line-height: 1.35; }
.toc a::before { content: counter(t, decimal-leading-zero); font-family: var(--mono); font-size: .72rem; color: var(--mut); padding-top: .1rem; }
.toc a:hover, .toc a.is-on { color: var(--ink); } .toc a.is-on::before { color: var(--lime); }
.side-cta { padding: 1.2rem; border: 1px solid var(--line-2); border-inline-start: 4px solid var(--lime); border-radius: var(--radius-l); background: var(--bg-2); display: grid; gap: .6rem; }
.side-cta p { margin: 0; color: var(--ink-2); font-size: .92rem; }
.side-cta-h { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.5rem !important; line-height: 1; color: var(--ink) !important; }
.side-cta .btn { justify-self: start; }
.side-cta-link { font-size: .85rem; font-weight: 600; color: var(--ink-2); text-decoration: none; } .side-cta-link:hover { color: var(--lime); }
.post .page-top { max-width: none; }
.post .page-top .display { font-size: clamp(2.2rem, 1.4rem + 2.4vw, 3.9rem); line-height: .95; max-width: 24ch; }
.post .page-top .lead { max-width: 60ch; }
@media (max-width: 1080px) { .post-grid { grid-template-columns: 1fr; } .post-side { position: static; padding-block-start: 0; } .toc { display: none; } }

/* ═══ v9.7: full width FAQ + mobile pass ═══ */
.faq { max-width: none; width: 100%; }
.faq details p { max-width: 80ch; }
html, body { overflow-x: clip; }
img, svg, video, iframe { max-width: 100%; }
.prose { overflow-wrap: break-word; }
.prose table { display: block; max-width: 100%; overflow-x: auto; }
@media (max-width: 760px) {
  /* board cards: long firm and program names wrap instead of pushing the page wide */
  .board th.fm, .board .fm { white-space: normal; min-width: 0; }
  .board .fm-n { min-width: 0; } .board .fm-n a, .board .fm-n small { overflow-wrap: anywhere; }
  .board .fm-n small .tag { white-space: nowrap; }
  /* tap targets: at least 44px tall */
  .more, .linkish, .side-cta-link, .duel-foot a, .crumbs a, .foot-cols a, .mnav a, .toc a { min-height: 44px; display: inline-flex; align-items: center; }
  .foot-cols a { display: flex; }
  .board .fm-n a { padding-block: .35rem; }
  .btn, .pill, .duel-shuffle { min-height: 44px; }
  input[type="checkbox"], input[type="radio"] { width: 22px; height: 22px; }
  input, select, textarea { font-size: 16px; }  /* stops iOS zooming into form fields */
  /* readable small labels */
  .k, .foot-h, .mkt-n, .tag, .board td::before, .facts dt, .stats dt, .tower dt, .ph-stats dt, .duel-lab, .duel-meta, .toc-h, .side-cta-k, .legend, .hero-k, .guide-k, .rank-table th, .fm-n small { font-size: max(12px, .8em) !important; }
  .fm-n small, .rank-table small { font-size: 12px !important; }
  /* hero and sections */
  .hero-cta { flex-direction: column; align-items: stretch; } .hero-cta .btn { justify-content: center; width: 100%; }
  .tower { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tower div { padding: .9rem .9rem .8rem; flex-wrap: wrap; gap: .3rem .6rem; }
  .tower div:nth-child(2) { border-inline-end: 0; }
  .tower div:nth-child(-n+2) { border-block-end: 1px solid var(--line); }
  .steps { grid-template-columns: 1fr !important; }
  .final-cta-in { background: var(--bg-2); border-inline-start: 4px solid var(--lime); }
  .final-cta-in .display { font-size: var(--step-3); }
  .block-head { flex-wrap: wrap; gap: .5rem 1rem; }
  .faq summary { padding: .95rem 1rem; font-size: 1rem; }
  .post-cta { flex-direction: column; align-items: stretch; }
  .post .page-top .display { font-size: clamp(1.9rem, 1.3rem + 3vw, 2.6rem); }
  .duel { padding: .9rem; }
  .duel-heads { gap: .4rem; } .duel-firm { font-size: 1.05rem; } .duel-prog { font-size: .78rem; }
  .duel-vs { font-size: 1.2rem; }
  .duel-v { font-size: .86rem; }
}
@media (max-width: 400px) {
  .duel-heads { grid-template-columns: 1fr; } .duel-vs { display: none; } .duel-side--b { text-align: left; }
  .tower dd { font-size: 2rem; }
}
@media (max-width: 760px) {
  .list-table th.fm a { display: inline-block; padding-block: .5rem; }
  input[type="range"] { height: 32px; }
  .tv-tags { font-size: 12px; }
}
.nav a, .nav summary, .brand-name, .head-link, .head-cta .btn { white-space: nowrap; }

/* ═══ v9.8: legal pages + footer signup ═══ */
.legal h2 { margin-block-start: 2rem; }
.legal ul { padding-inline-start: 1.2rem; }
.foot-join { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: .5rem 2rem; align-items: center; margin-block: 2rem 1.5rem; padding: 1.25rem 1.4rem; border: 1px solid var(--line-2); border-inline-start: 4px solid var(--lime); border-radius: var(--radius-l); background: var(--bg-2); }
.foot-join-h { margin: 0; font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.4rem; color: var(--ink); }
.foot-join-copy p:not(.foot-join-h) { margin: .2rem 0 0; color: var(--ink-2); font-size: .9rem; }
.foot-join-row { display: flex; gap: .5rem; }
.foot-join-row input { flex: 1; min-width: 0; min-height: 48px; padding: 0 1rem; border-radius: var(--radius); border: 1px solid var(--line-2); background: var(--bg); color: var(--ink); font-size: 16px; }
.foot-join-note { grid-column: 2; margin: 0; font-size: .8rem; color: var(--mut); }
.foot-join-ok, .foot-join-err { grid-column: 1 / -1; display: none; margin: 0; font-size: .9rem; }
.foot-join.success .foot-join-ok { display: block; color: var(--lime); } .foot-join.error .foot-join-err { display: block; color: var(--warn); }
.foot-join.success .foot-join-row { display: none; }
@media (max-width: 760px) { .foot-join { grid-template-columns: 1fr; } .foot-join-note { grid-column: 1; } .foot-join-row { flex-direction: column; } .foot-join-row .btn { width: 100%; justify-content: center; } }

/* ═══ v9.9: offers + codes ═══ */
.tag--code { background: var(--lime); color: var(--on-lime); border-color: var(--lime); font-weight: 800; }
.copy-btn { min-height: 40px; padding: 0 .9rem; border-radius: var(--radius-s); border: 1px solid var(--line-2); background: transparent; color: var(--ink); font-weight: 700; font-size: .85rem; cursor: pointer; }
.copy-btn:hover { border-color: var(--lime); } .copy-btn.is-done { background: var(--lime); color: var(--on-lime); border-color: var(--lime); }
.offers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.offer-card { display: grid; gap: .8rem; align-content: start; padding: 1.2rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); scroll-margin-top: 100px; }
.oc-head { display: flex; gap: .8rem; align-items: center; }
.oc-name { display: block; font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.3rem; line-height: 1; color: var(--ink); text-decoration: none; }
.oc-d { display: block; margin-top: .25rem; color: var(--lime); font-weight: 700; }
.oc-code { display: flex; gap: .5rem; align-items: center; }
.oc-code code { flex: 1; font-family: var(--mono); font-weight: 700; letter-spacing: .06em; padding: .55rem .8rem; border: 1px dashed var(--lime); border-radius: var(--radius-s); color: var(--ink); }
.oc-meta { margin: 0; font-size: .82rem; color: var(--mut); }
.oc-go { display: flex; flex-wrap: wrap; gap: .5rem; }
.oc-aff { margin: 0; font-family: var(--mono); font-size: .72rem; color: var(--mut); text-transform: uppercase; letter-spacing: .08em; }
.offers-disc { margin-block-end: 1rem; }
@media (max-width: 1080px) { .offers { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .offers { grid-template-columns: 1fr; } .oc-go .btn { width: 100%; justify-content: center; } }

/* ═══ v10.0: homepage offers strip (only when Show Offers is on and a code is live) ═══ */
.offers-strip-sec { padding-block-start: 2rem; }
.offers--strip { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, 1fr); grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory; padding-block-end: .5rem; scrollbar-width: thin; }
.offers--strip .offer-card { scroll-snap-align: start; }
@media (max-width: 620px) { .offers--strip { grid-auto-columns: 85%; } }

/* ═══ v10.2: official firm logos (optional per firm) ═══ */
.mono--logo { background: var(--bg-3); padding: 5px; overflow: hidden; }
.mono--logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.mono--light { background: #F5F5F2; }
.mono--lg.mono--logo { padding: 7px; } .mono--xl.mono--logo { padding: 12px; }

/* ═══ v10.9: balanced hero (left column matches the Duel's height) ═══ */
.hero--duel { align-items: stretch; }
.hero--duel .hero-copy { display: flex; flex-direction: column; justify-content: center; gap: 0; padding-block: .5rem; }
.hero--duel .hero-h { font-size: clamp(3.4rem, 2rem + 5vw, 7.2rem); line-height: .86; max-width: 9ch; }
.hero--duel .hero-k { margin-block-end: 1.1rem; }
.hero--duel .lead { font-size: clamp(1.1rem, 1rem + .4vw, 1.3rem); max-width: 34ch; margin-block: 1.4rem 1.2rem; }
.hero--duel .hero-cta { margin-block-start: 1.6rem; }
.hero-quick { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-block-start: 2.2rem; padding-block-start: 1.4rem; border-block-start: 1px solid var(--line); }
.hero-quick-k { flex-basis: 100%; margin: 0 0 .25rem; font-family: var(--mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--mut); }
.hero-quick a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 .85rem; border: 1px solid var(--line-2); border-radius: 999px; font-size: .88rem; font-weight: 600; color: var(--ink); text-decoration: none; background: var(--bg-2); }
.hero-quick a:hover { border-color: var(--lime); color: var(--lime); }
@media (max-width: 1080px) { .hero--duel .hero-h { max-width: none; font-size: clamp(3rem, 10vw, 5rem); } }
@media (max-width: 760px) { .hero-quick a { min-height: 40px; } }
.hero--duel { align-items: center; }
.hero--duel .duel { align-self: center; }
.hero--duel .hero-h { font-size: clamp(3.2rem, 1.6rem + 4.6vw, 6.4rem); max-width: 10ch; }

/* ================= 10.10: Replay My Trades, Stack Builder, Live Duels, price per $1K, Pit News ================= */
@layer pages {
  .board td.perk { color: var(--lime); }
  .tool-in input[type="number"] { min-height: 56px; padding: 0 1rem; border-radius: var(--radius); background: var(--bg); color: var(--ink); border: 1px solid var(--line-2); font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 1.4rem; font-weight: 600; }
  .tool-in input[type="number"]:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
  /* replay */
  .rp-drop { position: relative; display: grid !important; justify-items: center; text-align: center; gap: .5rem !important; padding: 1.75rem 1rem; border: 1px dashed var(--line-2); border-radius: var(--radius-l); background: var(--bg); color: var(--ink) !important; cursor: pointer; }
  .rp-drop svg { color: var(--lime); }
  .rp-drop b { font-size: 1.1rem; }
  .rp-drop span { font-weight: 500; color: var(--ink-2); font-size: .9rem; }
  .rp-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
  .rp-drop:focus-within, .rp-drop:hover { border-color: var(--lime); }
  .rp-safe { margin: 0; padding: .9rem 1rem; border-radius: var(--radius); border: 1px solid var(--line); font-size: .92rem; color: var(--ink-2); }
  .rp-safe b { color: var(--ink); }
  .rp-cols, .rp-opts { display: grid; gap: 1rem; }
  .rp-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rp-sum, .sb-sum { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-block: .75rem 1rem; }
  .sb-sum { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .rp-sum > div, .sb-sum > div { padding: .9rem 1rem; border-radius: var(--radius); background: var(--bg); border: 1px solid var(--line); display: grid; gap: .15rem; }
  .rp-sum b { font-family: "Barlow Condensed", sans-serif; font-weight: 800; font-size: 2.6rem; line-height: 1; color: var(--lime); }
  .rp-sum .rp-sum-f b { color: var(--neg); }
  .rp-sum span, .sb-sum span { font-size: .85rem; color: var(--ink-2); }
  .sb-sum b { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 1.35rem; }
  .sb-sum .sb-hi { border-color: var(--lime); } .sb-sum .sb-hi b { color: var(--lime); }
  .rp-tag { display: inline-block; padding: .25rem .6rem; border-radius: 4px; font-size: .82rem; font-weight: 700; white-space: nowrap; }
  .rp-pass { background: var(--lime); color: var(--on-lime); }
  .rp-fail { background: var(--neg); color: #0A0A0B; }
  .rp-cons, .rp-open { background: var(--bg-3); color: var(--ink); border: 1px solid var(--line-2); }
  .rp-table .rp-why { white-space: normal; color: var(--ink-2); font-size: .9rem; min-width: 200px; }
  .rp-table tbody th a { font-weight: 700; text-decoration: none; }
  .rp-table tbody th .rp-prog { display: block; font-weight: 500; font-size: .85rem; color: var(--ink-2); white-space: normal; }
  .rp-table { min-width: 0; }
  .rp-table tbody th { white-space: normal; min-width: 150px; }
  /* stack builder */
  .sb-check { display: flex !important; align-items: center; gap: .6rem; min-height: 44px; color: var(--ink) !important; }
  .sb-check input { width: 20px; height: 20px; accent-color: var(--lime); }
  .sb-h { font-size: 1.6rem; margin-block: 1rem .75rem; }
  .sb-line { display: grid; grid-template-columns: auto auto minmax(0, 1fr); gap: 1rem 1.5rem; align-items: center; padding: 1rem 1.1rem; border-radius: var(--radius); background: var(--bg); border: 1px solid var(--line); margin-block-end: .6rem; }
  .sb-line > div:first-child { display: grid; gap: .2rem; min-width: 0; grid-column: 1 / -1; }
  .sb-line .btn { justify-self: end; }
  .sb-line a { text-decoration: none; }
  .sb-line span { font-size: .88rem; color: var(--ink-2); }
  .sb-flag { color: var(--neg) !important; font-size: .8rem !important; }
  .sb-q { display: grid; gap: .1rem; }
  .sb-q span { font-size: .75rem; }
  .sb-q b { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 1.05rem; }
  /* live duels */
  .ld-k { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
  .ld-live { background: var(--lime); color: var(--on-lime); padding: .2rem .6rem; border-radius: 3px; font-weight: 700; }
  .ld-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: start; }
  .ld-grid h2 { font-size: 1.7rem; margin-block-end: .75rem; }
  .ld-table, .ld-days { min-width: 0; }
  .ld-table td, .ld-table th { white-space: normal; }
  .ld-note { display: block; color: var(--mut); font-size: .8rem; font-family: var(--mono); margin-block-start: .2rem; }
  .ld-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-block-end: 1rem; }
  .ld-card { padding: 1rem 1.1rem; border-radius: var(--radius); background: var(--bg-2); border: 1px solid var(--line); border-top: 4px solid var(--lime); }
  .ld-name { display: block; font-size: 1.05rem; margin-block-end: .6rem; }
  .ld-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin: 0; }
  .ld-card dt { font-size: .78rem; color: var(--ink-2); } .ld-card dd { margin: 0; font-family: "JetBrains Mono", ui-monospace, monospace; font-weight: 600; }
  .ld-days .pos { color: var(--lime); } .ld-days .neg { color: var(--neg); }
  .ld-fair { margin-block-start: 1rem; }
  /* pit news */
  .pit-dot { display: inline-block; width: .55em; height: .55em; border-radius: 50%; background: var(--lime); margin-inline-end: .5rem; vertical-align: middle; }
  @media (max-width: 900px) {
    .ld-grid { grid-template-columns: minmax(0, 1fr); }
    .sb-sum { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sb-line { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sb-line .btn { grid-column: 1 / -1; justify-self: stretch; }
  }
  @media (max-width: 560px) { .rp-opts { grid-template-columns: minmax(0, 1fr); } .ld-cards { grid-template-columns: minmax(0, 1fr); } }
}

/* ================= 10.11: homepage hero with quick replay + timing tower, three ways, replay chart ================= */
@layer pages {
  .hero--tower .hero-h em { font-style: inherit; color: var(--lime); }
  .hero--tower .lead { max-width: 60ch; }
  .quick-replay { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 260px); gap: 1rem; margin-block: 1.4rem .9rem; padding: 1.1rem; border-radius: var(--radius-l); border: 1px solid var(--line-2); background: var(--bg-2); max-width: 820px; }
  .quick-replay > label { grid-column: 1; font-weight: 600; font-size: .9rem; color: var(--ink-2); }
  .quick-replay textarea { grid-column: 1; padding: .8rem 1rem; border-radius: var(--radius); background: var(--bg); color: var(--ink); border: 1px solid var(--line-2); font-family: "JetBrains Mono", ui-monospace, monospace; font-size: .95rem; line-height: 1.6; resize: vertical; min-height: 7.5rem; }
  .quick-replay .qr-side { grid-column: 2; grid-row: 1 / span 2; display: flex; flex-direction: column; gap: .75rem; justify-content: flex-end; }
  .quick-replay .seg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .quick-replay .seg button { min-height: 44px; padding-inline: .2rem; }
  .quick-replay .qr-go { min-height: 54px; width: 100%; justify-content: center; }
  .quick-replay .small { margin: 0; }
  .hero-links { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-weight: 600; margin-block-end: 1rem; }
  .hero-links a { text-decoration: none; } .hero-links a:hover { text-decoration: underline; }
  .ttower { align-self: start; margin-block-start: .5rem; border-radius: var(--radius-l); border: 1px solid var(--line-2); background: var(--bg-2); overflow: hidden; }
  .tt-head { display: grid; gap: .2rem; padding: 1rem 1.2rem; background: var(--bg-3); }
  .tt-head b { font-family: "Barlow Condensed", sans-serif; font-style: italic; font-weight: 900; font-size: 1.7rem; text-transform: uppercase; letter-spacing: .01em; }
  .tt-head span { font-family: var(--mono); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); }
  .tt-list { list-style: none; margin: 0; padding: 0; }
  .tt-list li { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr) auto; align-items: stretch; border-top: 1px solid var(--line); min-height: 4rem; }
  .tt-pos { display: flex; align-items: center; justify-content: center; background: var(--bg-3); font-family: "Barlow Condensed", sans-serif; font-style: italic; font-weight: 900; font-size: 1.45rem; }
  .tt-list li:first-child .tt-pos { background: var(--lime); color: var(--on-lime); }
  .tt-list a { display: grid; align-content: center; gap: .1rem; padding: .55rem 1rem; text-decoration: none; min-width: 0; }
  .tt-list a b { font-size: 1rem; } .tt-list a span { font-size: .82rem; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tt-list a:hover b { color: var(--lime); }
  .tt-v { display: flex; align-items: center; padding-inline: 1rem; font-family: var(--mono); font-weight: 600; font-size: 1.05rem; color: var(--lime); }
  .tt-foot { margin: 0; padding: .85rem 1.2rem; border-top: 1px solid var(--line); font-size: .78rem; line-height: 1.5; color: var(--ink-2); }
  .ways { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
  .way { display: flex; flex-direction: column; gap: .6rem; padding: 1.6rem; min-height: 13rem; border-radius: var(--radius-l); border: 1px solid var(--line); border-top: 4px solid var(--lime); background: var(--bg-2); text-decoration: none; color: var(--ink); }
  .way .k { color: var(--lime); }
  .way b { font-family: "Barlow Condensed", sans-serif; font-weight: 800; font-size: 1.85rem; line-height: 1.05; }
  .way > span:not(.k) { color: var(--ink-2); line-height: 1.45; }
  .way em { margin-top: auto; font-style: normal; font-weight: 700; color: var(--lime); }
  .way:hover { border-color: var(--line-2); }
  .rp-cbtn { display: block; margin-top: .3rem; font-size: .8rem; font-weight: 600; color: var(--lime); }
  .rp-chart { margin-block: 0 1rem; padding: 1rem; border-radius: var(--radius); border: 1px solid var(--line); background: var(--bg); }
  .rp-chart .chart { width: 100%; height: auto; }
  @media (max-width: 1080px) { .ttower { margin-block-start: 1.5rem; } }
  @media (max-width: 900px) { .ways { grid-template-columns: minmax(0, 1fr); } }
  @media (max-width: 640px) { .quick-replay { grid-template-columns: minmax(0, 1fr); } .quick-replay .qr-side { grid-column: 1; grid-row: auto; } }
}

/* 10.11 hero sizing: unlayered on purpose, to override the older unlayered .hero--duel rules above. */
.hero--duel.hero--tower { grid-template-columns: minmax(0, 1.45fr) minmax(340px, 1fr); align-items: start; }
.hero--duel.hero--tower .hero-h { font-size: clamp(2.8rem, 1.4rem + 4.2vw, 5.8rem); line-height: .9; max-width: 14ch; }
@media (max-width: 1080px) { .hero--duel.hero--tower { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .hero--tower::before { height: 14%; opacity: .6; } }

/* ================= 10.15: header, reimagined. One clean row: logo, the menu in heavy expanded caps, then search, log in and one lime button.
   No slab behind the menu; a lime bar grows under the item you hover or open. Unlayered on purpose, to override older .nav rules. ================= */
.head-in { gap: clamp(1rem, 2vw, 2rem); min-height: 72px; }
.brand { flex-shrink: 0; }
.nav.nav--main { flex: 1 1 auto; display: flex; align-items: stretch; justify-content: center; gap: clamp(1.25rem, 2.6vw, 2.75rem); align-self: stretch;
  font-family: "Archivo", "Barlow", sans-serif; font-stretch: 125%; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; font-size: clamp(.74rem, .5rem + .3vw, .86rem); }
.nav.nav--main > a, .nav.nav--main > details { position: relative; display: flex; align-items: center; }
.nav.nav--main > a, .nav.nav--main > details > summary { font: inherit; color: var(--ink-2); text-decoration: none; white-space: nowrap; padding: 0; }
.nav.nav--main > details > summary { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; }
.nav.nav--main > details > summary::after { border-color: currentColor; width: 5px; height: 5px; }
.nav.nav--main > a::after, .nav.nav--main > details::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: var(--lime); transform: scaleX(0); transform-origin: left; transition: transform .18s var(--ease); pointer-events: none; }
.nav.nav--main > a:hover, .nav.nav--main > details:hover > summary, .nav.nav--main > details[open] > summary, .nav.nav--main > a[aria-current] { color: var(--ink); }
.nav.nav--main > a:hover::after, .nav.nav--main > details:hover::after, .nav.nav--main > details[open]::after, .nav.nav--main > a[aria-current]::after { transform: scaleX(1); }
.nav.nav--main :focus-visible { outline: 2px solid var(--lime); outline-offset: 4px; border-radius: 2px; }
.nav.nav--main .sub { top: calc(100% + .35rem); left: -1rem; text-transform: none; font-stretch: 100%; letter-spacing: normal; font-weight: 600; }
.nav.nav--main .has-sub--end .sub { left: auto; right: -1rem; }
.nav.nav--main .sub li a { color: var(--ink-2); }
.head-cta { flex-shrink: 0; display: flex; align-items: center; gap: .9rem; }
.head-cta-btn { white-space: nowrap; }
@media (max-width: 1320px) { .head-cta .find-lab, .head-cta .find-btn kbd { display: none; } }
@media (max-width: 1100px) { .nav.nav--main, .head-cta-btn { display: none; } .menu-btn { display: inline-grid; } }

/* ================= 10.13: Compare, company facts, beginner path ================= */
@layer pages {
  .cmp-pick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(120px, .5fr); gap: 1rem; margin-block-end: 1.25rem; }
  .cmp-pick label { display: grid; gap: .45rem; font-weight: 600; font-size: .9rem; color: var(--ink-2); min-width: 0; }
  .cmp-pick select { appearance: none; min-height: 52px; width: 100%; padding: 0 2.5rem 0 1rem; border-radius: var(--radius); border: 1px solid var(--line-2); background: var(--bg-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23C8CFC2' stroke-width='1.6'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 1rem center; color: var(--ink); font-weight: 600; font-size: .95rem; text-overflow: ellipsis; }
  .cmp-table { min-width: 640px; table-layout: fixed; }
  .cmp-table thead th:first-child, .cmp-table tbody th[scope="row"] { width: 220px; }
  .cmp-table thead th { white-space: normal; vertical-align: bottom; font-family: var(--sans); font-size: 1rem; color: var(--ink); text-transform: none; letter-spacing: 0; }
  .cmp-table thead th a { font-weight: 700; text-decoration: none; }
  .cmp-table td { white-space: normal; vertical-align: top; }
  .cmp-table tbody th[scope="row"] { white-space: normal; color: var(--ink-2); font-weight: 600; font-size: .9rem; }
  .cmp-sub { display: block; font-size: .8rem; color: var(--mut); font-weight: 500; }
  .cmp-note { font-size: .85rem; color: var(--ink-2); line-height: 1.45; }
  .cmp-group th { padding-block: 1.1rem .5rem !important; font-family: "Barlow Condensed", sans-serif; font-style: italic; font-weight: 800; font-size: 1.25rem !important; color: var(--lime) !important; text-transform: uppercase; background: var(--bg) !important; }
  .cmp-visit td { padding-block: 1rem; }
  .prog-cmp { font-size: .85rem; font-weight: 600; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
  .prog-cmp:hover { text-decoration: underline; }
  .hero-new { margin: 0 0 .9rem; color: var(--ink-2); }
  .hero-new a { font-weight: 700; }
  @media (max-width: 900px) { .cmp-pick { grid-template-columns: minmax(0, 1fr); } }
}

/* 10.15 balance: section headings on one line at one size; lists in four even columns with short labels; hero columns centered. */
.block-head .display, .sub-h { max-width: none; font-size: clamp(1.9rem, 1.3rem + 1.6vw, 2.8rem); }
.list-links { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1080px) { .list-links { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .list-links { grid-template-columns: minmax(0, 1fr); } }
.hero--duel.hero--tower { align-items: center; }
.hero--tower .ttower { align-self: center; margin-block-start: 0; }
.hero-side { display: grid; gap: 1.25rem; align-self: center; }
.hero-side .hero-quick { margin: 0; }
.list-more { display: inline-flex; align-items: center; min-height: 44px; margin-top: .25rem; font-weight: 700; font-size: .9rem; }
/* 10.15: homepage codes strip as four even tiles */
.offers.offers--strip { grid-auto-flow: row; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: visible; scroll-snap-type: none; }
.offers--strip .offer-card { gap: .65rem; padding: 1rem; }
.offers--strip .oc-name { font-size: 1.05rem; line-height: 1.15; overflow-wrap: anywhere; }
.offers--strip .oc-d { font-size: .88rem; }
.offers--strip .oc-meta { font-size: .78rem; margin: 0; }
.offers--strip .oc-go .btn { width: 100%; justify-content: center; }
.offers--strip .oc-code { display: flex; gap: .5rem; } .offers--strip .oc-code code { flex: 1; min-width: 0; }
@media (max-width: 1080px) { .offers.offers--strip { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .offers.offers--strip { grid-template-columns: minmax(0, 1fr); } }
/* header fit: hide the search label a little earlier so the row never overflows */
@media (max-width: 1480px) { .head-cta .find-lab, .head-cta .find-btn kbd { display: none; } }
.offers--strip .oc-code code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.offers--strip .copy-btn { flex-shrink: 0; padding-inline: .7rem; white-space: nowrap; }
.offers--strip .offer-card { min-width: 0; overflow: hidden; }
/* 10.15: four even columns (Market, Account size, Features, Platform) instead of the older stacked grid areas */
.list-links { grid-template-areas: none !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; align-items: stretch; }
.list-links > .list-group { grid-area: auto !important; }
@media (max-width: 1080px) { .list-links { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 560px) { .list-links { grid-template-columns: minmax(0, 1fr) !important; } }

/* 10.16: evergreen pitch hero with the Duel beside it */
.hero--duel.hero--pitch { grid-template-columns: minmax(0, 1.1fr) minmax(360px, 1fr); align-items: center; }
.hero--duel.hero--pitch .hero-h { font-size: clamp(2.8rem, 1.4rem + 4.2vw, 5.8rem); line-height: .9; max-width: 12ch; }
.hero--pitch .hero-h em { font-style: inherit; color: var(--lime); }
.hero--pitch .lead { max-width: 56ch; }
@media (max-width: 1080px) { .hero--duel.hero--pitch { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .hero--pitch::before { height: 12%; opacity: .6; } }

/* ================= 10.17: design push. Motion that means something, a real face-off in the Duel, livery details, a signature footer.
   Every animation is off under prefers-reduced-motion. Unlayered on purpose. ================= */
/* numbers line up everywhere data is shown */
.rank-table, .duel-rows, .tt-list, .sb-sum, .rp-sum, .ld-card, .cost-lines { font-variant-numeric: tabular-nums; }

/* The Duel as a face-off: logos, a slashed VS badge, sides that come in from their corners */
.duel-heads { align-items: stretch; }
.duel-side { align-content: start; }
.duel-logo { margin-block-end: .45rem; }
.duel-logo .mono { width: 42px; height: 42px; font-size: 1.05rem; }
.duel-side--b .duel-logo { justify-self: end; }
.duel-vs { position: relative; align-self: center; display: grid; place-items: center; width: 3.1rem; height: 3.1rem; padding: 0; font-family: var(--display); font-style: italic; font-weight: 900; font-size: 1.35rem; letter-spacing: -.02em; color: var(--on-lime); background: var(--lime);
  clip-path: polygon(22% 0, 100% 0, 78% 100%, 0 100%); }
.duel-vs::after { content: ""; position: absolute; inset: 0 auto 0 -10px; width: 3px; background: #F5F5F2; transform: skewX(-24deg); opacity: .85; }
@media (prefers-reduced-motion: no-preference) {
  .duel--in .duel-side--a { animation: pfd-in-l .55s cubic-bezier(.2,.8,.2,1) both; }
  .duel--in .duel-side--b { animation: pfd-in-r .55s cubic-bezier(.2,.8,.2,1) both; }
  .duel--in .duel-vs { animation: pfd-pop .45s .18s cubic-bezier(.3,1.6,.5,1) both; }
  .duel--in .duel-row { animation: pfd-fade .4s both; }
  .duel--in .duel-row:nth-child(2) { animation-delay: .04s; } .duel--in .duel-row:nth-child(3) { animation-delay: .08s; }
  .duel--in .duel-row:nth-child(4) { animation-delay: .12s; } .duel--in .duel-row:nth-child(5) { animation-delay: .16s; }
  .duel--in .duel-row:nth-child(6) { animation-delay: .2s; } .duel--in .duel-row:nth-child(n+7) { animation-delay: .24s; }
}
@keyframes pfd-in-l { from { opacity: 0; transform: translateX(-28px); } }
@keyframes pfd-in-r { from { opacity: 0; transform: translateX(28px); } }
@keyframes pfd-pop { from { opacity: 0; transform: scale(.4) rotate(-12deg); } }
@keyframes pfd-fade { from { opacity: 0; transform: translateY(6px); } }
@keyframes pfd-rise { from { opacity: 0; transform: translateY(24px); } }

/* hero: the livery stripes drift as you scroll, the headline settles in */
@media (prefers-reduced-motion: no-preference) {
  .hero-h1 .hero-h { animation: pfd-rise .7s cubic-bezier(.2,.8,.2,1) both; }
  .hero-copy .lead { animation: pfd-rise .7s .08s cubic-bezier(.2,.8,.2,1) both; }
  .hero-copy .proof, .hero-copy .hero-cta { animation: pfd-rise .7s .16s cubic-bezier(.2,.8,.2,1) both; }
  @supports (animation-timeline: scroll()) {
    .hero::before { animation: pfd-drift linear both; animation-timeline: scroll(root); animation-range: 0 90vh; }
    @keyframes pfd-drift { to { transform: translate(-6%, -10%); } }
  }
  /* section headings and cards rise into view (scroll-driven where supported; otherwise simply shown) */
  /* 10.38: scroll-driven reveals removed. Safari's PDF export and some screenshot tools left those sections invisible. */
}

/* buttons: a light sweep across the lime on hover */
.btn--lime { position: relative; isolation: isolate; overflow: hidden; }
.btn--lime::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.5) 50%, transparent 65%); transform: translateX(-110%); }
@media (prefers-reduced-motion: no-preference) { .btn--lime::after { transition: transform .6s ease; } }
.btn--lime:hover::after { transform: translateX(110%); }
@media print { .btn--lime::after { display: none; } }
.btn:active { transform: translateY(1px); }

/* cards lift, with a lime edge on hover */
.way, .guide, .offer-card, .tool, .pay-card { transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.way:hover, .guide:hover, .tool:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--lime) 55%, var(--line)); box-shadow: 0 18px 40px -28px color-mix(in srgb, var(--lime) 60%, transparent); }
@media (prefers-reduced-motion: reduce) { .way:hover, .guide:hover, .tool:hover { transform: none; } }

/* board rows: a lime rail marks the row under the pointer */
.board tbody tr { position: relative; }
.board tbody tr:hover th.fm { box-shadow: inset 3px 0 0 var(--lime); }

/* signature footer: the name in huge outlined livery type, cut by a lime slash */
.foot-mark { position: relative; overflow: hidden; margin-block-start: 2.5rem; padding-block: 1rem 0; border-top: 1px solid var(--line); line-height: .78; user-select: none; }
.foot-mark span { display: block; white-space: nowrap; font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; letter-spacing: -.02em;
  font-size: clamp(3rem, 11vw, 11rem); color: transparent; position: relative; z-index: 1; -webkit-text-stroke: 1.5px color-mix(in srgb, var(--ink) 22%, transparent); text-align: center; translate: 0 18%; }
.foot-mark::after { content: ""; position: absolute; top: 0; bottom: 0; left: 58%; width: clamp(40px, 6vw, 90px); background: var(--lime); transform: skewX(-24deg); opacity: .9; z-index: 0; }
.foot-mark::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(58% + clamp(52px, 7.4vw, 110px)); width: 5px; background: #F5F5F2; transform: skewX(-24deg); opacity: .5; z-index: 0; }

/* ================= 10.18: About page ================= */
.ab-hero { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; padding-block: clamp(2.5rem, 6vw, 5rem) clamp(1rem, 3vw, 2rem); }
.ab-h { font-size: clamp(2.8rem, 1.4rem + 4.4vw, 6rem); line-height: .9; margin-block: .6rem 1rem; }
.ab-h em { font-style: inherit; color: var(--lime); }
.ab-hero .lead { max-width: 58ch; }
.ab-hero .hero-cta { margin-block-start: 1.5rem; }
.ab-stats .tower { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; margin: 0; border: 1px solid var(--line-2); border-radius: var(--radius-l); overflow: hidden; background: var(--bg-2); }
.ab-stats .tower div { padding: 1.4rem 1.5rem; border-inline-end: 1px solid var(--line); border-block-end: 1px solid var(--line); }
.ab-stats .tower div:nth-child(2n) { border-inline-end: 0; } .ab-stats .tower div:nth-child(n+3) { border-block-end: 0; }
.ab-stats .tower dd { margin: 0; font-family: var(--display); font-style: italic; font-weight: 900; font-size: clamp(2.6rem, 2rem + 2vw, 4rem); line-height: 1; color: var(--ink); }
.ab-stats .tower div:last-child dd { color: var(--lime); }
.ab-stats .tower dt { margin-block-start: .35rem; font-family: var(--mono); font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); }
.ab-vs { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 1rem; align-items: center; }
.ab-col { padding: clamp(1.25rem, 2.5vw, 2rem); border-radius: var(--radius-l); border: 1px solid var(--line); background: var(--bg-2); height: 100%; box-sizing: border-box; }
.ab-col--pfd { border-color: color-mix(in srgb, var(--lime) 55%, var(--line)); }
.ab-col-k { margin: 0 0 1rem; font-family: var(--mono); font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); }
.ab-col--pfd .ab-col-k { color: var(--lime); }
.ab-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.ab-col li { position: relative; padding-inline-start: 1.6rem; font-size: 1.05rem; line-height: 1.4; }
.ab-col--sales li { color: var(--ink-2); }
.ab-col--sales li::before { content: ""; position: absolute; left: 0; top: .55em; width: .8rem; height: 2px; background: var(--mut); }
.ab-col--pfd li::before { content: ""; position: absolute; left: 0; top: .2em; width: .95rem; height: .95rem; background: var(--lime); clip-path: polygon(14% 52%, 38% 76%, 88% 18%, 100% 30%, 38% 100%, 0 64%); }
.ab-vs-badge { display: grid; place-items: center; width: 3.4rem; height: 3.4rem; font-family: var(--display); font-style: italic; font-weight: 900; font-size: 1.4rem; color: var(--on-lime); background: var(--lime); clip-path: polygon(22% 0, 100% 0, 78% 100%, 0 100%); }
.ab-card { display: grid; grid-template-columns: minmax(200px, 320px) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; padding: clamp(1.25rem, 3vw, 2.5rem); border-radius: var(--radius-l); border: 1px solid var(--line-2); background: linear-gradient(135deg, var(--bg-2), var(--bg)); position: relative; overflow: hidden; }
.ab-card::after { content: ""; position: absolute; top: 0; bottom: 0; right: 8%; width: 70px; background: var(--lime); transform: skewX(-24deg); opacity: .08; pointer-events: none; }
.ab-photo { aspect-ratio: 4 / 5; border-radius: var(--radius-l); overflow: hidden; background: var(--bg-3); display: grid; place-items: center; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 28px), calc(100% - 28px) 100%, 0 100%); }
.ab-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ab-initials { font-family: var(--display); font-style: italic; font-weight: 900; font-size: clamp(4rem, 8vw, 7rem); color: var(--lime); }
.ab-bio { position: relative; z-index: 1; }
.ab-name { font-size: clamp(2.2rem, 1.6rem + 2vw, 3.4rem); margin-block: .3rem .2rem; }
.ab-role { margin: 0 0 1rem; font-family: var(--mono); font-size: .8rem; letter-spacing: .04em; color: var(--lime); }
.ab-bio > p { max-width: 62ch; line-height: 1.6; color: var(--ink-2); }
.ab-links { display: flex; gap: 1.25rem; flex-wrap: wrap; font-weight: 700; }
.ab-note { margin-block-start: 1.25rem; padding: 1rem 1.2rem; border-radius: var(--radius); border: 1px solid var(--line); background: var(--bg); font-size: .95rem; line-height: 1.5; color: var(--ink-2); max-width: 62ch; }
.ab-note b { color: var(--ink); }
.ab-tools { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.ab-tools .way b { font-size: 1.45rem; }
.ab-contact { display: grid; grid-template-columns: minmax(0, 1.4fr) auto; gap: 1.5rem 3rem; align-items: center; padding: clamp(1.5rem, 3.5vw, 3rem); border-radius: var(--radius-l); background: var(--bg-2); border: 1px solid var(--line-2); border-top: 4px solid var(--lime); }
.ab-contact .display { font-size: clamp(1.9rem, 1.3rem + 1.6vw, 2.8rem); margin-block: .4rem .6rem; }
.ab-contact p { margin: 0; color: var(--ink-2); max-width: 60ch; }
.ab-contact .hero-cta { margin: 0; }
@media (max-width: 1080px) { .ab-hero, .ab-card, .ab-contact { grid-template-columns: minmax(0, 1fr); } .ab-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ab-photo { max-width: 320px; } }
@media (max-width: 760px) { .ab-vs { grid-template-columns: minmax(0, 1fr); } .ab-vs-badge { justify-self: center; } .ab-tools { grid-template-columns: minmax(0, 1fr); } }
.ab-stats .tower div { display: grid !important; align-content: start; gap: 0; }
.ab-stats .tower dt { order: 2; } .ab-stats .tower dd { order: 1; }
@media print { .block-head, .way, .guide, .step, .offer-card, .list-group, .hero-h1 .hero-h, .hero-copy .lead, .hero-copy .proof, .hero-copy .hero-cta { animation: none !important; opacity: 1 !important; transform: none !important; } }

/* ================= 10.19: page headers upgraded site-wide, and a document layout for policies ================= */
.page-top { position: relative; isolation: isolate; padding-block: clamp(2.5rem, 6vw, 5rem) clamp(1.75rem, 3.5vw, 2.75rem); border-block-end: 1px solid var(--line); margin-block-end: clamp(1.5rem, 3vw, 2.5rem); overflow: hidden; }
.page-top::before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; right: clamp(-2rem, 2vw, 4rem); width: clamp(60px, 9vw, 130px); background: var(--lime); transform: skewX(-24deg); opacity: .09; }
.page-top::after { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; right: calc(clamp(-2rem, 2vw, 4rem) - 26px); width: 4px; background: var(--ink); transform: skewX(-24deg); opacity: .12; }
.page-top .display { font-size: clamp(2.4rem, 1.5rem + 3.4vw, 4.8rem); line-height: .92; max-width: 18ch; margin-block: .5rem .9rem; }
.page-top .lead { max-width: 64ch; }
.page-top .hero-cta { margin-block-start: 1.25rem; }
.doc-meta { margin: 1rem 0 0; font-family: var(--mono); font-size: .78rem; letter-spacing: .03em; color: var(--mut); }
.doc { display: grid; grid-template-columns: minmax(200px, 250px) minmax(0, 72ch); gap: clamp(2rem, 5vw, 5rem); align-items: start; padding-block-end: clamp(2rem, 5vw, 4rem); }
.doc-side { position: sticky; top: 96px; }
.doc-side .toc ol { margin: .5rem 0 0; padding-inline-start: 1.1rem; display: grid; gap: .35rem; font-size: .9rem; }
.doc-side .toc a { color: var(--ink-2); text-decoration: none; } .doc-side .toc a:hover, .doc-side .toc a.is-on { color: var(--lime); }
.doc-body h2 { scroll-margin-top: 100px; margin-block: 2.4rem .8rem; padding-block-start: 1.4rem; border-block-start: 1px solid var(--line); font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
.doc-body h2:first-child { margin-block-start: 0; border: 0; padding: 0; }
.doc-body p, .doc-body li { line-height: 1.7; color: var(--ink-2); }
.doc-body b { color: var(--ink); }
.doc-body ul, .doc-body ol { padding-inline-start: 1.25rem; display: grid; gap: .4rem; }
.doc-table { overflow-x: auto; margin-block: 1rem 1.25rem; border: 1px solid var(--line); border-radius: var(--radius); }
.doc-table table { width: 100%; border-collapse: collapse; min-width: 640px; font-size: .9rem; }
.doc-table th, .doc-table td { text-align: left; vertical-align: top; padding: .7rem .85rem; border-block-start: 1px solid var(--line); line-height: 1.5; }
.doc-table thead th { border: 0; background: var(--bg-2); font-family: var(--mono); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); }
.doc-table td { color: var(--ink-2); }
.doc-caps { padding: 1rem 1.2rem; border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--bg-2); font-size: .85rem; letter-spacing: .01em; text-transform: uppercase; line-height: 1.6; }
.tool-disc { padding: 1.1rem 1.25rem; border: 1px solid var(--line); border-left: 3px solid var(--lime); border-radius: var(--radius); background: var(--bg-2); }
.tool-disc p { margin: 0 0 .6rem; font-size: .85rem; line-height: 1.6; color: var(--ink-2); max-width: 110ch; }
.tool-disc p:last-child { margin: 0; } .tool-disc b { color: var(--ink); }
@media (max-width: 1080px) { .doc { grid-template-columns: minmax(0, 1fr); } .doc-side { position: static; } .doc-side .toc { display: none; } }
@media print { .doc-side, .page-top::before, .page-top::after { display: none; } .doc { grid-template-columns: 1fr; } }
.page-top + .block, .page-top + .wrap.block { padding-block-start: 0; }
.method-list { list-style: none; margin: 0; padding: 0; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; counter-reset: m; max-width: none !important; }
.method-list > li { counter-increment: m; position: relative; display: grid; gap: .4rem; align-content: start; padding: 1.4rem 1.4rem 1.4rem 4.2rem; border: 1px solid var(--line) !important; border-radius: var(--radius-l); background: var(--bg-2); line-height: 1.6; color: var(--ink-2); }
.method-list > li::before { content: counter(m, decimal-leading-zero); position: absolute; left: 1.2rem; top: 1.2rem; font-family: var(--display); font-style: italic; font-weight: 900; font-size: 1.6rem; color: var(--lime); }
.method-list > li b { display: block; color: var(--ink); font-size: 1.1rem; }
@media (max-width: 900px) { .method-list { grid-template-columns: minmax(0, 1fr); } }

/* 10.20 accessibility fixes */
.foot-mark span::before { content: attr(data-text); }
.offer-x { color: var(--mut) !important; }
.table-wrap:focus-visible, .doc-table:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }

/* 10.22: top code strip (only with Show Offers on) */
.codebar { background: var(--lime); color: var(--on-lime); font-size: .85rem; }
.codebar-in { display: flex; align-items: center; gap: .5rem 1.25rem; flex-wrap: wrap; min-height: 40px; padding-block: .35rem; }
.codebar-k { font-family: var(--mono); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; }
.codebar-t { font-weight: 700; } .codebar-t a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.codebar-c { display: inline-flex; align-items: center; gap: .4rem; }
.codebar-c code { font-family: var(--mono); font-weight: 700; padding: .1rem .5rem; border: 1.5px dashed #0A0A0B; border-radius: 4px; }
.codebar .copy-btn { min-height: 32px; padding: 0 .7rem; border: 0; border-radius: 4px; background: #0A0A0B; color: var(--lime); font-weight: 700; cursor: pointer; }
.codebar-m { font-family: var(--mono); font-size: .72rem; color: var(--on-soft); }
.codebar-all { margin-left: auto; color: var(--on-lime); font-weight: 700; min-height: 32px; display: inline-flex; align-items: center; }
.codebar .copy-btn:focus-visible, .codebar a:focus-visible { outline: 2px solid #0A0A0B; outline-offset: 2px; }
@media (max-width: 760px) { .codebar-m { display: none; } .codebar-all { margin-left: 0; } }

/* 10.23: cleaner board. Fewer columns, short headers, numbers right-aligned, firm names on one line. */
.board { min-width: 900px; }
.board thead th.th-n, .board td.n { text-align: right; }
.board thead th.th-n .sort { justify-content: flex-end; width: 100%; }
.board thead th { white-space: nowrap; }
.board td.n { white-space: nowrap; font-variant-numeric: tabular-nums; }
.board .cell-sub { display: block; margin-top: .2rem; font-family: var(--mono); font-size: .72rem; font-weight: 500; color: var(--mut); white-space: nowrap; }
.board .fm { min-width: 300px; }
.board .fm-n a { white-space: nowrap; font-size: 1.02rem; }
.board tbody th, .board tbody td { padding-block: 1rem; }
@media (max-width: 1080px) { .board td.n, .board thead th.th-n { text-align: left; } }

/* ================= 10.24: modern tables. Each row is its own card: separated, rounded, lifted on hover.
   Applies to the board, list pages, program tables, cost tables, Compare and Replay (desktop; phones keep the card layout). ================= */
@media (min-width: 761px) {
  .table-wrap { border: 0 !important; background: none !important; border-radius: 0 !important; }
  .rank-table { border-collapse: separate !important; border-spacing: 0 8px !important; }
  .rank-table thead th { background: none !important; border: 0 !important; padding: .35rem 1rem .1rem; font-family: var(--mono); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
  .rank-table tbody > tr > th, .rank-table tbody > tr > td { background: var(--bg-2); border: 0 !important; border-block: 1px solid var(--line) !important; padding-block: 1rem; transition: background-color .15s ease, border-color .15s ease; }
  .rank-table tbody > tr > :first-child { border-inline-start: 1px solid var(--line) !important; border-start-start-radius: 12px; border-end-start-radius: 12px; }
  .rank-table tbody > tr > :last-child { border-inline-end: 1px solid var(--line) !important; border-start-end-radius: 12px; border-end-end-radius: 12px; }
  .rank-table tbody > tr:hover > th, .rank-table tbody > tr:hover > td { background: var(--bg-3); border-color: var(--line-2) !important; }
  .rank-table tbody > tr:hover > :first-child { box-shadow: inset 3px 0 0 var(--lime); }
  .rank-table tbody > tr.cmp-group > th { background: none !important; border: 0 !important; box-shadow: none !important; padding-block: 1.2rem .2rem !important; }
  .board .fm { min-width: 320px; }
}
/* the program picker inside a firm's row */
.prog-pick { display: inline-flex; align-items: center; gap: .5rem; margin-top: .35rem; flex-wrap: wrap; }
.prog-pick select { appearance: none; min-height: 34px; max-width: 210px; padding: 0 2rem 0 .75rem; border-radius: 999px; border: 1px solid var(--line-2); background: linear-gradient(45deg, transparent 50%, var(--lime) 50%) no-repeat calc(100% - .75rem - 5px) 50% / 5px 5px, linear-gradient(135deg, var(--lime) 50%, transparent 50%) no-repeat calc(100% - .75rem) 50% / 5px 5px, var(--bg); color: var(--ink); font-family: var(--sans); font-size: .85rem; font-weight: 600; text-overflow: ellipsis; cursor: pointer; }
.prog-pick select:hover { border-color: var(--lime); }
.prog-pick select:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
.prog-n { font-family: var(--mono); font-size: .7rem; color: var(--mut); }
.prog-one { display: block; margin-top: .3rem; font-size: .85rem; color: var(--ink-2); }
.board .fm-n { display: grid; gap: .1rem; justify-items: start; }
.board .fm-n .tag--code { margin-inline-start: .5rem; }
.board .fm-n > a + .tag--code { display: inline-flex; }
/* list pages: programs as chips */
.progs { white-space: normal !important; }
.prog-chip { display: inline-flex; align-items: center; min-height: 28px; margin: .15rem .3rem .15rem 0; padding: 0 .65rem; border-radius: 999px; border: 1px solid var(--line-2); font-size: .8rem; font-weight: 600; text-decoration: none; color: var(--ink-2); }
.prog-chip:hover { border-color: var(--lime); color: var(--ink); }

/* 10.24: compact firm cell: name and tags on one line; market, flag and the program picker on the next */
.board .fm-n { display: grid !important; gap: .35rem; }
.fm-top { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.fm-top .tag { margin: 0 !important; }
.fm-sub { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; font-size: .82rem; color: var(--ink-2); }
.fm-mk { font-family: var(--mono); font-size: .75rem; font-weight: 700; color: var(--lime); }
.fm-sub .prog-pick { margin: 0; }
.fm-sub .prog-one { margin: 0; display: inline; }

/* 10.25: code column */
.board td.code-c { white-space: nowrap; }
.code-cell { display: inline-flex; align-items: center; gap: .35rem; }
.code-cell code { font-family: var(--mono); font-weight: 700; font-size: .85rem; padding: .2rem .5rem; border: 1.5px dashed var(--lime); border-radius: 6px; color: var(--lime); }
.code-cell .copy-btn { min-height: 30px; padding: 0 .6rem; border: 1px solid var(--line-2); border-radius: 6px; background: var(--bg); color: var(--ink); font-size: .75rem; font-weight: 700; cursor: pointer; }
.code-cell .copy-btn:hover { border-color: var(--lime); }
.code-cell .copy-btn.is-done { background: var(--lime); color: var(--on-lime); border-color: var(--lime); }
.code-none { color: var(--mut); }
.board td.code-c .cell-sub { max-width: 190px; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 761px) {
  .board .fm { min-width: 270px; }
  .board tbody td, .board thead th { padding-inline: .6rem; }
  .board td.code-c .cell-sub { max-width: 150px; }
  .board .prog-pick select { max-width: 190px; }
}

/* ================= 10.26: calmer firm pages. Programs fold open one at a time; only confirmed facts are shown. ================= */
.prog-acc { padding: 0 !important; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-2); margin-block: .75rem !important; overflow: hidden; }
.prog-acc[open] { border-color: var(--line-2); }
.prog-sum { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "n t" "k t"; gap: .45rem 1rem; align-items: center; padding: 1.1rem 1.25rem; }
.prog-sum::-webkit-details-marker { display: none; }
.prog-sum:hover { background: var(--bg-3); }
.prog-sum:focus-visible { outline: 2px solid var(--lime); outline-offset: -2px; }
.prog-sum-n { grid-area: n; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.prog-sum-n .display { font-size: clamp(1.25rem, 1.05rem + .6vw, 1.6rem); line-height: 1.05; }
.prog-keys { grid-area: k; display: flex; flex-wrap: wrap; gap: .4rem; }
.prog-keys span { font-family: var(--mono); font-size: .74rem; padding: .25rem .55rem; border-radius: 999px; background: var(--bg); border: 1px solid var(--line); color: var(--ink-2); }
.prog-keys span:first-child { color: var(--lime); border-color: color-mix(in srgb, var(--lime) 45%, var(--line)); }
.prog-tog { grid-area: t; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line-2); display: grid; place-items: center; }
.prog-tog::before { content: ""; width: 9px; height: 9px; border-right: 2px solid var(--lime); border-bottom: 2px solid var(--lime); transform: translateY(-2px) rotate(45deg); transition: transform .2s ease; }
.prog-acc[open] .prog-tog::before { transform: translateY(2px) rotate(-135deg); }
.prog-body { padding: 0 1.25rem 1.25rem; border-top: 1px solid var(--line); }
.prog-lead { margin: 1rem 0; color: var(--ink-2); max-width: 75ch; line-height: 1.6; }
.prog-unk { color: var(--mut); margin: .6rem 0 1rem; }
.prog-more { margin-top: 1rem; border: 1px solid var(--line); border-radius: 10px; background: var(--bg); }
.prog-more > summary { cursor: pointer; padding: .8rem 1rem; font-weight: 700; list-style: none; display: flex; align-items: center; gap: .5rem; }
.prog-more > summary::-webkit-details-marker { display: none; }
.prog-more > summary::before { content: "+"; font-family: var(--mono); color: var(--lime); width: 1rem; }
.prog-more[open] > summary::before { content: "\2212"; }
.prog-more > summary span { font-family: var(--mono); font-size: .75rem; color: var(--mut); }
.prog-more .rule-list { padding: 0 1rem 1rem 2.2rem; margin: 0; }
.prog-links { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin: 1rem 0 0; }
.elig-more { margin-top: .75rem; }
.elig-more > summary { cursor: pointer; display: inline-flex; align-items: center; min-height: 40px; padding: 0 1rem; border-radius: 999px; border: 1px solid var(--line-2); font-weight: 700; list-style: none; }
.elig-more > summary::-webkit-details-marker { display: none; }
.elig-more > summary:hover { border-color: var(--lime); }
.elig-more[open] > summary { margin-bottom: 1rem; }
.pay-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
@media print { .prog-acc:not([open]) .prog-body { display: block; } }

/* 10.27: list tables. Program chips stay on one line each (long names are shortened with the full name on hover). */
.list-table td.progs { min-width: 240px; max-width: 320px; font-family: var(--sans); }
.list-table .prog-chip { display: inline-block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; line-height: 28px; font-family: var(--sans); }
.list-table .prog-chip i { font-style: normal; font-family: var(--mono); font-size: .68rem; color: var(--lime); margin-left: .3rem; }
.list-table .fm { white-space: nowrap; }
.list-table .fm a { font-weight: 700; }

.list-table thead th { white-space: normal; line-height: 1.3; }
.list-table td.progs { max-width: 280px; }
@media (max-width: 760px) {
  .list-table { min-width: 0 !important; }
  .list-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .list-table, .list-table tbody, .list-table tr, .list-table th, .list-table td { display: block; }
  .list-table tr { margin-bottom: .75rem; padding: 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-2); }
  .list-table th.fm { padding: 0 0 .6rem; border: 0; }
  .list-table td { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border: 0; border-top: 1px solid var(--line); text-align: right; }
  .list-table td::before { content: attr(data-l); font-family: var(--mono); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); text-align: left; }
  .list-table td.progs { display: block; max-width: none; text-align: left; }
  .list-table td.progs::before { display: block; margin-bottom: .35rem; }
}

/* ================= 10.28: calmer type and a stricter lime rule.
   Italic capitals are kept for the hero, page titles and the Duel; section headings are plain bold.
   Lime is kept for things you act on (buttons, codes, the code strip, links on hover) and the livery marks. ================= */
.block-head .display, .prof-block > h2.display, h2.prof-h, .doc-body h2, .ab-contact .display, .sub-h,
.prog-sum-n .display, .pay-card h3, .list-group h3, .method-list > li b, .ab-name {
  font-family: var(--sans) !important; font-style: normal !important; text-transform: none !important;
  font-weight: 700 !important; letter-spacing: -.015em !important; font-stretch: 100% !important; line-height: 1.15 !important; }
.block-head .display, h2.prof-h, .prof-block > h2.display { font-size: clamp(1.6rem, 1.25rem + 1.1vw, 2.3rem) !important; }
.doc-body h2 { font-size: clamp(1.35rem, 1.15rem + .7vw, 1.75rem) !important; }
.prog-sum-n .display { font-size: clamp(1.1rem, 1rem + .4vw, 1.35rem) !important; }
.list-group h3 { font-size: 1.1rem !important; }
.ab-name { font-size: clamp(1.8rem, 1.4rem + 1.4vw, 2.6rem) !important; }
/* lime only where you act */
.board td.perk, .rank-table td.perk, .perk { color: var(--ink) !important; font-weight: 700; }
.prog-keys span:first-child { color: var(--ink) !important; border-color: var(--line-2) !important; }
.fm-mk, .fm-n .mk { color: var(--ink-2) !important; }
.chip--hi { background: transparent !important; color: var(--ink) !important; border: 1px solid var(--line-2) !important; }
.tag:not(.tag--code), .list-table .prog-chip i { color: var(--ink-2) !important; background: transparent !important; border: 1px solid var(--line-2); }
.ab-role { color: var(--ink-2) !important; }
.method-list > li::before { color: var(--ink-2) !important; }
.step-n { background: var(--bg-3) !important; color: var(--ink) !important; border: 1px solid var(--line-2); }
.block-head::after { background: var(--line-2) !important; clip-path: none !important; height: 2px !important; width: 48px !important; }
/* homepage: tools on one quiet line */
.tools-line { padding-block: .5rem 1rem; }
.tools-line p { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.25rem; margin: 0; padding: 1rem 1.25rem; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-2); }
.tools-line .k { margin-inline-end: .25rem; }
.tools-line a { font-weight: 700; color: var(--ink); text-decoration: none; min-height: 32px; display: inline-flex; align-items: center; }
.tools-line a:hover { color: var(--lime); }
.tools-line .tools-all { margin-inline-start: auto; color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; }

/* ================= 10.30: "Find firms by what you need" as modern filter rows.
   One row per group: a quiet label on the left, pill links with a firm count on the right. ================= */
.list-links { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 0 !important; border: 1px solid var(--line); border-radius: 16px; background: var(--bg-2); overflow: hidden; }
.list-links > .list-group { display: grid; grid-template-columns: 170px minmax(0, 1fr); align-items: center; gap: .75rem 1.5rem; padding: 1.1rem 1.4rem !important; border: 0 !important; border-radius: 0 !important; background: none !important; }
.list-links > .list-group + .list-group { border-top: 1px solid var(--line) !important; }
.list-links .list-group h3 { margin: 0 !important; padding: 0 !important; border: 0 !important; font-family: var(--mono) !important; font-size: .74rem !important; font-weight: 600 !important; letter-spacing: .1em !important; text-transform: uppercase !important; color: var(--mut) !important; }
.list-links .list-group ul { display: flex !important; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.list-links .list-group li { display: block !important; padding: 0 !important; border: 0 !important; }
.list-links .list-group li a { display: inline-flex; align-items: center; gap: .55rem; min-height: 40px; padding: 0 .5rem 0 .95rem; border-radius: 999px; border: 1px solid var(--line-2); background: var(--bg); color: var(--ink); font-weight: 600; font-size: .95rem; text-decoration: none; transition: border-color .15s ease, background-color .15s ease, transform .15s ease; }
.list-links .list-group li a small { display: inline-grid; place-items: center; min-width: 26px; height: 26px; padding: 0 .4rem; border-radius: 999px; background: var(--bg-3); color: var(--ink-2); font-family: var(--mono); font-size: .72rem; font-weight: 600; margin: 0 !important; }
.list-links .list-group li a:hover { border-color: var(--lime); background: var(--bg-3); }
.list-links .list-group li a:hover small { background: var(--lime); color: var(--on-lime); }
.list-links .list-group li a:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
.list-links .list-more { grid-column: 2; min-height: 0; margin: -.25rem 0 0; font-size: .85rem; color: var(--ink-2); }
@media (prefers-reduced-motion: no-preference) { .list-links .list-group li a:hover { transform: translateY(-1px); } }
@media (max-width: 760px) {
  .list-links > .list-group { grid-template-columns: minmax(0, 1fr); padding: 1rem !important; }
  .list-links .list-more { grid-column: 1; }
}

/* 10.32: price after a live, flat code */
.w-code { display: block; margin-top: .2rem; font-family: var(--mono); font-size: .72rem; font-weight: 600; color: var(--lime); white-space: nowrap; }

/* 10.34: payouts the firm reports (its claim, attributed) */
.rep-pay { margin: 0 0 1.25rem; padding: 1.1rem 1.25rem; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-2); }
.rep-pay-k { margin: 0 0 .3rem; font-family: var(--mono); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
.rep-pay-v { margin: 0 0 .35rem; font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem); font-weight: 800; letter-spacing: -.02em; }
.rep-pay-v span { font-size: 1rem; font-weight: 600; color: var(--ink-2); letter-spacing: 0; }
.rep-pay .small { margin: 0; color: var(--ink-2); }

/* 10.37: a clear "No code listed" label instead of a dash */
.code-none { display: inline-flex; align-items: center; min-height: 26px; padding: 0 .6rem; border-radius: 6px; border: 1px dashed var(--line-2); color: var(--mut); font-family: var(--mono); font-size: .72rem; white-space: nowrap; }

/* ================= 10.39: head-to-head (versus) pages ================= */
.vs-heads { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 1rem; align-items: center; }
.vs-side { display: grid; gap: .45rem; justify-items: start; padding: 1.2rem 1.3rem; border: 1px solid var(--line-2); border-radius: 14px; background: var(--bg-2); }
.vs-side--b { justify-items: end; text-align: right; }
.vs-firm { font-size: clamp(1.3rem, 1.1rem + .8vw, 1.8rem); font-weight: 800; color: var(--ink); text-decoration: none; letter-spacing: -.01em; }
.vs-firm:hover { color: var(--lime); }
.vs-side small { font-family: var(--mono); font-size: .72rem; color: var(--mut); }
.vs-size { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin: 1.25rem 0 .5rem; }
.vs-size .pill.is-on { background: var(--lime); color: var(--on-lime); border-color: var(--lime); }
.vs-block { margin-block: 2.25rem; }
.vs-block > h2 { display: flex; align-items: center; gap: .6rem; }
.vs-count { display: inline-grid; place-items: center; min-width: 30px; height: 30px; padding: 0 .5rem; border-radius: 999px; background: var(--bg-3); font-family: var(--mono); font-size: .8rem; color: var(--ink-2); }
.vs-table th[scope="row"] { font-weight: 600; color: var(--ink-2); white-space: nowrap; }
.vs-table td { font-weight: 600; }
.vs-scen { display: grid; gap: 1rem; }
.vs-sc { border: 1px solid var(--line); border-radius: 14px; background: var(--bg-2); overflow: hidden; }
.vs-sc-q { margin: 0; padding: 1rem 1.25rem; font-weight: 800; font-size: 1.05rem; border-bottom: 1px solid var(--line); }
.vs-sc-a { display: grid; grid-template-columns: 1fr 1fr; }
.vs-sc-a > div { padding: 1rem 1.25rem; }
.vs-sc-a > div + div { border-inline-start: 1px solid var(--line); }
.vs-sc-a b { display: block; font-family: var(--mono); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); margin-bottom: .35rem; }
.vs-sc-a p { margin: 0; line-height: 1.55; color: var(--ink); }
.vs-cost { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.vs-cost-c { padding: 1.2rem 1.3rem; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-2); display: grid; gap: .4rem; align-content: start; }
.vs-cost-v { margin: 0; font-size: 1.8rem; font-weight: 800; }
.vs-cost-c .w-code { font-size: .8rem; }
.vs-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.vs-foot { color: var(--mut); max-width: 80ch; }
@media (max-width: 760px) {
  .vs-heads { grid-template-columns: minmax(0, 1fr); }
  .vs-heads .duel-vs { justify-self: center; }
  .vs-side--b { justify-items: start; text-align: left; }
  .vs-sc-a, .vs-cost { grid-template-columns: minmax(0, 1fr); }
  .vs-sc-a > div + div { border-inline-start: 0; border-top: 1px solid var(--line); }
}

/* 10.43: firm-page link blocks as rounded pills, matching "Find firms by what you need" */
#versus .pill-row, #similar .rel { display: flex; flex-wrap: wrap; gap: .5rem; }
#versus .pill-row .pill, #similar .rel .pill { display: inline-flex; align-items: center; gap: .55rem; min-height: 40px; padding: 0 .95rem; border-radius: 999px !important; border: 1px solid var(--line-2); background: var(--bg-2); color: var(--ink); font-weight: 600; font-size: .95rem; text-decoration: none; box-shadow: none; transition: border-color .15s ease, background-color .15s ease, transform .15s ease; }
#versus .pill-row .pill { padding-left: .4rem; }
#versus .vs-tag { display: inline-grid; place-items: center; min-width: 30px; height: 26px; padding: 0 .45rem; border-radius: 999px; background: var(--bg-3); color: var(--ink-2); font-family: var(--display); font-style: italic; font-weight: 900; font-size: .72rem; letter-spacing: .02em; }
#versus .pill-row .pill:hover, #similar .rel .pill:hover { border-color: var(--lime); background: var(--bg-3); }
#versus .pill-row .pill:hover .vs-tag { background: var(--lime); color: var(--on-lime); }
#versus .pill-row .pill:focus-visible, #similar .rel .pill:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
@media (prefers-reduced-motion: no-preference) { #versus .pill-row .pill:hover, #similar .rel .pill:hover { transform: translateY(-1px); } }
/* header: solid enough that page text never shows through behind the logo */
.site-head::before { background: color-mix(in srgb, var(--bg) 97%, transparent) !important; }

/* ================= 10.44: rotating code bar, side code card, homepage firm strip ================= */
.codebar-in { justify-content: center; gap: .5rem 1rem; min-height: 44px; }
.codebar-t { font-weight: 800; } .cb-d { font-weight: 600; }
.codebar-c code { font-family: var(--mono); font-weight: 700; padding: .15rem .5rem; border: 1.5px dashed rgb(10 10 11 / .55); border-radius: 6px; background: rgb(255 255 255 / .35); }
.codebar .copy-btn { background: #0A0A0B; color: var(--lime); border: 0; border-radius: 6px; padding: .3rem .7rem; font-weight: 700; cursor: pointer; }
.cb-go { display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .8rem; border-radius: 999px; background: #0A0A0B; color: #fff; font-weight: 700; text-decoration: none; }
.cb-go:hover { background: #222; }
.codebar-m { font-family: var(--mono); font-size: .72rem; opacity: .8; }
.cb-nav { width: 28px; height: 28px; border-radius: 999px; border: 1px solid rgb(10 10 11 / .35); background: transparent; color: var(--on-lime); font-size: 1.1rem; line-height: 1; cursor: pointer; }
.cb-nav:hover { background: rgb(10 10 11 / .1); }
.codebar a:focus-visible, .codebar button:focus-visible { outline: 2px solid #0A0A0B; outline-offset: 2px; }
@media (max-width: 760px) { .codebar-m, .codebar-all, .cb-nav { display: none; } .codebar-in { gap: .4rem .6rem; font-size: .8rem; } }

/* ================= 10.45: polish for code cards, side card, header ================= */
/* header: fully solid; the blur made page text show through behind the menu in Safari */
.site-head { background: var(--bg); }
.site-head::before { background: var(--bg) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
/* homepage code cards: same height, one short line, terms folded away */
.offers--strip .offer-card { grid-template-rows: auto auto auto 1fr auto; }
.oc-end.is-dated { color: var(--lime); font-weight: 700; }
.oc-terms { font-size: .78rem; color: var(--mut); }
.oc-terms summary { cursor: pointer; width: fit-content; color: var(--ink-2); font-weight: 600; list-style: none; }
.oc-terms summary::-webkit-details-marker { display: none; }
.oc-terms summary::after { content: " +"; } .oc-terms[open] summary::after { content: " \2212"; }
.oc-terms p { margin: .35rem 0 0; line-height: 1.5; }
.offers--strip .oc-go { display: flex; align-items: center; gap: .75rem; align-self: end; }
.oc-visit { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; min-height: 44px; padding: 0 1rem; border-radius: 999px; background: var(--lime); color: var(--on-lime); font-weight: 800; text-decoration: none; transition: filter .15s ease, transform .15s ease; }
.oc-visit:hover { filter: brightness(1.08); }
.oc-rules { font-size: .85rem; color: var(--ink-2); }
.offers-more { margin: 1rem 0 0; text-align: right; }
@media (prefers-reduced-motion: no-preference) { .oc-visit:hover { transform: translateY(-1px); } }

/* ================= 10.46: featured firm strip (names only) and a modern code card ================= */
.firm-strip { margin-block: clamp(1.5rem, 3vw, 2.75rem); padding-block: clamp(1.5rem, 3vw, 2.25rem); border-block: 1px solid var(--line); overflow: hidden; }
.fs-head { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem 1.5rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.fs-k { margin: 0; font-family: var(--mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--mut); }
.fs-sub { margin: 0; font-size: .85rem; color: var(--mut); }
.fs-view { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.fs-track { display: flex; align-items: center; width: max-content; animation: fs-scroll 110s linear infinite; }
.fs-dup { display: contents; }
.fs-view:hover .fs-track, .fs-view:focus-within .fs-track { animation-play-state: paused; }
@keyframes fs-scroll { to { transform: translateX(-50%); } }
.fs-item { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: clamp(1.25rem, 1rem + 1vw, 1.9rem); letter-spacing: .01em; color: var(--ink-2); opacity: .55; white-space: nowrap; text-decoration: none; padding-inline: 1.6rem; transition: opacity .2s ease, color .2s ease; }
.fs-item:hover, .fs-item:focus-visible { opacity: 1; color: var(--ink); }
.fs-sep { font-family: var(--display); font-style: italic; font-weight: 900; font-size: clamp(1.25rem, 1rem + 1vw, 1.9rem); color: var(--lime); opacity: .6; }
@media (prefers-reduced-motion: reduce) { .fs-track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; row-gap: .5rem; } .fs-dup { display: none; } .fs-view { mask-image: none; -webkit-mask-image: none; } }

.code-rail { position: fixed; z-index: 40; display: none; width: 250px; padding: 1.1rem 1.1rem 1rem; border-radius: 20px; border: 1px solid color-mix(in srgb, var(--lime) 22%, var(--line-2)); background: linear-gradient(180deg, color-mix(in srgb, var(--lime) 7%, var(--bg-2)) 0%, var(--bg-2) 45%); box-shadow: 0 24px 60px -24px rgb(0 0 0 / .8), inset 0 1px 0 rgb(255 255 255 / .04); text-align: left; transition: transform .35s cubic-bezier(.2,.8,.2,1), opacity .25s ease; }
.code-rail::before { content: ""; position: absolute; left: 18px; right: 18px; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: var(--lime); }
.code-rail:not([hidden]) { display: grid; gap: .6rem; }
/* wide screens: in the right-hand margin, vertically centred */
@media (min-width: 1780px) { .code-rail { right: 22px; top: 50%; transform: translate(calc(100% + 40px), -50%); } .code-rail.is-in { transform: translate(0, -50%); } }
/* laptops: bottom-right, still open by default */
@media (min-width: 900px) and (max-width: 1779px) { .code-rail { right: 18px; bottom: 18px; transform: translateY(calc(100% + 40px)); } .code-rail.is-in { transform: none; } }
@media (max-width: 899px) { .code-rail, .rail-tab { display: none !important; } }
.code-rail:not(.is-in) { opacity: 0; pointer-events: none; }
.code-rail.is-min { display: none !important; }
.rail-top { display: flex; align-items: center; justify-content: space-between; }
.rail-k { font-family: var(--mono); font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--lime); }
.rail-x { width: 26px; height: 26px; border-radius: 8px; border: 0; background: transparent; color: var(--mut); font-size: 1rem; cursor: pointer; }
.rail-x:hover { background: var(--bg-3); color: var(--ink); }
.rail-firm { font-weight: 800; font-size: 1.15rem; line-height: 1.2; color: var(--ink); text-decoration: none; }
.rail-firm:hover { text-decoration: underline; text-underline-offset: 3px; }
.rail-d { margin: 0; font-weight: 700; font-size: .95rem; line-height: 1.35; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rail-code { display: flex; align-items: stretch; border: 1.5px dashed color-mix(in srgb, var(--lime) 70%, transparent); border-radius: 12px; overflow: hidden; }
.rail-code code { flex: 1; display: flex; align-items: center; padding: .55rem .75rem; font-family: var(--mono); font-weight: 700; font-size: 1.05rem; letter-spacing: .05em; color: var(--ink); min-width: 0; }
.rail-code .copy-btn { border: 0; border-left: 1.5px dashed color-mix(in srgb, var(--lime) 70%, transparent); border-radius: 0; background: color-mix(in srgb, var(--lime) 12%, transparent); color: var(--lime); font-weight: 800; padding: 0 .9rem; cursor: pointer; }
.rail-code .copy-btn:hover { background: color-mix(in srgb, var(--lime) 22%, transparent); }
.rail-go { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; min-height: 46px; border-radius: 12px; background: var(--lime); color: var(--on-lime); font-weight: 800; font-size: 1rem; text-decoration: none; transition: filter .15s ease, transform .15s ease; }
.rail-go:hover { filter: brightness(1.08); }
@media (prefers-reduced-motion: no-preference) { .rail-go:hover { transform: translateY(-1px); } }
.rail-m { margin: 0; font-size: .75rem; color: var(--mut); }
.rail-m .is-dated { color: var(--lime); font-weight: 700; }
.rail-m a { color: var(--ink-2); }
.rail-foot { display: flex; align-items: center; justify-content: space-between; padding-top: .35rem; border-top: 1px solid var(--line); }
.rail-foot button { width: 30px; height: 30px; border-radius: 999px; border: 1px solid var(--line-2); background: transparent; color: var(--ink); cursor: pointer; font-size: 1rem; }
.rail-foot button:hover { border-color: var(--lime); color: var(--lime); }
.rail-dots { display: flex; gap: 5px; }
.rail-dots i { width: 6px; height: 6px; border-radius: 999px; background: var(--line-2); }
.rail-dots i.on { width: 16px; background: var(--lime); }
.code-rail a:focus-visible, .code-rail button:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
/* minimised: a lime tab on the right edge */
.rail-tab { position: fixed; right: 0; top: 50%; z-index: 40; display: none; transform: translate(100%, -50%); transition: transform .3s ease; padding: 1rem .5rem; border: 0; border-radius: 12px 0 0 12px; background: var(--lime); color: var(--on-lime); font-family: var(--display); font-style: italic; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; box-shadow: 0 10px 30px -12px rgb(0 0 0 / .6); }
.rail-tab span { writing-mode: vertical-rl; }
@media (min-width: 900px) { .rail-tab[aria-expanded="false"]:not([hidden]) { display: block; } }
.rail-tab.is-in { transform: translate(0, -50%); }
.rail-tab:not(.is-in) { pointer-events: none; }
.rail-tab:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

/* ================= 10.47: sleeker code card ================= */
.code-rail { width: 244px; padding: .9rem .95rem .95rem; gap: .55rem !important; border-radius: 16px; border: 1px solid var(--line-2); background: color-mix(in srgb, var(--bg-2) 94%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 20px 50px -28px rgb(0 0 0 / .9); overflow: hidden; }
.code-rail::before { display: none; }
.rail-top { display: flex; align-items: center; gap: .35rem; }
.rail-k { flex: 1; font-family: var(--mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
.rail-k b { color: var(--ink); font-weight: 600; }
.rail-nav { display: inline-flex; gap: 2px; }
.rail-nav button, .rail-x { display: inline-grid; place-items: center; width: 24px; height: 24px; border: 0; border-radius: 7px; background: transparent; color: var(--mut); font-size: .95rem; line-height: 1; cursor: pointer; }
.rail-nav button:hover, .rail-x:hover { background: var(--bg-3); color: var(--ink); }
.rail-firm { font-weight: 700; font-size: 1rem; letter-spacing: -.005em; }
.rail-d { font-weight: 500; font-size: .8rem; color: var(--ink-2); -webkit-line-clamp: 2; }
.rail-code { border: 0; border-radius: 10px; background: var(--bg-3); overflow: hidden; }
.rail-code code { padding: .55rem .7rem; font-size: .95rem; letter-spacing: .06em; }
.rail-code .copy-btn { border: 0; background: transparent; color: var(--lime); font-weight: 700; font-size: .8rem; padding: 0 .8rem; }
.rail-code .copy-btn:hover { background: color-mix(in srgb, var(--lime) 10%, transparent); }
.rail-go { min-height: 40px; border-radius: 10px; font-size: .9rem; font-weight: 700; gap: .4rem; }
.rail-m { display: flex; justify-content: space-between; gap: .5rem; font-size: .7rem; }
.rail-m a { color: var(--mut); text-decoration: underline; text-underline-offset: 2px; }
.rail-m a:hover { color: var(--ink); }
.rail-foot, .rail-dots { display: none; }
/* a hairline that fills over the 7 seconds before the next code; pauses on hover */
.rail-prog { position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; background: var(--lime); opacity: .7; transform-origin: left; animation: rail-prog 7s linear forwards; }
.code-rail:hover .rail-prog, .code-rail:focus-within .rail-prog { animation-play-state: paused; }
@keyframes rail-prog { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) { .rail-prog { display: none; } }
.rail-tab { padding: .8rem .4rem; border-radius: 10px 0 0 10px; font-size: .8rem; }

/* ================= 10.48: homepage codes scroll sideways ================= */
.offers.offers--strip { display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: calc((100% - 3rem) / 4); gap: 1rem; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: 0; padding-bottom: .75rem; scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; }
.offers--strip .offer-card { scroll-snap-align: start; }
.offers--strip::-webkit-scrollbar { height: 6px; } .offers--strip::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 999px; }
.offers--strip:focus-visible { outline: 2px solid var(--lime); outline-offset: 4px; }
@media (max-width: 1100px) { .offers.offers--strip { grid-auto-columns: calc((100% - 2rem) / 3); } }
@media (max-width: 860px) { .offers.offers--strip { grid-auto-columns: calc((100% - 1rem) / 2); } }
@media (max-width: 620px) { .offers.offers--strip { grid-auto-columns: 85%; } }
[data-offers][data-strip] { position: relative; }
.oc-scroll-nav { display: flex; gap: .35rem; margin-left: auto; margin-right: 1.25rem; align-self: center; }
.oc-scroll-nav button { width: 34px; height: 34px; border-radius: 999px; border: 1px solid var(--line-2); background: transparent; color: var(--ink); font-size: 1.1rem; cursor: pointer; }
.oc-scroll-nav button:hover { border-color: var(--lime); color: var(--lime); }
.oc-scroll-nav button:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
@media (max-width: 620px) { .oc-scroll-nav { display: none; } }

/* ================= 10.49: next-step code cards, phone code bar ================= */
.next-step { margin-block: 1.75rem 1rem; padding: 1.25rem; border: 1px solid var(--line-2); border-radius: 16px; background: var(--bg-2); }
.next-h { margin: 0 0 .25rem; font-size: 1.15rem; font-weight: 800; }
.next-step > .small { margin: 0 0 1rem; color: var(--mut); }
.next-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .75rem; }
.next-card { display: grid; gap: .5rem; align-content: start; padding: .9rem; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); }
.next-firm { font-weight: 800; color: var(--ink); text-decoration: none; } .next-firm:hover { text-decoration: underline; text-underline-offset: 3px; }
.next-prog { font-size: .78rem; color: var(--mut); margin-top: -.3rem; }
.next-price { margin: 0; font-weight: 700; } .next-price .w-code { display: block; }
.next-nocode { margin: 0; font-family: var(--mono); font-size: .75rem; color: var(--mut); }
.next-card .rail-code { display: flex; } .next-card .rail-go { display: inline-flex; }
.vs-actions .btn--line { order: 9; }
/* phone code bar */
.code-dock { display: none; }
@media (max-width: 899px) {
  .code-dock:not([hidden]) { position: fixed; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); z-index: 45; display: flex; align-items: center; gap: .5rem; padding: .5rem .5rem .5rem .85rem; border: 1px solid var(--line-2); border-radius: 14px; background: color-mix(in srgb, var(--bg-2) 96%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 16px 40px -18px rgb(0 0 0 / .9); }
  body.has-dock { padding-bottom: 76px; }
  .dock-t { flex: 1; min-width: 0; display: grid; line-height: 1.2; }
  .dock-t b { font-size: .88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dock-t span { font-size: .72rem; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dock-code { min-height: 40px; padding: 0 .7rem; border: 1.5px dashed color-mix(in srgb, var(--lime) 70%, transparent); border-radius: 10px; background: transparent; color: var(--ink); font-family: var(--mono); font-weight: 700; font-size: .85rem; letter-spacing: .04em; cursor: pointer; }
  .dock-code.is-done { color: var(--lime); }
  .dock-go { display: inline-flex; align-items: center; min-height: 40px; padding: 0 .95rem; border-radius: 10px; background: var(--lime); color: var(--on-lime); font-weight: 800; text-decoration: none; }
  .dock-x { width: 28px; height: 28px; border: 0; border-radius: 8px; background: transparent; color: var(--mut); font-size: 1.1rem; cursor: pointer; }
}
.next-grid { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.next-grid:has(> :only-child) { max-width: 340px; }

/* ================= 10.50: bigger code card on desktop ================= */
.rail-price { margin: 0; display: grid; gap: .1rem; }
.rail-price span { font-size: .72rem; color: var(--mut); font-family: var(--mono); }
.rail-price b { font-size: 1.05rem; } .rail-price b.is-was { color: var(--mut); font-weight: 600; text-decoration: line-through; font-size: .9rem; }
.rail-price .w-code { font-size: 1.05rem; color: var(--lime); font-family: var(--sans); font-weight: 800; }
@media (min-width: 1100px) {
  .code-rail { width: 340px; padding: 1.4rem 1.4rem 1.35rem; gap: .85rem !important; border-radius: 20px; }
  .rail-k { font-size: .72rem; }
  .rail-nav button, .rail-x { width: 30px; height: 30px; font-size: 1.1rem; }
  .rail-firm { font-size: 1.45rem; font-weight: 800; letter-spacing: -.01em; }
  .rail-d { font-size: 1rem; -webkit-line-clamp: 3; }
  .rail-code { border-radius: 12px; }
  .rail-code code { padding: .85rem 1rem; font-size: 1.3rem; }
  .rail-code .copy-btn { font-size: .95rem; padding: 0 1.1rem; }
  .rail-go { min-height: 54px; border-radius: 12px; font-size: 1.1rem; }
  .rail-m { font-size: .8rem; }
  .rail-prog { height: 3px; }
}
@media (min-width: 900px) and (max-width: 1779px) { .code-rail { right: 22px; bottom: 22px; } }
.rail-price { display: block; }
.rail-price span { display: block; margin-bottom: .15rem; }
.rail-price b, .rail-price .w-code { display: inline; margin: 0; }
.rail-price .w-code { margin-left: .45rem; }
@media (min-width: 1100px) { .rail-price .w-code { font-size: 1.2rem; } }

/* ================= 10.51: phone fixes + phone code card ================= */
/* the 10.23 board width is for tables only; on phones the board is one card per program */
@media (max-width: 760px) {
  .board { min-width: 0; }
  .board .fm { min-width: 0; }
  .board td, .board td.n, .board td.data-c { white-space: normal; text-align: left; }
  .board td.n .sort { justify-content: flex-start; }
  .hero-k { letter-spacing: .08em; line-height: 1.6; max-width: 82%; }
}
/* phones: the code card sits at the bottom, compact */
@media (max-width: 899px) {
  .code-rail:not([hidden]) { display: grid !important; }
  .code-rail.is-min { display: none !important; }
  .code-rail { left: 10px; right: 10px; top: auto; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); width: auto; max-width: 520px; margin-inline: auto; z-index: 45;
    grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "firm top" "d d" "code go"; align-items: center; gap: .45rem .5rem !important; padding: .7rem .7rem .75rem .85rem; border-radius: 16px;
    transform: translateY(calc(100% + 30px)); box-shadow: 0 18px 44px -14px rgb(0 0 0 / .95); }
  .code-rail.is-in { transform: none; }
  .code-rail .rail-top { grid-area: top; gap: .15rem; }
  .code-rail .rail-k { flex: none; font-size: .66rem !important; }
  .code-rail .rail-firm { grid-area: firm; font-size: .98rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .code-rail .rail-d { grid-area: d; margin-top: -.3rem; font-size: .8rem; -webkit-line-clamp: 1; }
  .code-rail .rail-price, .code-rail .rail-m { display: none; }
  .code-rail .rail-code { grid-area: code; min-width: 0; }
  .code-rail .rail-code code { padding: .5rem .65rem; font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .code-rail .rail-code .copy-btn { min-height: 44px; }
  .code-rail .rail-go { grid-area: go; min-height: 44px; padding: 0 .95rem; white-space: nowrap; }
  .code-rail .rail-nav button, .code-rail .rail-x { width: 34px; height: 34px; font-size: 1.1rem; }
  /* minimized: a lime pill in the corner */
  .rail-tab[aria-expanded="false"]:not([hidden]) { display: block !important; }
  .rail-tab { top: auto; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 45; padding: .65rem 1.05rem; border-radius: 999px; font-size: .9rem; transform: translateY(calc(100% + 30px)); }
  .rail-tab.is-in { transform: none; }
  .rail-tab span { writing-mode: horizontal-tb; }
  .menu-open .code-rail, .menu-open .rail-tab { display: none !important; }
}

/* ================= 10.52: mobile menu, a clean full-height sheet ================= */
.msheet { display: none; }
.menu-btn .mb-1, .menu-btn .mb-2, .menu-btn .mb-3 { transform-origin: 12px 12px; transition: transform .25s cubic-bezier(.2,.8,.2,1), opacity .15s ease; }
.menu-open .menu-btn { border-color: var(--lime); color: var(--lime); }
.menu-open .menu-btn .mb-1 { transform: translateY(5px) rotate(45deg); }
.menu-open .menu-btn .mb-2 { opacity: 0; }
.menu-open .menu-btn .mb-3 { transform: translateY(-5px) rotate(-45deg); }
html.menu-lock { overflow: hidden; }
@media (max-width: 1100px) {
  .menu-open .msheet { display: block; position: fixed; left: 0; right: 0; bottom: 0; top: 72px; z-index: 49; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; background: var(--bg); border-top: 1px solid var(--line); }
  .ms-in { max-width: 560px; margin-inline: auto; padding: 1rem clamp(1.1rem, 4vw, 1.5rem) calc(2rem + env(safe-area-inset-bottom, 0px)); }
  @media (prefers-reduced-motion: no-preference) { .menu-open .ms-in > * { animation: ms-in .32s cubic-bezier(.2,.8,.2,1) both; } .menu-open .ms-in > :nth-child(2) { animation-delay: .03s; } .menu-open .ms-in > :nth-child(n+3) { animation-delay: .06s; } }
  .ms-search { display: flex; align-items: center; gap: .65rem; width: 100%; min-height: 50px; padding: 0 1rem; border: 1px solid var(--line-2); border-radius: 14px; background: var(--bg-2); color: var(--mut); font: inherit; font-size: 1rem; text-align: left; cursor: pointer; }
  .ms-search:hover { border-color: var(--mut); }
  .ms-hero { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin-top: .75rem; }
  .ms-hero--one { grid-template-columns: 1fr; }
  .ms-big { position: relative; display: grid; gap: .15rem; align-content: end; min-height: 108px; padding: .9rem; border: 1px solid var(--line-2); border-radius: 16px; background: var(--bg-2); color: var(--ink); text-decoration: none; overflow: hidden; }
  .ms-big .ms-i { position: absolute; top: .85rem; left: .9rem; color: var(--lime); }
  .ms-big b { font-size: 1.02rem; font-weight: 800; line-height: 1.2; display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
  .ms-big span { font-size: .78rem; color: var(--mut); }
  .ms-big--lime { background: var(--lime); border-color: var(--lime); color: var(--on-lime); }
  .ms-big--lime .ms-i { color: var(--on-lime); }
  .ms-big--lime span { color: rgb(10 10 11 / .7); }
  .ms-big--lime::after { content: ""; position: absolute; top: -20%; right: -18%; width: 42%; height: 140%; background: rgb(10 10 11 / .08); transform: skewX(-18deg); pointer-events: none; }
  .ms-count { font-style: normal; font-family: var(--mono); font-size: .72rem; font-weight: 700; min-width: 1.5rem; padding: .1rem .4rem; border-radius: 999px; background: var(--lime); color: var(--on-lime); text-align: center; }
  .ms-h { margin: 1.5rem 0 .5rem .2rem; font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--mut); }
  .ms-group { border: 1px solid var(--line); border-radius: 16px; background: var(--bg-2); overflow: hidden; }
  .ms-row { display: flex; align-items: center; gap: .8rem; min-height: 54px; padding: .55rem 1rem; color: var(--ink); text-decoration: none; font-weight: 600; font-size: 1rem; }
  .ms-group > * + * { border-top: 1px solid var(--line); }
  .ms-row .ms-i { flex: none; color: var(--mut); }
  .ms-t { flex: 1; min-width: 0; display: grid; }
  .ms-t small { font-size: .78rem; font-weight: 500; color: var(--mut); }
  .ms-ch { flex: none; color: var(--mut); }
  .ms-row:hover, .ms-row:active { background: var(--bg-3); }
  .ms-row[aria-current="page"] { box-shadow: inset 3px 0 0 var(--lime); }
  .ms-row[aria-current="page"] .ms-i { color: var(--lime); }
  .ms-mkts { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; padding: .6rem 1rem .75rem 3.05rem; }
  .ms-mkts a { display: grid; place-items: center; min-height: 40px; border: 1px solid var(--line-2); border-radius: 999px; color: var(--ink-2); font-size: .88rem; font-weight: 600; text-decoration: none; }
  .ms-mkts a:hover, .ms-mkts a[aria-current="page"] { border-color: var(--lime); color: var(--lime); }
  .ms-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
  .ms-tile { display: flex; flex-direction: column; justify-content: space-between; gap: .9rem; min-height: 88px; padding: .85rem .9rem; border: 1px solid var(--line); border-radius: 16px; background: var(--bg-2); color: var(--ink); text-decoration: none; }
  .ms-tile .ms-i { color: var(--lime); }
  .ms-tile b { font-size: .93rem; font-weight: 700; line-height: 1.25; }
  .ms-tile:hover, .ms-tile[aria-current="page"] { border-color: var(--lime); }
  .ms-tile--all { flex-direction: row; align-items: center; min-height: 52px; grid-column: 1 / -1; }
  .ms-tiles > .ms-tile:nth-last-child(2):nth-child(odd) { grid-column: 1 / -1; }
  .ms-more { margin-top: 1.25rem; border-top: 1px solid var(--line); }
  .ms-more summary { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 0 .2rem; list-style: none; cursor: pointer; color: var(--ink-2); font-weight: 600; }
  .ms-more summary::-webkit-details-marker { display: none; }
  .ms-more[open] summary .ms-ch { transform: rotate(180deg); }
  .ms-links { display: flex; flex-wrap: wrap; gap: .45rem; padding: .1rem 0 .5rem; }
  .ms-links a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 .85rem; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-2); font-size: .85rem; text-decoration: none; }
  .ms-links a:hover { border-color: var(--line-2); color: var(--ink); }
  .ms-foot { margin: 1.25rem 0 0; font-family: var(--mono); font-size: .7rem; line-height: 1.6; color: var(--mut); text-align: center; }
  .msheet a:focus-visible, .msheet button:focus-visible, .msheet summary:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
}
@keyframes ms-in { from { opacity: 0; transform: translateY(8px); } }

/* ================= 10.53: new PFD mark + PROP FIRM DUEL wordmark ================= */
.brand { gap: .6rem; color: var(--ink); }
.brand-tile { width: 38px; height: 38px; }
.brand-word { display: block; flex: none; height: 19px; width: auto; aspect-ratio: 233.98 / 28.64; color: var(--ink); }
@container head scroll-state(stuck: top) { .brand-tile { width: 34px; height: 34px; } .brand-word { height: 17px; } }
@media (max-width: 400px) { .brand-tile { width: 34px; height: 34px; } .brand-word { height: 16px; } }
.site-foot .brand-word, footer .brand-word { height: 20px; }

/* 10.55: the PFD mark is always lime */
.brand .brand-tile { color: var(--lime) !important; }

/* ================= 10.57: social icons ================= */
.foot-brand { display: grid; gap: 1.1rem; align-content: start; }
@media (max-width: 1080px) { .foot-top--cols > .foot-brand { grid-column: 1 / -1; } }
.socials { display: flex; flex-wrap: wrap; gap: .5rem; }
.soc { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line-2); border-radius: 12px; color: var(--ink-2); background: var(--bg-2); transition: color .15s ease, border-color .15s ease, background-color .15s ease; }
.soc:hover { color: var(--on-lime); background: var(--lime); border-color: var(--lime); }
.soc:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
.msheet .socials { justify-content: center; margin-top: 1.25rem; }
@media (min-width: 1081px) { .foot-brand .socials { gap: .35rem; flex-wrap: nowrap; } .foot-brand .soc { width: 40px; height: 40px; border-radius: 11px; } }

/* ================= 10.62: "Run a prop firm?" call-out ================= */
.firm-cta-wrap { margin-block: clamp(2.5rem, 6vw, 4.5rem); }
.firm-cta { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.4fr) auto; align-items: center; gap: 1.5rem 3rem; padding: clamp(1.5rem, 4vw, 2.75rem); border: 1px solid var(--line-2); border-radius: 20px; background: var(--bg-2); }
.firm-cta::after { content: ""; position: absolute; top: -20%; right: -6%; width: 22%; height: 140%; background: linear-gradient(90deg, transparent 0 18%, color-mix(in srgb, var(--lime) 14%, transparent) 18% 70%, transparent 70% 78%, color-mix(in srgb, var(--ink) 18%, transparent) 78% 82%, transparent 82%); transform: skewX(-20deg); pointer-events: none; }
.firm-cta-copy, .firm-cta-btns { position: relative; z-index: 1; }
.firm-cta-k { color: var(--lime); margin: 0 0 .4rem; }
.firm-cta-h { margin: 0 0 .6rem; font-size: clamp(1.9rem, 4.2vw, 2.9rem); line-height: 1; }
.firm-cta-p { margin: 0; max-width: 58ch; color: var(--ink-2); font-size: 1.05rem; line-height: 1.55; }
.firm-cta-btns { display: flex; flex-direction: column; gap: .7rem; min-width: 250px; }
.firm-cta-btns .btn { justify-content: center; }
@media (max-width: 860px) { .firm-cta { grid-template-columns: 1fr; } .firm-cta-btns { min-width: 0; } .firm-cta::after { width: 40%; right: -22%; opacity: .7; } }

/* 10.63: lime version of the firm call-out (homepage) */
.firm-cta--lime { background: var(--lime); border-color: var(--lime); color: var(--on-lime); }
.firm-cta--lime .firm-cta-k, .firm-cta--lime .firm-cta-h { color: var(--on-lime); }
.firm-cta--lime .firm-cta-p { color: rgb(10 10 11 / .78); }
.firm-cta--lime::after { background: linear-gradient(90deg, transparent 0 18%, rgb(10 10 11 / .1) 18% 70%, transparent 70% 78%, rgb(10 10 11 / .28) 78% 82%, transparent 82%); }
.firm-cta--lime .btn--lime { background: #0A0A0B; color: var(--lime); border-color: #0A0A0B; }
.firm-cta--lime .btn--lime:hover { background: #1d1d20; color: var(--lime); }
.firm-cta--lime .btn--line { background: rgb(10 10 11 / .12); color: var(--on-lime); border-color: transparent; box-shadow: none; }
.firm-cta--lime .btn--line:hover { background: #0A0A0B; color: var(--lime); }
.firm-cta--lime a:focus-visible { outline: 2px solid #0A0A0B; outline-offset: 3px; }

/* ================= 10.64: brand everywhere ================= */
::selection { background: var(--lime); color: var(--on-lime); }
:root { accent-color: var(--lime); }
.err { position: relative; }
.err-mark { display: block; width: clamp(88px, 14vw, 140px); height: auto; margin-bottom: 1.5rem; }
.err-mark path { fill: var(--lime); }
.err-k { color: var(--lime); }
.err-h { font-size: clamp(3rem, 10vw, 6.5rem); }

/* ================= 10.65: one livery everywhere: lime band + gap + white pinstripe ================= */
.final-cta-in { background: linear-gradient(112deg, var(--bg-2) 0 58%, var(--lime) 58% 66%, var(--bg-2) 66% 68%, #F5F5F2 68% 68.6%, var(--bg-2) 68.6%); }
@media (max-width: 760px) {
  .final-cta-in { border-inline-start: 1px solid var(--line-2); background: linear-gradient(112deg, var(--bg-2) 0 86%, var(--lime) 86% 93%, var(--bg-2) 93% 95%, #F5F5F2 95% 95.8%, var(--bg-2) 95.8%); }
  .final-cta-in .display, .final-cta-in .k, .final-cta-in p { max-width: 78%; }
}
.ab-card::after { width: 90px; background: linear-gradient(90deg, var(--lime) 0 72%, transparent 72% 88%, #F5F5F2 88% 93%, transparent 93%); }

/* 10.65: lime is the only accent. The old racing-red touches become lime or white. */
.hero::before { background: linear-gradient(112deg, transparent 0 40%, var(--lime) 40% 56%, transparent 56% 60.5%, #F5F5F2 60.5% 62%, transparent 62%) !important; }
.site-foot { box-shadow: none; }
.block-head::after { background: linear-gradient(90deg, var(--lime) 0 52px, transparent 52px 56px, #F5F5F2 56px 60px, transparent 60px) !important; }
.brand-tile { box-shadow: none !important; }
.tower div:last-child dd { color: var(--lime); }
.tick-live::before { background: var(--lime); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lime) 25%, transparent); }
.tick-news span { background: var(--lime); color: var(--on-lime); }
.mkt--soon .mkt-n { border-color: var(--line-2); color: var(--mut); }
.tv-thumb-ep { color: var(--lime); }
.offer-x { color: var(--mut); }
.disc--aff::before { background: var(--lime); }

/* ================= 10.66: signature footer: lime PFD + outlined name, livery beside it (never over the letters) ================= */
.foot-mark::before, .foot-mark::after { content: none !important; display: none !important; }
.foot-mark { padding-block: clamp(1.5rem, 4vw, 3rem) clamp(1rem, 3vw, 2rem); line-height: 1; }
.fm-row { display: flex; align-items: center; justify-content: center; gap: clamp(.6rem, 2vw, 1.8rem); }
.fm-icon { flex: none; width: clamp(48px, 9vw, 150px); height: auto; color: var(--lime); }
.foot-mark .fm-name { display: block; flex: none; translate: none; font-size: clamp(2.2rem, 8.4vw, 9rem); line-height: .9; text-align: left; }
.foot-mark .fm-words { display: flex; flex-wrap: nowrap; flex: none; gap: .22em; -webkit-text-stroke: 0; translate: none; font-size: clamp(2.2rem, 8.4vw, 9rem); } .foot-mark .fm-words .fm-name { font-size: 1em; translate: none; }
.foot-mark .fm-duel { -webkit-text-stroke-color: color-mix(in srgb, var(--lime) 70%, transparent); }
.fm-livery { flex: none; align-self: stretch; width: clamp(34px, 6vw, 96px); position: relative; margin-left: clamp(.2rem, 1vw, 1rem); }
.fm-livery::before { content: ""; position: absolute; inset: -10% 38% -10% 0; background: var(--lime); transform: skewX(-24deg); }
.fm-livery::after { content: ""; position: absolute; top: -10%; bottom: -10%; right: 12%; width: 12%; background: #F5F5F2; opacity: .6; transform: skewX(-24deg); }
@media (max-width: 620px) { .fm-livery { display: none; } }

/* ================= 10.67: ad slots. Off by default (Theme settings > Show ads). ================= */
.spot { display: block; margin-block: clamp(1.5rem, 4vw, 2.5rem); }
.spot:not(.is-ready) { min-height: 90px; }
.spot--billboard:not(.is-ready) { min-height: 250px; }
.spot--rectangle:not(.is-ready) { min-height: 250px; }
@media (max-width: 760px) { .spot--billboard:not(.is-ready) { min-height: 120px; } }
.sp-lab { display: block; margin: 0 auto .4rem; font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--mut); }
.spot--leaderboard .sp-lab, .spot--leaderboard > a { max-width: 728px; }
.spot--billboard .sp-lab, .spot--billboard > a { max-width: 970px; }
.spot--rectangle .sp-lab, .spot--rectangle > a { max-width: 300px; }
.spot > a { display: flex; margin-inline: auto; text-decoration: none; color: var(--ink); }
.sp-img img { display: block; width: 100%; height: auto; border-radius: 10px; }
/* native sponsor card */
.sp-native { align-items: center; gap: 1rem; padding: 1rem 1.1rem; border: 1px solid var(--line-2); border-radius: 16px; background: var(--bg-2); }
.sp-native:hover { border-color: var(--lime); }
.sp-logo { flex: none; width: 48px; height: 48px; border-radius: 12px; object-fit: cover; }
.sp-logo--txt { display: grid; place-items: center; background: var(--bg-3); font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; color: var(--ink); }
.sp-copy { flex: 1; min-width: 0; display: grid; gap: .15rem; }
.sp-h { font-weight: 800; font-size: 1.05rem; }
.sp-p { font-size: .9rem; color: var(--ink-2); }
.sp-code { flex: none; padding: .35rem .6rem; border: 1.5px dashed color-mix(in srgb, var(--lime) 70%, transparent); border-radius: 8px; font-family: var(--mono); font-weight: 700; font-size: .85rem; letter-spacing: .05em; }
.sp-cta, .sp-house-cta { flex: none; display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; padding: 0 1rem; border-radius: 10px; background: var(--lime); color: var(--on-lime); font-weight: 800; white-space: nowrap; }
.spot--rectangle .sp-native { flex-direction: column; align-items: flex-start; aspect-ratio: 6 / 5; justify-content: space-between; }
@media (max-width: 620px) { .sp-native { flex-wrap: wrap; } .sp-native .sp-cta { width: 100%; justify-content: center; } }
/* Advertise-here house spot: the "Run a prop firm?" look, lime livery on carbon */
.sp-house { position: relative; overflow: hidden; align-items: center; justify-content: space-between; gap: 1rem 2rem; padding: 1.25rem 1.5rem; border: 1.5px dashed color-mix(in srgb, var(--lime) 45%, var(--line-2)); border-radius: 16px;
  background: linear-gradient(112deg, var(--bg-2) 0 74%, color-mix(in srgb, var(--lime) 16%, var(--bg-2)) 74% 84%, var(--bg-2) 84% 86%, color-mix(in srgb, #F5F5F2 22%, var(--bg-2)) 86% 86.8%, var(--bg-2) 86.8%); }
.sp-house:hover { border-color: var(--lime); }
.sp-house:hover .sp-house-cta { filter: brightness(1.08); }
.sp-house-copy { display: grid; gap: .2rem; min-width: 0; }
.sp-house-k { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--lime); }
.sp-house-h { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; line-height: .95; font-size: clamp(1.5rem, 3.2vw, 2.2rem); color: var(--ink); }
.sp-house-p { max-width: 46ch; color: var(--ink-2); font-size: .95rem; }
.spot--billboard .sp-house { min-height: 250px; padding: clamp(1.5rem, 4vw, 2.75rem); }
.spot--billboard .sp-house-h { font-size: clamp(2rem, 5vw, 3.6rem); }
.spot--leaderboard .sp-house { min-height: 90px; padding-block: .9rem; }
.spot--leaderboard .sp-house-h { font-size: clamp(1.25rem, 2.4vw, 1.7rem); }
.spot--rectangle .sp-house { flex-direction: column; align-items: flex-start; justify-content: space-between; aspect-ratio: 6 / 5; background: linear-gradient(112deg, var(--bg-2) 0 62%, color-mix(in srgb, var(--lime) 16%, var(--bg-2)) 62% 80%, var(--bg-2) 80% 83%, color-mix(in srgb, #F5F5F2 22%, var(--bg-2)) 83% 84.5%, var(--bg-2) 84.5%); }
.spot--native .sp-house { min-height: 90px; }
@media (max-width: 760px) {
  .sp-house { flex-direction: column; align-items: flex-start; }
  .sp-house-cta { width: 100%; justify-content: center; }
  .spot--billboard .sp-house { min-height: 0; }
}
.msheet .spot { margin-block: 1.25rem 0; }
.msheet .sp-house-p { display: none; }
.spot a:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
.spot .btn.sp-cta, .spot .btn.sp-house-cta { border-radius: 0; background: var(--lime); color: var(--on-lime); }
.spot--billboard .sp-native { min-height: 180px; padding: clamp(1.25rem, 3vw, 2rem); gap: 1.5rem; }
.spot--billboard .sp-native .sp-h { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: clamp(1.6rem, 3.6vw, 2.6rem); line-height: .95; }
.spot--billboard .sp-native .sp-logo { width: 72px; height: 72px; }

/* ================= 10.69: media kit page ================= */
.mk-top h1 em { font-style: inherit; color: var(--lime); }
.mk-sec { scroll-margin-top: 90px; }
.mk-about { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 2rem; align-items: start; }
.mk-tag { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: clamp(1.4rem, 2.6vw, 2rem); line-height: 1; color: var(--lime); margin: 0 0 1rem; }
.mk-about p { max-width: 62ch; color: var(--ink-2); } .mk-about .mut { color: var(--mut); font-size: .9rem; }
.mk-facts { margin: 0; display: grid; gap: .1rem; border: 1px solid var(--line-2); border-radius: 16px; background: var(--bg-2); padding: .5rem 1.1rem; }
.mk-facts div { display: grid; grid-template-columns: 7.5rem 1fr; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid var(--line); }
.mk-facts div:last-child { border-bottom: 0; }
.mk-facts dt { font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
.mk-facts dd { margin: 0; color: var(--ink); overflow-wrap: anywhere; }
.mk-grid { display: grid; gap: 1rem; }
.mk-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mk-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mk-card { position: relative; overflow: hidden; display: grid; gap: .5rem; align-content: start; padding: 1.5rem; border: 1px solid var(--line-2); border-radius: 18px; background: var(--bg-2); color: var(--ink); text-decoration: none; }
.mk-card--pdf { background: linear-gradient(112deg, var(--bg-2) 0 76%, color-mix(in srgb, var(--lime) 18%, var(--bg-2)) 76% 86%, var(--bg-2) 86% 88%, color-mix(in srgb, #F5F5F2 22%, var(--bg-2)) 88% 88.8%, var(--bg-2) 88.8%); }
.mk-card--pdf:hover { border-color: var(--lime); }
.mk-k { font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--lime); }
.mk-h { font-weight: 800; font-size: 1.3rem; line-height: 1.2; max-width: 26ch; }
.mk-p { color: var(--ink-2); max-width: 52ch; }
.mk-dl { justify-self: start; margin-top: .5rem; display: inline-flex; align-items: center; min-height: 44px; padding: 0 1rem; border-radius: 10px; background: var(--lime); color: var(--on-lime); font-weight: 800; text-decoration: none; }
.mk-logo { margin: 0; display: grid; grid-template-rows: 170px auto; border: 1px solid var(--line-2); border-radius: 18px; overflow: hidden; background: var(--bg-2); }
.mk-logo img { width: 100%; height: 100%; object-fit: contain; padding: 1.75rem; box-sizing: border-box; }
.mk-logo--dark img { background: #0A0A0B; }
.mk-logo--light img { background: #FFFFFF; }
.mk-logo--lime img { background: #9EF03A; padding: .5rem; object-fit: contain; }
.mk-logo figcaption { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; padding: .8rem 1rem; border-top: 1px solid var(--line); }
.mk-logo figcaption b { font-size: .95rem; }
.mk-logo figcaption span { display: flex; gap: .4rem; }
.mk-logo figcaption a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 .7rem; border: 1px solid var(--line-2); border-radius: 8px; font-family: var(--mono); font-size: 12px; color: var(--ink); text-decoration: none; }
.mk-logo figcaption a:hover { border-color: var(--lime); color: var(--lime); }
.mk-sw { display: flex; justify-content: space-between; align-items: flex-end; min-height: 130px; padding: 1.1rem; border: 1px solid var(--line-2); border-radius: 18px; background: var(--sw); color: var(--ink); }
.mk-sw b { font-weight: 800; font-size: 1.1rem; } .mk-sw span { font-family: var(--mono); font-size: .9rem; }
.mk-type { margin-top: 1rem; color: var(--ink-2); }
.mk-rules { margin: 0; padding-left: 1.2rem; display: grid; gap: .6rem; max-width: 75ch; color: var(--ink-2); }
.mk-rules li::marker { color: var(--lime); } .mk-rules b { color: var(--ink); }
.mk-req { display: grid; grid-template-columns: minmax(0, 1.4fr) auto; gap: 1.5rem 3rem; align-items: center; padding: clamp(1.5rem, 4vw, 2.75rem); border-radius: 20px; background: var(--lime); color: var(--on-lime); }
.mk-req .k, .mk-req h2 { color: var(--on-lime); margin: 0 0 .5rem; } .mk-req p { margin: 0; max-width: 58ch; color: rgb(10 10 11 / .8); }
.mk-req .btn--lime { background: #0A0A0B; color: var(--lime); }
.mk-sec a:focus-visible, .mk-top a:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
.mk-req a:focus-visible { outline-color: #0A0A0B; }
@media (max-width: 900px) { .mk-about, .mk-grid--2, .mk-req { grid-template-columns: 1fr; } .mk-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .mk-grid--3 { grid-template-columns: 1fr; } .mk-facts div { grid-template-columns: 1fr; gap: .1rem; } }

/* ================= 10.70: private rate card ================= */
.rc-top h1 em { font-style: inherit; color: var(--lime); }
.rc-sec { margin-block: clamp(2rem, 5vw, 3.5rem); }
.rc-block-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 2rem; margin-bottom: 1rem; }
.rc-block-head h2, .rc-two h2 { margin: 0; font-size: clamp(1.8rem, 3.6vw, 2.6rem); }
.rc-note { margin: 0; color: var(--mut); max-width: 60ch; font-size: .95rem; }
.rc-table-wrap { overflow-x: auto; border: 1px solid var(--line-2); border-radius: 16px; background: var(--bg-2); }
.rc-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.rc-table th { text-align: left; padding: .8rem 1rem; font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); border-bottom: 1px solid var(--line-2); white-space: nowrap; }
.rc-table td { padding: .85rem 1rem; border-bottom: 1px solid var(--line); vertical-align: top; color: var(--ink-2); }
.rc-table tr:last-child td { border-bottom: 0; }
.rc-table td b { display: block; color: var(--ink); }
.rc-why { display: block; margin-top: .25rem; font-size: .85rem; color: var(--mut); max-width: 44ch; }
.rc-mono { font-family: var(--mono); font-size: .85rem; white-space: nowrap; }
.rc-num { font-family: var(--mono); font-weight: 700; color: var(--ink) !important; white-space: nowrap; text-align: right; }
.rc-table th:nth-child(n+4) { text-align: right; }
.rc-table td:nth-child(4) { color: var(--lime) !important; }
.rc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.rc-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rc-card { padding: 1.4rem; border: 1px solid var(--line-2); border-radius: 18px; background: var(--bg-2); }
.rc-card h3 { margin: 0 0 .4rem; font-size: 1.2rem; } .rc-card p { margin: 0 0 .5rem; color: var(--ink-2); }
.rc-k { font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--lime); margin: 0 0 .3rem !important; }
.rc-price { font-family: var(--display); font-style: italic; font-weight: 900; font-size: 2.6rem; line-height: 1; color: var(--lime) !important; margin-top: .8rem !important; }
.rc-price small { font-family: var(--sans); font-style: normal; font-weight: 600; font-size: .9rem; color: var(--mut); margin-left: .3rem; }
.rc-was { font-size: .9rem; color: var(--mut) !important; }
.rc-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 3rem; }
.rc-two p { color: var(--ink-2); max-width: 60ch; }
.rc-list { margin: .8rem 0 0; padding-left: 1.2rem; display: grid; gap: .5rem; color: var(--ink-2); } .rc-list li::marker { color: var(--lime); } .rc-list b { color: var(--ink); }
.rc-src { margin-top: 1rem; font-size: .8rem; color: var(--mut); }
.rc-cta { display: grid; grid-template-columns: minmax(0, 1.4fr) auto; gap: 1.5rem 3rem; align-items: center; padding: clamp(1.5rem, 4vw, 2.75rem); border-radius: 20px; background: var(--lime); color: var(--on-lime); }
.rc-cta .rc-k, .rc-cta h2 { color: var(--on-lime) !important; margin: 0 0 .5rem; font-size: clamp(1.8rem, 3.6vw, 2.6rem); } .rc-cta .rc-k { font-size: 12px; } .rc-cta p { margin: 0; color: rgb(10 10 11 / .8); }
.rc-cta .btn--lime { background: #0A0A0B; color: var(--lime); }
.rc-cta a:focus-visible { outline: 2px solid #0A0A0B; outline-offset: 3px; }
@media (max-width: 900px) { .rc-grid, .rc-grid--3, .rc-two, .rc-cta { grid-template-columns: 1fr; } }
.rc-table-wrap:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }

/* 10.71: media kit logo cards: fixed-height frame per preview (Safari let tall SVGs spill over the caption), readable captions on every card */
.mk-logo { grid-template-rows: auto auto; }
.mk-logo-media { height: 170px; overflow: hidden; display: flex; align-items: center; justify-content: center; padding: 1.75rem; box-sizing: border-box; }
.mk-logo-media img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; padding: 0 !important; background: none !important; object-fit: contain; }
.mk-logo--dark .mk-logo-media { background: #0A0A0B; }
.mk-logo--light .mk-logo-media { background: #FFFFFF; }
.mk-logo--lime .mk-logo-media { background: #9EF03A; padding: .75rem; }
.mk-logo figcaption { position: relative; z-index: 1; background: var(--bg-2); color: var(--ink); }
.mk-logo figcaption b { color: var(--ink); }

/* printing or saving any page as PDF: keep backgrounds, drop the floating code card and overlays */
@media print {
  html, body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .code-rail, .rail-tab, .code-dock, .find, .msheet, .menu-btn { display: none !important; }
  .mk-logo, .mk-card, .mk-sw, .mk-req, .rc-card, .rc-table-wrap, .firm-cta, .spot { break-inside: avoid; }
}
@media print {
  .site-head { position: relative !important; top: auto !important; }
  .codebar, .spot.is-house, .foot-join, .skip { display: none !important; }

}

/* 10.72: share-based rate card */
.rc-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rc-card--hot { border-color: var(--lime); background: linear-gradient(112deg, var(--bg-2) 0 72%, color-mix(in srgb, var(--lime) 14%, var(--bg-2)) 72% 84%, var(--bg-2) 84%); }
.rc-dim { color: var(--ink-2) !important; font-weight: 600 !important; }
.rc-table td:nth-child(4) { color: var(--lime) !important; }
.rc-price--sm { font-size: 2.6rem; }
.rc-price small { display: inline-block; }
@media (max-width: 1100px) { .rc-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .rc-grid--4 { grid-template-columns: 1fr; } }

/* ═══ 10.75: firm code pages ═══ */
.code-card { max-width: 760px; padding: clamp(1.25rem, 1rem + 1.5vw, 2rem); border: 1px solid var(--line-2); border-radius: var(--radius-l); background: var(--bg-2); box-shadow: var(--shadow); display: grid; gap: .75rem; }
.code-card .k { margin: 0; }
.code-val { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin: 0; }
.code-val code { font-family: var(--mono); font-size: clamp(1.8rem, 1.4rem + 2vw, 2.8rem); font-weight: 700; color: var(--lime); letter-spacing: .04em; padding: .2rem .8rem; border: 2px dashed var(--lime); border-radius: var(--radius); }
.code-d { margin: 0; font-size: var(--step-1); }
.code-card .hero-cta { margin-block-start: .5rem; }
.code-card.is-ended .code-val code { text-decoration: line-through; opacity: .5; border-color: var(--line-2); color: var(--ink-2); }
.code-ended { color: var(--warn); font-weight: 600; }
.code-body .table-wrap { margin-block: 1rem 1.5rem; }
.code-body table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.code-body th, .code-body td { padding: .7rem 1rem; text-align: left; border-block-end: 1px solid var(--line); }
.code-body th { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--mut); font-weight: 700; }
.code-body td:last-child { color: var(--lime); font-weight: 700; }

/* ═══ 10.78: modern pass. Softer, roomier cards; key–value rows instead of cramped mono columns.
   Buttons keep their angled livery cut; containers get rounded corners and quiet borders. ═══ */
:root { --radius-s: 8px; --radius: 12px; --radius-l: 16px; }
.pay-card, .prog, .prof-hero, .firm-card, .tool, .list-group, .steps li, .faq details, .note, .find, .tv-card, .tv-soon,
.offer-card, .guide, .way, .code-card, .cluster, .table-wrap, .sub, .alerts-row, .prog-sum, .elig, .co-card, .src-list {
  border-radius: var(--radius-l); clip-path: none;
}
.pill, .mkt, .chip, .tag, .chip--hi, .seg, .seg button, .size-sel, .search input, .find-btn, .menu-btn, .prog-chip { border-radius: 999px; }
.pill[aria-pressed="true"], .pill.is-on, .seg button[aria-pressed="true"] { clip-path: none; border-radius: 999px; }
.mono { border-radius: 10px; clip-path: none; }

/* on-page jump links: quiet rounded chips */
.prog-jump { gap: .5rem; }
.prog-jump .pill { border: 1px solid var(--line-2); background: color-mix(in srgb, var(--bg-2) 80%, transparent); padding: .45rem 1rem; font-size: .9rem; }
.prog-jump .pill:hover { border-color: var(--lime); color: var(--lime); }

/* payout cards: two per row on desktop, each fact on its own row */
.pay-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); gap: 1.25rem; }
.pay-card { padding: 1.5rem 1.6rem 1.4rem; background: linear-gradient(180deg, color-mix(in srgb, var(--bg-2) 92%, var(--lime)) 0%, var(--bg-2) 60%); border: 1px solid var(--line); margin: 0; box-shadow: 0 1px 0 rgb(255 255 255 / .03) inset, 0 18px 40px -28px rgb(0 0 0 / .9); }
.pay-card:hover { border-color: var(--line-2); transform: none; }
.pay-card h3 { font-size: 1.35rem; line-height: 1.2; margin-block-end: 1rem; }
.pay-card .facts, .pay-card .facts--sm { display: block; border: 0; margin: 0 0 1rem; }
.pay-card .facts div { display: grid; grid-template-columns: minmax(8.5rem, 38%) 1fr; gap: 1rem; align-items: baseline; padding: .7rem 0; border-block-end: 1px solid color-mix(in srgb, var(--line) 70%, transparent); background: none; }
.pay-card .facts div:last-child { border-block-end: 0; }
.pay-card .facts dt { margin: 0; font-family: var(--sans); font-size: .78rem; letter-spacing: .05em; text-transform: uppercase; color: var(--mut); }
.pay-card .facts dd { margin: 0; font-family: var(--sans); font-size: 1rem; font-weight: 600; line-height: 1.45; color: var(--ink); overflow-wrap: anywhere; }
.pay-card .facts div:first-child dd { font-family: var(--display); font-size: 1.6rem; font-weight: 800; color: var(--lime); line-height: 1; }
.pay-card .rule-list { margin: .5rem 0 0; padding: 1rem 1.25rem 1rem 2.4rem; gap: .6rem; border-radius: var(--radius); background: color-mix(in srgb, var(--bg) 70%, transparent); border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); font-size: .95rem; line-height: 1.55; color: var(--ink-2); }
.pay-card .rule-list li { padding-inline-start: .25rem; }
.pay-card .facts div { grid-template-columns: 10.5rem 1fr; }
.pay-card > .small { color: var(--ink-2); }

/* the same key–value treatment for other fact lists on firm pages */
.prof-block .facts dd { overflow-wrap: anywhere; }
@media (max-width: 560px) { .pay-card .facts div { grid-template-columns: 1fr; gap: .2rem; } .pay-card { padding: 1.2rem; } }
/* 10.79: jump links land below the sticky header and chip bar, not under them */
.prof-block, [id="cost"], [id="programs"], [id="rules"], [id="payouts"], [id="eligibility"], [id="company"], [id="sources"], .prog { scroll-margin-top: 150px; }
.prog-jump { background: color-mix(in srgb, var(--bg) 94%, transparent); }
/* 10.82: All-in Cost balance. Left column holds the inputs, the note and any ad, and stays in view; the result card fills the right. */
.tool-grid--cost { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); align-items: start; }
.tool-grid--cost .tool-side { display: grid; gap: 1rem; position: sticky; top: 96px; }
.tool-grid--cost .tool-out { min-height: 0; }
.tool-aside { display: grid; gap: 1rem; }
.tool-aside .note { margin: 0; font-size: .85rem; }
.tool-aside .sp { margin: 0; max-width: none; }
[data-truecost] .next-step { margin-block-start: 1.25rem; }
[data-truecost] .next-grid { grid-template-columns: 1fr; }
[data-truecost] .next-card { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "firm code go" "prog code go" "price code go"; align-items: center; column-gap: 1rem; row-gap: .15rem; }
[data-truecost] .next-card .next-firm { grid-area: firm; } [data-truecost] .next-card .next-prog { grid-area: prog; } [data-truecost] .next-card .next-price { grid-area: price; margin: 0; }
[data-truecost] .next-card .rail-code, [data-truecost] .next-card .next-nocode { grid-area: code; margin: 0; min-width: 170px; }
[data-truecost] .next-card .rail-go { grid-area: go; margin: 0; white-space: nowrap; padding-inline: 1.4rem; }
@media (max-width: 860px) { .tool-grid--cost .tool-side { position: static; } [data-truecost] .next-card { grid-template-columns: 1fr; grid-template-areas: "firm" "prog" "price" "code" "go"; row-gap: .6rem; } }
.tool-aside .tool-disc { margin: 0; }
[data-truecost] .next-grid:has(> :only-child) { max-width: none; }
@media (max-width: 860px) { .tool-grid--cost { grid-template-columns: 1fr; } }
@media (max-width: 860px) { .tool-grid--cost .tool-side { display: contents; } .tool-grid--cost .tool-aside { order: 3; } }

/* ═══ 10.84: branded monograms and awards.
   Every firm without an official logo gets the same Prop Firm Duel tile: black carbon, white italic
   initials, one white pinstripe in the corner. No per-firm colors, and never lime (lime is PFD's own mark).
   Firms are rounded squares; trading tools ("kind": "tool") are circles. ═══ */
.mono:not(.mono--logo):not(.mono--page) {
  position: relative; overflow: hidden; clip-path: none;
  background-color: #000;
  background-image: repeating-conic-gradient(#161616 0 25%, #000 0 50%);
  background-size: 6px 6px;
  color: #fff; box-shadow: inset 0 0 0 1px #2E2E2E;
  font-family: var(--display); font-style: italic; font-weight: 800; letter-spacing: .01em;
}
.mono:not(.mono--logo):not(.mono--page)::after {
  content: ""; position: absolute; inset-inline-end: -2px; inset-block-end: -2px; width: 34%; height: 34%;
  background: linear-gradient(135deg, transparent calc(50% - .75px), rgb(255 255 255 / .55) calc(50% - .75px) calc(50% + .75px), transparent calc(50% + .75px));
  pointer-events: none;
}
.mono--tool { border-radius: 50%; }
.prof-hero { --ph: 0; }
.prof-hero, .prof-hero::before { background-image: none; }

/* awards: medals on a firm's page, chips on its card */
.ph-awards { display: flex; flex-wrap: wrap; gap: .75rem; margin-block-start: 1rem; }
.ph-awards .award { display: block; width: 84px; height: 84px; border-radius: 50%; }
.ph-awards .award img { width: 100%; height: 100%; display: block; }
.ph-awards .award:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
.award-chips { display: inline-flex; flex-wrap: wrap; gap: .3rem; margin-block: .2rem; }
.award-chip { display: block; height: 22px; width: auto; }

/* 10.93: the /awards/ page, winner first */
.aw-group + .aw-group { margin-block-start: 3rem; }
.aw-group > .display { font-size: clamp(1.9rem, 1.5rem + 1.6vw, 2.8rem); margin-block-end: .3rem; }
.aw-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); margin-block-start: 1.25rem; align-items: start; }
.aw-card { display: flex; flex-direction: column; gap: 1.1rem; padding: 1.4rem; background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--radius-l); scroll-margin-top: 6rem; }
.aw-card:target { border-color: var(--lime); }
.aw-head { display: flex; align-items: center; gap: 1rem; }
.aw-medal { width: 88px; height: 88px; flex-shrink: 0; }
.aw-name { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.55rem; line-height: .95; margin: 0 0 .35rem; }
.aw-short { color: var(--ink-2); font-size: .95rem; line-height: 1.35; margin: 0; }
.aw-win { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .85rem; padding: .9rem 1rem; border-radius: var(--radius); background: var(--bg); border: 1px solid var(--line-2); }
.aw-win-id { min-width: 0; }
.aw-win-name { display: block; font-family: var(--display); font-weight: 800; font-size: 1.35rem; line-height: 1.05; color: var(--ink); text-decoration: none; }
a.aw-win-name:hover { color: var(--lime); }
.aw-win-sub { display: grid; gap: .1rem; margin-block-start: .25rem; color: var(--mut); font-size: .82rem; line-height: 1.3; }
.aw-win-sub span { overflow-wrap: anywhere; }
.aw-stat { text-align: end; }
.aw-stat b { display: block; font-family: var(--display); font-style: italic; font-weight: 900; font-size: 1.9rem; line-height: 1; color: var(--lime); }
.aw-stat span { display: block; color: var(--mut); font-size: .75rem; margin-block-start: .2rem; white-space: nowrap; }
.aw-none { color: var(--mut); margin: 0; }
.aw-ru { display: flex; align-items: baseline; gap: .6rem; margin: 0; font-size: .9rem; color: var(--ink-2); }
.aw-ru > span { color: var(--mut); }
.aw-ru a { color: var(--ink); font-weight: 700; text-decoration: none; }
.aw-ru a:hover { color: var(--lime); }
.aw-ru b { margin-inline-start: auto; font-weight: 700; color: var(--ink-2); }
.aw-how { border-block-start: 1px solid var(--line); padding-block-start: .8rem; }
.aw-how summary { cursor: pointer; color: var(--ink-2); font-size: .9rem; font-weight: 600; }
.aw-how summary:hover { color: var(--lime); }
.aw-how p { color: var(--ink-2); font-size: .9rem; line-height: 1.5; margin: .6rem 0 0; }
.aw-how .aw-meta { color: var(--mut); font-size: .8rem; }
@media (max-width: 420px) { .aw-win { grid-template-columns: auto 1fr; } .aw-stat { grid-column: 1 / -1; text-align: start; display: flex; align-items: baseline; gap: .5rem; } .aw-stat span { margin: 0; } }
.aw-later { margin-block-start: 1.25rem; }
.aw-later-h { color: var(--mut); font-size: .85rem; font-weight: 600; margin: 0 0 .6rem; }
.aw-later ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.aw-later li { display: flex; align-items: center; gap: .7rem; padding: .6rem .75rem; border: 1px dashed var(--line-2); border-radius: var(--radius); scroll-margin-top: 6rem; }
.aw-later li:target { border-color: var(--lime); border-style: solid; }
.aw-later img { width: 44px; height: 44px; flex-shrink: 0; opacity: .75; }
.aw-later b { display: block; font-size: .95rem; color: var(--ink); }
.aw-later small { display: block; color: var(--mut); font-size: .8rem; line-height: 1.3; }
/* 10.94: trading tools we cover */
.aw-tools { margin-block-start: 1.75rem; }
.aw-tools-h { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.35rem; margin: 0 0 .8rem; }
.aw-tools ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); }
.aw-tools li { display: flex; gap: .85rem; align-items: flex-start; padding: 1rem; background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--radius); scroll-margin-top: 6rem; }
.aw-tools li:target { border-color: var(--lime); }
.aw-tool-n { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .6rem; margin: 0; }
.aw-tool-n b { font-family: var(--display); font-weight: 800; font-size: 1.2rem; color: var(--ink); }
.aw-tool-n span { color: var(--mut); font-size: .8rem; }
.aw-tool-s { color: var(--ink-2); font-size: .88rem; line-height: 1.45; margin: .3rem 0 .45rem; }
.aw-tool-go { font-size: .85rem; font-weight: 600; color: var(--ink); text-decoration: none; }
.aw-tool-go:hover { color: var(--lime); }
/* 10.95: /trading-tools/ */
.td-cat { scroll-margin-top: 6rem; }
.td-cat + .td-cat { margin-block-start: 2.25rem; }
.td-cat > .display { font-size: clamp(1.7rem, 1.4rem + 1.2vw, 2.4rem); margin-block-end: .9rem; }
.tool-aw { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0 0 .5rem; }
.tool-aw img { display: block; height: 22px; width: auto; }
.aw-tools-link { margin: 1.25rem 0 0; }
.aw-tools-link a { font-weight: 700; color: var(--ink); text-decoration: none; border-block-end: 1px solid var(--lime); }
.aw-tools-link a:hover { color: var(--lime); }

/* 11.2.1: footer tagline under the logo, same line as the homepage hero */
.foot-tag { margin: 0; font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.15rem; line-height: 1.05; letter-spacing: .01em; color: var(--ink); }
.foot-tag em { display: block; font-style: inherit; color: var(--lime); }

/* 11.3: hero proof bar (coverage numbers from the data) */
.proof-bar { grid-column: 1 / -1; margin-block-start: clamp(1.5rem, 3vw, 2.5rem); }
.proof-bar .tower { margin: 0; }
.proof-note { margin: .75rem 0 0; font-size: var(--step--1); color: var(--mut); }
@media (max-width: 760px) { .proof-bar .tower { grid-template-columns: repeat(2, minmax(0, 1fr)); } .proof-bar .tower div:nth-child(2) { border-inline-end: 0; } .proof-bar .tower div:nth-child(-n+2) { border-block-end: 1px solid var(--line); } }

/* 11.4: sitemap page */
.sm-find { position: relative; max-width: 560px; margin-block-start: 1.6rem; }
.sm-find svg { position: absolute; left: 1rem; top: 1.05rem; color: var(--mut); pointer-events: none; }
.sm-find input { width: 100%; min-height: 52px; padding: 0 1rem 0 2.8rem; border-radius: var(--radius); border: 1px solid var(--line-2); background: var(--bg-2); color: var(--ink); font-size: 1rem; }
.sm-find input:focus { outline: 2px solid var(--lime); outline-offset: 2px; border-color: transparent; }
.sm-none { margin-block-start: .75rem; color: var(--mut); font-size: var(--step--1); }
.sm { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); padding-block: clamp(2rem, 4vw, 3rem) var(--section); }
.sm-sec { padding: clamp(1.2rem, 2.2vw, 1.6rem); border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); min-width: 0; }
.sm-sec--wide { grid-column: 1 / -1; }
.sm-h { display: flex; align-items: baseline; gap: .6rem; margin: 0 0 1rem; padding-block-end: .7rem; border-block-end: 2px solid var(--lime); font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: var(--step-2); line-height: 1; }
.sm-h--sub { margin-block-start: 1.6rem; font-size: var(--step-1); border-block-end-width: 1px; border-color: var(--line-2); }
.sm-n { font-family: var(--mono); font-style: normal; font-weight: 600; font-size: .78rem; color: var(--on-lime); background: var(--lime); padding: .2rem .5rem; border-radius: 999px; }
.sm-list, .sm-letter ul { list-style: none; margin: 0; padding: 0; }
.sm-list li, .sm-letter li { display: flex; flex-direction: column; padding: .5rem 0; border-block-end: 1px solid var(--line); }
.sm-list li:last-child, .sm-letter li:last-child { border-block-end: 0; }
.sm-list a, .sm-letter a { color: var(--ink); font-weight: 600; text-decoration: none; }
.sm-list a:hover, .sm-letter a:hover { color: var(--lime); }
.sm-list small, .sm-letter small { color: var(--mut); font-size: .82rem; }
.sm-az { columns: 4 220px; column-gap: clamp(1.25rem, 2.5vw, 2.5rem); }
.sm-letter { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); align-items: start; break-inside: avoid; margin-block-end: .6rem; }
.sm-l { margin: .35rem 0 0; font-family: var(--display); font-style: italic; font-weight: 900; font-size: 1.6rem; line-height: 1; color: var(--lime); }
.sm .list-links { gap: 0 clamp(1rem, 2.5vw, 2.5rem); }
@media (max-width: 1000px) { .sm { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .sm { grid-template-columns: 1fr; } .sm .list-links { grid-template-columns: 1fr; } }
.sm [hidden], .sm-none[hidden] { display: none !important; }
.sm .list-links .list-group li[hidden], .sm .list-links .list-group[hidden] { display: none !important; }

/* 11.5: footer — brand on the left, link columns in their own grid (3 across, 4 when TV adds a seventh) */
.foot-top--cols { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); gap: clamp(2rem, 4vw, 3.5rem); }
.foot-top--cols .foot-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.25rem clamp(1.25rem, 2.5vw, 2.5rem); }
.foot-top--cols .foot-cols:has(> div:nth-child(7)) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.foot-cols .foot-all { color: var(--lime); font-weight: 600; }
.foot-cols .foot-all::after { content: "→"; margin-inline-start: .35em; }
@media (max-width: 1080px) { .foot-top--cols { grid-template-columns: 1fr; } .foot-top--cols .foot-cols, .foot-top--cols .foot-cols:has(> div:nth-child(7)) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 720px) { .foot-top--cols .foot-cols, .foot-top--cols .foot-cols:has(> div:nth-child(7)) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 330px) { .foot-top--cols .foot-cols, .foot-top--cols .foot-cols:has(> div:nth-child(7)) { grid-template-columns: 1fr; } }
/* sitemap: firms in review are named but not linked */
.sm-letter li.sm-rev span { color: var(--ink-2); font-weight: 600; }
.sm-letter li.sm-rev small { color: var(--mut); }

/* ================= 11.6: homepage energy ================= */
/* cheapest way in */
.cw { padding-block-start: clamp(2.5rem, 5vw, 4rem); }
.cw-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(.9rem, 2vw, 1.4rem); }
.cw-card { position: relative; overflow: hidden; display: flex; flex-direction: column; padding: clamp(1.25rem, 2.4vw, 1.75rem); border: 1px solid var(--line-2); border-radius: var(--radius-l); background: var(--bg-2); }
.cw-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--lime); }
.cw-k { margin: 0; font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--lime); }
.cw-v { white-space: nowrap; margin: .7rem 0 0; font-family: var(--display); font-style: italic; font-weight: 900; font-size: clamp(3rem, 2.2rem + 3vw, 4.6rem); line-height: .9; color: var(--ink); letter-spacing: -.01em; }
.cw-u { margin: .3rem 0 0; color: var(--mut); font-size: .92rem; }
.cw-f { margin: 1.1rem 0 0; display: grid; gap: .1rem; }
.cw-f a { font-weight: 700; font-size: 1.08rem; color: var(--ink); text-decoration: none; } .cw-f a:hover { color: var(--lime); }
.cw-f span { color: var(--ink-2); font-size: .88rem; }
.cw-go { display: flex; flex-wrap: wrap; gap: .5rem; margin-block-start: auto; padding-block-start: 1.25rem; }
.cw .small { margin-block-start: .9rem; }
@media (max-width: 900px) { .cw-grid { grid-template-columns: 1fr; } }

/* money wall */
.mw-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 0; margin: 0; border-block-start: 1px solid var(--line-2); }
.mw-tile { display: grid; gap: .6rem; align-content: start; padding: clamp(1.25rem, 2.4vw, 1.8rem) clamp(1rem, 2vw, 1.5rem); border-block-end: 1px solid var(--line); border-inline-end: 1px solid var(--line); }
.mw-tile dd { margin: 0; white-space: nowrap; font-family: var(--display); font-style: italic; font-weight: 900; font-size: clamp(2.4rem, 1.6rem + 2.6vw, 4rem); line-height: .9; color: var(--lime); letter-spacing: -.01em; }
.mw-tile:first-child dd { font-size: clamp(2.8rem, 1.9rem + 3.4vw, 5rem); }
.mw-tile dt { display: grid; gap: .2rem; }
.mw-tile dt > a { font-weight: 700; font-size: 1.05rem; color: var(--ink); text-decoration: none; } .mw-tile dt > a:hover { color: var(--lime); }
.mw-tile dt > span { color: var(--ink-2); font-size: .9rem; }
.mw-tile small { color: var(--mut); font-size: .76rem; } .mw-tile small a { color: var(--mut); }
.mw-note { max-width: 80ch; margin-block-start: 1rem; }

/* award winners */
.hw-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: clamp(.9rem, 2vw, 1.4rem); }
.hw-card { display: grid; justify-items: center; text-align: center; gap: .35rem; padding: clamp(1.4rem, 2.6vw, 2rem) 1.25rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); color: var(--ink); text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
.hw-card:hover { border-color: color-mix(in srgb, var(--lime) 55%, var(--line)); transform: translateY(-3px); }
.hw-card .aw-medal, .hw-card .fx-medal { width: 120px; height: 120px; margin-block-end: .5rem; }
.hw-card .fx-medal > img { width: 120px; height: 120px; }
.hw-t { font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--lime); }
.hw-card b { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.7rem; line-height: 1; }
.hw-card small { color: var(--mut); font-size: .84rem; }

/* ticker: scrolling prices */
.tick-prices { flex: 1 1 auto; min-width: 0; overflow: hidden; -webkit-mask: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); mask: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.tp-track { display: inline-flex; gap: 2.25rem; padding-inline-end: 2.25rem; white-space: nowrap; }
.tp-track a, .tp-dup a { display: inline-flex; align-items: baseline; gap: .4rem; color: var(--mut); text-decoration: none; }
.tp-track b { color: var(--ink-2); font-weight: 600; }
.tp-track a span { color: var(--lime); font-weight: 700; font-variant-numeric: tabular-nums; }
.tp-track a:hover b { color: var(--ink); }
.tp-dup { display: inline-flex; gap: 2.25rem; }
.ticker .tick-news { flex: 0 1 auto; max-width: 34ch; }
@media (prefers-reduced-motion: no-preference) {
  .tp-track { animation: tp-roll 60s linear infinite; }
  .tick-prices:hover .tp-track, .tick-prices:focus-within .tp-track { animation-play-state: paused; }
  @keyframes tp-roll { to { transform: translateX(-50%); } }
}
@media (prefers-reduced-motion: reduce) { .tick-prices { overflow-x: auto; } .tp-dup { display: none; } }
@media (max-width: 760px) { .tick-live { display: none; } }

/* hero headline: words land one after another (text never hidden, so it paints immediately) */
.hero-h.fx-words { animation: none !important; }
.fx-w { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  .hero-h.fx-words .fx-w { animation: fx-land .7s calc(var(--wi) * 85ms) cubic-bezier(.16, 1, .3, 1) both; }
  @keyframes fx-land { from { transform: translateY(.45em) skewX(-12deg); filter: blur(8px); } }
}

/* 11.7: short intro line under a section heading */
.sec-lead { margin: -.6rem 0 1.25rem; font-size: var(--step-0); color: var(--ink-2); max-width: 64ch; }

/* ================= 11.8: new homepage sections ================= */
/* what kind of trader are you? */
.tt { padding-block-start: clamp(2.5rem, 5vw, 4rem); }
.tt-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.7rem, 1.6vw, 1rem); }
.tt-card { display: flex; flex-direction: column; gap: .45rem; padding: 1.2rem 1.25rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); color: var(--ink); text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
.tt-card:hover { border-color: color-mix(in srgb, var(--lime) 60%, var(--line)); transform: translateY(-3px); }
.tt-card b { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.35rem; line-height: 1; }
.tt-card span { color: var(--ink-2); font-size: .9rem; line-height: 1.45; }
.tt-card em { margin-block-start: auto; padding-block-start: .5rem; font-style: normal; font-weight: 700; color: var(--lime); font-size: .9rem; }
@media (max-width: 1000px) { .tt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 460px) { .tt-grid { grid-template-columns: 1fr; } }

/* the sticker price isn't the price */
.sp-in { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; padding: clamp(1.4rem, 3vw, 2.4rem); border: 1px solid var(--line-2); border-radius: var(--radius-l); background: var(--bg-2); }
.sp-rows { display: grid; gap: 1.5rem; }
.sp-lab { margin: 0 0 .5rem; font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); }
.sp-lab span { color: var(--mut); margin-inline-start: .4rem; }
.sp-nums { display: flex; align-items: flex-end; gap: clamp(.8rem, 2vw, 1.6rem); margin: 0; }
.sp-nums dt { font-size: .8rem; color: var(--mut); }
.sp-nums dd { margin: .15rem 0 0; font-family: var(--display); font-style: italic; font-weight: 900; font-size: clamp(2.6rem, 1.8rem + 3vw, 4.4rem); line-height: .9; color: var(--ink-2); white-space: nowrap; }
.sp-nums dd small { font-size: .45em; margin-inline-start: .1em; }
.sp-arrow { font-size: 2rem; color: var(--mut); padding-block-end: .4rem; }
.sp-why p { margin: 0 0 .8rem; color: var(--ink-2); }
.sp-why ul { margin: 0 0 1.25rem; padding-inline-start: 1.1rem; display: grid; gap: .5rem; color: var(--ink-2); }
.sp-why li::marker { color: var(--lime); }
.sp-why b { color: var(--ink); }
.sp .small { margin-block-start: .9rem; }
@media (max-width: 900px) { .sp-in { grid-template-columns: 1fr; } }

/* how you'd get paid */
.pr-table th[scope="row"] a { display: block; font-weight: 700; color: var(--ink); text-decoration: none; } .pr-table th[scope="row"] a:hover { color: var(--lime); }
.pr-table th[scope="row"] span { display: block; font-size: .8rem; color: var(--mut); font-weight: 500; }
.pr-table td { color: var(--ink-2); font-size: .9rem; min-width: 9rem; }
.pr-table td:nth-child(2) { font-family: var(--display); font-style: italic; font-weight: 900; font-size: 1.4rem; color: var(--lime); min-width: 5rem; }
.pr .small { margin-block-start: .9rem; }

/* the four rules that end evaluations */
.er-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.8rem, 1.8vw, 1.2rem); }
.er-card { display: flex; flex-direction: column; gap: .5rem; padding: clamp(1.2rem, 2.2vw, 1.6rem); border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); }
.er-n { margin: 0; font-family: var(--display); font-style: italic; font-weight: 900; font-size: 2.2rem; line-height: 1; color: var(--lime); }
.er-card h3 { margin: 0; font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.45rem; line-height: 1; }
.er-card p { margin: 0; color: var(--ink-2); font-size: .92rem; line-height: 1.5; }
.er-card a { margin-block-start: auto; padding-block-start: .6rem; font-weight: 700; color: var(--lime); text-decoration: none; font-size: .9rem; }
@media (max-width: 1000px) { .er-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .er-grid { grid-template-columns: 1fr; } }

/* can you sign up from your country? */
.cc-box { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1rem; }
.cc-box label { font-weight: 700; }
.cc-box select { min-height: 50px; min-width: min(100%, 320px); padding: 0 1rem; border-radius: var(--radius); border: 1px solid var(--line-2); background: var(--bg-2); color: var(--ink); font-size: 1rem; }
.cc-out { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 1rem; margin-block-start: 1.25rem; }
.cc-out:empty { display: none; }
.cc-col { padding: 1.1rem 1.2rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); }
.cc-col h3 { margin: 0 0 .6rem; font-family: var(--mono); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); }
.cc-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.cc-col li { display: flex; justify-content: space-between; gap: .75rem; font-size: .92rem; }
.cc-col li a { color: var(--ink); font-weight: 600; text-decoration: none; }
.cc-col li span { color: var(--mut); font-size: .82rem; text-align: end; }
.cc-ok a::before { content: "✓ "; color: var(--lime); }
.cc-no a::before { content: "✕ "; color: var(--mut); }

/* 11.9: live code prices */
.sp-nums .sp-all dd { color: var(--ink); }
.sp-nums .sp-code dd { color: var(--lime); }
.sp-nums .sp-list dd { color: var(--ink-2); }
@media (max-width: 560px) { .sp-row--3 .sp-nums { flex-wrap: wrap; } .sp-row--3 .sp-nums dd { font-size: 2.4rem; } }
.cw-v small { font-size: .42em; margin-inline-start: .1em; }
.cw-code { margin-block-start: .8rem; }
.cw-code .cell-sub { display: block; margin-block-start: .3rem; color: var(--mut); font-size: .78rem; }

.sp-nums .sp-code { border: 0; padding: 0; background: none; font-family: inherit; font-weight: inherit; font-size: inherit; letter-spacing: normal; border-radius: 0; }
.sp-in:has(.sp-row--3) { grid-template-columns: 1fr; }
.sp-in:has(.sp-row--3) .sp-rows { grid-template-columns: 1fr; gap: 1.75rem; }
.sp-row--3 .sp-nums { flex-wrap: wrap; row-gap: .5rem; }
.sp-in:has(.sp-row--3) .sp-why { border-block-start: 1px solid var(--line); padding-block-start: 1.25rem; }
.sp-in:has(.sp-row--3) .sp-why ul { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: .5rem 2rem; }

/* 11.10: badges */
.ph-badges { display: flex; flex-wrap: wrap; gap: .45rem; margin-block: .9rem .2rem; }
.ph-badges a { display: inline-flex; line-height: 0; border-radius: 999px; transition: transform .15s ease; }
.ph-badges a:hover { transform: translateY(-2px); }
.ph-badges img, .award-chips .badge-chip { height: 26px; width: auto; }
.award-chips .badge-chip { height: 22px; }
.bd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 1rem; margin-block-start: 1.25rem; }
.bd-card { display: flex; flex-direction: column; gap: .8rem; padding: 1.2rem 1.3rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); scroll-margin-top: 6rem; }
.bd-card:target { border-color: var(--lime); }
.bd-card header { display: grid; gap: .6rem; }
.bd-card header img { height: 28px; width: auto; justify-self: start; }
.bd-card header p { margin: 0; color: var(--ink-2); font-size: .9rem; line-height: 1.45; }
.bd-card ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.bd-card li a { display: inline-block; padding: .25rem .6rem; border: 1px solid var(--line-2); border-radius: 999px; color: var(--ink); text-decoration: none; font-size: .84rem; font-weight: 600; }
.bd-card li a:hover { border-color: var(--lime); color: var(--lime); }
.bd-more { margin-block-start: auto; color: var(--lime); font-weight: 700; font-size: .88rem; text-decoration: none; }

/* 11.11: one winners card per firm */
.hw-medals { position: relative; display: inline-block; }
.hw-more { position: absolute; right: -.6rem; bottom: .3rem; padding: .15rem .5rem; border-radius: 999px; background: var(--lime); color: var(--on-lime); font-size: .72rem; font-weight: 800; }
.hw-list { list-style: none; margin: .3rem 0 0; padding: 0; display: grid; gap: .35rem; }
.hw-list li { display: grid; gap: .05rem; }
.hw-list span { font-family: var(--mono); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--lime); }
.hw-list small { color: var(--mut); font-size: .82rem; }

/* 11.11: ?health panel */
.health { position: fixed; right: 1rem; bottom: 1rem; z-index: 200; width: min(92vw, 460px); max-height: 70vh; overflow: auto; padding: 1rem 1.1rem; border: 1px solid var(--line-2); border-radius: var(--radius-l); background: var(--bg-2); box-shadow: 0 24px 60px -20px rgb(0 0 0 / .8); font-size: .86rem; }
.health-h { display: flex; justify-content: space-between; align-items: center; margin: 0 0 .6rem; font-family: var(--mono); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--lime); }
.health-h button { background: none; border: 0; color: var(--ink-2); font-size: 1.2rem; cursor: pointer; }
.health ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.health li { padding-inline-start: 1.1rem; position: relative; color: var(--ink-2); }
.health li::before { content: ""; position: absolute; left: 0; top: .45em; width: 8px; height: 8px; border-radius: 50%; background: var(--lime); }
.health li.warn::before { background: #F2A33A; }
.health b { color: var(--ink); }

/* 11.12: one-tap code + visit, and the confirmation toast */
.v-code { display: inline-block; margin-inline-start: .45em; padding: .08em .45em; border-radius: 4px; background: color-mix(in oklch, var(--on-lime) 88%, transparent); color: var(--lime); font-family: var(--mono); font-style: normal; font-size: .78em; font-weight: 700; letter-spacing: .03em; line-height: 1.4; }
.btn--line .v-code, .oc-visit .v-code, .rail-go .v-code { background: color-mix(in oklch, var(--lime) 18%, transparent); color: var(--lime); }
.pfd-toast { position: fixed; left: 50%; bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px)); z-index: 300; margin: 0; max-width: min(92vw, 520px); padding: .8rem 1.1rem; border-radius: 12px; background: var(--lime); color: var(--on-lime); font-weight: 600; box-shadow: 0 20px 50px -18px rgb(0 0 0 / .8); transform: translate(-50%, 160%); transition: transform .3s cubic-bezier(.2, .8, .2, 1); pointer-events: none; }
.pfd-toast.is-on { transform: translate(-50%, 0); }
@media (prefers-reduced-motion: reduce) { .pfd-toast { transition: none; } }
.cw { scroll-margin-top: 80px; }

/* 11.13: take-home calculator, glossary, new firm sections */
.th-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: clamp(1.25rem, 3vw, 2.5rem); align-items: start; }
.th-in { display: grid; gap: .9rem; padding: 1.3rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); }
.th-in label { display: grid; gap: .35rem; font-weight: 600; font-size: .9rem; }
.th-in select, .th-in input[type=number] { min-height: 46px; padding: 0 .8rem; border-radius: var(--radius); border: 1px solid var(--line-2); background: var(--bg); color: var(--ink); font-size: 1rem; width: 100%; }
.th-money { display: flex; align-items: center; border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--bg); } .th-money span { padding-inline: .8rem 0; color: var(--mut); } .th-money input { border: 0 !important; }
.th-check { display: flex !important; grid-auto-flow: column; align-items: center; gap: .5rem !important; font-weight: 500 !important; color: var(--ink-2); }
.th-out { display: grid; gap: 1.1rem; }
.th-nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin: 0; }
.th-nums > div { padding: 1.1rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); display: grid; gap: .2rem; align-content: start; }
.th-nums dt { font-family: var(--mono); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
.th-nums dd { margin: 0; font-family: var(--display); font-style: italic; font-weight: 900; font-size: clamp(2rem, 1.5rem + 2vw, 3rem); line-height: 1; color: var(--ink); }
.th-nums > div:first-child dd, .th-mult dd { color: var(--lime); }
.th-nums small { color: var(--mut); font-size: .8rem; }
.th-rules { padding: 1.1rem 1.2rem; border: 1px solid var(--line); border-radius: var(--radius-l); }
.th-rules h3 { margin: 0 0 .6rem; font-size: 1rem; }
.th-go { display: flex; flex-wrap: wrap; gap: .6rem; }
@media (max-width: 900px) { .th-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .th-nums { grid-template-columns: 1fr; } }
.gl { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: .8rem; margin: 0; }
.gl-item { padding: 1.1rem 1.2rem; border: 1px solid var(--line); border-radius: var(--radius-l); background: var(--bg-2); scroll-margin-top: 6rem; }
.gl-item:target { border-color: var(--lime); }
.gl-item dt { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: 1.3rem; line-height: 1.05; margin-block-end: .4rem; }
.gl-item dd { margin: 0; color: var(--ink-2); font-size: .94rem; line-height: 1.55; }
.lead-s { color: var(--ink-2); max-width: 70ch; }
.src-line { margin-block-start: .8rem; }
.live-note { margin-block-start: .9rem; padding: .8rem 1rem; border-inline-start: 3px solid var(--lime); background: color-mix(in oklch, var(--lime) 6%, transparent); border-radius: 0 var(--radius) var(--radius) 0; }
.ph-confirmed dd { color: var(--lime); font-weight: 700; }
.wrong-num { margin-block-start: .8rem; }
.sm-firmnote { margin-block-start: 1rem; }
.sp-nums dl { margin: 0; }
.th-nums dd small { display: block; margin-block-start: .35rem; font-family: var(--sans); font-style: normal; font-weight: 400; font-size: .8rem; line-height: 1.35; color: var(--mut); }

/* ==========================================================================
   11.19: ONE ROUNDED SHAPE SYSTEM. Every button is the same pill; every box has rounded corners; nothing is cut
   or square. The only slanted shapes left are the livery stripes in the background, which aren't elements you use.
   ========================================================================== */
/* every button, link-button and control: the same pill */
.btn, .btn--sm, .btn--xl, .btn--lime, .btn--line, .btn--ghost, .btn--ink, .btn--coral, .head-cta-btn,
button:not(.duel-sel), [role="button"], input[type="submit"], input[type="button"],
.copy-btn, .rail-go, .oc-visit, .oc-rules, .rail-x, .cb-nav, .find-btn, .menu-btn, .sort, .mkt, .duel-shuffle,
.pill, .pill.is-on, .pill[aria-pressed="true"], .seg, .seg button, .seg button[aria-pressed="true"], .prog-cmp {
  border-radius: 999px !important; clip-path: none !important;
}
.btn--lime::after { border-radius: inherit; }
/* chips, tags and code boxes: pills too */
.chip, code, .v-code, .sp-code, .cw-code code, .offer code, .flags li, .badge-chip, .award-chip, .aw-chip, .rail-code, .codebar code {
  border-radius: 999px !important; clip-path: none !important;
}
pre code { border-radius: 0 !important; }
/* fields: single-line fields are pills; tall ones get the card radius */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select { border-radius: 999px; clip-path: none; }
textarea, select[multiple], select.duel-sel, .duel-sel { border-radius: var(--radius-l) !important; }
.th-money { border-radius: 999px; overflow: hidden; }
/* boxes that were cut at a corner or left square: the card radius */
.tool, .stats div, .steps li, .tv-card, .prog, .prof-hero, .offer, .pay-card, .prof-exit, .ab-photo, .mono,
.prog-jump, .duel-note, .tower, .mk-logo-media, .mk-logo figcaption, figcaption, .health, .pfd-toast {
  clip-path: none !important; border-radius: var(--radius-l);
}
.mk-logo-media + figcaption { border-radius: 0 0 var(--radius-l) var(--radius-l); }
/* round badges: numbered steps and the VS marks */
.step-n, .steps > li > .step-n, .tv-play svg, .ab-vs-badge { clip-path: none !important; border-radius: 50% !important; }
.duel-vs { clip-path: none !important; border-radius: 999px !important; }
.duel-vs::after { display: none; }
.block-head::after { border-radius: 999px; }
.meter-bar, .meter-bar i, .list-table .prog-chip i, .tag { border-radius: 999px; }
input[type="range"] { border-radius: 999px; }
input[type="range"]::-webkit-slider-runnable-track { border-radius: 999px; }
input[type="range"]::-moz-range-track { border-radius: 999px; }


/* 11.22: Verified badge by a firm's name (firm confirmed its listing in the last 12 months) */
.vbadge { display: inline-flex; vertical-align: -0.12em; margin-inline-start: .3em; width: 1em; height: 1em; flex: none; line-height: 0; cursor: help; }
.vbadge svg { width: 100%; height: 100%; }
.vbadge .vb-seal { fill: var(--lime); }
.vbadge .vb-tick { stroke: #0B0B0C; }
.vbadge--lg { width: .62em; height: .62em; vertical-align: .08em; margin-inline-start: .18em; }
@media (forced-colors: active) { .vbadge .vb-seal { fill: CanvasText; } .vbadge .vb-tick { stroke: Canvas; } }

/* 11.23: Prop Firm Duel TV page */
.tvp-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; padding-block: clamp(2.5rem, 6vw, 5rem) clamp(2rem, 5vw, 3.5rem); }
.tvp-hero .display { font-size: clamp(3rem, 7vw, 5.6rem); }
.tvp-hero .display em { color: var(--lime); font-style: inherit; }
.tvp-hero .lead { margin-block: 1rem 1.6rem; }
.tvp-sub svg { margin-inline-end: .5rem; }
.tvp-stats { display: flex; gap: clamp(1.25rem, 3vw, 2.5rem); margin: 1.8rem 0 0; flex-wrap: wrap; }
.tvp-stats div { display: flex; flex-direction: column-reverse; }
.tvp-stats dd { margin: 0; font-family: var(--font-display, inherit); font-weight: 800; font-style: italic; font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1; }
.tvp-stats dt { color: var(--muted, #9a9a9a); font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; margin-top: .35rem; }
.tvp-feature { display: block; text-decoration: none; color: inherit; }
.tvp-screen { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: var(--radius-l); overflow: hidden; border: 1px solid color-mix(in oklch, var(--lime) 35%, transparent);
  background: radial-gradient(70% 90% at 70% 30%, color-mix(in oklch, var(--lime) 22%, transparent), transparent 70%), repeating-linear-gradient(-24deg, transparent 0 22px, color-mix(in oklch, var(--lime) 6%, transparent) 22px 24px), var(--bg-2); }
.tvp-live { position: absolute; top: 1rem; left: 1rem; display: inline-flex; align-items: center; gap: .45rem; padding: .35rem .75rem; border-radius: 999px; background: #0b0b0c; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.tvp-live i { width: .5rem; height: .5rem; border-radius: 50%; background: var(--lime); }
.tvp-play { position: absolute; inset: 0; margin: auto; width: 88px; height: 88px; border-radius: 50%; display: grid; place-items: center; background: var(--lime); color: #0b0b0c; box-shadow: 0 0 0 10px color-mix(in oklch, var(--lime) 18%, transparent); transition: transform .2s ease; }
.tvp-play svg { margin-left: 4px; }
.tvp-feature:hover .tvp-play, .tvp-feature:focus-visible .tvp-play { transform: scale(1.07); }
.tvp-screen-title { position: absolute; left: 1rem; right: 5rem; bottom: 1rem; display: flex; flex-direction: column; gap: .2rem; }
.tvp-screen-title small { color: var(--lime); font-weight: 700; letter-spacing: .08em; font-size: .75rem; }
.tvp-screen-title b { font-size: clamp(1.1rem, 2vw, 1.45rem); line-height: 1.2; }
.tvp-dur { position: absolute; right: 1rem; bottom: 1rem; padding: .2rem .5rem; border-radius: 6px; background: #0b0b0c; font-size: .8rem; font-variant-numeric: tabular-nums; }
.tvp-feature-cap { display: block; margin-top: .75rem; color: var(--muted, #9a9a9a); font-size: .92rem; }
.tvp-shows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.tvp-show { display: grid; grid-template-columns: 96px 1fr; gap: 1.1rem; align-items: start; padding: 1.25rem; border-radius: var(--radius-l); background: var(--bg-2); border: 1px solid var(--line, #222); }
.tvp-show-art { aspect-ratio: 1; border-radius: 18px; display: grid; place-items: center; background: #0b0b0c; border: 1px solid color-mix(in oklch, var(--lime) 30%, transparent); }
.tvp-show-art b { font-family: var(--font-display, inherit); font-style: italic; font-weight: 800; font-size: 2rem; color: var(--lime); }
.tvp-show h3 { margin: .1rem 0 .35rem; font-size: 1.25rem; }
.tvp-show p { margin: 0 0 .6rem; color: var(--muted, #bdbdbd); }
.tvp-show-n { font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; color: var(--lime); }
.tvp-promise { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.tvp-promise > div { padding: 1.4rem; border-top: 2px solid var(--lime); background: var(--bg-2); border-radius: 0 0 var(--radius-l) var(--radius-l); }
.tvp-promise h3 { margin: 0 0 .4rem; font-size: 1.1rem; }
.tvp-promise p { margin: 0; color: var(--muted, #bdbdbd); }
.tvp-band { display: flex; justify-content: space-between; align-items: center; gap: 2rem; flex-wrap: wrap; padding: clamp(1.75rem, 4vw, 3rem); border-radius: var(--radius-l); background: var(--lime); color: #0b0b0c; }
.tvp-band .k { color: #0b0b0c; opacity: .75; }
.tvp-band .display { font-size: clamp(2.4rem, 5vw, 4rem); }
.tvp-band .display em { font-style: inherit; opacity: .7; }
.tvp-band .lead { color: #0b0b0c; margin-top: .6rem; }
.tvp-band-cta { display: flex; flex-direction: column; align-items: center; gap: .6rem; }
.tvp-band .btn--dark { background: #0b0b0c; color: var(--lime); border-color: #0b0b0c; }
.tvp-handle { font-weight: 700; }
@media (max-width: 900px) { .tvp-hero, .tvp-shows, .tvp-promise { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .tvp-show { grid-template-columns: 64px 1fr; } .tvp-show-art b { font-size: 1.4rem; } .tvp-play { width: 68px; height: 68px; } }
@media (prefers-reduced-motion: reduce) { .tvp-play { transition: none; } }
#episodes .tv-grid--all { grid-template-columns: repeat(4, minmax(0, 1fr)); }
#episodes .tv-grid--all .tv-card, #episodes .tv-grid--all .tv-card--lead { grid-column: auto; }
#episodes .tv-grid--all .tv-card .tv-ex { display: block; }
@media (max-width: 1100px) { #episodes .tv-grid--all { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { #episodes .tv-grid--all { grid-template-columns: 1fr; } }

/* 11.24: awards hidden (Show awards off): the awards page shows badges only */
.awards-off .aw-group:not(#badges), .awards-off .aw-tools, .awards-off [data-awards] > :not(#badges):not(.aw-group) { display: none !important; }