#cpStatLookupModule {
    --ink: #141414;
    --muted: #6f6a5f;
    --line: rgba(0, 0, 0, 0.14);
    --line-soft: rgba(0, 0, 0, 0.08);
    --sky: #89CFF0;
    --sky-light: #d8f3ff;
    --sky-mid: #aee4fa;
    --red: #c41e3a;
    --red-dark: #8f1529;

    /* HOST-SURFACE tokens. These are for the few elements that render DIRECTLY
       on the host page rather than inside one of the module's own light
       panels. The host page is LIGHT (verified against the live site), so they
       resolve to the normal dark palette — they exist as their own names only
       so that every such element can be re-pointed from one place if the site
       is ever embedded on a dark surface. */
    --on-host: #141414;
    --on-host-muted: #6f6a5f;
    --on-host-accent: #8f1529;
    --on-host-line: rgba(0, 0, 0, 0.14);

    --serif: Georgia, "Times New Roman", serif;
    --sans: Arial, Helvetica, sans-serif;
    /* ---- TYPE SCALE ---------------------------------------------------
       Every font-size in this module resolves from here. Before August 2026
       the modules used THIRTY ad-hoc sizes starting at 7.5px, 342 of them
       under 11px, which is the main reason the site read as dense and
       illegible on a phone. Dense stat tables genuinely want small text --
       Savant and FanGraphs sit around 12px -- so the floor is 11.5px, not a
       comfortable reading size, but nothing below it. The narrow-screen block
       at the end of this stylesheet lifts the bottom of the scale again. */
    --fs-micro: 11.5px;  /* dense table cells, chips, superscripts */
    --fs-xs: 12px;       /* column headers, meta lines, labels */
    --fs-sm: 13px;       /* secondary text */
    --fs-base: 14px;     /* body */
    --fs-md: 15px;       /* emphasis, player names in lists */
    --fs-lg: 17px;       /* sub-headings */
    --fs-xl: 20px;       /* headings */
    --fs-2xl: 24px;      /* section titles */
    --fs-3xl: clamp(26px, 3.4vw, 34px);  /* page titles */

    /* ---- SPACING (4px base) ---- */
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 24px;
    --sp-6: 32px;
    --sp-7: 48px;

    /* ---- RADIUS + ELEVATION ---- */
    --r-sm: 6px;
    --r-md: 10px;
    --r-lg: 14px;
    --r-pill: 999px;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.06);
    --shadow-2: 0 2px 6px rgba(0, 0, 0, 0.07), 0 8px 20px -12px rgba(0, 0, 0, 0.18);
    --shadow-3: 0 4px 14px rgba(0, 0, 0, 0.10), 0 18px 40px -20px rgba(0, 0, 0, 0.25);

    /* ---- MOTION ---- */
    --ease: cubic-bezier(0.4, 0.1, 0.2, 1);
    --dur-1: 0.16s;
    --dur-2: 0.28s;


    max-width: 1000px;
    margin: 0 auto;
    padding: 0 18px 48px;
    font-family: var(--serif);
    color: var(--ink);
  }

  #cpStatLookupModule *, #cpStatLookupModule *::before, #cpStatLookupModule *::after { box-sizing: border-box; }

  /* ---------- Keyboard focus ---------- */
  #cpStatLookupModule :focus-visible {
    outline: 2px solid var(--red);
    outline-offset: 2px;
    border-radius: 4px;
  }
  #cpStatLookupModule .cp-sl-option:focus-visible { outline-offset: -2px; }

  /* ---------- Search ----------
     The field is the first thing on the page, so it carries the masthead's
     weight: a framed pill with an inset icon and a clear button, and a results
     sheet built from real rows (headshot, name, position line, level badge,
     rank chip) rather than a single line of text per player. */
  #cpStatLookupModule .cp-sl-searchwrap { position: relative; margin: 6px 0 18px; }

  #cpStatLookupModule .cp-sl-searchfield {
    position: relative; display: flex; align-items: center;
    border-radius: 999px; border: 1px solid var(--line);
    background: linear-gradient(180deg, #ffffff, #fbf8f2);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05), inset 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: border-color 0.16s ease, box-shadow 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-searchfield:focus-within {
    border-color: rgba(196, 30, 58, 0.55);
    box-shadow: 0 4px 14px rgba(196, 30, 58, 0.10), 0 0 0 3px rgba(196, 30, 58, 0.12);
  }
  #cpStatLookupModule .cp-sl-searchicon {
    position: absolute; left: 17px; width: 18px; height: 18px; color: #b3ada1;
    pointer-events: none; transition: color 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-searchfield:focus-within .cp-sl-searchicon { color: var(--red); }
  #cpStatLookupModule .cp-sl-search {
    width: 100%; height: 50px; padding: 0 44px 0 45px; border: 0; border-radius: 999px;
    background: transparent; font-family: var(--serif); font-size: var(--fs-md); color: var(--ink); outline: none;
  }
  #cpStatLookupModule .cp-sl-search::placeholder { color: #a8a296; }
  /* The native search widget's own clear affordance would sit next to ours. */
  #cpStatLookupModule .cp-sl-search::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
  #cpStatLookupModule .cp-sl-searchclear {
    position: absolute; right: 12px; width: 26px; height: 26px; border-radius: 999px;
    border: 0; background: rgba(0, 0, 0, 0.06); color: var(--muted);
    font-size: var(--fs-lg); line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center;
  }
  #cpStatLookupModule .cp-sl-searchclear[hidden] { display: none; }
  #cpStatLookupModule .cp-sl-searchclear:hover { background: rgba(196, 30, 58, 0.12); color: var(--red-dark); }

  /* ---------- Search scope ----------
     Sits in flow between the field and the dropdown, and the dropdown's `top`
     is offset to clear it: the whole point of the toggle is that it stays
     reachable WHILE results are on screen, so it must not be overlaid. */
  #cpStatLookupModule .cp-sl-searchscope { display: flex; justify-content: flex-end; gap: 6px; padding: 8px 6px 0; }
  #cpStatLookupModule .cp-sl-scopebtn[hidden] { display: none; }
  #cpStatLookupModule .cp-sl-scopebtn {
    display: inline-flex; align-items: center; gap: 7px; cursor: pointer;
    padding: 4px 11px 5px; border-radius: 999px;
    border: 1px solid var(--line); background: transparent; color: var(--muted);
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800;
    letter-spacing: 0.06em; text-transform: uppercase;
    transition: color .14s ease, border-color .14s ease, background .14s ease;
  }
  #cpStatLookupModule .cp-sl-scopebtn:hover { color: var(--red-dark); border-color: rgba(196, 30, 58, 0.4); }
  #cpStatLookupModule .cp-sl-scopedot {
    width: 8px; height: 8px; border-radius: 999px; flex: 0 0 auto;
    border: 1.5px solid currentColor; background: transparent; transition: background .14s ease;
  }
  #cpStatLookupModule .cp-sl-scopebtn[aria-pressed="true"] {
    color: var(--red-dark); border-color: rgba(196, 30, 58, 0.45); background: rgba(196, 30, 58, 0.08);
  }
  #cpStatLookupModule .cp-sl-scopebtn[aria-pressed="true"] .cp-sl-scopedot { background: currentColor; }

  #cpStatLookupModule .cp-sl-results {
    position: absolute; left: 0; right: 0; top: 92px; z-index: 40;
    max-height: 396px; overflow-y: auto; background: #fffdf8;
    border: 1px solid var(--line); border-radius: 16px; padding: 6px;
    box-shadow: 0 20px 44px rgba(0, 0, 0, 0.18); display: none;
  }
  #cpStatLookupModule .cp-sl-results.is-open { display: block; }
  #cpStatLookupModule .cp-sl-resulthead {
    display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
    padding: 7px 10px 8px; font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900;
    letter-spacing: 0.11em; text-transform: uppercase; color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-resulthead em { font-style: normal; color: #b3ada1; letter-spacing: 0.06em; }

  #cpStatLookupModule .cp-sl-option {
    display: flex; align-items: center; gap: 11px; width: 100%; padding: 8px 10px;
    border: 1px solid transparent; border-radius: 12px; background: transparent;
    text-align: left; cursor: pointer; font-family: var(--serif); color: var(--ink);
    transition: background 0.12s ease, border-color 0.12s ease;
  }
  #cpStatLookupModule .cp-sl-option:hover, #cpStatLookupModule .cp-sl-option.is-active {
    background: rgba(137, 207, 240, 0.18); border-color: rgba(137, 207, 240, 0.5);
  }
  /* ---------- Shared headshot thumbnail ----------
     Do NOT crop these to a circle. Both assets are the same 2:3 portrait
     (240x361 milb, 213x320 MLB /67), but the SUBJECT inside that frame is not
     consistently placed: measuring each player's head band row-by-row against
     the studio backdrop (widest-row to neck-pinch) gives head tops from 1.9% to
     11.9% of image height and chins from 47.9% to 83.9%. A square window can
     only show 66.5% of a 2:3 image's height, so no fixed crop contains every
     player's head — whatever flatters one clips another, which is precisely the
     "unbalanced from player to player" problem. Rendering the full asset at its
     native 2:3 is uniform by construction and cannot cut a face off. Same
     reasoning as the comparison cards and the spotlight photo. */
  #cpStatLookupModule .cp-sl-avatar {
    position: relative; flex: 0 0 auto; overflow: hidden; border-radius: 9px;
    background: linear-gradient(180deg, #eef6fb, #dfeaf3); border: 1px solid rgba(0, 0, 0, 0.10);
  }
  #cpStatLookupModule .cp-sl-avatar img { width: 100%; height: 100%; object-fit: contain; display: block; }
  #cpStatLookupModule .cp-sl-option-avatar { width: 34px; height: 51px; }
  #cpStatLookupModule .cp-sl-option-body { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
  #cpStatLookupModule .cp-sl-option-name { font-size: var(--fs-md); font-weight: 900; line-height: 1.2; }
  #cpStatLookupModule .cp-sl-option-sub {
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; letter-spacing: 0.06em;
    text-transform: uppercase; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #cpStatLookupModule .cp-sl-option-tags { margin-left: auto; display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
  #cpStatLookupModule .cp-sl-option-lvl {
    display: inline-flex; align-items: center; height: 21px; padding: 0 8px; border-radius: 999px;
    background: rgba(137, 207, 240, 0.22); border: 1px solid rgba(137, 207, 240, 0.55);
    font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.07em;
    text-transform: uppercase; color: #23546f; white-space: nowrap;
  }

  #cpStatLookupModule .cp-sl-option-rank {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 30px; height: 24px; padding: 0 6px; border-radius: 7px;
    background: linear-gradient(180deg, #cc314b, #ad1b34);
    border: 1px solid rgba(0, 0, 0, 0.12); color: #fff;
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; flex: 0 0 auto;
  }
  #cpStatLookupModule .cp-sl-option-rank.cp-rank-gold { background: linear-gradient(180deg, #f7dd7f, #c9962a); color: #402e06; }
  #cpStatLookupModule .cp-sl-option-rank.cp-rank-silver { background: linear-gradient(180deg, #f0f1f5, #a4a9b6); color: #2b2e36; }
  #cpStatLookupModule .cp-sl-option-rank.cp-rank-bronze { background: linear-gradient(180deg, #ecb27e, #a8642f); color: #3a2008; }
  /* Unranked: the slot still reserves its width so the level badges stay in a
     column, but it draws nothing — a list of dashed empty boxes was louder than
     the ranks it was aligning. */
  #cpStatLookupModule .cp-sl-option-rank.cp-rank-empty { background: transparent; border: 0; color: transparent; }

  #cpStatLookupModule .cp-sl-noopt { padding: 18px 14px; text-align: center; color: var(--muted); font-size: var(--fs-base); }
  #cpStatLookupModule .cp-sl-noopt strong { display: block; color: var(--ink); font-size: var(--fs-md); margin-bottom: 3px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-option-sub { max-width: 130px; }

  /* ---------- Range controls ---------- */
  #cpStatLookupModule .cp-sl-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 6px; }

  #cpStatLookupModule .cp-sl-chip {
    height: 38px; padding: 0 15px; border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.12); background: rgba(255, 255, 255, 0.9);
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.08em;
    text-transform: uppercase; color: #444; cursor: pointer;
    transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-chip:hover { border-color: rgba(196, 30, 58, 0.5); color: var(--red-dark); transform: translateY(-1px); }
  #cpStatLookupModule .cp-sl-chip.is-active { background: linear-gradient(180deg, #cc314b, #ad1b34); border-color: rgba(0, 0, 0, 0.12); color: #ffffff; }

  #cpStatLookupModule .cp-sl-customrow { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 10px 0 0; }
  #cpStatLookupModule .cp-sl-customrow[hidden] { display: none; }

  #cpStatLookupModule .cp-sl-date {
    height: 38px; padding: 0 14px; border-radius: 999px; border: 1px solid rgba(0, 0, 0, 0.12);
    background: rgba(255, 255, 255, 0.92); font-family: var(--serif); font-size: var(--fs-base); color: var(--ink);
    outline: none; transition: border-color 0.16s ease, box-shadow 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-date:focus { border-color: rgba(196, 30, 58, 0.55); box-shadow: 0 0 0 3px rgba(196, 30, 58, 0.12); }
  #cpStatLookupModule .cp-sl-customto { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
  #cpStatLookupModule .cp-sl-customhint { font-family: var(--sans); font-size: var(--fs-sm); color: var(--red-dark); }

  #cpStatLookupModule .cp-sl-calpanel { margin-top: 12px; }
  #cpStatLookupModule .cp-sl-calpanel[hidden] { display: none; }
  #cpStatLookupModule .cp-sl-calhint { font-family: var(--sans); font-size: var(--fs-sm); color: var(--muted); margin: 0 0 8px; }
  #cpStatLookupModule .cp-sl-calmonths { display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-start; }
  #cpStatLookupModule .cp-sl-calmonthname { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; color: #444; margin-bottom: 6px; }
  #cpStatLookupModule .cp-sl-calgrid { display: grid; grid-template-columns: repeat(7, 27px); gap: 2px; }
  #cpStatLookupModule .cp-sl-calwd { font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; color: var(--muted); text-align: center; line-height: 18px; }
  #cpStatLookupModule .cp-sl-calcell { height: 27px; border-radius: 6px; border: 1px solid transparent; background: transparent; font-family: var(--sans); font-size: var(--fs-xs); color: var(--muted); display: flex; align-items: center; justify-content: center; padding: 0; }
  #cpStatLookupModule .cp-sl-calcell.in-range { background: rgba(196, 30, 58, 0.10); }
  #cpStatLookupModule .cp-sl-calcell.is-game { background: rgba(255, 255, 255, 0.9); border-color: rgba(196, 30, 58, 0.35); color: var(--ink); font-weight: 700; cursor: pointer; transition: background 0.16s ease; }
  #cpStatLookupModule .cp-sl-calcell.is-game:hover { background: rgba(196, 30, 58, 0.18); }
  #cpStatLookupModule .cp-sl-calcell.is-game.in-range { background: rgba(196, 30, 58, 0.22); }
  #cpStatLookupModule .cp-sl-calcell.is-edge { background: linear-gradient(180deg, #cc314b, #ad1b34); color: #ffffff; border-color: transparent; }

  /* ---------- Player card (Top 30 styling) ---------- */
  #cpStatLookupModule .cp-sl-player {
    position: relative; display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: 24px;
    align-items: center; padding: 22px; border-radius: 20px;
    background: #fffdf8;
    border: 1px solid var(--line);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08), 0 1px 0 rgba(255, 255, 255, 0.9) inset;
    margin: 18px 0 18px; overflow: hidden;
  }
  /* Accent bar removed per design — cleaner card edge. */
  #cpStatLookupModule .cp-sl-player.cp-medal-1 { border-color: rgba(227, 185, 74, 0.6); }
  #cpStatLookupModule .cp-sl-player.cp-medal-2 { border-color: rgba(176, 181, 194, 0.65); }
  #cpStatLookupModule .cp-sl-player.cp-medal-3 { border-color: rgba(205, 129, 68, 0.6); }
  #cpStatLookupModule .cp-sl-player.cp-medal-1::after,
  #cpStatLookupModule .cp-sl-player.cp-medal-2::after,
  #cpStatLookupModule .cp-sl-player.cp-medal-3::after { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: 18px; }
  #cpStatLookupModule .cp-sl-player.cp-medal-1::after { box-shadow: inset 0 0 0 1px rgba(227, 185, 74, 0.4), inset 0 0 26px rgba(227, 185, 74, 0.12); }
  #cpStatLookupModule .cp-sl-player.cp-medal-2::after { box-shadow: inset 0 0 0 1px rgba(176, 181, 194, 0.45), inset 0 0 26px rgba(176, 181, 194, 0.12); }
  #cpStatLookupModule .cp-sl-player.cp-medal-3::after { box-shadow: inset 0 0 0 1px rgba(205, 129, 68, 0.4), inset 0 0 26px rgba(205, 129, 68, 0.12); }

  #cpStatLookupModule .cp-sl-photo {
    position: relative; width: 168px; height: 168px; border-radius: 16px; overflow: hidden;
    background: radial-gradient(circle at 26% 16%, rgba(255, 255, 255, 0.55), transparent 34%),
      linear-gradient(180deg, var(--sky-light) 0%, var(--sky-mid) 56%, var(--sky) 100%);
    border: 4px solid #ffffff;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.14), inset 0 0 0 1px rgba(0, 0, 0, 0.05); align-self: center;
  }
  #cpStatLookupModule .cp-sl-photo img {
    width: 100%; height: 100%; object-fit: contain; object-position: center bottom;
    filter: saturate(1.02) drop-shadow(0 10px 8px rgba(0, 0, 0, 0.18));
  }
  #cpStatLookupModule .cp-sl-rankbadge {
    position: absolute; top: 8px; left: 8px; padding: 4px 8px 5px; border-radius: 7px;
    background: linear-gradient(180deg, #cc314b, #ad1b34); border: 1px solid rgba(0, 0, 0, 0.12);
    color: #fff; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.02em; z-index: 2;
  }
  #cpStatLookupModule .cp-sl-rankbadge.cp-rank-gold { background: linear-gradient(180deg, #f7dd7f, #c9962a); color: #402e06; }
  #cpStatLookupModule .cp-sl-rankbadge.cp-rank-silver { background: linear-gradient(180deg, #f0f1f5, #a4a9b6); color: #2b2e36; }
  #cpStatLookupModule .cp-sl-rankbadge.cp-rank-bronze { background: linear-gradient(180deg, #ecb27e, #a8642f); color: #3a2008; }
  #cpStatLookupModule .cp-sl-mlb-chip {
    position: absolute; bottom: 6px; right: 6px; padding: 3px 7px 4px; border-radius: 6px;
    background: rgba(20, 20, 20, 0.86); color: #fffdf8; font-family: var(--sans);
    font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase; z-index: 2;
  }

  #cpStatLookupModule .cp-sl-player-body { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
  #cpStatLookupModule .cp-sl-player-name { margin: 0 0 10px; font-family: var(--serif); font-size: clamp(24px, 3.4vw, 34px); font-weight: 900; line-height: 1.02; letter-spacing: -0.01em; }
  #cpStatLookupModule .cp-sl-player-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 14px; }

  #cpStatLookupModule .cp-sl-tag {
    padding: 6px 11px; border-radius: 999px; background: #f4f1ea;
    border: 1px solid var(--line-soft); font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800;
    letter-spacing: 0.03em; color: var(--ink);
  }
  #cpStatLookupModule .cp-sl-tag.cp-sl-level { color: var(--red-dark); background: rgba(196, 30, 58, 0.07); border-color: rgba(196, 30, 58, 0.22); }
  #cpStatLookupModule .cp-sl-tag.cp-sl-team { color: #0f5175; background: rgba(137, 207, 240, 0.14); border-color: rgba(137, 207, 240, 0.6); }

  /* Two-way switch. An empty [data-twoway] slot must take no vertical room —
     it is present in every player's header and shown for almost none. */
  #cpStatLookupModule .cp-sl-twoway-slot:empty { display: none; }
  #cpStatLookupModule .cp-sl-twoway {
    display: inline-flex; align-items: center; gap: 2px; margin-bottom: 14px;
    padding: 3px; border-radius: 999px; background: #f4f1ea; border: 1px solid var(--line-soft);
  }
  #cpStatLookupModule .cp-sl-twoway em {
    font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; font-style: normal;
    letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); padding: 0 8px 0 6px;
  }
  #cpStatLookupModule .cp-sl-twoway button {
    padding: 5px 12px; border: 0; border-radius: 999px; background: transparent; cursor: pointer;
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; letter-spacing: 0.03em; color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-twoway button:hover { color: var(--ink); }
  #cpStatLookupModule .cp-sl-twoway button.is-active { background: var(--red-dark); color: #fff; }

  #cpStatLookupModule .cp-sl-bio { display: grid; grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 11px 20px; }
  #cpStatLookupModule .cp-sl-bio-item { font-family: var(--sans); font-size: var(--fs-sm); line-height: 1.35; color: var(--ink); }
  #cpStatLookupModule .cp-sl-bio-item strong {
    display: block; font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-bottom: 2px;
  }

  #cpStatLookupModule .cp-sl-links { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
  #cpStatLookupModule .cp-sl-link {
    display: inline-flex; align-items: center; padding: 8px 12px; border-radius: 999px;
    border: 1px solid var(--line); background: rgba(255, 255, 255, 0.92); color: var(--red);
    text-decoration: none; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900;
    letter-spacing: 0.05em; text-transform: uppercase; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.05);
    transition: transform 0.16s ease, color 0.16s ease, border-color 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-link:hover { color: var(--red-dark); border-color: rgba(196, 30, 58, 0.5); transform: translateY(-1px); }

  /* ---------- Section ---------- */
  #cpStatLookupModule .cp-sl-section { margin-bottom: 22px; }
  #cpStatLookupModule .cp-sl-section-header { display: flex; align-items: baseline; gap: 14px; margin: 0 0 12px; }
  #cpStatLookupModule .cp-sl-section-title { font-family: var(--serif); font-size: var(--fs-xl); font-weight: 900; white-space: nowrap; }
  #cpStatLookupModule .cp-sl-section-rule { flex: 1; border-bottom: 2px dashed rgba(0, 0, 0, 0.22); transform: translateY(-4px); }
  #cpStatLookupModule .cp-sl-rangeline {
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.1em;
    text-transform: uppercase; color: var(--red-dark); margin: 0 0 12px;
  }

  /* ---------- Defense ----------
     The chip row is the headline of the section: the positions the player
     actually stood at, most-played first. Wraps rather than scrolls — a
     utility man with five of them still has to read on a phone. */
  #cpStatLookupModule .cp-sl-defcontrols { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 0 0 12px; }
  #cpStatLookupModule .cp-sl-defcontrols label { display: inline-flex; align-items: center; gap: 7px; }
  #cpStatLookupModule .cp-sl-defsummary { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 11px; }
  #cpStatLookupModule .cp-sl-defchip {
    display: inline-flex; align-items: baseline; gap: 6px;
    padding: 5px 10px 6px; border-radius: 999px;
    background: rgba(196, 30, 58, 0.07); border: 1px solid rgba(196, 30, 58, 0.22);
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 700; color: var(--ink);
    letter-spacing: 0.04em; white-space: nowrap;
  }
  #cpStatLookupModule .cp-sl-defchip b {
    font-size: var(--fs-sm); font-weight: 900; letter-spacing: 0.08em; color: var(--red-dark);
  }

  /* ---------- Stat tiles ---------- */
  #cpStatLookupModule .cp-sl-statgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; }
  #cpStatLookupModule .cp-sl-stat {
    position: relative; display: block;
    padding: 13px 8px; border-radius: 12px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 247, 244, 0.98));
    border: 1px solid var(--line-soft); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65); text-align: center;
  }
  #cpStatLookupModule .cp-sl-stat strong { display: block; font-family: var(--serif); font-size: var(--fs-xl); font-weight: 900; letter-spacing: -0.02em; }
  /* A tile that opens its clips. Same card, plus a hover state — the row of
     tiles has to stay a row of numbers, not a row of buttons. */
  #cpStatLookupModule a.cp-sl-stat-clip { text-decoration: none; color: inherit; cursor: pointer; transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease; }
  #cpStatLookupModule a.cp-sl-stat-clip:hover { border-color: rgba(196,30,58,0.55); box-shadow: 0 4px 12px rgba(196,30,58,0.14); transform: translateY(-1px); }
  #cpStatLookupModule a.cp-sl-stat-clip span { color: var(--red-dark); }
  /* Faint but always there — without a resting cue nobody discovers that four
     of the tiles open video, and a row of tiles where only some are links has
     to say which. */
  #cpStatLookupModule a.cp-sl-stat-clip::after { content: "▸"; position: absolute; top: 5px; right: 7px; font-size: var(--fs-micro); color: var(--red); opacity: .32; transition: opacity .14s ease; }
  #cpStatLookupModule a.cp-sl-stat-clip:hover::after { opacity: 1; }
  #cpStatLookupModule .cp-sl-stat span {
    display: block; margin-top: 4px; font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900;
    letter-spacing: 0.1em; text-transform: uppercase; color: var(--red-dark);
  }

  /* Level-relative tiles (OPS+ / ERA+) read as derived, not as a raw stat. */
  #cpStatLookupModule .cp-sl-stat-ctx {
    background: linear-gradient(180deg, rgba(137, 207, 240, 0.20), rgba(216, 243, 255, 0.30));
    border-color: rgba(58, 102, 176, 0.30); cursor: help;
  }
  #cpStatLookupModule .cp-sl-stat-ctx span { color: #2c5c8a; }

  /* League baseline line under the season grid */
  #cpStatLookupModule .cp-sl-leagueline {
    margin: 12px 0 0; font-family: var(--sans); font-size: var(--fs-sm); color: var(--muted);
    padding: 7px 10px; border-radius: 8px; background: rgba(0, 0, 0, 0.025);
  }
  #cpStatLookupModule .cp-sl-leagueline strong { color: var(--ink); }
  #cpStatLookupModule .cp-sl-leagueline.is-loading { opacity: 0.6; font-style: italic; }
  #cpStatLookupModule .cp-sl-leagueline-row { display: block; margin-top: 3px; padding-left: 10px; }
  #cpStatLookupModule .cp-sl-leagueline-row strong { display: inline-block; min-width: 34px; }

  /* Age relative to level */
  #cpStatLookupModule .cp-sl-bio-age { cursor: help; }
  #cpStatLookupModule .cp-sl-agedelta {
    display: inline-block; margin-left: 4px; padding: 1px 6px; border-radius: 999px;
    font-size: var(--fs-xs); font-weight: 700; background: rgba(0, 0, 0, 0.06); color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-bio-age.is-young .cp-sl-agedelta { background: rgba(196, 30, 58, 0.12); color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-bio-age.is-old .cp-sl-agedelta { background: rgba(58, 102, 176, 0.14); color: #2c5c8a; }

  /* "Show more stats" toggle + collapsible extra-stats block */
  #cpStatLookupModule .cp-sl-moretoggle-wrap { display: flex; justify-content: center; margin: 14px 0 0; }
  #cpStatLookupModule .cp-sl-moretoggle {
    height: 32px; padding: 0 16px; border-radius: 999px; cursor: pointer;
    border: 1px solid rgba(196, 30, 58, 0.28); background: rgba(255, 255, 255, 0.9);
    font-family: var(--sans); font-size: var(--fs-sm); font-weight: 800; color: var(--red-dark);
    transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-moretoggle:hover { border-color: rgba(196, 30, 58, 0.55); background: rgba(196, 30, 58, 0.06); }
  #cpStatLookupModule .cp-sl-moretoggle[aria-expanded="true"] { background: rgba(196, 30, 58, 0.08); }
  #cpStatLookupModule .cp-sl-extra { margin-top: 12px; }
  #cpStatLookupModule .cp-sl-extra[hidden] { display: none; }

  /* Secondary season stats: Basic / Advanced tabs + sub-grid */
  #cpStatLookupModule .cp-sl-stattabs { display: flex; gap: 6px; margin: 0 0 12px; }
  #cpStatLookupModule .cp-sl-stattab {
    height: 32px; padding: 0 16px; border-radius: 999px; cursor: pointer;
    border: 1px solid rgba(0, 0, 0, 0.12); background: rgba(255, 255, 255, 0.9);
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; letter-spacing: 0.04em; color: #555;
    transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-stattab:hover { border-color: rgba(196, 30, 58, 0.5); color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-stattab.is-active { background: linear-gradient(180deg, #cc314b, #ad1b34); border-color: rgba(0, 0, 0, 0.12); color: #fff; }
  #cpStatLookupModule .cp-sl-subgrid { margin-top: 0; }

  /* ---------- Rolling chart ---------- */
  #cpStatLookupModule .cp-sl-chart-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
  #cpStatLookupModule .cp-sl-chart-label { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
  #cpStatLookupModule .cp-sl-statselect {
    height: 34px; padding: 0 30px 0 12px; border-radius: 999px; border: 1px solid rgba(0, 0, 0, 0.12);
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23b91c35' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center, rgba(255, 255, 255, 0.9);
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--ink); appearance: none; -webkit-appearance: none; outline: none; cursor: pointer;
  }
  #cpStatLookupModule .cp-sl-statselect:focus { border-color: rgba(196, 30, 58, 0.55); box-shadow: 0 0 0 3px rgba(196, 30, 58, 0.12); }
  #cpStatLookupModule .cp-sl-splityearselect { height: 38px; margin-left: 6px; }
  #cpStatLookupModule .cp-sl-window { display: inline-flex; gap: 4px; }
  #cpStatLookupModule .cp-sl-window button {
    height: 34px; padding: 0 11px; border-radius: 999px; border: 1px solid rgba(0, 0, 0, 0.12);
    background: rgba(255, 255, 255, 0.9); font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900;
    letter-spacing: 0.06em; color: #444; cursor: pointer; transition: all 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-window button.is-active { background: linear-gradient(180deg, var(--sky-light), var(--sky-mid)); border-color: rgba(15, 61, 87, 0.3); color: #0f3d57; }

  #cpStatLookupModule .cp-sl-chartwrap {
    padding: 16px 12px 10px; border-radius: 14px;
    background: linear-gradient(180deg, #fffdf8, #f7f4ec); border: 1px solid var(--line);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.7);
  }
  #cpStatLookupModule .cp-sl-chart-svg { width: 100%; height: auto; display: block; }
  #cpStatLookupModule .cp-sl-chart-line { fill: none; stroke: var(--red); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
  #cpStatLookupModule .cp-sl-chart-area { fill: rgba(196, 30, 58, 0.08); stroke: none; }
  #cpStatLookupModule .cp-sl-chart-dot { fill: #fffdf8; stroke: var(--red); stroke-width: 2; }
  #cpStatLookupModule .cp-sl-chart-grid { stroke: rgba(0, 0, 0, 0.08); stroke-width: 1; }
  #cpStatLookupModule .cp-sl-chart-text { font-family: var(--sans); font-size: var(--fs-micro); font-weight: 700; fill: var(--muted); }
  #cpStatLookupModule .cp-sl-chart-avg { stroke: rgba(137, 207, 240, 0.9); stroke-width: 1.5; stroke-dasharray: 5 4; }
  #cpStatLookupModule .cp-sl-chart-cap { margin-top: 8px; font-family: var(--sans); font-size: var(--fs-xs); color: var(--muted); text-align: center; }

  /* ---------- Game log ---------- */
  #cpStatLookupModule .cp-sl-tablewrap { overflow-x: auto; border-radius: 13px; border: 1px solid var(--line); box-shadow: 0 5px 14px rgba(0, 0, 0, 0.05); }
  #cpStatLookupModule table { width: 100%; border-collapse: collapse; background: linear-gradient(180deg, #fffdf8, #f7f4ec); font-family: var(--sans); font-size: var(--fs-base); }
  #cpStatLookupModule thead th {
    background: rgba(137, 207, 240, 0.18); color: var(--red-dark); font-size: var(--fs-micro); font-weight: 900;
    letter-spacing: 0.08em; text-transform: uppercase; padding: 9px 10px; text-align: right;
    white-space: nowrap; border-bottom: 1px solid var(--line);
  }
  #cpStatLookupModule thead th:first-child, #cpStatLookupModule tbody td:first-child { text-align: left; }
  #cpStatLookupModule tbody td { padding: 9px 10px; text-align: right; white-space: nowrap; color: var(--ink); border-bottom: 1px solid var(--line-soft); font-variant-numeric: tabular-nums; }
  #cpStatLookupModule tbody tr:last-child td { border-bottom: 0; }
  #cpStatLookupModule tbody tr:nth-child(even) td { background: rgba(255, 255, 255, 0.5); }
  #cpStatLookupModule tbody td a { color: var(--red); font-weight: 900; text-decoration: none; }
  #cpStatLookupModule tbody td a:hover { color: var(--red-dark); text-decoration: underline; }

  /* ---------- States ---------- */
  #cpStatLookupModule .cp-sl-msg, #cpStatLookupModule .cp-sl-error, #cpStatLookupModule .cp-sl-empty {
    text-align: center; font-family: var(--serif); font-size: var(--fs-lg); padding: 40px 20px; color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-error { color: var(--ink); }
  #cpStatLookupModule .cp-sl-empty { border: 2px dashed rgba(0, 0, 0, 0.22); border-radius: 14px; background: rgba(255, 255, 255, 0.5); font-size: var(--fs-base); padding: 22px; }

  /* ---------- Player comparison ---------- */
  /* One light sheet. The module's base text colour is --ink, which assumes a
     light surface; every other view keeps its content inside light panels, so
     a bare comparison put its title and note as dark-on-dark on the host page. */
  #cpStatLookupModule .cp-cmp {
    animation: cpSkelFadeIn 0.28s ease;
    background: linear-gradient(180deg, #fffdf8, #f6f2ea);
    border: 1px solid var(--line); border-radius: 18px;
    padding: 18px 18px 22px; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.07);
  }
  #cpStatLookupModule .cp-cmp-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
  /* One shared date range for every column. Sits under the title row so the
     window it applies to reads as belonging to the whole comparison. */
  #cpStatLookupModule .cp-cmp-range {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 14px;
    padding: 10px 12px; border: 1px solid var(--line-soft); border-radius: 12px; background: rgba(255, 255, 255, 0.72);
  }
  #cpStatLookupModule .cp-cmp-rangelabel {
    margin-left: auto; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900;
    letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted);
  }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-range { gap: 6px; padding: 9px 10px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-rangelabel { margin-left: 0; flex-basis: 100%; }
  #cpStatLookupModule .cp-cmp-title {
    margin: 0; flex: 1 1 auto; text-align: center; font-family: var(--serif);
    font-size: var(--fs-2xl); font-weight: 900; color: var(--ink); letter-spacing: -0.01em;
  }
  /* Column count is set inline per render so 2 and 3 players lay out the same. */
  #cpStatLookupModule .cp-cmp-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; align-items: stretch; }
  #cpStatLookupModule .cp-cmp-card {
    position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px;
    padding: 14px 12px; border-radius: 14px; border: 1px solid var(--line);
    background: #ffffff; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
    text-align: center;
  }
  #cpStatLookupModule .cp-cmp-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
  /* Headshot assets are natively 240x361 (2:3), so this ratio shows them uncropped. */
  #cpStatLookupModule .cp-cmp-photo { width: 104px; height: 156px; object-fit: cover; border-radius: 12px; background: rgba(0, 0, 0, 0.05); }
  #cpStatLookupModule .cp-cmp-name { font-family: var(--serif); font-size: var(--fs-lg); font-weight: 900; color: var(--ink); line-height: 1.2; }
  #cpStatLookupModule .cp-cmp-name a { color: inherit; text-decoration: none; }
  #cpStatLookupModule .cp-cmp-name a:hover { color: var(--red-dark); text-decoration: underline; }
  #cpStatLookupModule .cp-cmp-rank {
    display: inline-block; margin-right: 5px; padding: 1px 7px; border-radius: 999px;
    background: rgba(196, 30, 58, 0.12); color: var(--red-dark); font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900;
  }
  #cpStatLookupModule .cp-cmp-meta { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); line-height: 1.4; }
  #cpStatLookupModule .cp-cmp-lvl { display: flex; align-items: center; gap: 6px; margin-top: 4px; }
  #cpStatLookupModule .cp-cmp-lvl span { font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); }
  #cpStatLookupModule .cp-cmp-lvl select {
    height: 26px; border-radius: 999px; border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.95); font-family: var(--sans); font-size: var(--fs-xs); color: var(--ink); padding: 0 6px;
  }
  #cpStatLookupModule .cp-cmp-remove {
    position: absolute; top: 6px; right: 8px; border: 0; background: none; cursor: pointer;
    font-size: var(--fs-xl); line-height: 1; color: var(--muted); padding: 2px 4px;
  }
  #cpStatLookupModule .cp-cmp-remove:hover { color: var(--red-dark); }
  #cpStatLookupModule .cp-cmp-addcard { justify-content: center; border-style: dashed; background: rgba(255, 255, 255, 0.45); }
  #cpStatLookupModule .cp-cmp-addtitle { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); }
  #cpStatLookupModule .cp-cmp-addinput {
    width: 100%; height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line);
    background: #fff; font-family: var(--sans); font-size: var(--fs-sm); color: var(--ink); outline: none;
  }
  #cpStatLookupModule .cp-cmp-addinput:focus { border-color: rgba(196, 30, 58, 0.55); box-shadow: 0 0 0 3px rgba(196, 30, 58, 0.12); }
  #cpStatLookupModule .cp-cmp-addresults { width: 100%; display: flex; flex-direction: column; gap: 2px; max-height: 190px; overflow-y: auto; }
  #cpStatLookupModule .cp-cmp-addresults[hidden] { display: none; }
  #cpStatLookupModule .cp-cmp-addresults button {
    display: flex; flex-direction: column; align-items: flex-start; gap: 1px; width: 100%;
    padding: 6px 9px; border: 1px solid transparent; border-radius: 8px; background: none; cursor: pointer;
    font-family: var(--sans); font-size: var(--fs-sm); font-weight: 700; color: var(--ink); text-align: left;
  }
  #cpStatLookupModule .cp-cmp-addresults button:hover { background: rgba(196, 30, 58, 0.07); border-color: rgba(196, 30, 58, 0.3); }
  #cpStatLookupModule .cp-cmp-addresults button span { font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); }
  #cpStatLookupModule .cp-cmp-addempty { padding: 6px 4px; font-family: var(--sans); font-size: var(--fs-sm); color: var(--muted); }
  #cpStatLookupModule .cp-cmp-outside { font-style: normal; color: #2c5c8a; background: rgba(58, 102, 176, 0.12); border-radius: 999px; padding: 0 5px; margin-left: 3px; }
  #cpStatLookupModule .cp-cmp-orgtag { font-style: normal; color: #2c5c8a; }
  #cpStatLookupModule .cp-cmp-note { margin: 0 0 14px; font-family: var(--sans); font-size: var(--fs-sm); line-height: 1.5; color: var(--muted); padding: 9px 12px; border-radius: 10px; background: rgba(0, 0, 0, 0.025); }
  #cpStatLookupModule .cp-cmp-note p { margin: 0 0 5px; }
  #cpStatLookupModule .cp-cmp-note p:last-child { margin-bottom: 0; }
  #cpStatLookupModule .cp-cmp-note strong { color: var(--ink); }
  #cpStatLookupModule .cp-cmp-note.is-warn { background: rgba(196, 30, 58, 0.07); color: var(--red-dark); }
  #cpStatLookupModule .cp-cmp-table { min-width: 100%; font-size: var(--fs-base); }
  #cpStatLookupModule .cp-cmp-table col.cp-cmp-colstat { width: 178px; }
  #cpStatLookupModule .cp-cmp-table th, #cpStatLookupModule .cp-cmp-table td { padding: 9px 10px; white-space: nowrap; }
  /* Statcast block: same table, its own titled section so it reads as an
     addition to the season line rather than more of the same rows. */
  #cpStatLookupModule .cp-cmp-scblock { margin-top: 20px; padding-top: 16px; border-top: 1px dashed rgba(0, 0, 0, 0.16); }
  #cpStatLookupModule .cp-cmp-sctitle {
    display: flex; align-items: baseline; gap: 9px; margin: 0 0 10px;
    font-family: var(--serif); font-size: var(--fs-lg); font-weight: 900; color: var(--ink);
  }
  #cpStatLookupModule .cp-cmp-sctitle span {
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.09em;
    text-transform: uppercase; color: var(--muted);
  }
  #cpStatLookupModule .cp-cmp-sclvl {
    display: block; margin-top: 2px; font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900;
    letter-spacing: 0.08em; text-transform: uppercase; color: var(--red-dark);
  }
  #cpStatLookupModule .cp-cmp-sclvl.is-none { color: var(--muted); }
  #cpStatLookupModule .cp-cmp-table thead th { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; }
  #cpStatLookupModule .cp-cmp-table th[scope="row"] {
    text-align: left; background: rgba(137, 207, 240, 0.10); color: var(--ink);
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.05em;
    text-transform: uppercase; white-space: nowrap; padding: 8px 10px; position: sticky; left: 0; z-index: 1;
  }
  #cpStatLookupModule .cp-cmp-table td { text-align: center; font-variant-numeric: tabular-nums; }
  #cpStatLookupModule .cp-cmp-table thead th { text-align: center; }
  #cpStatLookupModule .cp-cmp-table thead th:first-child { text-align: left; }
  #cpStatLookupModule .cp-cmp-table td.is-best { background: rgba(26, 127, 55, 0.13); color: #14622c; font-weight: 900; }
  #cpStatLookupModule .cp-cmp-table tr.cp-cmp-ctxrow td { background: rgba(137, 207, 240, 0.13); font-weight: 900; }
  #cpStatLookupModule .cp-cmp-table tr.cp-cmp-ctxrow td.is-best { background: rgba(26, 127, 55, 0.18); }
  #cpStatLookupModule .cp-cmp-table tr.cp-cmp-ctxrow th[scope="row"] { cursor: help; }
  #cpStatLookupModule .cp-cmp-table th.cp-cmp-keepcase { text-transform: none; font-size: var(--fs-sm); }
  #cpStatLookupModule .cp-cmp-table tr.cp-cmp-pendrow th[scope="row"],
  #cpStatLookupModule .cp-cmp-table tr.cp-cmp-pendrow td { opacity: 0.55; }
  #cpStatLookupModule .cp-cmp-pendtag {
    display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 999px;
    background: rgba(0, 0, 0, 0.06); color: var(--muted);
    font-size: var(--fs-micro); font-weight: 800; letter-spacing: 0.04em; text-transform: none;
  }
  /* Marks the rows the 162-game pace actually scaled. Deliberately louder than
     the pending tag — it changes what the number means, not just when it lands. */
  #cpStatLookupModule .cp-cmp-pacetag {
    display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 999px;
    background: rgba(196, 30, 58, 0.12); color: var(--red-dark, #a01829);
    font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.04em; text-transform: none;
  }
  #cpStatLookupModule .cp-cmp-loading { font-style: italic; color: var(--red-dark, #a01829); font-weight: 700; }
  #cpStatLookupModule .cp-sl-comparebtn { cursor: pointer; font-family: var(--sans); }
  /* ---------- Comparison on a phone ----------
     Two players plus the add-card were three tracks inside 375px: every name
     broke over two lines, the meta over four, and the add-card's input was cut
     off mid-placeholder. The players keep the grid; adding moves below them as
     a full-width strip, and the chrome above shrinks to chip scale. */
  #cpStatLookupModule.cp-is-mobile .cp-cmp { padding: 14px 12px 18px; border-radius: 14px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-top { gap: 8px; margin-bottom: 12px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-title { flex-basis: 100%; order: -1; font-size: var(--fs-xl); }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-actions { gap: 6px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-top .cp-sl-chip,
  #cpStatLookupModule.cp-is-mobile .cp-cmp-range .cp-sl-chip {
    height: 28px; padding: 0 9px; font-size: var(--fs-micro); letter-spacing: 0.04em;
  }

  /* The two dates share a row instead of each claiming one. */
  #cpStatLookupModule.cp-is-mobile .cp-cmp-range .cp-sl-date { flex: 1 1 90px; min-width: 0; font-size: var(--fs-xs); padding: 0 6px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-range .cp-sl-customto { font-size: var(--fs-micro); letter-spacing: 0.05em; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-rangelabel { font-size: var(--fs-micro); }

  /* The inline grid-template-columns is written per render (2 or 3 tracks), so
     the phone override has to outrank it. */
  #cpStatLookupModule.cp-is-mobile .cp-cmp-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px;
  }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-card { padding: 10px 8px 11px; gap: 4px; border-radius: 12px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-photo { width: 84px; height: 126px; border-radius: 10px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-name { font-size: var(--fs-base); }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-meta { font-size: var(--fs-micro); letter-spacing: 0.03em; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-lvl { margin-top: 2px; gap: 4px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-lvl span { font-size: var(--fs-micro); }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-lvl select { font-size: var(--fs-xs); padding: 2px 4px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-rank { font-size: var(--fs-micro); padding: 1px 5px; }

  /* Add-a-player becomes one horizontal strip under the cards, so its input is
     as wide as the page rather than a third of it. */
  #cpStatLookupModule.cp-is-mobile .cp-cmp-addcard {
    grid-column: 1 / -1;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 9px 11px;
    text-align: left;
  }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-addcard .cp-cmp-addtitle { flex: 0 0 auto; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-addcard .cp-cmp-addinput { flex: 1 1 120px; width: auto; min-width: 0; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-addcard .cp-cmp-addresults { flex-basis: 100%; max-height: 160px; }

  /* The stat column was 178px of a ~330px content width. Narrower, tighter, and
     genuinely opaque — it was already sticky, but over a translucent blue, so
     the scrolled columns showed straight through it. */
  #cpStatLookupModule.cp-is-mobile .cp-cmp-table { font-size: var(--fs-sm); }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-table col.cp-cmp-colstat { width: 104px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-table th,
  #cpStatLookupModule.cp-is-mobile .cp-cmp-table td { padding: 6px 8px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-table th[scope="row"] {
    font-size: var(--fs-micro); padding: 6px 8px; background: #f1f0e9; box-shadow: 1px 0 0 rgba(0, 0, 0, 0.09);
  }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-table thead th { font-size: var(--fs-micro); padding: 7px 8px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-table thead th:first-child {
    position: sticky; left: 0; z-index: 3; background: #e3eef5; box-shadow: 1px 0 0 rgba(0, 0, 0, 0.09);
  }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-table th.cp-cmp-keepcase { font-size: var(--fs-xs); }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-note { font-size: var(--fs-sm); padding: 8px 10px; margin-bottom: 12px; }
  #cpStatLookupModule.cp-is-mobile .cp-cmp-scblock { margin-top: 16px; padding-top: 13px; }

  /* ---------- Skeleton loading placeholders ---------- */
  #cpStatLookupModule .cp-skel { padding: 14px 12px; }
  #cpStatLookupModule .cp-skel-bar, #cpStatLookupModule .cp-skel-block {
    position: relative; overflow: hidden; border-radius: 8px; background: rgba(0, 0, 0, 0.07);
  }
  #cpStatLookupModule .cp-skel-bar::after, #cpStatLookupModule .cp-skel-block::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(90deg, transparent 20%, rgba(255, 255, 255, 0.65) 50%, transparent 80%);
    transform: translateX(-100%); animation: cpSkelShimmer 1.4s ease-in-out infinite;
  }
  @keyframes cpSkelShimmer { to { transform: translateX(100%); } }
  #cpStatLookupModule .cp-skel-bar { height: 15px; margin: 9px 0; }
  #cpStatLookupModule .cp-skel-bar.is-head { height: 19px; width: 42%; margin-bottom: 14px; background: rgba(0, 0, 0, 0.10); }
  #cpStatLookupModule .cp-skel-block { height: 260px; margin: 8px 0; }
  #cpStatLookupModule .cp-skel-row { display: flex; gap: 10px; }
  #cpStatLookupModule .cp-skel-row .cp-skel-bar { flex: 1 1 auto; }
  #cpStatLookupModule .cp-skel-fadein { animation: cpSkelFadeIn 0.28s ease; }
  @keyframes cpSkelFadeIn { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-motion: reduce) {
    #cpStatLookupModule .cp-skel-bar::after, #cpStatLookupModule .cp-skel-block::after { animation: none; }
    #cpStatLookupModule .cp-skel-fadein { animation: none; }
  }
  /* Sections fade in as they replace their skeletons. */
  #cpStatLookupModule .cp-sl-chart-panel, #cpStatLookupModule .cp-sl-splitblock { animation: cpSkelFadeIn 0.28s ease; }
  @media (prefers-reduced-motion: reduce) {
    #cpStatLookupModule .cp-sl-chart-panel, #cpStatLookupModule .cp-sl-splitblock { animation: none; }
  }
  /* While a game is live these sections are rebuilt every 20 seconds, and
     replaying the entrance fade on each poll is what reads as the page
     flickering. The fade is an arrival cue, not a refresh cue. */
  #cpStatLookupModule.cp-is-live .cp-sl-chart-panel,
  #cpStatLookupModule.cp-is-live .cp-sl-splitblock { animation: none; }

  #cpStatLookupModule .cp-sl-lvlfilter.cp-sl-presets { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid rgba(0, 0, 0, 0.08); }
  #cpStatLookupModule .cp-sl-lvlfilter.cp-sl-presets[hidden] { display: none; }

  /* ---------- Mobile ---------- */
  #cpStatLookupModule.cp-is-mobile .cp-sl-player { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-player-meta, #cpStatLookupModule.cp-is-mobile .cp-sl-links, #cpStatLookupModule.cp-is-mobile .cp-sl-bio { justify-content: center; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-bio { grid-template-columns: repeat(2, 1fr); text-align: left; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-statgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  @media (prefers-reduced-motion: reduce) {
    #cpStatLookupModule *, #cpStatLookupModule *::before, #cpStatLookupModule *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
  }
  /* ---------- Header topline + ranking pill ---------- */
  #cpStatLookupModule .cp-sl-player-topline { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
  #cpStatLookupModule .cp-sl-player-topline .cp-sl-player-name { margin: 0; }
  #cpStatLookupModule .cp-sl-rankpill {
    font-weight: 900; color: #fff; border: 1px solid rgba(0,0,0,0.14);
    background: linear-gradient(180deg, #cc314b, #ad1b34); letter-spacing: 0.04em;
  }
  #cpStatLookupModule .cp-sl-rankpill.cp-rank-gold { background: linear-gradient(180deg, #f7dd7f, #c9962a); color: #402e06; }
  #cpStatLookupModule .cp-sl-rankpill.cp-rank-silver { background: linear-gradient(180deg, #f0f1f5, #a4a9b6); color: #2b2e36; }
  #cpStatLookupModule .cp-sl-rankpill.cp-rank-bronze { background: linear-gradient(180deg, #ecb27e, #a8642f); color: #3a2008; }

  /* ---------- Level filter chips ---------- */
  #cpStatLookupModule .cp-sl-lvlfilter { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
  #cpStatLookupModule .cp-sl-lvlchip {
    height: 30px; padding: 0 12px; border-radius: 999px; border: 1px solid rgba(0,0,0,0.12);
    background: rgba(255,255,255,0.9); font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900;
    letter-spacing: 0.06em; text-transform: uppercase; color: #555; cursor: pointer;
    transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-lvlchip:hover { border-color: rgba(196,30,58,0.5); color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-lvlchip.is-active { background: linear-gradient(180deg, #cc314b, #ad1b34); border-color: rgba(0,0,0,0.12); color: #fff; }

  /* ---------- Career stats table ---------- */
  #cpStatLookupModule .cp-sl-careerwrap { max-height: 460px; overflow: auto; }
  #cpStatLookupModule .cp-sl-careertable,
  #cpStatLookupModule .cp-sl-deftable { font-size: var(--fs-sm); }
  #cpStatLookupModule .cp-sl-careertable th, #cpStatLookupModule .cp-sl-careertable td,
  #cpStatLookupModule .cp-sl-deftable th, #cpStatLookupModule .cp-sl-deftable td { padding: 6px 8px; white-space: nowrap; }
  #cpStatLookupModule .cp-sl-careertable thead th,
  #cpStatLookupModule .cp-sl-deftable thead th { position: sticky; top: 0; z-index: 1; }
  #cpStatLookupModule .cp-sl-careertable tbody td,
  #cpStatLookupModule .cp-sl-deftable tbody td { text-align: right; }
  #cpStatLookupModule .cp-sl-careertable tbody td:nth-child(-n+4) { text-align: left; }
  /* Expander, Pos, Lvl. */
  #cpStatLookupModule .cp-sl-deftable tbody td:nth-child(-n+3) { text-align: left; }
  #cpStatLookupModule .cp-sl-careertable .cp-sl-subtotal td { background: rgba(137,207,240,0.14); font-weight: 900; }
  #cpStatLookupModule .cp-sl-careertable .cp-sl-total td { background: rgba(196,30,58,0.1); font-weight: 900; border-top: 2px solid rgba(196,30,58,0.3); }

  /* ---------- Compact game log ---------- */
  #cpStatLookupModule .cp-sl-gamelog { font-size: var(--fs-sm); }
  #cpStatLookupModule .cp-sl-gamelog th, #cpStatLookupModule .cp-sl-gamelog td { padding: 7px 9px; white-space: nowrap; }
  #cpStatLookupModule .cp-sl-gamelog td.cp-sl-num, #cpStatLookupModule .cp-sl-gamelog th.cp-sl-num { text-align: right; font-variant-numeric: tabular-nums; }
  /* A cell carrying a title tooltip — says so rather than hiding the hover. */
  #cpStatLookupModule .cp-sl-hashint { cursor: help; }
  #cpStatLookupModule .cp-sl-gamelog td:first-child, #cpStatLookupModule .cp-sl-gamelog th:first-child { text-align: left; }
  #cpStatLookupModule .cp-sl-gamelog td:nth-child(2), #cpStatLookupModule .cp-sl-gamelog td:nth-child(3) { text-align: left; color: var(--muted); }

  /* ---------- Streak chips (player header) ----------
     Rebuilt August 2026. Streaks were their own section below the fold — first
     four display cards, then four one-line pills — for what is really one fact
     about the player: he is on a run right now. So they moved up beside the
     rolling-form sparkline in the bio block, at chip scale, and only ACTIVE
     streaks are shown. A streak that ended in May is season history; the season
     table and game log already carry it. */
  #cpStatLookupModule .cp-sl-headrow {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 14px;
  }

  #cpStatLookupModule .cp-sl-hdstreaks {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
  }

  #cpStatLookupModule .cp-sl-hdstreaks:empty { display: none; }

  #cpStatLookupModule .cp-sl-hdstreak {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding: 5px 11px 5px 9px;
    border-radius: 999px;
    background: linear-gradient(180deg, #fff6ef, #fdeade);
    border: 1px solid rgba(196, 30, 58, 0.3);
    font-family: var(--sans);
    font-size: var(--fs-xs);
    font-weight: 800;
    letter-spacing: 0.03em;
    color: var(--red-dark);
    animation: cpStreakIn 0.38s cubic-bezier(0.22, 1, 0.36, 1) backwards;
  }

  #cpStatLookupModule .cp-sl-hdstreak b {
    font-family: var(--serif);
    font-size: var(--fs-md);
    font-weight: 900;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }

  #cpStatLookupModule .cp-sl-hdstreak i {
    font-style: normal;
    font-size: var(--fs-micro);
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: rgba(143, 21, 41, 0.72);
  }

  /* The dot is the only thing that says "still running" at this size, so it
     keeps the slow pulse the old cards had. */
  #cpStatLookupModule .cp-sl-hdstreakdot {
    align-self: center;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--red);
    flex: 0 0 auto;
    animation: cpStreakPulse 2s ease-in-out infinite;
  }

  @keyframes cpStreakPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(196, 30, 58, 0.45); }
    55% { box-shadow: 0 0 0 5px rgba(196, 30, 58, 0); }
  }

  @keyframes cpStreakIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
  }

  #cpStatLookupModule .cp-sl-hdstreak:nth-child(2) { animation-delay: 70ms; }

  @media (prefers-reduced-motion: reduce) {
    #cpStatLookupModule .cp-sl-hdstreakdot { animation: none !important; }
    #cpStatLookupModule .cp-sl-hdstreak { animation: none !important; }
  }

  #cpStatLookupModule.cp-is-mobile .cp-sl-player-topline { justify-content: center; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-headrow { justify-content: center; }

  /* ---------- Rank badge (number only, glow for top 3) ---------- */
  #cpStatLookupModule .cp-sl-rankbadge2 {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 38px; height: 30px; padding: 0 10px; border-radius: 9px;
    font-family: var(--serif); font-size: var(--fs-lg); font-weight: 900; letter-spacing: -0.01em;
    border: 1px solid rgba(0,0,0,0.14); box-shadow: 0 3px 8px rgba(0,0,0,0.12);
  }
  #cpStatLookupModule .cp-sl-rankbadge2.cp-rank-plain { background: linear-gradient(180deg, #fffdf8, #ece8df); color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-rankbadge2.cp-rank-gold { background: linear-gradient(180deg, #f7dd7f, #c9962a); color: #402e06; }
  #cpStatLookupModule .cp-sl-rankbadge2.cp-rank-silver { background: linear-gradient(180deg, #f0f1f5, #a4a9b6); color: #2b2e36; }
  #cpStatLookupModule .cp-sl-rankbadge2.cp-rank-bronze { background: linear-gradient(180deg, #ecb27e, #a8642f); color: #3a2008; }
  #cpStatLookupModule .cp-sl-rankbadge2.cp-glow.cp-rank-gold { animation: cpGlowGold 2.4s ease-in-out infinite; }
  #cpStatLookupModule .cp-sl-rankbadge2.cp-glow.cp-rank-silver { animation: cpGlowSilver 2.4s ease-in-out infinite; }
  #cpStatLookupModule .cp-sl-rankbadge2.cp-glow.cp-rank-bronze { animation: cpGlowBronze 2.4s ease-in-out infinite; }
  @keyframes cpGlowGold { 0%,100% { box-shadow: 0 0 6px rgba(247,221,127,0.5), 0 3px 8px rgba(0,0,0,0.12); } 50% { box-shadow: 0 0 16px rgba(247,221,127,0.9), 0 3px 8px rgba(0,0,0,0.12); } }
  @keyframes cpGlowSilver { 0%,100% { box-shadow: 0 0 6px rgba(200,205,215,0.5), 0 3px 8px rgba(0,0,0,0.12); } 50% { box-shadow: 0 0 16px rgba(210,214,224,0.9), 0 3px 8px rgba(0,0,0,0.12); } }
  @keyframes cpGlowBronze { 0%,100% { box-shadow: 0 0 6px rgba(205,129,68,0.5), 0 3px 8px rgba(0,0,0,0.12); } 50% { box-shadow: 0 0 16px rgba(224,150,90,0.9), 0 3px 8px rgba(0,0,0,0.12); } }
  @media (prefers-reduced-motion: reduce) {
    #cpStatLookupModule .cp-sl-rankbadge2.cp-glow { animation: none !important; }
  }

  /* ---------- Season/Custom mode toggle ---------- */
  #cpStatLookupModule .cp-sl-modes { display: flex; gap: 8px; margin: 0 0 12px; flex-wrap: wrap; }

  /* ---------- Live in-game indicator ---------- */
  #cpStatLookupModule .cp-sl-liveline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
  #cpStatLookupModule .cp-sl-live-pill {
    display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px 4px; border-radius: 999px;
    background: linear-gradient(180deg, #cc314b, #ad1b34); color: #fff;
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase;
  }
  #cpStatLookupModule .cp-sl-live-dot {
    width: 7px; height: 7px; border-radius: 999px; background: #fff; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
    animation: cpLivePulse 1.6s ease-in-out infinite;
  }
  @keyframes cpLivePulse {
    0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); opacity: 1; }
    70% { box-shadow: 0 0 0 6px rgba(255, 255, 255, 0); opacity: 0.85; }
    100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); opacity: 1; }
  }
  #cpStatLookupModule .cp-sl-live-ctx { font-family: var(--sans); font-size: var(--fs-sm); font-weight: 800; letter-spacing: 0.02em; color: var(--red-dark); text-transform: none; }
  @media (prefers-reduced-motion: reduce) {
    #cpStatLookupModule .cp-sl-live-dot { animation: none !important; }
  }

  /* ---------- Career expand control + split rows ---------- */
  #cpStatLookupModule .cp-sl-careertable .cp-sl-expandcell,
  #cpStatLookupModule .cp-sl-deftable .cp-sl-expandcell { width: 26px; padding-left: 4px; padding-right: 0; }
  #cpStatLookupModule .cp-sl-expandbtn {
    width: 20px; height: 20px; border-radius: 5px; border: 1px solid rgba(0,0,0,0.14);
    background: rgba(255,255,255,0.9); color: var(--red-dark); font-size: var(--fs-base); font-weight: 900;
    line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
    transition: transform 0.16s ease, background 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-expandbtn.is-open { transform: rotate(90deg); background: rgba(137,207,240,0.25); }
  #cpStatLookupModule .cp-sl-careertable .cp-sl-seasonrow td { font-weight: 700; }
  #cpStatLookupModule .cp-sl-careertable .cp-sl-split td,
  #cpStatLookupModule .cp-sl-deftable .cp-sl-split td { background: rgba(137,207,240,0.07); color: var(--muted); font-size: var(--fs-xs); }
  #cpStatLookupModule .cp-sl-careertable .cp-sl-split td:nth-child(4), 
  #cpStatLookupModule .cp-sl-careertable .cp-sl-split td:nth-child(5) { padding-left: 14px; }


  /* ---------- Splits ---------- */
  #cpStatLookupModule .cp-sl-splitcontrols {
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0 0 12px;
  }
  #cpStatLookupModule .cp-sl-splitchip {
    height: 34px; padding: 0 14px; border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.12); background: rgba(255, 255, 255, 0.9);
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.07em;
    text-transform: uppercase; color: #444; cursor: pointer;
    transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-splitchip:hover { border-color: rgba(196, 30, 58, 0.5); color: var(--red-dark); transform: translateY(-1px); }
  #cpStatLookupModule .cp-sl-splitchip.is-active { background: linear-gradient(180deg, #cc314b, #ad1b34); border-color: rgba(0, 0, 0, 0.12); color: #fff; }
  #cpStatLookupModule .cp-sl-splitgrid {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start;
  }
  #cpStatLookupModule .cp-sl-splitblock {
    min-width: 0; border-radius: 13px; border: 1px solid var(--line);
    background: linear-gradient(180deg, #fffdf8, #f7f4ec);
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.05); overflow: hidden;
  }
  #cpStatLookupModule .cp-sl-splitblock-title {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 10px 12px; border-bottom: 1px solid var(--line-soft);
    background: rgba(137, 207, 240, 0.14);
  }
  #cpStatLookupModule .cp-sl-splitblock-title strong {
    font-family: var(--serif); font-size: var(--fs-md); font-weight: 900; color: var(--ink);
  }
  #cpStatLookupModule .cp-sl-splitblock-title span {
    font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.1em;
    text-transform: uppercase; color: var(--red-dark);
  }
  #cpStatLookupModule .cp-sl-splittable { font-size: var(--fs-sm); }
  #cpStatLookupModule .cp-sl-splittable th, #cpStatLookupModule .cp-sl-splittable td { padding: 7px 8px; white-space: nowrap; }
  #cpStatLookupModule .cp-sl-splittable td { text-align: right; }
  #cpStatLookupModule .cp-sl-splittable td:first-child,
  #cpStatLookupModule .cp-sl-splittable th:first-child,
  #cpStatLookupModule .cp-sl-splittable td:nth-child(2),
  #cpStatLookupModule .cp-sl-splittable th:nth-child(2) { text-align: left; }
  #cpStatLookupModule .cp-sl-splitempty { margin: 12px; padding: 16px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-splitgrid { grid-template-columns: 1fr; }

  /* ---------- Pitch movement plot ---------- */
  #cpStatLookupModule .cp-sl-statcastview { margin: 12px 0 0; }
  #cpStatLookupModule .cp-sl-movementplot { padding: 8px 10px 14px; }
  /* Supersampling: the wrapper reserves the display box (via aspect-ratio),
     while the SVG lays out at 200% and is GPU-scaled to 0.5, so rotated axis
     text is rasterized at 2x and downsampled crisp. */
  #cpStatLookupModule .cp-sl-mv-super { position: relative; width: 100%; max-width: 580px; margin: 0 auto; aspect-ratio: 580 / 560; }
  #cpStatLookupModule .cp-sl-mv-super .cp-sl-movement-svg { position: absolute; top: 0; left: 0; width: 200%; height: 200%; max-width: none; transform: scale(0.5); transform-origin: top left; will-change: transform; }
  #cpStatLookupModule .cp-sl-movement-svg { width: 100%; height: auto; max-width: 580px; margin: 0 auto; display: block; }
  /* Movement-plot zoom/pan */
  #cpStatLookupModule .cp-sl-mv-super { cursor: grab; touch-action: none; }
  #cpStatLookupModule .cp-sl-mv-super.is-panning { cursor: grabbing; }
  #cpStatLookupModule .cp-sl-mv-zoom { position: absolute; top: 8px; right: 8px; display: flex; gap: 4px; z-index: 3; }
  #cpStatLookupModule .cp-sl-mv-zoom button { min-width: 27px; height: 27px; padding: 0 7px; border-radius: 7px; border: 1px solid var(--line); background: rgba(255,255,255,0.94); color: var(--ink); font-family: var(--sans); font-weight: 800; font-size: var(--fs-base); line-height: 1; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,0.12); }
  #cpStatLookupModule .cp-sl-mv-zoom button[data-mvzoom="reset"] { font-size: var(--fs-xs); }
  #cpStatLookupModule .cp-sl-mv-zoom button[data-mvlasso] { font-size: var(--fs-xs); }
  #cpStatLookupModule .cp-sl-mv-zoom button[data-mvlasso].is-active {
    background: linear-gradient(180deg, #cc314b, #ad1b34); border-color: transparent; color: #ffffff;
  }
  #cpStatLookupModule .cp-sl-mv-super.is-lassoing { cursor: crosshair; }
  #cpStatLookupModule .cp-sl-mv-avgctrl { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; margin-right: 10px; }
  #cpStatLookupModule .cp-sl-mv-zoom button:hover { border-color: var(--red, #c41e3a); color: var(--red, #c41e3a); }

  /* Click-to-reclassify popover on the movement plot */
  #cpStatLookupModule [data-movementplot] { position: relative; }
  #cpStatLookupModule .cp-mvreclass-menu {
    position: absolute; z-index: 20; width: 244px; max-width: calc(100% - 12px);
    background: #fffdf8; border: 1px solid var(--line); border-radius: 12px;
    box-shadow: 0 14px 34px rgba(0,0,0,0.2); font-family: var(--sans); overflow: hidden;
  }
  #cpStatLookupModule .cp-mvrc-head {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    padding: 9px 11px; border-bottom: 1px solid var(--line-soft); background: rgba(0,0,0,0.02);
  }
  #cpStatLookupModule .cp-mvrc-head strong { font-size: var(--fs-sm); color: var(--ink); }
  #cpStatLookupModule .cp-mvrc-x { border: 0; background: none; cursor: pointer; font-size: var(--fs-lg); line-height: 1; color: var(--muted); padding: 0 2px; }
  #cpStatLookupModule .cp-mvrc-x:hover { color: var(--red-dark); }
  #cpStatLookupModule .cp-mvrc-hint { padding: 8px 11px 4px; font-size: var(--fs-xs); line-height: 1.45; color: var(--muted); }
  #cpStatLookupModule .cp-mvrc-hint strong { color: var(--ink); font-weight: 700; }
  #cpStatLookupModule .cp-mvrc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; padding: 6px 8px 9px; max-height: 232px; overflow-y: auto; }
  #cpStatLookupModule .cp-mvrc-opt {
    display: flex; align-items: center; gap: 7px; padding: 5px 6px; border: 1px solid transparent;
    border-radius: 8px; background: none; cursor: pointer; text-align: left; font-family: var(--sans);
    font-size: var(--fs-sm); color: var(--ink);
  }
  #cpStatLookupModule .cp-mvrc-opt:hover { background: rgba(196,30,58,0.07); border-color: rgba(196,30,58,0.3); }
  #cpStatLookupModule .cp-mvrc-opt:disabled { cursor: default; opacity: 0.5; }
  #cpStatLookupModule .cp-mvrc-opt:disabled:hover { background: none; border-color: transparent; }
  #cpStatLookupModule .cp-mvrc-code {
    flex: 0 0 auto; min-width: 26px; text-align: center; padding: 2px 5px; border-radius: 5px;
    font-weight: 900; font-size: var(--fs-xs); letter-spacing: 0.02em;
  }
  #cpStatLookupModule .cp-mvrc-name { flex: 1 1 auto; line-height: 1.15; }

  /* Multi-select on the movement plot */
  #cpStatLookupModule .cp-sl-mv-dot.is-selected { opacity: 1; stroke: #141414; stroke-width: 1.4; r: 4; }
  /* A saved lasso area. Dashed like the stroke that made it, so it reads as the
     same object; 10% fill under the dots rather than over them. */
  #cpStatLookupModule .cp-sl-mv-region {
    fill-opacity: 0.10; stroke-width: 1.4; stroke-dasharray: 5 4; stroke-opacity: 0.85;
    pointer-events: none;
  }
  #cpStatLookupModule .cp-sl-mv-regionlabel { pointer-events: none; }
  #cpStatLookupModule .cp-sl-mv-regionnote { font-weight: 800; color: var(--red-dark, #8f1529); }
  #cpStatLookupModule .cp-sl-mv-regionlabel text {
    font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.05em;
  }
  #cpStatLookupModule .cp-sl-mv-marquee { fill: rgba(196, 30, 58, 0.08); stroke: rgba(196, 30, 58, 0.65); stroke-width: 1; stroke-dasharray: 4 3; pointer-events: none; }
  /* Freehand lasso. While the pointer is down this is INK — an open, unfilled
     stroke that follows the hand, so it reads as drawing rather than as a shape
     being fitted. The faint dashed tie back to the start shows what will be
     enclosed; the region is only closed on release, for the hit test. */
  #cpStatLookupModule .cp-sl-mv-lassoink {
    fill: none; stroke: #c41e3a; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round;
    pointer-events: none;
  }
  #cpStatLookupModule .cp-sl-mv-lassotie {
    fill: none; stroke: rgba(196, 30, 58, 0.42); stroke-width: 1; stroke-dasharray: 4 4; pointer-events: none;
  }
  #cpStatLookupModule .cp-mvselbar {
    position: absolute; z-index: 19; top: 8px; left: 50%; transform: translateX(-50%);
    display: flex; align-items: center; gap: 8px; padding: 6px 10px;
    background: #fffdf8; border: 1px solid var(--line); border-radius: 999px;
    box-shadow: 0 8px 22px rgba(0,0,0,0.16); font-family: var(--sans); font-size: var(--fs-sm); color: var(--ink);
  }
  #cpStatLookupModule .cp-mvselbar button {
    border: 1px solid rgba(0, 0, 0, 0.12); background: rgba(255, 255, 255, 0.9); border-radius: 999px;
    padding: 3px 10px; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.06em;
    text-transform: uppercase; color: #444; cursor: pointer;
  }
  #cpStatLookupModule .cp-mvselbar [data-mvsel-go] { background: linear-gradient(180deg, #cc314b, #ad1b34); border-color: transparent; color: #ffffff; }
  #cpStatLookupModule .cp-mvselbar button:hover { border-color: rgba(196, 30, 58, 0.5); }
  #cpStatLookupModule .cp-sl-mv-zoomhint { color: var(--muted); font-weight: 600; }
  #cpStatLookupModule .cp-sl-mv-bg { fill: #ffffff; }
  #cpStatLookupModule .cp-sl-mv-grid { stroke: rgba(0, 0, 0, 0.07); stroke-width: 1; }
  #cpStatLookupModule .cp-sl-mv-zero { stroke: rgba(176, 139, 87, 0.85); stroke-width: 1.4; stroke-dasharray: 5 4; }
  #cpStatLookupModule .cp-sl-mv-tick { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 400; fill: var(--muted); }
  /* weight 700 = Arial's real bold (800 would be synthesized/faux-bold, which
     smears when the y-axis label is rotated); geometricPrecision keeps the
     rotated text crisp. */
  #cpStatLookupModule .cp-sl-mv-axis { font-family: var(--sans); font-size: var(--fs-base); font-weight: 700; fill: var(--ink); text-rendering: geometricPrecision; }
  #cpStatLookupModule .cp-sl-mv-bubble { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; fill: #ffffff; }
  #cpStatLookupModule .cp-sl-mv-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; margin-top: 8px; font-family: var(--sans); font-size: var(--fs-sm); color: var(--muted); }
  #cpStatLookupModule .cp-sl-mv-legenditem { display: inline-flex; align-items: center; gap: 6px; }
  #cpStatLookupModule .cp-sl-mv-swatch { width: 11px; height: 11px; border-radius: 3px; display: inline-block; border: 1px solid rgba(0, 0, 0, 0.14); }
  #cpStatLookupModule .cp-sl-mv-legenditem em { color: var(--red-dark); font-style: normal; font-weight: 800; }

  /* ---------- Pitch usage splits (diverging bars) ---------- */
  #cpStatLookupModule .cp-sl-usagesplits { padding: 10px 8px 6px; }
  #cpStatLookupModule .cp-sl-usage-svg { width: 100%; height: auto; max-width: 780px; margin: 0 auto; display: block; }
  #cpStatLookupModule .cp-sl-us-stripe { fill: rgba(0, 0, 0, 0.028); }
  #cpStatLookupModule .cp-sl-us-grid { stroke: rgba(0, 0, 0, 0.08); stroke-width: 1; }
  #cpStatLookupModule .cp-sl-us-center { stroke: rgba(0, 0, 0, 0.55); stroke-width: 1.5; }
  #cpStatLookupModule .cp-sl-us-chiptext { font-family: var(--sans); font-size: var(--fs-sm); font-weight: 900; }
  #cpStatLookupModule .cp-sl-us-val { font-family: var(--sans); font-size: var(--fs-sm); }
  #cpStatLookupModule .cp-sl-us-count { font-weight: 800; fill: var(--ink); }
  #cpStatLookupModule .cp-sl-us-pct { font-weight: 600; fill: var(--muted); }
  #cpStatLookupModule .cp-sl-us-head { font-family: var(--sans); font-size: var(--fs-base); font-weight: 900; fill: var(--ink); letter-spacing: 0.03em; }
  #cpStatLookupModule .cp-sl-us-headsub { font-weight: 700; fill: var(--muted); }
  #cpStatLookupModule .cp-sl-us-tick { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 600; fill: var(--muted); }



  /* ---------- Mobile polish / chart readability ---------- */
  #cpStatLookupModule.cp-is-mobile { padding-left: 10px; padding-right: 10px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-section { margin-bottom: 18px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-section-header { gap: 8px; margin-bottom: 10px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-section-title { font-size: var(--fs-xl); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-controls {
    display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; align-items: center;
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-statselect { width: 100%; min-width: 0; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-window { grid-column: 1 / -1; overflow-x: auto; padding: 2px 0 4px; -webkit-overflow-scrolling: touch; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-window button { flex: 0 0 auto; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chartwrap { margin-left: -8px; margin-right: -8px; padding: 12px 8px 10px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-svg { width: 720px; max-width: none; min-height: 250px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-cap { font-size: var(--fs-xs); line-height: 1.35; padding: 0 8px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-tablewrap { border-radius: 10px; -webkit-overflow-scrolling: touch; }
  /* Pin the identity column while the rest of a wide table scrolls sideways.
     Sticky cells need OPAQUE backgrounds (the table's zebra tints are
     translucent), so these approximate each row flavor over the table bg. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-tablewrap th:first-child,
  #cpStatLookupModule.cp-is-mobile .cp-sl-tablewrap td:first-child {
    position: sticky; left: 0; z-index: 2; background: #faf7f0;
    box-shadow: 3px 0 6px -2px rgba(0, 0, 0, 0.14);
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-tablewrap thead th:first-child { z-index: 3; background: #e6f2f7; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-tablewrap tr.cp-sl-total td:first-child { background: #eef6fb; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-careertable tr.cp-sl-total td:first-child { background: #f9e9ec; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-deftable,
  #cpStatLookupModule.cp-is-mobile .cp-sl-careertable,
  #cpStatLookupModule.cp-is-mobile .cp-sl-splittable,
  #cpStatLookupModule.cp-is-mobile .cp-sl-gamelog { font-size: var(--fs-xs); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-careertable th,
  #cpStatLookupModule.cp-is-mobile .cp-sl-careertable td,
  #cpStatLookupModule.cp-is-mobile .cp-sl-deftable th,
  #cpStatLookupModule.cp-is-mobile .cp-sl-deftable td,
  #cpStatLookupModule.cp-is-mobile .cp-sl-splittable th,
  #cpStatLookupModule.cp-is-mobile .cp-sl-splittable td,
  #cpStatLookupModule.cp-is-mobile .cp-sl-gamelog th,
  #cpStatLookupModule.cp-is-mobile .cp-sl-gamelog td { padding: 6px 7px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-splitcontrols { gap: 5px; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; -webkit-overflow-scrolling: touch; }
  #cpStatLookupModule .cp-sl-statcasttable th, #cpStatLookupModule .cp-sl-statcasttable td { white-space: nowrap; }
  #cpStatLookupModule .cp-sl-statcasttable tbody tr.cp-sl-total td { background: rgba(137, 207, 240, 0.14); font-weight: 900; border-top: 1px solid rgba(0,0,0,0.1); border-bottom: 1px solid rgba(0,0,0,0.12); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-splitchip { flex: 0 0 auto; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-statcasttable { font-size: var(--fs-sm); }



  /* ---------- Cohesive chart presentation + downloads ---------- */
  #cpStatLookupModule .cp-sl-chartwrap,
  #cpStatLookupModule .cp-sl-chart-panel {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    background:
      radial-gradient(circle at 92% 0%, rgba(137, 207, 240, 0.18), transparent 34%),
      linear-gradient(180deg, #fffefa 0%, #f7f3ea 100%);
    border: 1px solid rgba(20, 20, 20, 0.14);
    box-shadow: 0 10px 28px rgba(20, 20, 20, 0.07), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  }
  #cpStatLookupModule .cp-sl-chartwrap { padding: 12px 14px 13px; }
  #cpStatLookupModule .cp-sl-chart-panel { padding: 12px 14px 14px; }
  #cpStatLookupModule .cp-sl-movementplot,
  #cpStatLookupModule .cp-sl-usagesplits { padding: 12px; }

  #cpStatLookupModule .cp-sl-chart-actionrow {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    min-height: 36px; margin: 0 0 10px;
  }
  #cpStatLookupModule .cp-sl-chart-summary {
    min-width: 0; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800;
    line-height: 1.35; letter-spacing: 0.02em; color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-chart-summary strong { color: var(--ink); font-weight: 900; }
  #cpStatLookupModule .cp-sl-chart-actions { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; }
  #cpStatLookupModule .cp-sl-downloadbtn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-width: 68px; height: 34px; padding: 0 11px; border-radius: 999px;
    border: 1px solid rgba(20, 20, 20, 0.14); background: rgba(255, 255, 255, 0.92);
    color: #48433c; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900;
    letter-spacing: 0.07em; text-transform: uppercase; cursor: pointer;
    box-shadow: 0 3px 9px rgba(20, 20, 20, 0.06);
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-downloadbtn::before { content: "↓"; font-size: var(--fs-base); line-height: 1; transform: translateY(-1px); }
  #cpStatLookupModule .cp-sl-downloadbtn:hover {
    transform: translateY(-1px); border-color: rgba(196, 30, 58, 0.5); color: var(--red-dark);
    background: #fff;
  }
  #cpStatLookupModule .cp-sl-downloadbtn.cp-sl-download-primary {
    border-color: rgba(196, 30, 58, 0.26); color: #fff;
    background: linear-gradient(180deg, #cc314b, #ad1b34);
  }
  #cpStatLookupModule .cp-sl-downloadbtn.cp-sl-download-primary:hover { color: #fff; border-color: rgba(143, 21, 41, 0.72); }
  #cpStatLookupModule .cp-sl-downloadbtn:disabled { opacity: 0.62; cursor: progress; transform: none; }

  #cpStatLookupModule .cp-sl-chart-stage {
    position: relative; width: 100%; overflow: hidden; border-radius: 13px;
    background:
      linear-gradient(rgba(255,255,255,0.78), rgba(255,255,255,0.78)),
      repeating-linear-gradient(0deg, transparent 0, transparent 23px, rgba(20,20,20,0.022) 24px),
      #fffdf8;
    border: 1px solid rgba(20, 20, 20, 0.08);
  }
  #cpStatLookupModule .cp-sl-chart-stage-movement { padding: 5px; }
  #cpStatLookupModule .cp-sl-chart-stage-usage { padding: 5px 3px; }
  #cpStatLookupModule .cp-sl-chart-stage-rolling { padding: 3px 4px 0; }

  #cpStatLookupModule .cp-sl-chart-svg { width: 100%; height: auto; max-width: 760px; margin: 0 auto; display: block; }
  #cpStatLookupModule .cp-sl-chart-bg { fill: rgba(255, 255, 255, 0.94); stroke: rgba(20, 20, 20, 0.08); stroke-width: 1; }
  #cpStatLookupModule .cp-sl-chart-line-halo { fill: none; stroke: rgba(255, 255, 255, 0.96); stroke-width: 7; stroke-linejoin: round; stroke-linecap: round; }
  #cpStatLookupModule .cp-sl-chart-line { stroke-width: 3.1; filter: drop-shadow(0 2px 3px rgba(196, 30, 58, 0.18)); }
  #cpStatLookupModule .cp-sl-chart-area { fill: url(#cpRollingAreaGradient); }
  #cpStatLookupModule .cp-sl-chart-dot { stroke-width: 2.2; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-chart-dot-latest { fill: var(--red); stroke: #fffdf8; stroke-width: 3; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.22)); }
  #cpStatLookupModule .cp-sl-chart-grid { stroke: rgba(20, 20, 20, 0.075); stroke-dasharray: 3 5; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-chart-vgrid { stroke: rgba(20, 20, 20, 0.045); stroke-width: 1; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-chart-text { font-size: var(--fs-xs); font-weight: 700; }
  #cpStatLookupModule .cp-sl-chart-avg { stroke: rgba(34, 128, 174, 0.78); stroke-width: 1.6; stroke-dasharray: 7 5; vector-effect: non-scaling-stroke; }

  /* ---------- Rolling-chart interactive hover ---------- */
  #cpStatLookupModule .cp-sl-chart-stage-rolling { position: relative; }
  #cpStatLookupModule .cp-sl-chart-hitzone { fill: transparent; cursor: crosshair; }
  #cpStatLookupModule .cp-sl-chart-hover { pointer-events: none; opacity: 0; transition: opacity 0.12s ease; }
  #cpStatLookupModule .cp-sl-chart-hover.is-on { opacity: 1; }
  #cpStatLookupModule .cp-sl-chart-hover .cp-hv-line { stroke: rgba(20, 20, 20, 0.34); stroke-width: 1; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-chart-hover .cp-hv-ring { fill: #fff; stroke: var(--red, #c41e3a); stroke-width: 2.6; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-chart-tip {
    position: absolute; z-index: 6; pointer-events: none; opacity: 0;
    transform: translateY(3px); transition: opacity 0.12s ease, transform 0.12s ease;
    min-width: 132px; max-width: 230px; padding: 8px 10px; border-radius: 10px;
    background: rgba(255, 253, 248, 0.985); border: 1px solid var(--line);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.17); font-family: var(--sans);
  }
  #cpStatLookupModule .cp-sl-chart-tip.is-on { opacity: 1; transform: none; }
  #cpStatLookupModule .cp-tip-date { font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); }
  #cpStatLookupModule .cp-tip-val { display: flex; align-items: baseline; gap: 6px; margin-top: 2px; }
  #cpStatLookupModule .cp-tip-num { font-size: var(--fs-xl); font-weight: 900; color: var(--ink); font-variant-numeric: tabular-nums; line-height: 1.1; }
  #cpStatLookupModule .cp-tip-stat { font-size: var(--fs-xs); font-weight: 800; color: var(--muted); text-transform: uppercase; letter-spacing: 0.05em; }
  #cpStatLookupModule .cp-tip-meta { margin-top: 5px; font-size: var(--fs-xs); line-height: 1.45; color: var(--muted); }
  #cpStatLookupModule .cp-tip-meta strong { color: var(--ink); font-weight: 700; }
  #cpStatLookupModule .cp-tip-delta { display: inline-block; margin-top: 4px; padding: 1px 6px; border-radius: 999px; font-size: var(--fs-xs); font-weight: 900; font-variant-numeric: tabular-nums; }
  #cpStatLookupModule .cp-tip-delta.is-up { background: rgba(26, 127, 55, 0.13); color: #1a7f37; }
  #cpStatLookupModule .cp-tip-delta.is-down { background: rgba(196, 30, 58, 0.12); color: var(--red-dark, #a01829); }
  #cpStatLookupModule .cp-tip-delta.is-flat { background: rgba(0, 0, 0, 0.06); color: var(--muted); }
  @media (prefers-reduced-motion: reduce) {
    #cpStatLookupModule .cp-sl-chart-hover, #cpStatLookupModule .cp-sl-chart-tip { transition: none; }
  }

  /* Promotion / level-change rules on the rolling chart */
  #cpStatLookupModule .cp-sl-chart-levelmark line {
    stroke: rgba(196, 30, 58, 0.42); stroke-width: 1.4; stroke-dasharray: 3 3; vector-effect: non-scaling-stroke;
  }
  #cpStatLookupModule .cp-sl-chart-levelmark.is-down line { stroke: rgba(58, 102, 176, 0.42); }
  #cpStatLookupModule .cp-sl-chart-levelmark text {
    font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.06em;
    fill: var(--red-dark);
  }
  #cpStatLookupModule .cp-sl-chart-levelmark.is-down text { fill: #2c5c8a; }
  #cpStatLookupModule .cp-sl-chart-ref-label { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; fill: #17678e; }
  /* Multi-series legend, drawn inside the svg so the PNG export carries it. */
  #cpStatLookupModule .cp-sl-chart-legendtext { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.01em; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-legendtext { font-size: var(--fs-lg); }
  #cpStatLookupModule .cp-sl-chart-latest-box { fill: #fffdf8; stroke: rgba(196, 30, 58, 0.34); stroke-width: 1; filter: drop-shadow(0 3px 6px rgba(0,0,0,0.12)); }
  #cpStatLookupModule .cp-sl-chart-latest-text { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; fill: var(--red-dark); }
  #cpStatLookupModule .cp-sl-chart-cap {
    margin-top: 9px; padding: 0 6px; font-size: var(--fs-sm); line-height: 1.45; color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-chart-cap strong { color: var(--ink); }

  #cpStatLookupModule .cp-sl-mv-super { max-width: 620px; aspect-ratio: 620 / 650; }
  #cpStatLookupModule .cp-sl-movement-svg { max-width: 620px; }
  #cpStatLookupModule .cp-sl-mv-bg { fill: url(#cpMvPlotGradient); stroke: rgba(20, 20, 20, 0.1); stroke-width: 1; }
  #cpStatLookupModule .cp-sl-mv-quadrant-a { fill: rgba(137, 207, 240, 0.055); }
  #cpStatLookupModule .cp-sl-mv-quadrant-b { fill: rgba(196, 30, 58, 0.025); }
  #cpStatLookupModule .cp-sl-mv-grid { stroke: rgba(20, 20, 20, 0.075); stroke-dasharray: 2 5; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-mv-zero { stroke: rgba(143, 21, 41, 0.62); stroke-width: 1.5; stroke-dasharray: 7 5; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-mv-tick { font-size: var(--fs-sm); font-weight: 600; }
  #cpStatLookupModule .cp-sl-mv-axis { font-size: var(--fs-base); font-weight: 700; }
  #cpStatLookupModule .cp-sl-mv-bubble { font-size: var(--fs-sm); }
  #cpStatLookupModule .cp-sl-mv-legend {
    gap: 7px 9px; margin-top: 10px; padding: 0 4px; font-size: var(--fs-sm);
  }
  #cpStatLookupModule .cp-sl-mv-legenditem {
    padding: 6px 9px; border-radius: 999px; background: rgba(255, 255, 255, 0.84);
    border: 1px solid rgba(20, 20, 20, 0.08);
  }

  #cpStatLookupModule .cp-sl-usage-svg { max-width: 820px; }
  #cpStatLookupModule .cp-sl-us-plotbg { fill: rgba(255,255,255,0.9); stroke: rgba(20,20,20,0.08); stroke-width: 1; }
  #cpStatLookupModule .cp-sl-us-track { fill: rgba(20, 20, 20, 0.055); }
  #cpStatLookupModule .cp-sl-us-stripe { fill: rgba(137, 207, 240, 0.045); }
  #cpStatLookupModule .cp-sl-us-grid { stroke: rgba(20, 20, 20, 0.085); stroke-dasharray: 3 5; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-us-chiptext { font-size: var(--fs-sm); font-weight: 900; }
  #cpStatLookupModule .cp-sl-us-pitchname { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; fill: var(--ink); }
  #cpStatLookupModule .cp-sl-us-barhead { font-family: var(--sans); font-size: var(--fs-base); font-weight: 900; fill: #544e46; }
  #cpStatLookupModule .cp-sl-us-barheadsub { font-size: var(--fs-xs); font-weight: 800; fill: var(--muted); }
  #cpStatLookupModule .cp-sl-us-val { font-family: var(--sans); font-size: var(--fs-sm); font-weight: 900; fill: #544e46; }
  #cpStatLookupModule .cp-sl-us-sidepill { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.08em; }

  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-controls { margin-bottom: 10px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chartwrap {
    margin-left: 0; margin-right: 0; padding: 10px; overflow: hidden;
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-panel { padding: 10px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-actionrow { align-items: flex-start; flex-direction: column; gap: 8px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-actions { width: 100%; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-downloadbtn { flex: 1 1 0; min-width: 0; height: 36px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-svg { width: 100%; max-width: none; min-height: 0; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-text { font-size: var(--fs-xl); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-ref-label { font-size: var(--fs-lg); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-latest-text { font-size: var(--fs-lg); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-cap { padding: 0 2px; font-size: var(--fs-xs); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-movementplot,
  #cpStatLookupModule.cp-is-mobile .cp-sl-usagesplits { padding: 8px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-mv-tick { font-size: var(--fs-lg); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-mv-axis { font-size: var(--fs-xl); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-mv-bubble { font-size: var(--fs-md); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-us-chiptext { font-size: var(--fs-xl); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-us-pitchname { font-size: var(--fs-xl); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-us-barhead { font-size: var(--fs-xl); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-us-barheadsub { font-size: var(--fs-md); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-us-val { font-size: var(--fs-xl); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-us-sidepill { font-size: var(--fs-md); }

  /* ---------- Rolling trend customization ----------
     Two stacked rows, not one wrapping row: "what to chart" on top, "over what
     window" beneath, with the appearance knobs folded into the Display
     disclosure at the end of row two. A single flex row put nine controls of
     identical weight side by side and let them wrap at arbitrary points, so the
     grouping a reader needed was never visible. */
  #cpStatLookupModule .cp-sl-chart-controls {
    display: flex; flex-direction: column; align-items: stretch; gap: 8px;
    padding: 10px 12px; border: 1px solid var(--line-soft); border-radius: 14px;
    background: rgba(255, 255, 255, 0.62);
  }
  #cpStatLookupModule .cp-sl-chart-row {
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; min-width: 0;
  }
  #cpStatLookupModule .cp-sl-chart-row-window {
    padding-top: 8px; border-top: 1px solid var(--line-soft);
  }
  #cpStatLookupModule .cp-sl-chart-controlgroup {
    display: flex; align-items: center; flex-wrap: wrap; gap: 7px; min-width: 0;
  }
  #cpStatLookupModule .cp-sl-chart-controlgroup-stat { flex: 1 1 220px; }
  #cpStatLookupModule .cp-sl-chart-controlgroup-stat .cp-sl-statselect { min-width: 150px; flex: 1 1 150px; }
  #cpStatLookupModule .cp-sl-chart-mini-select { min-width: 86px; padding-right: 28px; }

  /* Display disclosure. <details> carries the open/close state and keyboard
     behaviour natively; only the panel needs positioning. */
  #cpStatLookupModule .cp-sl-chart-display { position: relative; margin-left: auto; }
  #cpStatLookupModule .cp-sl-chart-displaybtn {
    display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 13px;
    border-radius: 999px; border: 1px solid rgba(0, 0, 0, 0.12);
    background: rgba(255, 255, 255, 0.92); cursor: pointer; list-style: none;
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900;
    letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-chart-displaybtn::-webkit-details-marker { display: none; }
  #cpStatLookupModule .cp-sl-chart-displaybtn::after {
    content: "\25be"; font-size: var(--fs-sm); line-height: 1; transition: transform 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-chart-display[open] > .cp-sl-chart-displaybtn {
    border-color: rgba(15, 61, 87, 0.32); color: #0f3d57;
    background: linear-gradient(180deg, var(--sky-light), var(--sky-mid));
  }
  #cpStatLookupModule .cp-sl-chart-display[open] > .cp-sl-chart-displaybtn::after { transform: rotate(180deg); }
  #cpStatLookupModule .cp-sl-chart-displaypanel {
    position: absolute; z-index: 30; right: 0; top: calc(100% + 6px);
    display: flex; flex-direction: column; gap: 8px; min-width: 190px;
    padding: 11px 12px; border-radius: 12px; border: 1px solid var(--line-soft);
    background: #ffffff; box-shadow: 0 14px 30px rgba(0, 0, 0, 0.14);
  }
  #cpStatLookupModule .cp-sl-chart-displayrow {
    display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 10px;
  }
  #cpStatLookupModule .cp-sl-chart-displayrow .cp-sl-chart-mini-select { width: 100%; }
  #cpStatLookupModule .cp-sl-chart-controls .cp-sl-window { flex-wrap: wrap; overflow: visible; }
  #cpStatLookupModule .cp-sl-chart-customwindow { display: inline-flex; align-items: center; gap: 6px; }
  #cpStatLookupModule .cp-sl-chart-modenote {
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; color: var(--muted);
    padding: 0 11px; height: 34px; display: inline-flex; align-items: center;
    border-radius: 999px; border: 1px dashed rgba(0, 0, 0, 0.16); background: rgba(255, 255, 255, 0.55);
  }
  #cpStatLookupModule .cp-sl-chart-custominput {
    width: 76px; height: 34px; padding: 0 9px; border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.12); background: rgba(255,255,255,0.92);
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; color: var(--ink);
    font-variant-numeric: tabular-nums; outline: none;
  }
  #cpStatLookupModule .cp-sl-chart-custominput:focus { border-color: rgba(196,30,58,0.55); box-shadow: 0 0 0 3px rgba(196,30,58,0.12); }
  #cpStatLookupModule .cp-sl-chart-customapply {
    height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid rgba(196,30,58,0.25);
    background: rgba(255,255,255,0.95); color: var(--red-dark); font-family: var(--sans);
    font-size: var(--fs-xs); font-weight: 900; letter-spacing: .05em; text-transform: uppercase; cursor: pointer;
  }
  #cpStatLookupModule .cp-sl-chart-customapply:hover { background: #fff; border-color: rgba(196,30,58,0.55); }

  /* ---------- Savant-style percentile profile ---------- */
  #cpStatLookupModule .cp-sl-percentiles { padding: 12px; }
  #cpStatLookupModule .cp-sl-percentile-svg {
    width: 100%; height: auto; max-width: 840px; margin: 0 auto; display: block;
  }
  #cpStatLookupModule .cp-sl-pct-plotbg { fill: rgba(255,255,255,0.94); stroke: rgba(20,20,20,0.09); stroke-width: 1; }
  #cpStatLookupModule .cp-sl-pct-rowstripe { fill: rgba(137,207,240,0.035); }
  #cpStatLookupModule .cp-sl-pct-sep { stroke: rgba(24,128,147,0.66); stroke-width: 1; stroke-dasharray: 8 6; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-pct-grid { stroke: rgba(255,255,255,0.42); stroke-width: 2; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-pct-track { fill: #dcebea; }
  #cpStatLookupModule .cp-sl-pct-label { font-family: var(--sans); font-size: var(--fs-md); font-weight: 700; fill: #514c45; }
  #cpStatLookupModule .cp-sl-pct-value { font-family: var(--sans); font-size: var(--fs-md); font-weight: 700; fill: #514c45; }
  #cpStatLookupModule .cp-sl-pct-number { font-family: var(--sans); font-size: var(--fs-base); font-weight: 900; fill: #fff; paint-order: stroke; }
  #cpStatLookupModule .cp-sl-pct-head { font-family: var(--serif); font-size: var(--fs-xl); font-weight: 900; fill: #141414; }
  #cpStatLookupModule .cp-sl-pct-subhead { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.09em; text-transform: uppercase; fill: #8f1529; }
  #cpStatLookupModule .cp-sl-pct-axis { font-family: var(--sans); font-size: var(--fs-micro); font-weight: 800; fill: #7a756c; }
  /* ---------- Radar (hexagon) view of the same profile ---------- */
  #cpStatLookupModule .cp-sl-pctviewswitch { display: inline-flex; gap: 6px; margin-left: auto; }
  #cpStatLookupModule .cp-sl-pctviewbtn.is-active { background: var(--red, #c41e3a); border-color: var(--red, #c41e3a); color: #fff; }
  #cpStatLookupModule .cp-sl-radar-svg { width: 100%; height: auto; max-width: 820px; margin: 0 auto; display: block; }
  #cpStatLookupModule .cp-sl-radar-bg { fill: rgba(255,255,255,0.94); stroke: rgba(20,20,20,0.09); stroke-width: 1; }
  #cpStatLookupModule .cp-sl-radar-title { font-family: var(--sans); font-size: var(--fs-sm); font-weight: 900; letter-spacing: 0.14em; fill: #8f1529; }
  #cpStatLookupModule .cp-sl-radar-ring { fill: none; stroke: rgba(20,20,20,0.12); stroke-width: 1; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-radar-ring.is-mid { stroke: rgba(20,20,20,0.24); stroke-dasharray: 5 4; }
  #cpStatLookupModule .cp-sl-radar-ring.is-outer { stroke: rgba(20,20,20,0.26); }
  #cpStatLookupModule .cp-sl-radar-spoke { stroke: rgba(20,20,20,0.10); stroke-width: 1; vector-effect: non-scaling-stroke; }
  #cpStatLookupModule .cp-sl-radar-scale { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 700; fill: #a29a8f; }
  #cpStatLookupModule .cp-sl-radar-shape { fill: rgba(196,30,58,0.17); stroke: var(--red, #c41e3a); stroke-width: 2.6; stroke-linejoin: round; }
  #cpStatLookupModule .cp-sl-radar-dot { fill: var(--red, #c41e3a); stroke: #fffdf8; stroke-width: 2; }
  #cpStatLookupModule .cp-sl-radar-name { font-family: var(--sans); font-size: var(--fs-base); font-weight: 900; fill: #3f3a34; }
  #cpStatLookupModule .cp-sl-radar-rank { font-family: var(--sans); font-size: var(--fs-sm); font-weight: 700; fill: #8b8378; }
  /* Past 8 axes the label pairs start to meet; step the type down rather than
     refusing the axis count the reader asked for. */
  #cpStatLookupModule .cp-sl-radar-svg.is-tight .cp-sl-radar-name { font-size: var(--fs-sm); }
  #cpStatLookupModule .cp-sl-radar-svg.is-tight .cp-sl-radar-rank { font-size: var(--fs-xs); }
  #cpStatLookupModule .cp-pctradar-axes {
    display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 10px;
  }
  #cpStatLookupModule .cp-pctradar-axes label { display: inline-flex; align-items: center; gap: 8px; }
  #cpStatLookupModule .cp-pctradar-note { font-family: var(--sans); font-size: var(--fs-sm); color: var(--muted); }
  #cpStatLookupModule .cp-sl-percentile-source {
    margin-top: 9px; padding: 0 4px; font-family: var(--sans); font-size: var(--fs-xs);
    line-height: 1.4; color: var(--muted); text-align: center;
  }
  #cpStatLookupModule .cp-sl-percentile-source strong { color: var(--ink); }

  /* display/flex-direction are restated because an EARLIER mobile rule (in the
     general section block) sets this element to a two-column grid — harmless
     when the controls were leaf nodes, but it would lay the two rows out side
     by side now that they are the direct children. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-controls {
    display: flex; flex-direction: column; align-items: stretch; padding: 9px; gap: 9px;
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-row {
    display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; gap: 9px;
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-controlgroup { margin-left: 0; width: 100%; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-controlgroup-stat,
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-comparegroup { display: grid; grid-template-columns: auto minmax(0, 1fr); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-controlgroup .cp-sl-window {
    flex: 1 1 auto; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; -webkit-overflow-scrolling: touch;
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-controlgroup .cp-sl-window button { flex: 0 0 auto; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-mini-select { width: 100%; }
  /* Full-width trigger and a panel that spans the row rather than hanging off
     its right edge, where it would overflow a phone's viewport. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-display { margin-left: 0; width: 100%; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-displaybtn { width: 100%; justify-content: center; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-displaypanel { left: 0; right: 0; min-width: 0; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-customwindow { width: 100%; display: grid; grid-template-columns: auto minmax(72px, 1fr) auto; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-chart-custominput { width: 100%; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-percentiles { padding: 8px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-pct-label,
  #cpStatLookupModule.cp-is-mobile .cp-sl-pct-value { font-size: var(--fs-base); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-pct-number { font-size: var(--fs-lg); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-pct-head { font-size: var(--fs-2xl); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-pct-subhead { font-size: var(--fs-base); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-pct-axis { font-size: var(--fs-base); }



  /* ---------- Statcast level + qualification controls ---------- */
  #cpStatLookupModule .cp-sl-statcast-levelbar,
  #cpStatLookupModule .cp-sl-statcast-armbar,
  #cpStatLookupModule .cp-sl-percentile-controls {
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px;
    margin: 0 0 12px; padding: 10px 12px; border-radius: 12px;
    border: 1px solid rgba(20,20,20,0.09); background: rgba(137,207,240,0.10);
    font-family: var(--sans); font-size: var(--fs-xs); color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-statcast-levelbar label,
  #cpStatLookupModule .cp-sl-percentile-controls label { display: inline-flex; align-items: center; gap: 8px; }
  #cpStatLookupModule .cp-sl-percentile-custom .cp-sl-chart-custominput { width: 74px; }
  #cpStatLookupModule .cp-sl-statcast-levelbar strong {
    display: inline-flex; align-items: center; min-height: 32px; padding: 0 13px; border-radius: 999px;
    background: linear-gradient(180deg, #cc314b, #ad1b34); color: #fff; font-size: var(--fs-xs); letter-spacing: .05em;
  }
  #cpStatLookupModule .cp-sl-statcast-levelhint { flex: 1 1 260px; line-height: 1.35; }
  /* Switch-pitcher arm switch. Tinted apart from the level bar directly above it
     so two stacked control strips do not read as one block. */
  #cpStatLookupModule .cp-sl-statcast-armbar { background: rgba(196,30,58,0.08); border-color: rgba(196,30,58,0.20); }
  #cpStatLookupModule .cp-sl-armchips { margin: 0; }
  #cpStatLookupModule .cp-sl-armchip-n {
    display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 999px;
    background: rgba(20,20,20,0.10); font-size: var(--fs-xs); font-variant-numeric: tabular-nums;
  }
  #cpStatLookupModule .cp-sl-armchip.is-active .cp-sl-armchip-n { background: rgba(255,255,255,0.26); }
  #cpStatLookupModule .cp-sl-percentile-qualifier {
    display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 22px 18px;
    border: 1px dashed rgba(196,30,58,0.34); border-radius: 13px; background: rgba(255,255,255,0.58);
    text-align: center; font-family: var(--sans); color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-percentile-qualifier strong { color: var(--ink); font-size: var(--fs-lg); }

  /* ---------- Condensed percentile strip (under the bio) ---------- */
  #cpStatLookupModule .cp-pctstrip {
    margin: 0 0 22px; padding: 13px 15px; border: 1px solid var(--line-soft); border-radius: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,0.9), rgba(247,247,244,0.86));
  }
  #cpStatLookupModule .cp-pctstrip-head {
    display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin-bottom: 11px;
    font-family: var(--sans); font-size: var(--fs-xs); color: var(--muted);
  }
  #cpStatLookupModule .cp-pctstrip-head strong {
    font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase; color: var(--red-dark);
  }
  #cpStatLookupModule .cp-pctstrip-more {
    margin-left: auto; border: 1px solid var(--line); background: rgba(255,255,255,0.8); cursor: pointer;
    border-radius: 999px; padding: 3px 11px; font-family: var(--sans); font-size: var(--fs-xs); color: var(--ink);
  }
  #cpStatLookupModule .cp-pctstrip-more:hover { border-color: rgba(196,30,58,0.5); color: var(--red-dark); }
  /* Three across, two rows — a 6-cell block stays balanced here and at the
     2-column mobile breakpoint, with no orphan cell at either size. */
  #cpStatLookupModule .cp-pctstrip-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px 20px; }
  @media (max-width: 620px) { #cpStatLookupModule .cp-pctstrip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  #cpStatLookupModule .cp-pctstrip-cell { cursor: help; }
  #cpStatLookupModule .cp-pctstrip-top {
    display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 4px;
    font-family: var(--sans); font-size: var(--fs-xs);
  }
  #cpStatLookupModule .cp-pctstrip-label { color: var(--muted); font-weight: 700; }
  #cpStatLookupModule .cp-pctstrip-value { color: var(--ink); font-weight: 900; font-size: var(--fs-sm); }
  #cpStatLookupModule .cp-pctstrip-track {
    height: 7px; border-radius: 999px; background: rgba(0,0,0,0.075); overflow: hidden;
  }
  #cpStatLookupModule .cp-pctstrip-fill { height: 100%; border-radius: 999px; }
  #cpStatLookupModule .cp-pctstrip-pct {
    margin-top: 3px; font-family: var(--sans); font-size: var(--fs-sm); font-weight: 900; color: var(--ink);
  }
  #cpStatLookupModule .cp-pctstrip-pct span { font-size: var(--fs-micro); font-weight: 700; color: var(--muted); }
  #cpStatLookupModule.cp-is-mobile .cp-pctstrip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* ---------- Percentile criteria finder ---------- */
  #cpStatLookupModule .cp-finder { margin-top: 12px; }
  #cpStatLookupModule .cp-finder-controls {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 12px;
  }
  #cpStatLookupModule .cp-finder-controls label { display: inline-flex; align-items: center; gap: 7px; }
  #cpStatLookupModule .cp-finder-metrics {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 5px 12px; margin-bottom: 14px;
  }
  #cpStatLookupModule .cp-finder-metric {
    display: flex; align-items: center; gap: 7px; padding: 5px 9px; border-radius: 8px; cursor: pointer;
    border: 1px solid transparent; font-family: var(--sans); font-size: var(--fs-sm); color: var(--muted);
  }
  #cpStatLookupModule .cp-finder-metric:hover { background: rgba(0,0,0,0.03); }
  #cpStatLookupModule .cp-finder-metric.is-on {
    border-color: rgba(196,30,58,0.3); background: rgba(196,30,58,0.05); color: var(--ink);
  }
  #cpStatLookupModule .cp-finder-metricname { flex: 1 1 auto; }
  #cpStatLookupModule .cp-finder-own {
    font-weight: 800; font-size: var(--fs-xs); padding: 1px 6px; border-radius: 999px;
    background: rgba(0,0,0,0.06); color: var(--muted);
  }
  #cpStatLookupModule .cp-finder-own.is-clearing { background: rgba(223,43,49,0.16); color: var(--red-dark); }
  #cpStatLookupModule .cp-finder-offmark { font-weight: 900; color: var(--muted); opacity: 0.55; }
  #cpStatLookupModule .cp-finder-count {
    font-family: var(--sans); font-size: var(--fs-base); color: var(--ink); margin-bottom: 9px; line-height: 1.5;
  }
  #cpStatLookupModule .cp-finder-count strong { font-size: var(--fs-lg); color: var(--red-dark); }
  #cpStatLookupModule .cp-finder-count em { font-style: normal; font-weight: 700; }
  #cpStatLookupModule .cp-finder-note { font-size: var(--fs-sm); color: var(--muted); }
  #cpStatLookupModule .cp-finder-empty {
    padding: 12px; border-radius: 9px; background: rgba(0,0,0,0.03);
    font-family: var(--sans); font-size: var(--fs-sm); color: var(--muted);
  }
  #cpStatLookupModule .cp-finder-result .cp-pctpeers-scroll { max-height: 420px; overflow-y: auto; border: 1px solid var(--line-soft); border-radius: 10px; }
  #cpStatLookupModule .cp-finder-result tr.is-me { background: rgba(196,30,58,0.09); }
  #cpStatLookupModule .cp-finder-result tr.cp-finder-gap td {
    text-align: center; color: var(--muted); letter-spacing: 0.3em; padding: 2px 0; background: rgba(0,0,0,0.02);
  }

  /* ---------- Percentile provenance ---------- */
  #cpStatLookupModule .cp-pctprov {
    margin: 0 0 12px; padding: 9px 12px; border: 1px solid var(--line-soft); border-radius: 10px;
    background: rgba(255,255,255,0.5); font-family: var(--sans); font-size: var(--fs-sm); color: var(--muted);
  }
  #cpStatLookupModule .cp-pctprov-facts { display: flex; flex-wrap: wrap; gap: 6px 16px; }
  #cpStatLookupModule .cp-pctprov-facts strong { color: var(--ink); font-weight: 700; }
  #cpStatLookupModule .cp-pctprov-warn {
    margin: 8px 0 0; padding: 8px 10px 8px 26px; list-style: disc;
    border-left: 3px solid rgba(196,30,58,0.45); background: rgba(196,30,58,0.05);
    border-radius: 0 8px 8px 0; font-size: var(--fs-sm); line-height: 1.5;
  }
  #cpStatLookupModule .cp-pctprov-warn li + li { margin-top: 5px; }

  /* ---------- Compact movement / percentile export geometry ---------- */
  #cpStatLookupModule .cp-sl-mv-super { position: static; width: 100%; max-width: 620px; margin: 0 auto; aspect-ratio: auto; }
  #cpStatLookupModule .cp-sl-mv-super .cp-sl-movement-svg {
    position: static; width: 100%; height: auto; max-width: 620px; transform: none; transform-origin: initial; will-change: auto;
  }
  #cpStatLookupModule .cp-sl-percentile-svg { max-width: 900px; }

  /* ---------- Reworked usage matrix ---------- */
  #cpStatLookupModule .cp-sl-us-kicker { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: .14em; fill: var(--red-dark); }
  #cpStatLookupModule .cp-sl-us-title { font-family: var(--serif); font-size: var(--fs-xl); font-weight: 900; fill: var(--ink); }
  #cpStatLookupModule .cp-sl-us-delta { font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; fill: var(--muted); letter-spacing: .03em; }
  #cpStatLookupModule .cp-sl-usage-svg { max-width: 900px; }
  #cpStatLookupModule .cp-sl-us-track { fill: rgba(20,20,20,0.07); }
  #cpStatLookupModule .cp-sl-us-stripe { fill: rgba(137,207,240,0.055); }
  #cpStatLookupModule .cp-sl-us-pitchname { font-size: var(--fs-xs); }
  #cpStatLookupModule .cp-sl-us-val { font-size: var(--fs-xs); }
  #cpStatLookupModule .cp-sl-us-head { font-size: var(--fs-xs); }

  #cpStatLookupModule.cp-is-mobile .cp-sl-statcast-levelbar,
  #cpStatLookupModule.cp-is-mobile .cp-sl-statcast-armbar,
  #cpStatLookupModule.cp-is-mobile .cp-sl-percentile-controls { align-items: flex-start; flex-direction: column; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-statcast-levelbar label,
  #cpStatLookupModule.cp-is-mobile .cp-sl-percentile-controls label { width: 100%; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-statcast-levelbar select,
  #cpStatLookupModule.cp-is-mobile .cp-sl-percentile-controls select { flex: 1 1 auto; min-width: 0; }
  /* The hint's `flex: 1 1 260px` is a WIDTH basis in the desktop row, but these
     bars turn into columns here, where flex-basis sizes the HEIGHT — it was
     reserving 260px of blank space under the level chip. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-statcast-levelhint { flex: 0 0 auto; width: 100%; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-us-kicker { font-size: var(--fs-md); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-us-title { font-size: var(--fs-2xl); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-us-delta { font-size: var(--fs-base); }

  /* ---------- Statcast tool controls (heatmap / pitch chart) ---------- */
  #cpStatLookupModule .cp-sl-tool-controls {
    display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 18px;
    padding: 12px 14px; margin-bottom: 10px;
    background: rgba(137,207,240,0.08); border: 1px solid rgba(20,20,20,0.08); border-radius: 14px;
  }
  #cpStatLookupModule .cp-sl-tool-controls label { display: inline-flex; flex-direction: column; gap: 5px; }
  #cpStatLookupModule .cp-sl-tool-controls .cp-sl-chart-label { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
  #cpStatLookupModule .cp-sl-tool-controls select { min-width: 150px; }
  #cpStatLookupModule .cp-sl-heatmap-legendrow { display: flex; align-items: center; gap: 10px; margin-left: auto; }
  #cpStatLookupModule .cp-sl-heatmap-legend { width: 168px; height: 12px; border-radius: 7px; border: 1px solid rgba(20,20,20,0.12); }
  #cpStatLookupModule .cp-sl-heatmap-legend-labels { display: flex; justify-content: space-between; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; color: var(--muted); width: 168px; }
  /* Sized so the 380-unit plot inside the wider canvas keeps its old on-screen
     width — see the geometry note in heatmapSvg. */
  #cpStatLookupModule .cp-sl-heatmap-svg { max-width: 620px; }
  #cpStatLookupModule .cp-sl-heatmap-stage { display: flex; justify-content: center; }
  #cpStatLookupModule .cp-sl-pitchchart-svg { max-width: 1040px; }
  /* Column-picker chips for the customizable pitch chart. */
  #cpStatLookupModule .cp-sl-colpicker { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
  #cpStatLookupModule .cp-sl-colchip {
    font-family: var(--sans); font-size: var(--fs-sm); font-weight: 800; letter-spacing: .02em;
    padding: 6px 11px; border-radius: 999px; cursor: pointer; user-select: none;
    background: #fff; color: var(--muted); border: 1px solid rgba(20,20,20,0.16); transition: all .12s ease;
  }
  #cpStatLookupModule .cp-sl-colchip.is-active { background: var(--red, #c41e3a); color: #fff; border-color: var(--red, #c41e3a); }
  #cpStatLookupModule .cp-sl-colchip:hover { border-color: var(--red, #c41e3a); }
  #cpStatLookupModule .cp-sl-colpicker-hint { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; color: var(--muted); margin-right: 4px; }

  /* ---------- Sortable table headers ---------- */
  #cpStatLookupModule .cp-sl-sortable-th { cursor: pointer; user-select: none; position: relative; white-space: nowrap; }
  #cpStatLookupModule .cp-sl-sortable-th:hover { color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-sortable-th::after {
    content: "\2195"; margin-left: 4px; font-size: var(--fs-micro); opacity: 0.25; vertical-align: middle;
  }
  #cpStatLookupModule .cp-sl-sortable-th[data-sort-dir="asc"]::after { content: "\2191"; opacity: 0.95; }
  #cpStatLookupModule .cp-sl-sortable-th[data-sort-dir="desc"]::after { content: "\2193"; opacity: 0.95; }

  /* ---------- Retry on a failed load ---------- */
  #cpStatLookupModule .cp-sl-spark { display: flex; align-items: center; gap: 9px; }
  #cpStatLookupModule .cp-sl-headrow { margin-top: 10px; }
  #cpStatLookupModule .cp-sl-spark svg { width: 150px; height: 34px; overflow: visible; }
  #cpStatLookupModule .cp-sl-spark path { fill: none; stroke: var(--red, #c41e3a); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
  #cpStatLookupModule .cp-sl-spark-arrow { font-size: var(--fs-base); line-height: 1; }
  #cpStatLookupModule .cp-sl-spark-arrow.is-good { color: #1a7f37; }
  #cpStatLookupModule .cp-sl-spark-arrow.is-bad { color: var(--red-dark, #a01829); }
  #cpStatLookupModule .cp-sl-spark-arrow.is-flat { color: var(--muted); }
  #cpStatLookupModule .cp-sl-toplink { padding: 5px 11px; }
  #cpStatLookupModule .cp-sl-spark circle { fill: var(--red, #c41e3a); stroke: #fff; stroke-width: 1.2; }
  #cpStatLookupModule .cp-sl-spark-label { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
  #cpStatLookupModule .cp-sl-retry {
    display: inline-block; margin-left: 10px; padding: 4px 13px; border-radius: 999px; cursor: pointer;
    border: 1px solid rgba(196, 30, 58, 0.5); background: #fff; color: var(--red-dark);
    font-family: var(--sans); font-size: var(--fs-sm); font-weight: 800;
  }
  #cpStatLookupModule .cp-sl-retry:hover { background: rgba(196, 30, 58, 0.08); }

  /* Anything carrying a glossary definition reads as inspectable. */
  #cpStatLookupModule .cp-sl-stat span[title] { cursor: help; text-decoration: underline dotted rgba(143, 21, 41, 0.35); text-underline-offset: 2px; }
  #cpStatLookupModule .cp-sl-pitchtag { display: inline-block; min-width: 30px; text-align: center; padding: 1px 6px; border-radius: 5px; font-size: var(--fs-xs); font-weight: 900; letter-spacing: .02em; margin-right: 4px; }
  /* A stat you can watch. Deliberately quiet — a dense table cannot carry 27
     coloured links, so it reads as text until the pointer is on it. */
  #cpStatLookupModule .cp-sl-cliplink { position: relative; color: inherit; text-decoration: none; border-bottom: 1px dotted rgba(196,30,58,.55); cursor: pointer; }
  #cpStatLookupModule .cp-sl-cliplink:hover { color: var(--red); border-bottom-color: var(--red); }
  /* OUT OF FLOW, deliberately. These live in right-aligned numeric columns, and
     an `opacity: 0` marker still reserves its box — so every figure that had a
     video sat 16.5px to the LEFT of the plain figures in the same column, and a
     column with a mix of the two looked ragged. Absolute positioning keeps the
     digits where the column puts them; the marker sits in the cell's own right
     padding and only paints on hover. */
  #cpStatLookupModule .cp-sl-cliplink::after {
    content: "▸"; position: absolute; left: 100%; bottom: 0; margin-left: 2px;
    font-size: var(--fs-micro); line-height: inherit; opacity: 0;
    transition: opacity .12s ease; pointer-events: none;
  }
  #cpStatLookupModule .cp-sl-cliplink:hover::after { opacity: .85; }
  #cpStatLookupModule .cp-sl-pc-head { font-family: var(--sans); font-size: var(--fs-md); font-weight: 800; letter-spacing: .04em; fill: var(--muted); }
  #cpStatLookupModule .cp-sl-pc-tag { font-family: var(--sans); font-size: var(--fs-md); font-weight: 900; }
  #cpStatLookupModule .cp-sl-pc-val { font-family: var(--sans); font-size: var(--fs-xl); font-weight: 600; fill: var(--ink); }
  #cpStatLookupModule.cp-is-mobile .cp-sl-tool-controls { flex-direction: column; align-items: stretch; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-heatmap-legendrow { margin-left: 0; }
  /* Pitch reclassification builder */
  #cpStatLookupModule .cp-reclass { margin: 10px 0 4px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(180deg,#fffdf8,#f6f2ea); overflow: hidden; }
  #cpStatLookupModule .cp-reclass-open { box-shadow: 0 6px 18px rgba(0,0,0,0.06); }
  #cpStatLookupModule .cp-reclass-toggle { display: flex; align-items: center; gap: 10px; width: 100%; padding: 11px 14px; background: transparent; border: 0; cursor: pointer; font-family: var(--sans); text-align: left; }
  #cpStatLookupModule .cp-reclass-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(20,20,20,0.2); flex: 0 0 auto; }
  #cpStatLookupModule .cp-reclass-dot.is-on { background: var(--red, #c41e3a); box-shadow: 0 0 0 3px rgba(196,30,58,0.18); }
  #cpStatLookupModule .cp-reclass-title { font-weight: 800; font-size: var(--fs-base); color: var(--ink); }
  #cpStatLookupModule .cp-reclass-summary { font-size: var(--fs-xs); font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
  #cpStatLookupModule .cp-reclass-caret { margin-left: auto; color: var(--muted); font-size: var(--fs-sm); }
  #cpStatLookupModule .cp-reclass-body { padding: 4px 14px 14px; border-top: 1px solid var(--line-soft); }
  #cpStatLookupModule .cp-reclass-hint { margin: 10px 0; font-size: var(--fs-sm); color: var(--muted); line-height: 1.45; }
  #cpStatLookupModule .cp-reclass-empty { padding: 12px; font-size: var(--fs-sm); color: var(--muted); text-align: center; border: 1px dashed var(--line); border-radius: 9px; }
  #cpStatLookupModule .cp-reclass-rule { padding: 11px; border: 1px solid var(--line); border-radius: 10px; background: #fffdf8; margin-bottom: 9px; }
  #cpStatLookupModule .cp-reclass-line { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
  #cpStatLookupModule .cp-reclass-field { display: flex; flex-direction: column; gap: 3px; min-width: 150px; flex: 1 1 auto; }
  #cpStatLookupModule .cp-reclass-flabel { font-size: var(--fs-xs); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
  #cpStatLookupModule .cp-reclass-arrow { font-size: var(--fs-lg); color: var(--red, #c41e3a); font-weight: 900; padding-bottom: 6px; }
  #cpStatLookupModule .cp-reclass-remove { margin-left: auto; align-self: center; width: 28px; height: 28px; border-radius: 8px; border: 1px solid var(--line); background: #fff; color: var(--muted); cursor: pointer; font-size: var(--fs-base); line-height: 1; }
  #cpStatLookupModule .cp-reclass-remove:hover { border-color: var(--red, #c41e3a); color: var(--red, #c41e3a); }
  #cpStatLookupModule .cp-reclass-windows { margin-top: 11px; padding-top: 10px; border-top: 1px dashed var(--line-soft); }
  #cpStatLookupModule .cp-reclass-wlabel { display: block; font-size: var(--fs-xs); font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
  #cpStatLookupModule .cp-reclass-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px 20px; }
  /* Identity (single-pitch) reclass rules */
  #cpStatLookupModule .cp-reclass-fromstatic { display: inline-flex; flex-direction: column; gap: 2px; }
  #cpStatLookupModule .cp-reclass-fromstatic strong { font-family: var(--sans); font-size: var(--fs-base); color: var(--ink); padding: 5px 0; }
  #cpStatLookupModule .cp-reclass-pitches { margin-top: 11px; padding-top: 10px; border-top: 1px dashed var(--line-soft); }
  #cpStatLookupModule .cp-reclass-pchips { display: flex; flex-wrap: wrap; gap: 6px; }
  /* A lassoed bundle can hold hundreds of pitches. The list is still available
     in full — it just scrolls in its own box instead of pushing the rest of
     the panel (and every other rule) off the screen. */
  #cpStatLookupModule .cp-reclass-pchips.is-scroll {
    max-height: 168px; overflow-y: auto; padding: 8px; border-radius: 10px;
    background: rgba(0,0,0,0.025); border: 1px solid var(--line-soft); align-content: flex-start;
  }
  #cpStatLookupModule .cp-reclass-bundlehead { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
  #cpStatLookupModule .cp-reclass-bundlehead .cp-reclass-wlabel { flex: 1 1 auto; margin-bottom: 8px; }
  #cpStatLookupModule .cp-reclass-bundlespan { text-transform: none; letter-spacing: 0; font-weight: 700; color: #514c45; font-family: var(--sans); }
  /* A region rule keeps acting on data that arrives later, so its badge is
     colour-coded rather than the neutral grey a bundle's span uses. */
  #cpStatLookupModule .cp-reclass-autotag {
    background: rgba(196, 30, 58, 0.10); border: 1px solid rgba(196, 30, 58, 0.28);
    color: var(--red-dark, #8f1528); border-radius: 999px; padding: 1px 7px;
  }
  #cpStatLookupModule .cp-reclass-chiptoggle {
    border: 1px solid var(--line-soft); background: #ffffff; color: var(--red-dark); cursor: pointer;
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; padding: 4px 10px; border-radius: 999px; white-space: nowrap;
  }
  #cpStatLookupModule .cp-reclass-chiptoggle:hover { border-color: rgba(196,30,58,0.45); background: rgba(196,30,58,0.06); }
  #cpStatLookupModule .cp-reclass-pchip {
    display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 9px; border-radius: 999px;
    background: rgba(137,207,240,0.16); border: 1px solid rgba(58,102,176,0.25);
    font-family: var(--sans); font-size: var(--fs-xs); color: var(--ink); white-space: nowrap;
  }
  #cpStatLookupModule .cp-reclass-pchip button {
    border: 0; background: rgba(0,0,0,0.06); color: var(--muted); cursor: pointer; line-height: 1;
    width: 16px; height: 16px; border-radius: 999px; font-size: var(--fs-base); display: inline-flex; align-items: center; justify-content: center;
  }
  #cpStatLookupModule .cp-reclass-pchip button:hover { background: rgba(196,30,58,0.16); color: var(--red-dark); }
  #cpStatLookupModule .cp-reclass-wname { font-size: var(--fs-xs); font-weight: 800; color: #514c45; }
  #cpStatLookupModule .cp-reclass-metrichead { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 2px; }
  #cpStatLookupModule .cp-reclass-readout { font-size: var(--fs-xs); font-weight: 800; color: var(--red-dark, #a01829); font-variant-numeric: tabular-nums; }
  #cpStatLookupModule .cp-reclass-slider { position: relative; height: 24px; }
  #cpStatLookupModule .cp-reclass-slider-rail { position: absolute; top: 10px; left: 0; right: 0; height: 4px; border-radius: 3px; background: rgba(20,20,20,0.14); }
  #cpStatLookupModule .cp-reclass-slider-fill { position: absolute; top: 10px; height: 4px; border-radius: 3px; background: var(--red, #c41e3a); }
  #cpStatLookupModule .cp-reclass-slider input[type=range] { position: absolute; top: 0; left: 0; width: 100%; height: 24px; margin: 0; background: transparent; pointer-events: none; -webkit-appearance: none; appearance: none; }
  #cpStatLookupModule .cp-reclass-slider input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; pointer-events: auto; width: 15px; height: 15px; border-radius: 50%; background: #fff; border: 2px solid var(--red, #c41e3a); box-shadow: 0 1px 3px rgba(0,0,0,0.25); cursor: pointer; margin-top: 0; }
  #cpStatLookupModule .cp-reclass-slider input[type=range]::-moz-range-thumb { pointer-events: auto; width: 15px; height: 15px; border-radius: 50%; background: #fff; border: 2px solid var(--red, #c41e3a); box-shadow: 0 1px 3px rgba(0,0,0,0.25); cursor: pointer; }
  #cpStatLookupModule .cp-reclass-slider input[type=range]::-webkit-slider-runnable-track { background: transparent; height: 24px; }
  #cpStatLookupModule .cp-reclass-slider input[type=range]::-moz-range-track { background: transparent; height: 24px; }
  #cpStatLookupModule .cp-reclass-actions { display: flex; gap: 8px; margin-top: 4px; }
  #cpStatLookupModule .cp-reclass-add { padding: 7px 13px; border-radius: 8px; border: 1px solid var(--red, #c41e3a); background: var(--red, #c41e3a); color: #fff; font-family: var(--sans); font-weight: 800; font-size: var(--fs-sm); cursor: pointer; }
  #cpStatLookupModule .cp-reclass-add:hover { filter: brightness(1.05); }
  #cpStatLookupModule .cp-reclass-clear { padding: 7px 13px; border-radius: 8px; border: 1px solid var(--line); background: #fff; color: var(--muted); font-family: var(--sans); font-weight: 800; font-size: var(--fs-sm); cursor: pointer; }
  #cpStatLookupModule .cp-reclass-clear:hover { border-color: var(--red, #c41e3a); color: var(--red, #c41e3a); }
  /* Percentile qualifier list */
  #cpStatLookupModule .cp-sl-pct-row.is-clickable { cursor: pointer; }
  #cpStatLookupModule .cp-sl-pct-row.is-clickable:hover .cp-sl-pct-label { fill: var(--red, #c41e3a); }
  #cpStatLookupModule .cp-pctpeers { margin-top: 10px; border: 1px solid var(--line); border-radius: 12px; background: #fffdf8; overflow: hidden; }
  #cpStatLookupModule .cp-pctpeers-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--line-soft); font-family: var(--sans); font-size: var(--fs-sm); color: var(--ink); }
  #cpStatLookupModule .cp-pctpeers-me { margin-left: 8px; font-size: var(--fs-xs); font-weight: 800; color: var(--red-dark, #a01829); }
  #cpStatLookupModule .cp-pctpeers-actions { display: flex; gap: 6px; }
  #cpStatLookupModule .cp-pctpeers-actions button { padding: 4px 10px; border-radius: 7px; border: 1px solid var(--line); background: #fff; color: var(--muted); font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; cursor: pointer; }
  #cpStatLookupModule .cp-pctpeers-actions button:hover { border-color: var(--red, #c41e3a); color: var(--red, #c41e3a); }
  #cpStatLookupModule .cp-pctpeers-scroll { max-height: 340px; overflow: auto; }
  #cpStatLookupModule .cp-pctpeers-scroll table { width: 100%; }
  #cpStatLookupModule .cp-pctpeers-scroll thead th { position: sticky; top: 0; background: #f6f2ea; z-index: 1; }
  #cpStatLookupModule .cp-pctpeers-scroll tr.is-me td { background: rgba(196,30,58,0.10); font-weight: 900; color: var(--red-dark, #a01829); }
  /* Percentile metric customizer */
  #cpStatLookupModule .cp-pctcust-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 4px; }
  #cpStatLookupModule .cp-pctcust-row { display: flex; align-items: center; gap: 8px; padding: 5px 9px; border: 1px solid var(--line); border-radius: 8px; background: #fffdf8; }
  #cpStatLookupModule .cp-pctcust-row.is-on { border-color: rgba(196,30,58,0.35); background: #fff; }
  #cpStatLookupModule .cp-pctcust-row.is-missing { opacity: 0.55; }
  #cpStatLookupModule .cp-pctcust-check { display: flex; align-items: center; gap: 8px; flex: 1 1 auto; font-size: var(--fs-sm); font-weight: 700; color: var(--ink); cursor: pointer; }
  #cpStatLookupModule .cp-pctcust-check input { width: 15px; height: 15px; accent-color: var(--red, #c41e3a); cursor: pointer; }
  #cpStatLookupModule .cp-pctcust-na { font-size: var(--fs-xs); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
  #cpStatLookupModule .cp-pctcust-move { display: inline-flex; gap: 3px; }
  #cpStatLookupModule .cp-pctcust-move button { width: 24px; height: 22px; border-radius: 6px; border: 1px solid var(--line); background: #fff; color: var(--muted); cursor: pointer; font-size: var(--fs-micro); line-height: 1; padding: 0; }
  #cpStatLookupModule .cp-pctcust-move button:hover:not(:disabled) { border-color: var(--red, #c41e3a); color: var(--red, #c41e3a); }
  #cpStatLookupModule .cp-pctcust-move button:disabled { opacity: 0.35; cursor: default; }
  /* ---------- Landing (no player selected) ---------- */
  #cpStatLookupModule .cp-sl-landing { display: flex; flex-direction: column; gap: 28px; margin-top: 6px; }
  #cpStatLookupModule .cp-sl-landing .cp-sl-msg { padding: 4px 0 0; }
  #cpStatLookupModule .cp-sl-landing-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; }
  /* Section headings sit directly on the HOST page, which is dark — they cannot
     use --ink (that assumes the light panels the rest of the module renders
     inside). --red-dark reads on either surface, which is why it was chosen
     originally; only the rule and its diamond changed. */
  #cpStatLookupModule .cp-sl-landing-title { font-family: var(--sans); font-size: var(--fs-sm); font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase; color: var(--red-dark); white-space: nowrap; }
  #cpStatLookupModule .cp-sl-landing-rule { flex: 1; height: 1px; background: var(--line); }
  #cpStatLookupModule .cp-sl-landing-sub { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
  /* Quiet action pinned to the right of a landing section header (Clear). Kept
     understated: it sits beside a heading, not inside the content. */
  #cpStatLookupModule .cp-sl-landing-headaction {
    flex: 0 0 auto; padding: 3px 10px; border-radius: 999px; border: 1px solid var(--line);
    background: transparent; color: var(--muted); font-family: var(--sans); font-size: var(--fs-xs);
    font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; cursor: pointer;
  }
  #cpStatLookupModule .cp-sl-landing-headaction:hover { border-color: var(--red, #c41e3a); color: var(--red, #c41e3a); }
  #cpStatLookupModule .cp-sl-landing-meta { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); }

  /* Recently viewed: cards with a face on them. A row of identical text pills
     gave the eye nothing to land on — these are scanned by photo first. */
  #cpStatLookupModule .cp-sl-landing-pills { display: grid; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); gap: 9px; }
  #cpStatLookupModule .cp-sl-recentcard {
    position: relative; display: flex; align-items: center; gap: 10px; width: 100%;
    padding: 9px 11px; border-radius: 14px; border: 1px solid var(--line);
    background: linear-gradient(180deg, #ffffff, #fbf8f2); cursor: pointer;
    font-family: var(--serif); color: var(--ink); text-align: left;
    transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
  }
  #cpStatLookupModule .cp-sl-recentcard:hover {
    border-color: rgba(196, 30, 58, 0.45); transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.09);
  }
  #cpStatLookupModule .cp-sl-recentavatar { width: 38px; height: 57px; }
  #cpStatLookupModule .cp-sl-recentbody { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  #cpStatLookupModule .cp-sl-recentname { font-size: var(--fs-md); font-weight: 900; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #cpStatLookupModule .cp-sl-recentmeta { font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); }
  /* In flow, not absolute: an overlaid badge sat on top of the truncating name. */
  #cpStatLookupModule .cp-sl-recentcard .cp-sl-option-rank { margin-left: auto; min-width: 24px; height: 19px; font-size: var(--fs-micro); padding: 0 5px; border-radius: 6px; }

  /* Leaders toolbar: one framed control block instead of three identical chip
     rows, so the primary view switch reads louder than its filters. */
  #cpStatLookupModule .cp-sl-leadbar {
    display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px;
    padding: 11px 12px; border-radius: 16px; border: 1px solid var(--line);
    /* Opaque: this panel sits on the host page, whose background the module
       does not control, so a translucent fill would invert on a dark theme. */
    background: linear-gradient(180deg, #f4f9fd, #fffdf8);
  }
  #cpStatLookupModule .cp-sl-leadbar-primary { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
  #cpStatLookupModule .cp-sl-leadtabs {
    display: inline-flex; padding: 3px; border-radius: 999px; border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.85); gap: 2px; flex-wrap: wrap;
  }
  #cpStatLookupModule .cp-sl-leadtabs button {
    height: 32px; padding: 0 15px; border: 0; border-radius: 999px; background: transparent;
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.07em;
    text-transform: uppercase; color: #6b6459; cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
  }
  #cpStatLookupModule .cp-sl-leadtabs button:hover { color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-leadtabs button.is-active {
    background: linear-gradient(180deg, #cc314b, #ad1b34); color: #fff;
    box-shadow: 0 2px 6px rgba(196, 30, 58, 0.28);
  }
  #cpStatLookupModule .cp-sl-leadbar-filters { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
  #cpStatLookupModule .cp-sl-leadfilter { display: inline-flex; align-items: center; gap: 7px; flex-wrap: wrap; }
  #cpStatLookupModule .cp-sl-leadfilter > span {
    font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.1em;
    text-transform: uppercase; color: var(--muted);
  }
  #cpStatLookupModule .cp-sl-leadfilter button {
    height: 26px; padding: 0 11px; border-radius: 999px; border: 1px solid rgba(0, 0, 0, 0.12);
    background: rgba(255, 255, 255, 0.8); font-family: var(--sans); font-size: var(--fs-xs);
    font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; color: #5d574d; cursor: pointer;
    transition: border-color 0.14s ease, background 0.14s ease, color 0.14s ease;
  }
  #cpStatLookupModule .cp-sl-leadfilter button:hover { border-color: rgba(196, 30, 58, 0.45); color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-leadfilter button.is-active { background: rgba(196, 30, 58, 0.12); border-color: rgba(196, 30, 58, 0.45); color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-leadrandom {
    margin-left: auto; height: 32px; padding: 0 14px; border-radius: 999px;
    border: 1px dashed rgba(0, 0, 0, 0.22); background: rgba(255, 255, 255, 0.6);
    font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.07em;
    text-transform: uppercase; color: #6b6459; cursor: pointer;
  }
  #cpStatLookupModule .cp-sl-leadrandom:hover { border-color: rgba(196, 30, 58, 0.5); color: var(--red-dark); border-style: solid; }
  #cpStatLookupModule .cp-sl-landing-levels { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
  /* Three columns, not four. At the module's 964px content width a 232px min
     gave four ~231px cards, and after the rank, level chip, value and gaps the
     name was left ~90px — about 13 characters, so most full names truncated.
     A 300px min yields three ~312px cards and roughly 170px of name. */
  #cpStatLookupModule .cp-sl-leadgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 13px; }
  #cpStatLookupModule .cp-sl-leadboard {
    border: 1px solid var(--line); border-radius: 15px; background: #fffdf8; overflow: hidden;
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.045); transition: box-shadow 0.16s ease, transform 0.16s ease;
  }
  #cpStatLookupModule .cp-sl-leadboard:hover { box-shadow: 0 8px 20px rgba(0, 0, 0, 0.10); transform: translateY(-2px); }
  /* A thin red cap plus a light title bar, rather than a solid red block: with
     eight to ten boards on screen at once, filled headers become a wall. */
  #cpStatLookupModule .cp-sl-leadboard { border-top: 3px solid var(--red); }
  #cpStatLookupModule .cp-sl-leadboard-title {
    display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px;
    border-bottom: 1px solid var(--line-soft); font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900;
    letter-spacing: 0.08em; text-transform: uppercase; color: var(--red-dark);
    background: linear-gradient(180deg, rgba(137, 207, 240, 0.16), rgba(137, 207, 240, 0.06));
  }
  #cpStatLookupModule .cp-sl-leadboard-title span {
    font-size: var(--fs-micro); color: var(--muted); letter-spacing: 0.05em; font-weight: 800;
    padding: 2px 7px; border-radius: 999px; background: rgba(0, 0, 0, 0.05); white-space: nowrap;
  }
  #cpStatLookupModule .cp-sl-leadrow { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 12px; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; cursor: pointer; font-family: var(--serif); font-size: var(--fs-base); color: var(--ink); text-align: left; }
  #cpStatLookupModule .cp-sl-leadrow:last-child { border-bottom: 0; }
  #cpStatLookupModule .cp-sl-leadrow:hover { background: rgba(137, 207, 240, 0.16); }
  #cpStatLookupModule .cp-sl-leadrank { flex: 0 0 auto; width: 17px; text-align: center; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; color: var(--muted); }
  #cpStatLookupModule .cp-sl-leadname { flex: 1 1 auto; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #cpStatLookupModule .cp-sl-leadlevel {
    flex: 0 0 auto; font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.06em;
    text-transform: uppercase; color: #23546f; background: rgba(137, 207, 240, 0.24);
    border-radius: 999px; padding: 2px 6px;
  }
  #cpStatLookupModule .cp-sl-leadvalue { flex: 0 0 auto; min-width: 46px; text-align: right; font-family: var(--sans); font-size: var(--fs-base); font-weight: 900; color: var(--red-dark); font-variant-numeric: tabular-nums; }
  #cpStatLookupModule .cp-sl-leadempty { padding: 14px; text-align: center; color: var(--muted); font-size: var(--fs-base); }
  #cpStatLookupModule .cp-sl-leadsub { display: block; font-size: var(--fs-micro); font-weight: 800; color: var(--muted); text-align: right; }
  #cpStatLookupModule .cp-sl-leadboard .cp-sl-leadrow:nth-of-type(even) { background: rgba(137, 207, 240, 0.06); }
  #cpStatLookupModule .cp-sl-leadboard .cp-sl-leadrow:hover { background: rgba(137, 207, 240, 0.18); }
  #cpStatLookupModule .cp-sl-leadrank.cp-lead-gold, #cpStatLookupModule .cp-sl-leadrank.cp-lead-silver, #cpStatLookupModule .cp-sl-leadrank.cp-lead-bronze {
    display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px;
    border-radius: 50%; border: 1px solid rgba(0, 0, 0, 0.12); font-size: var(--fs-micro);
  }
  #cpStatLookupModule .cp-sl-leadrank.cp-lead-gold { background: linear-gradient(180deg, #f7dd7f, #c9962a); color: #402e06; }
  #cpStatLookupModule .cp-sl-leadrank.cp-lead-silver { background: linear-gradient(180deg, #f0f1f5, #a4a9b6); color: #2b2e36; }
  #cpStatLookupModule .cp-sl-leadrank.cp-lead-bronze { background: linear-gradient(180deg, #ecb27e, #a8642f); color: #3a2008; }

  /* Active streak boards */
  /* Four streak boards in a 3-wide grid would strand one alone on a second
     row, so the streak grid wraps to 2x2 before it gets there. The single-game
     highs grid, which has six, keeps the 3-wide shape via its own modifier. */
  #cpStatLookupModule .cp-sl-streakgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  #cpStatLookupModule .cp-sl-streakgrid.cp-sl-highsgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  @media (max-width: 1080px) { #cpStatLookupModule .cp-sl-streakgrid.cp-sl-highsgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 760px) { #cpStatLookupModule .cp-sl-streakgrid, #cpStatLookupModule .cp-sl-streakgrid.cp-sl-highsgrid { grid-template-columns: 1fr; } }
  #cpStatLookupModule .cp-sl-streakrow { display: flex; align-items: center; gap: 10px; padding: 10px 12px; font-size: var(--fs-base); }
  #cpStatLookupModule .cp-sl-streak-mid { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
  #cpStatLookupModule .cp-sl-streak-mid strong { font-weight: 900; font-size: var(--fs-base); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  /* Single-game-high details carry an opponent club name, so the line has to
     clip rather than wrap — streak details are short and are unaffected. */
  #cpStatLookupModule .cp-sl-streak-mid em { font-style: normal; font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #cpStatLookupModule .cp-sl-streak-val { flex: 0 0 auto; text-align: right; font-family: var(--sans); font-weight: 900; font-size: var(--fs-xl); line-height: 1; color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-streak-val em { display: block; font-style: normal; font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-top: 3px; }

  /* A face per row: every other surface on the site identifies a player by
     photo first, and five text lines per board gave the eye nothing to land
     on. Full 2:3 asset, never cropped square — see the avatar rule above. */
  #cpStatLookupModule .cp-sl-streakavatar { width: 26px; height: 39px; flex: 0 0 auto; }
  #cpStatLookupModule .cp-sl-streakrow { align-items: center; padding: 9px 12px; }
  #cpStatLookupModule .cp-sl-streak-mid strong { display: flex; align-items: center; gap: 6px; }
  /* A bare text node in a flex row cannot be truncated, so the name gets its
     own item — long ones ran under the value column instead of ellipsising. */
  #cpStatLookupModule .cp-sl-streak-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  #cpStatLookupModule .cp-sl-streak-mid strong .cp-sl-option-rank { flex: 0 0 auto; min-width: 22px; height: 16px; padding: 0 4px; border-radius: 5px; font-size: var(--fs-micro); }

  /* A number that is still moving. The pulse is the same vocabulary the header
     streak chips use, so "live" reads the same everywhere on the page. */
  #cpStatLookupModule .cp-sl-livepill {
    flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px;
    padding: 0 5px; height: 14px; border-radius: 4px;
    background: var(--red, #c41e3a); color: #fff;
    font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.08em;
    animation: cpStreakPulse 2s ease-in-out infinite;
  }
  @media (prefers-reduced-motion: reduce) {
    #cpStatLookupModule .cp-sl-livepill { animation: none !important; }
  }
  /* Streak length as a bar, scaled to the board leader. Five numbers alone did
     not show whether the leader is clear of the field or the pack is level. */
  #cpStatLookupModule .cp-sl-streakbar { display: block; height: 3px; margin-top: 5px; border-radius: 3px; background: rgba(0, 0, 0, 0.08); overflow: hidden; }
  #cpStatLookupModule .cp-sl-streakbar > span { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, rgba(196, 30, 58, 0.45), var(--red)); }

  /* The leader gets the weight: a warm ground, a red spine, and a larger
     figure, so each board has a clear top line. */
  #cpStatLookupModule .cp-sl-streakboard .cp-sl-leadrow.is-leader,
  #cpStatLookupModule .cp-sl-streakboard .cp-sl-leadrow.is-leader:nth-of-type(even) {
    background: linear-gradient(90deg, rgba(196, 30, 58, 0.10), rgba(196, 30, 58, 0.02));
    box-shadow: inset 3px 0 0 var(--red);
  }
  #cpStatLookupModule .cp-sl-streakboard .cp-sl-leadrow.is-leader:hover { background: linear-gradient(90deg, rgba(196, 30, 58, 0.16), rgba(137, 207, 240, 0.12)); }
  #cpStatLookupModule .cp-sl-streakrow.is-leader .cp-sl-streak-val { font-size: var(--fs-2xl); }
  #cpStatLookupModule .cp-sl-streakrow.is-leader .cp-sl-streak-mid strong { font-size: var(--fs-md); }
  #cpStatLookupModule .cp-sl-streakrow.is-leader .cp-sl-streakavatar { width: 30px; height: 45px; border-color: rgba(196, 30, 58, 0.35); }

  /* Prospect spotlight */
  #cpStatLookupModule .cp-sl-spotlight { display: flex; align-items: center; gap: 18px; width: 100%; padding: 16px 20px; border-radius: 18px; border: 1px solid rgba(227, 185, 74, 0.55); background: linear-gradient(130deg, #fffdf8 30%, #fdf3d9 100%); cursor: pointer; font-family: var(--serif); color: var(--ink); text-align: left; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset; transition: transform 0.15s ease, box-shadow 0.15s ease; }
  #cpStatLookupModule .cp-sl-spotlight:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0, 0, 0, 0.12); }
  #cpStatLookupModule .cp-sl-spot-photo { width: 76px; height: 114px; flex: 0 0 auto; border-radius: 12px; object-fit: cover; object-position: center top; background: var(--sky-light); border: 2px solid rgba(227, 185, 74, 0.7); }
  #cpStatLookupModule .cp-sl-spot-body { min-width: 0; }
  #cpStatLookupModule .cp-sl-spot-kicker { display: block; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 900; letter-spacing: 0.13em; text-transform: uppercase; color: #a3771b; }
  #cpStatLookupModule .cp-sl-spot-name { display: flex; align-items: center; gap: 9px; margin-top: 2px; font-size: var(--fs-2xl); font-weight: 900; }
  #cpStatLookupModule .cp-sl-spot-stats { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 9px; }
  #cpStatLookupModule .cp-sl-spot-stat { display: flex; flex-direction: column; }
  #cpStatLookupModule .cp-sl-spot-stat strong { font-family: var(--sans); font-size: var(--fs-md); font-weight: 900; color: var(--red-dark); }
  #cpStatLookupModule .cp-sl-spot-stat em { font-style: normal; font-family: var(--sans); font-size: var(--fs-micro); font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }

  /* ---------- Landing: mobile ----------
     One column of full-width cards turned "recently viewed" into a screenful,
     the section sub-line was clipped by its nowrap, and the leaders toolbar
     wrapped mid-control (a lone "Active Streaks" on its own line inside the
     segmented pill). Each of those gets an explicit mobile treatment. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-landing { gap: 22px; }
  /* Header: title on one line, context beneath it, rule dropped — there is no
     horizontal room for a rule AND a nowrap sub-line. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-landing-head { flex-wrap: wrap; gap: 4px 10px; margin-bottom: 10px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-landing-rule { display: none; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-landing-sub { flex-basis: 100%; white-space: normal; }
  /* The rule is hidden on mobile, so push the action to the right explicitly. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-landing-headaction { margin-left: auto; }

  /* Recently viewed becomes a single swipeable row instead of eight stacked
     full-width cards. Scroll snapping keeps a card aligned to the left edge. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-landing-pills {
    display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    /* Stays inside the content box. A full-bleed negative margin assumes the
       module's exact horizontal padding and pushed the strip past both edges,
       giving the whole page a horizontal scrollbar. The card width already
       leaves the next one part-visible, which is the scroll affordance. */
    padding: 2px 0 6px;
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-landing-pills::-webkit-scrollbar { display: none; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-recentcard {
    flex: 0 0 auto; width: 158px; scroll-snap-align: start; flex-direction: column;
    align-items: flex-start; gap: 7px; padding: 9px;
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-recentavatar { width: 100%; height: 96px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-recentbody { width: 100%; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-recentname { font-size: var(--fs-base); white-space: normal; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-recentcard .cp-sl-option-rank {
    position: absolute; top: 13px; right: 13px; margin: 0;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-recentcard:hover { transform: none; }

  /* Toolbar: tabs as a 2x2 grid (they will not fit on one line and wrapping a
     segmented control mid-row looks broken), then a full-width Surprise Me. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadbar { padding: 10px; gap: 9px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadbar-primary { display: block; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadtabs { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; width: 100%; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadtabs button { width: 100%; padding: 0 6px; font-size: var(--fs-xs); }
  /* An odd tab count would otherwise leave a hole in the 2-col grid. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadtabs button:last-child:nth-child(odd) { grid-column: 1 / -1; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadrandom { display: block; width: 100%; margin: 9px 0 0; }
  /* ---------- Mobile filter disclosure ----------
     Matches the block in the other tabs. The collapsed state is carried as
     [data-collapsed] rather than [hidden] because the row must stay visible
     on desktop, where the toggle does not exist. */
  #cpStatLookupModule .cp-sl-leadfiltertoggle { display: none; }

  #cpStatLookupModule.cp-is-mobile .cp-sl-leadfiltertoggle {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
    height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: #ffffff;
    font-family: var(--sans);
    font-size: var(--fs-xs);
    font-weight: 900;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: var(--ink);
    cursor: pointer;
  }

  #cpStatLookupModule .cp-sl-leadfiltercount {
    min-width: 17px;
    height: 17px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--red);
    color: #ffffff;
    font-size: var(--fs-micro);
    line-height: 17px;
    text-align: center;
  }

  #cpStatLookupModule .cp-sl-leadfiltercaret {
    margin-left: auto;
    font-size: var(--fs-md);
    line-height: 1;
    transition: transform 0.18s ease;
  }

  #cpStatLookupModule .cp-sl-leadfiltertoggle[aria-expanded="true"] .cp-sl-leadfiltercaret { transform: rotate(90deg); }

  @media (prefers-reduced-motion: reduce) {
    #cpStatLookupModule .cp-sl-leadfiltercaret { transition: none; }
  }

  #cpStatLookupModule.cp-is-mobile .cp-sl-leadbar-filters { flex-direction: column; align-items: stretch; gap: 8px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadbar-filters[data-collapsed] { display: none; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadfilter { align-items: center; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadfilter > span { flex-basis: 100%; }

  /* Boards: one per row, with room for long names next to the value. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadgrid { grid-template-columns: 1fr; gap: 10px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadboard:hover { transform: none; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadrow { padding: 9px 11px; }

  /* Spotlight: the name is long and the photo was eating the width. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-spotlight { gap: 13px; padding: 13px 14px; align-items: flex-start; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-spot-photo { width: 62px; height: 93px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-spot-name { font-size: var(--fs-lg); flex-wrap: wrap; gap: 6px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-spot-stats { gap: 12px; margin-top: 7px; }
  #cpStatLookupModule.cp-is-mobile .cp-sl-spotlight:hover { transform: none; }

  /* Loading indicators for background-enriched split columns */
  #cpStatLookupModule .cp-sl-loadcell { display: inline-block; color: var(--red-dark, #a01829); letter-spacing: 1px; font-weight: 900; font-size: var(--fs-micro); animation: cpSlLoadPulse 1s ease-in-out infinite; }
  #cpStatLookupModule .cp-sl-loadnote { color: var(--red-dark, #a01829); font-weight: 800; animation: cpSlLoadPulse 1.2s ease-in-out infinite; }
  @keyframes cpSlLoadPulse { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }


  /* Narrow screens lift the bottom of the type scale: the same chip that can
     sit at 11.5px on a desktop table is being read at arm's length on a phone.
     Only the small end moves -- headings are already large enough. */
  @media (max-width: 640px) {
    #cpStatLookupModule {
      --fs-micro: 12px;
      --fs-xs: 12.5px;
      --fs-sm: 13.5px;
      --fs-base: 14.5px;
      --fs-md: 15.5px;
    }
  }

  /* iOS holds a tap for ~300ms waiting to see whether a double-tap-zoom is
     coming. `manipulation` releases it, which is the single cheapest
     responsiveness win on a phone. Applied to everything interactive rather
     than per-control, so a new button cannot forget it. */
  #cpStatLookupModule button,
  #cpStatLookupModule a,
  #cpStatLookupModule select,
  #cpStatLookupModule input,
  #cpStatLookupModule [role="button"],
  #cpStatLookupModule [role="tab"] { touch-action: manipulation; }

  /* Phones with a home indicator overlay the bottom of the viewport. A spacer
     rather than a padding override: every module sets its own padding under
     `.cp-is-mobile`, which is more specific than this bare id, so an override
     silently lost. This ADDS to whatever padding is already there. */
  @media (max-width: 640px) {
    #cpStatLookupModule::after {
      content: "";
      display: block;
      height: env(safe-area-inset-bottom, 0px);
    }
  }

  /* ---- SELECTOR NORMALISATION -------------------------------------------
     Every option control on the player page is the same kind of thing -- a
     pill you pick from -- but they had drifted into four different shapes:
     heights 30/32/34/38, paddings 12/14/15/16, three letter-spacings, two
     weights, and .cp-sl-stattab alone missing text-transform. Stacked in the
     same view they read as four unrelated widgets.

     One treatment, taken from the Transactions/Alerts toolbar, which is the
     version of this control that already worked. Declared last so it wins on
     source order at equal specificity; the deliberate mobile overrides further
     down are more specific and still apply. */
  #cpStatLookupModule .cp-sl-chip,
  #cpStatLookupModule .cp-sl-lvlchip,
  #cpStatLookupModule .cp-sl-stattab,
  #cpStatLookupModule .cp-sl-splitchip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 32px;
    padding: 0 14px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.9);
    font-family: var(--sans);
    font-size: var(--fs-xs);
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
    cursor: pointer;
    transition: background var(--dur-1) var(--ease), color var(--dur-1) var(--ease),
                border-color var(--dur-1) var(--ease);
  }
  #cpStatLookupModule .cp-sl-chip:hover,
  #cpStatLookupModule .cp-sl-lvlchip:hover,
  #cpStatLookupModule .cp-sl-stattab:hover,
  #cpStatLookupModule .cp-sl-splitchip:hover {
    border-color: rgba(196, 30, 58, 0.38);
    color: var(--red-dark);
  }
  /* The active pill carries the same lift the segmented controls use, so a
     selected option reads the same everywhere on the site. */
  #cpStatLookupModule .cp-sl-chip.is-active,
  #cpStatLookupModule .cp-sl-lvlchip.is-active,
  #cpStatLookupModule .cp-sl-stattab.is-active,
  #cpStatLookupModule .cp-sl-splitchip.is-active {
    background: linear-gradient(180deg, #cc314b, #ad1b34);
    border-color: transparent;
    color: #ffffff;
    box-shadow: 0 2px 6px rgba(196, 30, 58, 0.28);
  }

  /* Basic/Advanced is a true either-or tablist with nothing but buttons in it,
     so it becomes a real segmented control rather than two loose pills -- the
     same shape as .cp-sl-leadtabs and .cp-tx-tabs. */
  #cpStatLookupModule .cp-sl-stattabs {
    display: inline-flex;
    padding: 3px;
    gap: 2px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.85);
  }
  #cpStatLookupModule .cp-sl-stattabs .cp-sl-stattab {
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  #cpStatLookupModule .cp-sl-stattabs .cp-sl-stattab.is-active {
    background: linear-gradient(180deg, #cc314b, #ad1b34);
    box-shadow: 0 2px 6px rgba(196, 30, 58, 0.28);
  }

  /* ---- MOBILE SELECTOR, matched to the Transactions toolbar ---------------
     The grid was already 2-up, but the buttons kept their desktop 32px height
     and pill radius, so the control read smaller and rounder than the same
     thing on Transactions. Same 38px target and same 12/10 radii here.
     The existing last-child:nth-child(odd) rule still spans the fifth tab. */
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadtabs {
    border-radius: 12px;
    padding: 3px;
  }
  #cpStatLookupModule.cp-is-mobile .cp-sl-leadtabs button {
    height: 38px;
    border-radius: 10px;
    justify-content: center;
  }

 carrying the @font-face rules. Every exported SVG needs its own
    // copy: the markup is rasterised standalone through an <img>, where the
    // host document's stylesheets - and any external URL - are unreachable.
    function exportFontStyleMarkup() {
      return `<style type="text/css">${EXPORT_FONT_CSS}