/* Winter Ball Updates · L2 · Stats, Stats Lab, Prospects, Player profile.
   Uses L1 theme tokens (theme.css) with local fallbacks so the module also
   renders in a bare harness. All classes are prefixed .l2- to stay out of
   L1's namespace. */

.l2 {
  --l2-bg: var(--bg, #F3F6FB);
  --l2-card: var(--card, #FFFFFF);
  --l2-card-2: var(--card-2, #F6F8FC);
  --l2-thead: var(--thead, #F3F5F9);
  --l2-ink: var(--ink, #0f2340);
  --l2-ink-2: var(--ink-2, #33415C);
  --l2-muted: #5E6B80; /* AA ≥4.5 on card, card-2, bg and blue-soft (L1's --ink-3 #77869C is 3.3–3.7) */
  --l2-line: var(--line, #E3E8F0);
  --l2-line-2: var(--rule-2, #EEF1F6);
  --l2-blue: var(--blue, #9a0f16);
  --l2-blue-soft: var(--blue-soft, #E8EFFD);
  --l2-navy: var(--navy, #0f2340);
  --l2-coral: var(--coral, #F2545B);
  --l2-mango: var(--mango, #F5A524);
  --l2-palm: var(--palm, #1E9E62);
  --l2-lagoon: var(--turq, #9a0f16);
  --l2-r: calc(var(--r, 8px) + 2px);
  --l2-shadow: var(--shadow, 0 1px 2px rgba(15,35,64,.06), 0 4px 14px rgba(15,35,64,.06));
  --l2-fd: var(--fd, "Barlow Condensed", "Arial Narrow", system-ui, sans-serif);
  --l2-fdw: var(--fdw, 700);
  --l2-fb: var(--fb, "Inter", system-ui, -apple-system, "Segoe UI", sans-serif);
  --l2-fm: var(--fm, "IBM Plex Mono", ui-monospace, Menlo, monospace);
  --l2-good-ink: #167A45; --l2-bad-ink: #B92B33; --l2-on-blue: #FFFFFF; --l2-pill-on: var(--l2-blue); --l2-seg-on: var(--l2-navy);
  --l2-sample-bg: #B3261E; --l2-rank-ink: #7A4B00; --l2-tile-hero: var(--l2-navy);
  --l2-lg-LIDOM: #1f3b6e; --l2-lg-LVBP: #F5B83D; --l2-lg-LMP: #137A42; --l2-lg-LBPRC: #C2185B;
  --l2-lgi-LIDOM: #FFFFFF; --l2-lgi-LVBP: #2B1D00; --l2-lgi-LMP: #FFFFFF; --l2-lgi-LBPRC: #FFFFFF;
  /* percentile bins: cold → hot (Savant-style) */
  --l2-p1: #BBD0F6; --l2-p2: #E1EAFB; --l2-p3: transparent; --l2-p4: #FBE0DE; --l2-p5: #F6B9B5;
  --l2-p1-ink: #0E3A8C; --l2-p5-ink: #8E1B1F; --l2-p2-ink: #2A4C8E; --l2-p4-ink: #9A3A35;
  color: var(--l2-ink);
  font-family: var(--l2-fb);
  font-size: 14px;
  line-height: 1.4;
  min-width: 0;
}
/* DARK:BEGIN (edit here; the OS-dark copy below is generated by mirroring these rules) */
:root[data-theme="dark"] .l2 {
  --l2-bg: var(--bg, #0b1622); --l2-card: var(--card, #13202e); --l2-card-2: var(--card-2, #182838);
  --l2-ink: var(--ink, #f0e2c6); --l2-ink-2: var(--ink-2, #dccbaa); --l2-muted: #bdad8c;
  --l2-line: var(--line, #2a3a4a); --l2-line-2: var(--rule-2, #22313f); --l2-blue: var(--blue, #ff8f80); --l2-blue-soft: var(--blue-soft, #22313f);
  --l2-p1: #2c3e54; --l2-p2: #1f2e3e; --l2-p4: #4A2430; --l2-p5: #74303A; --l2-p1-ink: #ead8b5; --l2-p2-ink: #cdbb98; --l2-p4-ink: #F3C0BF; --l2-p5-ink: #FFD9D7;
  --l2-good-ink: #3FCB82; --l2-bad-ink: #FF8A8F; --l2-pill-on: #0f2340; --l2-seg-on: #0f2340; --l2-sample-bg: #B3261E; --l2-rank-ink: #FFD48A; --l2-tile-hero: #1a2a3a;
  --l2-lg-LIDOM: #8fa9d9; --l2-lg-LVBP: #FFC145; --l2-lg-LMP: #3FCB82; --l2-lg-LBPRC: #FF7A93;
  --l2-lgi-LIDOM: #0b1622; --l2-lgi-LVBP: #0b1622; --l2-lgi-LMP: #0b1622; --l2-lgi-LBPRC: #0b1622;
}
:root[data-theme="dark"] .l2-scatter circle { stroke-opacity: .9; }
/* DARK:END */
/* DARK-OS:BEGIN generated from the DARK block: same rules for OS dark mode */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .l2 {
    --l2-bg: var(--bg, #0b1622); --l2-card: var(--card, #13202e); --l2-card-2: var(--card-2, #182838);
    --l2-ink: var(--ink, #f0e2c6); --l2-ink-2: var(--ink-2, #dccbaa); --l2-muted: #bdad8c;
    --l2-line: var(--line, #2a3a4a); --l2-line-2: var(--rule-2, #22313f); --l2-blue: var(--blue, #ff8f80); --l2-blue-soft: var(--blue-soft, #22313f);
    --l2-p1: #2c3e54; --l2-p2: #1f2e3e; --l2-p4: #4A2430; --l2-p5: #74303A; --l2-p1-ink: #ead8b5; --l2-p2-ink: #cdbb98; --l2-p4-ink: #F3C0BF; --l2-p5-ink: #FFD9D7;
    --l2-good-ink: #3FCB82; --l2-bad-ink: #FF8A8F; --l2-pill-on: #0f2340; --l2-seg-on: #0f2340; --l2-sample-bg: #B3261E; --l2-rank-ink: #FFD48A; --l2-tile-hero: #1a2a3a;
    --l2-lg-LIDOM: #8fa9d9; --l2-lg-LVBP: #FFC145; --l2-lg-LMP: #3FCB82; --l2-lg-LBPRC: #FF7A93;
    --l2-lgi-LIDOM: #0b1622; --l2-lgi-LVBP: #0b1622; --l2-lgi-LMP: #0b1622; --l2-lgi-LBPRC: #0b1622;
  }
  :root:not([data-theme="light"]) .l2-scatter circle { stroke-opacity: .9; }
}
/* DARK-OS:END */
.l2 *, .l2 *::before, .l2 *::after { box-sizing: border-box; }
.l2 .num, .l2 td, .l2 .l2-val { font-variant-numeric: tabular-nums; }
.l2 a { color: var(--l2-blue); text-decoration: none; }
.l2 a:hover { text-decoration: underline; }
.l2 button { font: inherit; color: inherit; }

/* ---------- page head ---------- */
.l2-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; margin: 0 0 14px; }
.l2-head h1 { font-family: var(--l2-fd); font-weight: var(--l2-fdw); font-size: 34px; line-height: 1; letter-spacing: -.01em; margin: 0; text-transform: none; }
.l2-head p { margin: 6px 0 0; color: var(--l2-muted); font-size: 13.5px; max-width: 70ch; }
.l2-stamp { color: var(--l2-muted); font-size: 12px; white-space: nowrap; }
.l2-stamp b { color: var(--l2-ink-2); font-weight: 600; }

/* ---------- cards ---------- */
.l2-card { background: var(--l2-card); border: 1px solid var(--l2-line); border-radius: var(--l2-r); box-shadow: var(--l2-shadow); padding: 16px 18px; min-width: 0; }
.l2-card + .l2-card { margin-top: 16px; }
.l2-grid > .l2-card, .l2-gloss > .l2-card, .l2-pgrid > .l2-card { margin-top: 0; }
.l2-card-h { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 10px; margin: 0 0 10px; min-height: 28px; }
.l2-card-h h2, .l2-card-h h3 { font-family: var(--l2-fd); font-weight: 700; font-size: 21px; line-height: 1.1; margin: 0; letter-spacing: -.005em; }
.l2-card-h h3 { font-size: 19px; }
.l2-viewall { font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.l2-foot { color: var(--l2-muted); font-size: 12px; margin-top: 10px; }
.l2-note { background: var(--l2-card-2); border: 1px solid var(--l2-line); border-radius: 10px; padding: 9px 12px; color: var(--l2-ink-2); font-size: 12.5px; }
.l2-note b { color: var(--l2-ink); }
.l2-note.warn { border-color: color-mix(in srgb, var(--l2-mango) 50%, var(--l2-line)); background: color-mix(in srgb, var(--l2-mango) 9%, var(--l2-card)); }
.l2-empty { color: var(--l2-muted); font-size: 13px; padding: 18px 4px; text-align: center; }
.l2-sample { display: inline-block; font: 700 10px/1 var(--l2-fb); letter-spacing: .08em; color: #fff; background: var(--l2-sample-bg); border-radius: 4px; padding: 3px 5px; vertical-align: 2px; }
.l2-real { display: inline-block; font: 700 10px/1 var(--l2-fb); letter-spacing: .08em; color: var(--l2-good-ink); border: 1px solid currentColor; border-radius: 4px; padding: 2px 5px; vertical-align: 2px; }

/* ---------- pills / chips / controls ---------- */
.l2-pills { display: flex; gap: 6px; flex-wrap: wrap; }
.l2-pill { border: 1px solid var(--l2-line); background: var(--l2-card-2); color: var(--l2-ink-2); border-radius: 8px; padding: 6px 12px; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; line-height: 1.2; }
.l2-pill:hover { border-color: var(--l2-blue); color: var(--l2-blue); }
.l2-pill.on { background: var(--l2-pill-on); border-color: var(--l2-pill-on); color: var(--l2-on-blue); }
.l2-pill .ct { opacity: .7; font-weight: 500; margin-left: 4px; }
.l2-pills.sm .l2-pill { padding: 4px 9px; font-size: 12px; border-radius: 6px; }
.l2-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--l2-line); overflow-x: auto; scrollbar-width: none; }
.l2-tabs::-webkit-scrollbar { display: none; }
.l2-tab { background: none; border: 0; border-bottom: 3px solid transparent; padding: 10px 14px 9px; font-weight: 600; font-size: 14.5px; color: var(--l2-ink-2); cursor: pointer; white-space: nowrap; }
.l2-tab:hover { color: var(--l2-blue); }
.l2-tab.on { color: var(--l2-blue); border-bottom-color: var(--l2-blue); }
.l2-tab[disabled] { color: var(--l2-muted); opacity: .6; cursor: not-allowed; }
.l2-seg { display: inline-flex; border: 1px solid var(--l2-line); border-radius: 8px; overflow: hidden; background: var(--l2-card-2); }
.l2-seg button { border: 0; background: none; padding: 6px 12px; font-size: 12.5px; font-weight: 600; color: var(--l2-ink-2); cursor: pointer; }
.l2-seg button.on { background: var(--l2-seg-on); color: #fff; }
.l2-filters { display: grid; grid-template-columns: minmax(180px, 1.6fr) repeat(4, minmax(120px, 1fr)) auto; gap: 10px 12px; align-items: end; }
.l2-filters.five { grid-template-columns: minmax(180px, 1.6fr) repeat(4, minmax(120px, 1fr)); }
.l2-f { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.l2-f > label, .l2-f > .lbl { font-size: 11.5px; font-weight: 700; color: var(--l2-ink-2); letter-spacing: .02em; }
.l2-in, .l2-sel { -webkit-appearance: none; appearance: none; width: 100%; min-width: 0; height: 36px; border: 1px solid var(--l2-line); border-radius: 8px; background: var(--l2-card); color: var(--l2-ink); padding: 0 10px; font: 13.5px var(--l2-fb); }
.l2-in { padding-left: 32px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%236B778C' stroke-width='2'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 4 4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: 10px 50%; }
.l2-sel { appearance: none; padding-right: 28px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%236B778C' stroke-width='2'%3E%3Cpath d='m1 1 5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; }
.l2-in:focus, .l2-sel:focus { outline: 2px solid var(--l2-blue); outline-offset: 0; border-color: var(--l2-blue); }
.l2-check { display: inline-flex; align-items: center; gap: 7px; height: 36px; font-size: 13px; font-weight: 600; color: var(--l2-ink-2); white-space: nowrap; cursor: pointer; }
.l2-check input { width: 16px; height: 16px; accent-color: var(--l2-blue); }
.l2-ctrlrow { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 12px; }
.l2-range { display: flex; align-items: center; gap: 10px; min-width: 260px; flex: 1 1 300px; }
.l2-range label { font-size: 12.5px; font-weight: 700; white-space: nowrap; color: var(--l2-ink-2); }
.l2-range label b { color: var(--l2-blue); font-size: 13.5px; }
.l2-range input[type=range] { flex: 1; min-width: 100px; -webkit-appearance: none; appearance: none; height: 6px; border-radius: 6px; background: linear-gradient(90deg, var(--l2-blue) var(--fill, 0%), var(--l2-line) var(--fill, 0%)); }
.l2-range input[type=range]:focus-visible { outline: 2px solid var(--l2-blue); outline-offset: 4px; }
.l2-range input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 3px solid var(--l2-blue); box-shadow: 0 1px 3px rgba(0,0,0,.25); cursor: pointer; }
.l2-range input[type=range]::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid var(--l2-blue); cursor: pointer; }
.l2-btn { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: 1px solid var(--l2-blue); color: var(--l2-blue); background: var(--l2-card); border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.l2-btn:hover { background: var(--l2-blue-soft); }
.l2-btn.solid { background: var(--l2-blue); color: #fff; }
.l2-qual { font-size: 12px; color: var(--l2-muted); }
.l2-qual b { color: var(--l2-ink-2); }

/* ---------- layout ---------- */
.l2-grid { display: grid; gap: 16px; }
.l2-grid.leaders { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.l2-split { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; align-items: start; }
.l2-section-t { font-family: var(--l2-fd); font-weight: 700; font-size: 15px; letter-spacing: .08em; text-transform: uppercase; color: var(--l2-muted); margin: 22px 0 10px; display: flex; align-items: center; gap: 10px; }
.l2-section-t::after { content: ""; flex: 1; height: 1px; background: var(--l2-line); }
.l2-section-t:first-child { margin-top: 4px; }

/* ---------- logos & badges ---------- */
.l2-logo { width: 26px; height: 26px; object-fit: contain; flex: none; display: inline-block; vertical-align: middle; }
.l2-logo.l2-lgc { width: 34px; height: 34px; }
.l2-logo.xl { width: 72px; height: 72px; }
.l2-crest { display: inline-grid; place-items: center; flex: none; width: 26px; height: 26px; border-radius: 6px; background: var(--l2-card-2); border: 1px solid var(--l2-line); font: 700 9px/1 var(--l2-fb); color: var(--l2-muted); }
.l2-badge { display: inline-grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--l2-card); border: 1px solid var(--l2-line); box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.l2-badge img { width: 26px; height: 26px; object-fit: contain; }
.l2-org { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 20px; padding: 0 5px; border-radius: 5px; font: 800 10.5px/1 var(--l2-fb); letter-spacing: .03em; color: #fff; background: var(--org, #4a5568); white-space: nowrap; }
.l2-org.none { background: transparent; color: var(--l2-muted); border: 1px dashed var(--l2-line); font-weight: 600; }
.l2-org.l2-lgc { height: 26px; min-width: 44px; font-size: 12.5px; border-radius: 6px; }
.l2-lg { display: inline-block; font: 700 10px/1 var(--l2-fb); letter-spacing: .06em; padding: 3px 5px; border-radius: 4px; color: #fff; background: var(--lgc, #4a5568); white-space: nowrap; }
.l2-lg[data-l2lgc="LIDOM"] { background: var(--l2-lg-LIDOM); color: var(--l2-lgi-LIDOM); }
.l2-lg[data-l2lgc="LVBP"] { background: var(--l2-lg-LVBP); color: var(--l2-lgi-LVBP); }
.l2-lg[data-l2lgc="LMP"] { background: var(--l2-lg-LMP); color: var(--l2-lgi-LMP); }
.l2-lg[data-l2lgc="LBPRC"] { background: var(--l2-lg-LBPRC); color: var(--l2-lgi-LBPRC); }
.l2-tag { display: inline-block; font: 700 10.5px/1 var(--l2-fb); padding: 3px 6px; border-radius: 4px; background: var(--l2-card-2); color: var(--l2-ink-2); border: 1px solid var(--l2-line); white-space: nowrap; }
.l2-tag.ss { background: transparent; border-style: dashed; color: var(--l2-ink-2); font-weight: 600; } /* A8: below the qualifier */
.l2-who:has(> .l2-tag.ss) { flex-wrap: wrap; gap: 2px 8px; } /* the tag drops under the role rather than cutting it */
.l2-tag.rank { background: color-mix(in srgb, var(--l2-mango) 22%, var(--l2-card)); border-color: color-mix(in srgb, var(--l2-mango) 50%, transparent); color: var(--l2-rank-ink); }
.l2-pname { background: none; border: 0; padding: 0; font-weight: 700; color: var(--l2-ink); cursor: pointer; text-align: left; font-size: inherit; line-height: 1.2; }
.l2-pname:hover { color: var(--l2-blue); text-decoration: underline; }
.l2-ast { color: var(--l2-bad-ink) !important; font-weight: 800; margin-left: 1px; text-decoration: none !important; }
.l2-who { display: flex; align-items: center; gap: 10px; min-width: 0; }
.l2-who > div { min-width: 0; }
.l2-who .l2-sub { color: var(--l2-muted); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- leader cards ---------- */
.l2-lead .l2-card-h { margin-bottom: 6px; }
.l2-lead ol { list-style: none; margin: 0; padding: 0; }
.l2-lead li { display: grid; grid-template-columns: 16px 28px minmax(0, 1fr) auto auto; align-items: center; gap: 7px; padding: 7px 0; border-top: 1px solid var(--l2-line-2); }
.l2-lead li:first-child { border-top: 0; }
.l2-lead li .rk { font-family: var(--l2-fd); font-weight: 700; font-size: 16px; color: var(--l2-muted); text-align: center; }
.l2-lead li.top .rk { color: var(--l2-blue); }
.l2-lead li .nm { min-width: 0; }
.l2-lead li .nm .l2-pname { font-size: 13.5px; display: block; max-width: 100%; white-space: normal; overflow-wrap: anywhere; line-height: 1.2; }
.l2-lead li .nm .l2-sub { color: var(--l2-muted); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.l2-lead li .ss { font-size: 11px; color: var(--l2-muted); white-space: nowrap; font-variant-numeric: tabular-nums; text-align: right; min-width: 38px; }
.l2-lead li .v { min-width: 44px; font-family: var(--l2-fd); font-weight: 700; font-size: 19px; text-align: right; }
.l2-lead li.top .v { color: var(--l2-blue); }
.l2-lead .rule { color: var(--l2-muted); font-size: 11px; margin-top: 6px; display: flex; justify-content: space-between; gap: 8px; }
.l2-lead .stat-k { font-family: var(--l2-fd); font-weight: 700; font-size: 12px; letter-spacing: .1em; color: var(--l2-muted); text-transform: uppercase; }

/* ---------- tables ---------- */
.l2-tw { overflow-x: auto; overflow-y: visible; border: 1px solid var(--l2-line); border-radius: 10px; background: var(--l2-card); position: relative; }
.l2-tw.nomax { max-height: none; }
.l2-t { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; }
.l2-t th, .l2-t td { padding: 7px 9px; text-align: right; white-space: nowrap; border-bottom: 1px solid var(--l2-line-2); }
.l2-t th { position: sticky; top: 0; z-index: 2; background: var(--l2-thead); font: 700 11.5px/1.2 var(--l2-fb); letter-spacing: .02em; color: var(--l2-ink-2); border-bottom: 1px solid var(--l2-line); user-select: none; }
.l2-t th.sort { cursor: pointer; padding: 0; }
.l2-t th .l2-sortbtn { all: unset; box-sizing: border-box; display: flex; align-items: center; justify-content: flex-end; gap: 3px; width: 100%; padding: 7px 9px; cursor: pointer; font: inherit; color: inherit; letter-spacing: inherit; white-space: nowrap; border-bottom: 1px dotted transparent; }
.l2-t th .l2-sortbtn:focus-visible { outline: 2px solid var(--l2-blue); outline-offset: -3px; border-radius: 4px; }
.l2-t th .l2-sortbtn .ab { border-bottom: 1px dotted color-mix(in srgb, currentColor 55%, transparent); }
.l2-t th.sort:hover, .l2-t th.sort:focus-within { color: var(--l2-blue); }
.l2-t th.sorted { color: var(--l2-blue); }
.l2-t th .arr { font-size: 9px; margin-left: 3px; }
.l2-t th.l, .l2-t td.l { text-align: left; }
.l2-t td.rk { color: var(--l2-muted); width: 34px; text-align: center; font-weight: 600; }
.l2-t .stick { position: sticky; left: 0; z-index: 1; background: var(--l2-card); }
.l2-t th.stick { z-index: 3; background: var(--l2-thead); }
.l2-t .stick2 { position: sticky; left: 34px; z-index: 1; background: var(--l2-card); box-shadow: 1px 0 0 var(--l2-line); }
.l2-t th.stick2 { z-index: 3; background: var(--l2-thead); }
.l2-t tbody tr:hover td { background: var(--l2-blue-soft); }
.l2-t tbody tr:hover td.stick, .l2-t tbody tr:hover td.stick2 { background: var(--l2-blue-soft); }
.l2-t td.l2-war { font-weight: 800; color: var(--l2-ink); cursor: help; }
.l2-t td.l2-war span { border-bottom: 1px dotted var(--l2-muted); }
.l2-t td.l2-na { color: var(--l2-muted); }
.l2-t td.sm { color: var(--l2-muted); font-style: normal; }
.l2-t tr.unq td:not(.stick):not(.stick2):not(.rk) { color: var(--l2-muted); }
.l2-t .pc { display: inline-block; min-width: 46px; padding: 2px 6px; border-radius: 5px; text-align: right; }
.l2-t .pc.b1 { background: var(--l2-p1); color: var(--l2-p1-ink); font-weight: 600; }
.l2-t .pc.b2 { background: var(--l2-p2); color: var(--l2-p2-ink); }
.l2-t .pc.b4 { background: var(--l2-p4); color: var(--l2-p4-ink); }
.l2-t .pc.b5 { background: var(--l2-p5); color: var(--l2-p5-ink); font-weight: 700; }
.l2-t .pcell { display: flex; align-items: center; gap: 8px; min-width: 190px; }
.l2-t .pcell .l2-tmn { color: var(--l2-muted); font-size: 11.5px; }
.l2-t td.team { text-align: left; }
.l2-t td.team .l2-tmn { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--l2-ink-2); }
.l2-legend { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 11.5px; color: var(--l2-muted); }
.l2-legend i { display: inline-block; width: 22px; height: 12px; border-radius: 3px; border: 1px solid var(--l2-line); }
.l2-tablebar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 14px; margin: 12px 0 8px; }
.l2-tablebar .count { font-size: 12.5px; color: var(--l2-muted); }
.l2-tablebar .count b { color: var(--l2-ink); }

/* ---------- tooltip (single floating element) ---------- */
.l2-tip { border-bottom: 1px dotted currentColor; cursor: help; text-decoration: none; }
th .l2-tip { border-bottom-color: color-mix(in srgb, currentColor 50%, transparent); }
#l2-tipbox { position: fixed; z-index: 10000; max-width: 300px; background: #0f2340; color: #f0e2c6; border-radius: 10px; padding: 10px 12px; font: 12.5px/1.45 var(--font-body, "Inter", system-ui, sans-serif); box-shadow: 0 8px 28px rgba(0,0,0,.28); pointer-events: auto; text-transform: none; letter-spacing: 0; text-align: left; white-space: normal; }
#l2-tipbox[hidden] { display: none; }
#l2-tipbox b { color: #fff; }
#l2-tipbox .tt { font-weight: 800; font-size: 13px; margin-bottom: 3px; color: #fff; }
#l2-tipbox .avg { margin-top: 6px; color: #A9BBE6; font-size: 11.5px; }
#l2-tipbox a { color: #8FB4FF; font-weight: 600; }
#l2-tipbox table { border-collapse: collapse; width: 100%; margin-top: 4px; }
#l2-tipbox td { padding: 2px 0; font-variant-numeric: tabular-nums; }
#l2-tipbox td + td { text-align: right; padding-left: 12px; white-space: nowrap; }
#l2-tipbox td:last-child { font-weight: 700; }
#l2-tipbox tr.tot td { border-top: 1px solid #2B4277; padding-top: 4px; }
#l2-tipbox tr.miss td { color: #F7A8AB; font-weight: 500; }

/* ---------- Stats Lab ---------- */
.l2-lab-ctrls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 18px; }
.l2-lab-ctrls .l2-range { min-width: 0; }
.l2-scatter { width: 100%; height: auto; display: block; }
.l2-scatter .ax { stroke: var(--l2-line); }
.l2-scatter text { fill: var(--l2-muted); font: 11px var(--l2-fb); }
.l2-scatter .lbl { fill: var(--l2-ink-2); font-size: 10.5px; font-weight: 600; }
.l2-scatter circle { cursor: pointer; }
.l2-scatter circle:hover, .l2-scatter circle:focus-visible { stroke: var(--l2-ink); stroke-width: 3; outline: none; }
.l2-scatter .avgl { stroke: var(--l2-coral); stroke-dasharray: 4 4; }
.l2-scatter .quad { fill: var(--l2-muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; opacity: .7; }

/* ---------- Glossary ---------- */
.l2-gloss { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.l2-gloss .l2-card { scroll-margin-top: 140px; }
.l2-gloss .l2-card.flash { animation: l2flash 1.4s ease-out; }
@keyframes l2flash { 0% { box-shadow: 0 0 0 3px var(--l2-blue); } 100% { box-shadow: var(--l2-shadow); } }
.l2-gloss .def { color: var(--l2-ink-2); margin: 0 0 8px; }
.l2-gloss .fx { font: 12px/1.5 var(--l2-fm); background: var(--l2-card-2); border: 1px solid var(--l2-line); border-radius: 8px; padding: 7px 10px; overflow-x: auto; white-space: pre-wrap; }
.l2-gloss .avgs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.l2-gloss .avgs span { font-size: 12px; background: var(--l2-card-2); border: 1px solid var(--l2-line); border-radius: 6px; padding: 3px 7px; }
.l2-gloss .avgs b { font-variant-numeric: tabular-nums; }
.l2-war-hero { grid-column: 1 / -1; border-left: 4px solid var(--l2-blue); }
.l2-war-hero ul { margin: 6px 0 0; padding-left: 18px; color: var(--l2-ink-2); }
.l2-war-hero li { margin: 3px 0; }
.l2-war-hero .missing { color: var(--l2-bad-ink); font-weight: 700; }

/* ---------- Prospects ---------- */
.l2-pro-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.l2-pro-top .l2-meta { display: flex; align-items: center; gap: 16px; font-size: 12px; color: var(--l2-muted); letter-spacing: .04em; }
.l2-pro-top .l2-meta b { color: var(--l2-ink); }
.l2-board td { vertical-align: middle; padding: 9px 7px; }
.l2-board th { padding-left: 7px; padding-right: 7px; }
.l2-board td.bigrk { font-family: var(--l2-fd); font-weight: 700; font-size: 20px; color: var(--l2-ink); text-align: center; width: 40px; }
.l2-board .l2-line .big { font-family: var(--l2-fd); font-weight: 700; font-size: 18px; color: var(--l2-ink); line-height: 1.05; }
.l2-board .l2-line .sm { color: var(--l2-muted); font-size: 11.5px; }
/* fuller winter line (operator 2026-10-23): partner stat beside the big number, a counting line, then a rates line */
.l2-board .l2-line .big .sub { font: 600 12px/1 var(--l2-fb, inherit); color: var(--l2-ink); opacity: .8; margin-left: 4px; }
.l2-board .l2-line .sm { line-height: 1.4; }
.l2-board .l2-line .sm2 { opacity: .85; }
@media (max-width: 560px) { .l2-board .l2-line .sm2 { display: none; } }
/* A9 (fan review 2026-10-23): on phones the winter line wraps inside the first screen width instead of running past
   the edge ("· 2 S"); trend and WAR stay as their own columns to scroll to */
@media (max-width: 599px) { .l2-board td.l2-line { white-space: normal; min-width: 148px; max-width: 160px; } .l2-board td.l2-line .sm { white-space: normal; } }
.l2-board td.l2-line { text-align: left; }
.l2-board .wt { display: flex; align-items: center; gap: 8px; text-align: left; }
.l2-board .wt .l2-lgc { font-size: 11px; font-weight: 700; color: var(--l2-ink-2); }
.l2-board .wt .cl { font-size: 11.5px; color: var(--l2-muted); }
.l2-trend { font-weight: 700; white-space: nowrap; }
.l2-trend.up { color: var(--l2-good-ink); }
.l2-trend.dn { color: var(--l2-bad-ink); }
.l2-trend.flat { color: var(--l2-muted); }
.l2-viewbtn { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; color: var(--l2-blue); border: 1px solid var(--l2-blue); border-radius: 6px; padding: 5px 9px; background: var(--l2-card); cursor: pointer; white-space: nowrap; }
.l2-viewbtn:hover { background: var(--l2-blue-soft); }
.l2-side .l2-card + .l2-card { margin-top: 16px; }
.l2-grid > .l2-card, .l2-gloss > .l2-card, .l2-pgrid > .l2-card { margin-top: 0; }
.l2-mini { list-style: none; margin: 0; padding: 0; }
.l2-mini li { display: grid; grid-template-columns: 18px 30px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 7px 0; border-top: 1px solid var(--l2-line-2); }
.l2-mini li:first-child { border-top: 0; }
.l2-mini .rk { font-family: var(--l2-fd); font-weight: 700; color: var(--l2-muted); text-align: center; }
.l2-mini .v { font-family: var(--l2-fd); font-weight: 700; font-size: 16px; text-align: right; white-space: nowrap; }
.l2-mini .l2-sub { color: var(--l2-muted); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.l2-mini .nm .l2-pname { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.l2-follow { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.l2-follow button { border: 1px solid var(--l2-line); background: var(--l2-card); border-radius: 8px; padding: 5px 0; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: 10px; color: var(--l2-muted); }
.l2-follow button .l2-org { min-width: 32px; }
.l2-follow button.on { border-color: var(--l2-blue); background: var(--l2-blue-soft); color: var(--l2-blue); font-weight: 700; }
.l2-follow button .ct { font-variant-numeric: tabular-nums; }
.l2-follow-div { grid-column: 1 / -1; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; color: var(--l2-muted); text-transform: uppercase; margin-top: 4px; }

/* ---------- Profile ---------- */
.l2-prof { background: var(--l2-card); border-radius: var(--l2-r); overflow: hidden; }
.l2-prof.full { border: 1px solid var(--l2-line); box-shadow: var(--l2-shadow); }
.l2-ph { position: relative; color: #fff; padding: 22px 24px 0; background:
  radial-gradient(120% 140% at 85% 120%, rgba(255,140,90,.55) 0%, rgba(255,140,90,0) 46%),
  linear-gradient(180deg, #0f2340 0%, #1B2C66 46%, #4C2C6E 78%, #8B3F62 100%); overflow: hidden; }
.l2-ph::after { content: ""; position: absolute; inset: auto 0 0 0; height: 58px; background:
  linear-gradient(0deg, rgba(11,22,34,.55), rgba(11,22,34,0)); pointer-events: none; }
.l2-ph svg.palms { position: absolute; right: 0; bottom: 0; height: 100%; width: 54%; opacity: .55; pointer-events: none; }
.l2-ph-top { position: relative; z-index: 1; display: flex; align-items: center; gap: 18px; padding-right: 150px; }
.l2-ph-top .l2-badge { width: 84px; height: 84px; background: rgba(255,255,255,.95); border: 0; }
.l2-ph-top .l2-badge img { width: 66px; height: 66px; }
.l2-ph h1 { font-family: var(--l2-fd); font-weight: 700; font-size: 44px; line-height: 1; margin: 0; letter-spacing: -.01em; text-shadow: 0 2px 12px rgba(0,0,0,.25); }
.l2-ph h1 .l2-ast { color: #FF8A8F !important; }
.l2-ph .subl { font-size: 17px; font-weight: 600; margin-top: 6px; color: #ecdcbc; }
.l2-ph .subl span + span::before { content: "|"; margin: 0 8px; opacity: .6; }
/* outbound player page (FanGraphs ↗): the header's own colour, underlined like the site's other outbound links */
.l2 .l2-ph .subl .l2-ext a { color: inherit; text-decoration: underline; text-decoration-color: rgb(236 220 188 / .55); text-underline-offset: 3px; white-space: nowrap; }
.l2 .l2-ph .subl .l2-ext a:hover, .l2 .l2-ph .subl .l2-ext a:focus-visible { color: #fff; text-decoration-color: currentColor; }
.l2-prof:not(.full) .l2-ph .warbig { right: 76px; }
.l2-ph .warbig { position: absolute; right: 24px; top: 18px; z-index: 1; text-align: right; }
.l2-ph .warbig .v { font-family: var(--l2-fd); font-weight: 700; font-size: 58px; line-height: .95; letter-spacing: -.02em; }
.l2-ph .warbig .k { font-size: 11px; font-weight: 700; letter-spacing: .14em; color: #e2d0ad; }
.l2-ph .warbig .k .l2-tip { border-bottom-color: rgba(255,255,255,.5); }
.l2-strip { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); margin-top: 18px; border-top: 1px solid rgba(255,255,255,.18); }
.l2-strip > div { padding: 11px 12px 13px; border-left: 1px solid rgba(255,255,255,.14); min-width: 0; }
.l2-strip > div:first-child { border-left: 0; padding-left: 0; }
.l2-strip .k { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; color: #e2d0ad; text-transform: uppercase; white-space: nowrap; }
.l2-strip .v { font-family: var(--l2-fd); font-weight: 700; font-size: 20px; margin-top: 3px; display: flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.l2-strip .v small { font-family: var(--l2-fb); font-size: 11.5px; font-weight: 500; color: #e2d0ad; }
.l2-strip .v .l2-logo { width: 24px; height: 24px; background: #fff; border-radius: 50%; padding: 2px; }
.l2-notebar { display: flex; gap: 8px; align-items: flex-start; padding: 10px 24px; background: color-mix(in srgb, var(--l2-coral) 12%, var(--l2-card)); border-bottom: 1px solid color-mix(in srgb, var(--l2-coral) 35%, transparent); font-size: 13px; color: var(--l2-ink); }
.l2-notebar b { color: var(--l2-bad-ink); }
.l2-pbody { padding: 0 24px 22px; }
.l2-prof .l2-tabs { padding: 0 14px; position: sticky; top: 0; background: var(--l2-card); z-index: 4; }
.l2-tiles { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.l2-tile { border: 1px solid var(--l2-line); border-radius: 12px; padding: 10px 12px; background: var(--l2-card); min-width: 0; }
.l2-tile .k { font-size: 11px; font-weight: 700; color: var(--l2-ink-2); letter-spacing: .04em; }
.l2-tile .v { font-family: var(--l2-fd); font-weight: 700; font-size: 30px; line-height: 1.05; margin-top: 2px; }
.l2-tile .r { font-size: 11.5px; color: var(--l2-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.l2-tile.l2-hero { background: var(--l2-tile-hero); color: #fff; border-color: var(--l2-tile-hero); }
.l2-tile.l2-hero .k, .l2-tile.l2-hero .r { color: #d6c5a2; }
.l2-pgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 14px; }
.l2-pgrid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.l2-pgrid .l2-card { padding: 14px 16px; box-shadow: none; }
.l2-pgrid .l2-card + .l2-card { margin-top: 0; }
.l2-chart { width: 100%; height: auto; display: block; overflow: visible; }
.l2-chart .l2-gl { stroke: var(--l2-line-2); }
.l2-chart .zero { stroke: var(--l2-muted); stroke-dasharray: 3 3; }
.l2-chart text { fill: var(--l2-muted); font: 11.5px var(--l2-fb); }
.l2-chart .ln { fill: none; stroke: var(--l2-blue); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.l2-chart .ar { fill: color-mix(in srgb, var(--l2-blue) 14%, transparent); }
.l2-chart .l2-dot { fill: var(--l2-card); stroke: var(--l2-blue); stroke-width: 2; }
.l2-chart .l2-dot.last { fill: var(--l2-blue); }
.l2-chart .bar.pos { fill: var(--l2-palm); }
.l2-chart .bar.neg { fill: var(--l2-coral); }
.l2-chart .lgl { stroke: var(--l2-muted); stroke-dasharray: 5 4; }
.l2-chart .callout rect { fill: var(--l2-navy); }
.l2-chart .callout text { fill: #fff; font-weight: 700; font-size: 11px; }
.l2-nottracked { display: flex; gap: 10px; align-items: flex-start; color: var(--l2-muted); font-size: 13px; padding: 6px 0; }
.l2-nottracked svg { flex: none; margin-top: 1px; }
.l2-pbars { display: grid; gap: 9px; }
.l2-pbar { display: grid; grid-template-columns: 92px minmax(0, 1fr) 54px; align-items: center; gap: 10px; font-size: 12.5px; }
.l2-pbar .k { font-weight: 600; color: var(--l2-ink-2); }
.l2-pbar .trk { position: relative; height: 8px; border-radius: 8px; background: linear-gradient(90deg, var(--l2-p1), #C9D3E3 50%, var(--l2-p5)); opacity: .35; }
.l2-pbar .trkw { position: relative; }
.l2-pbar .knob { position: absolute; top: 50%; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%; display: grid; place-items: center; font: 800 10.5px/1 var(--l2-fb); color: #fff; border: 2px solid #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
.l2-pbar .v { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.l2-pbar.l2-na .knob { display: none; }
.l2-pbar.l2-na .v { color: var(--l2-muted); font-weight: 500; font-size: 11.5px; }
.l2-kv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; font-size: 13px; }
.l2-kv > div { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px dashed var(--l2-line); }
.l2-kv > div .l2-na { color: var(--l2-muted); font-size: 11.5px; text-align: right; }
.l2-warbd { display: grid; gap: 8px; }
.l2-warbd .row { display: grid; grid-template-columns: 170px minmax(0, 1fr) 76px; align-items: center; gap: 10px; font-size: 13px; }
.l2-warbd .row .bar { position: relative; height: 14px; background: var(--l2-card-2); border-radius: 4px; }
.l2-warbd .row .bar i { position: absolute; top: 0; bottom: 0; border-radius: 4px; }
.l2-warbd .row .bar .mid { position: absolute; left: 50%; top: -3px; bottom: -3px; width: 1px; background: var(--l2-muted); }
.l2-warbd .row .v { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.l2-warbd .row.tot { border-top: 2px solid var(--l2-ink); padding-top: 8px; font-weight: 800; }
.l2-warbd .row.miss { color: var(--l2-bad-ink); }
.l2-warbd .row.miss .v { font-weight: 600; font-size: 12px; }
.l2-spray { width: 100%; max-width: 320px; height: auto; }
.l2-spray .fld { fill: color-mix(in srgb, var(--l2-palm) 14%, var(--l2-card)); stroke: var(--l2-line); }
.l2-spray .inf { fill: color-mix(in srgb, var(--l2-mango) 18%, var(--l2-card)); }

/* ---------- page banner (photo when assets/banners/<name>.jpg exists, else CSS/SVG dusk scene) ---------- */
.l2-banner { position: relative; overflow: hidden; border-radius: var(--l2-r); margin: 0 0 16px; min-height: 148px; display: flex; align-items: flex-end; color: #fff;
  background: radial-gradient(90% 160% at 92% 130%, rgba(255,150,90,.55) 0%, rgba(255,150,90,0) 52%), linear-gradient(100deg, #081736 0%, #0E2453 38%, #33295F 70%, #6B3462 100%); }
.l2-banner .l2-scene { position: absolute; right: 0; bottom: 0; width: 100%; height: 100%; pointer-events: none; }
.l2-banner.has-photo { background: linear-gradient(90deg, rgba(11,22,34,.92) 0%, rgba(11,22,34,.72) 38%, rgba(11,22,34,.18) 72%, rgba(11,22,34,0) 100%), var(--l2-photo) center right / cover no-repeat; }
.l2-banner.has-photo .l2-scene { display: none; }
.l2-banner-in { position: relative; z-index: 1; padding: 22px 26px 20px; max-width: 760px; }
.l2-banner h1 { font-family: var(--l2-fd); font-weight: var(--l2-fdw); font-size: 44px; line-height: .98; margin: 0; letter-spacing: -.005em; text-shadow: 0 2px 14px rgba(0,0,0,.3); }
.l2-banner p { margin: 8px 0 0; color: #ecdcbc; font-size: 14.5px; max-width: 64ch; }
.l2-banner-stamp { margin-top: 10px; }
.l2-banner .l2-stamp { color: #d6c5a2; }
.l2-banner .l2-stamp b { color: #fff; }
.l2-ph.has-photo { background: linear-gradient(90deg, rgba(11,22,34,.9) 0%, rgba(11,22,34,.65) 45%, rgba(11,22,34,.35) 100%), var(--l2-photo) center / cover no-repeat; }
.l2-ph.has-photo svg.palms { display: none; }
.l2 .only-phone { display: none; }
@media (max-width: 720px) {
  .l2-banner { min-height: 120px; border-radius: 10px; }
  .l2-banner.has-photo { background: linear-gradient(0deg, rgba(11,22,34,.9) 0%, rgba(11,22,34,.55) 60%, rgba(11,22,34,.3) 100%), var(--l2-photo) center / cover no-repeat; }
  .l2-banner .l2-scene { opacity: .32; }
  .l2-banner-in { padding: 16px 16px 14px; }
  .l2-banner h1 { font-size: 30px; }
  .l2-banner p { font-size: 13px; }
  .l2 .only-phone { display: block; }
}

/* ---------- harness modal fallback (only used when L1's modal is absent) ---------- */
.l2-modal-bg { position: fixed; inset: 0; background: rgba(11,22,34,.55); z-index: 9000; display: grid; place-items: center; padding: 24px; }
.l2-modal { width: min(1080px, 100%); max-height: calc(100vh - 48px); overflow: auto; border-radius: var(--l2-r); position: relative; background: var(--l2-card); }
.l2-modal-x { position: absolute; top: 14px; right: 14px; z-index: 5; width: 36px; height: 36px; border-radius: 50%; border: 0; background: rgba(255,255,255,.2); color: #fff; font-size: 20px; cursor: pointer; }

/* ---------- responsive ---------- */
@media (max-width: 1280px) {
  .l2-grid.leaders { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .l2-split { grid-template-columns: minmax(0, 1fr) 300px; }
  .l2-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1080px) {
  .l2-grid.leaders { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .l2-filters, .l2-filters.five { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .l2-filters .l2-f.l2-fsearch { grid-column: 1 / -1; }
  .l2-split { grid-template-columns: minmax(0, 1fr); }
  .l2-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .l2-side .l2-card + .l2-card { margin-top: 0; }
  .l2-pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .l2-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .l2-strip > div:nth-child(4n+1) { border-left: 0; padding-left: 0; }
  .l2-lab-ctrls { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .l2 { font-size: 13.5px; }
  .l2-head h1 { font-size: 28px; }
  .l2-card { padding: 14px 14px; }
  .l2-grid.leaders { grid-template-columns: minmax(0, 1fr); }
  .l2-filters, .l2-filters.five { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .l2-range { min-width: 0; flex-basis: 100%; }
  .l2-side { grid-template-columns: minmax(0, 1fr); }
  .l2-gloss { grid-template-columns: minmax(0, 1fr); }
  .l2-pgrid, .l2-pgrid.two { grid-template-columns: minmax(0, 1fr); }
  .l2-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .l2-tw:not(.nomax) { overflow: auto; max-height: 70vh; } /* phone: sticky header + first column need the box to scroll */
  .l2-t { font-size: 12.5px; }
  .l2-t th, .l2-t td { padding: 7px 7px; }
  .l2-t .pcell { min-width: 0; width: 148px; gap: 6px; }
  .l2-t .pcell > div { min-width: 0; }
  .l2-t .pcell .l2-pname { display: block; max-width: 116px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .l2-t .pcell .l2-logo { width: 22px; height: 22px; }
  .l2-t .pcell .l2-tmn { display: none; }
  .l2-tablebar .l2-legend { font-size: 10.5px; }
  .l2-tablebar .l2-legend i { width: 14px; height: 10px; }
  .l2-t .hide-sm { display: none; }
  .l2-ph { padding: 16px 16px 0; }
  .l2-ph-top { padding-right: 0; gap: 12px; }
  .l2-ph-top .l2-badge { width: 56px; height: 56px; }
  .l2-ph-top .l2-badge img { width: 44px; height: 44px; }
  .l2-ph h1 { font-size: 30px; }
  .l2-ph .subl { font-size: 13.5px; }
  .l2-ph .warbig, .l2-prof:not(.full) .l2-ph .warbig { position: relative; right: auto; top: auto; text-align: left; margin-top: 10px; display: flex; align-items: baseline; gap: 8px; z-index: 1; }
  .l2-ph .warbig .v { font-size: 40px; }
  .l2-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 12px; }
  .l2-strip > div { padding: 9px 8px 10px; }
  .l2-strip > div:nth-child(4n+1) { border-left: 1px solid rgba(255,255,255,.14); padding-left: 8px; }
  .l2-strip > div:nth-child(3n+1) { border-left: 0; padding-left: 0; }
  .l2-strip > div:nth-child(n+4) { border-top: 1px solid rgba(255,255,255,.14); }
  .l2-strip .v { font-size: 17px; }
  .l2-notebar { padding: 10px 16px; }
  .l2-pbody { padding: 0 14px 18px; }
  .l2-prof .l2-tabs { padding: 0 4px; }
  .l2-tab { padding: 10px 10px 9px; font-size: 13.5px; }
  .l2-kv { grid-template-columns: minmax(0, 1fr); }
  .l2-warbd .row { grid-template-columns: 112px minmax(0, 1fr) 60px; font-size: 12px; }
  .l2-follow { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .l2-board .hide-sm { display: none; }
  .l2-modal-bg { padding: 0; align-items: end; }
  .l2-modal { max-height: 92vh; border-radius: 16px 16px 0 0; }
}

/* ---------- shell integration (L1 logo badges, rule tags) ---------- */
.l2 .l2-badge.sh { width: auto; height: auto; border: 0; background: none; box-shadow: none; }
.l2 .logo-badge.l2-lb { flex: none; }
.l2-substamp { display: flex; justify-content: flex-end; margin: -4px 0 10px; }
.l2-allcount { margin: 12px 2px 0; font-weight: 600; font-size: 13.5px; color: var(--l2-ink); }
.l2-pgrid.one { grid-template-columns: minmax(0, 760px); }
.l2-grid.l2-orgs { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1280px) { .l2-grid.l2-orgs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1080px) { .l2-grid.l2-orgs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .l2-grid.l2-orgs { grid-template-columns: minmax(0, 1fr); } }
.l2-more { text-align: center; margin-top: 10px; }
.l2-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.l2-ph.l2-painted { background: #0f2340; }
.l2-ph.l2-painted svg.palms { display: none; }
.l2-ph.l2-painted::after { background: linear-gradient(90deg, rgba(11,22,34,.82) 0%, rgba(11,22,34,.45) 55%, rgba(11,22,34,.25) 100%); inset: 0; height: auto; z-index: -1; }
.l2-grid.leaders.all { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }