/* ============================================================
   site-palette.css — PALETA SITE-ULUI.

   A fost `skin-modern.css`, skinul opt-in al paginii de eveniment (B158, ADR 0054). Rollout-ul B159
   l-a dus pagina cu pagina pe tot site-ul, iar B159 L10 i-a coborat TOATE regulile in foile de
   audienta (`@layer app`). Ce a ramas — si e tot ce a contat pana la urma — sunt cele doua blocuri de
   TOKENI. Fisierul si-a luat numele care spune ce face.

   DOUA LUMI DE RANDARE, si de-aia paleta asta sta separat:
    · SITE-ul incarca fisierul asta, ULTIMUL din lant (base.html.twig + cele patru documente
      standalone: login si cele trei pagini de eroare);
    · ECRANUL JURATULUI nu-l incarca deloc (tokens.css + judge.css + base-layout.css) si isi pastreaza
      paleta lui. Componentele partajate cu el — `.btn-ink*`, `.brand-modal*`, campurile de formular,
      stepperul de confirmare — citesc tokeni de ROL: `tokens.css` le da valoarea juratului pe `:root`,
      iar blocurile de aici o suprascriu pentru site.
      ⚠️ Nu muta blocurile astea in `tokens.css`: acolo le-ar mosteni si juratul.

   NELAYERIZATE, inadins: remapeaza roluri declarate si in `@layer tokens` din `tokens.css`
   (`--c-kf-*`), pe care un layer ulterior le-ar bate. Ordinea `<link>` le pune dupa remap-ul
   nelayerizat din `tokens.css` — vezi contractul din ADR 0023.

   De unde vine directia: docs/DESIGN_RESEARCH.md + deciziile ownerului, pastrate in ADR 0054.
   ============================================================ */

@layer vendor, app, tokens, base, layout, components, utilities;

/* ── 1. TOKENI ──────────────────────────────────────────────────────────────────────────
   Contrast măsurat (WCAG 2.x) pe fiecare pereche folosită — lista e în contrast-audit.php
   (SKIN_MODERN_PAIRS). Cifrele din comentarii sunt calculate, nu estimate. */
:root {
  /* ---- TIER 1 · LIGHT (brut) ---- */
  --sm-bg: #f3f4ef;
  --sm-s1: #ffffff;             /* carduri, panouri, bara de navigație */
  --sm-s2: #e9ebe3;             /* imbricat, pastile inactive */
  --sm-s2-rgb: 233, 235, 227;   /* aceeași, ca triplet — puntea `.bg-light` */
  --sm-s3: #dde0d5;             /* apăsat / selectat liniștit */
  --sm-s3-rgb: 221, 224, 213;   /* aceeași, ca triplet — pentru variabilele RGB ale badge-urilor Bootstrap */
  --sm-hair: #dde0d5;           /* separator decorativ între rânduri */
  --sm-edge: #c9cdc0;           /* conturul cardurilor dense + conectorii nerezolvați (decor: 1.62 pe s1) */
  --sm-line: #7d8479;           /* graniță CU SENS: 3.85 pe s1 · 3.49 pe bg · 3.20 pe s2 */
  --sm-text-hi: #141714;        /* 16.34 pe bg */
  --sm-text-hi-rgb: 20, 23, 20;
  --sm-text-mid: #50584d;       /* 7.38 pe s1 · 5.52 pe s3 */
  /* LIME = „a câștigat / a avansat". Pe light lime-ul e DOAR umplere (pe alb 1.18:1) → marcajele
     subțiri și textul de accent iau olive. */
  --sm-accent-fill: #c8ff00;    /* cerneala pe el: 15.28 */
  --sm-accent-fill-rgb: 200, 255, 0; /* același, ca triplet — variabilele RGB ale badge-urilor Bootstrap */
  --sm-on-accent: #141714;
  --sm-accent-text: #4d6600;    /* 6.53 pe s1 · 5.43 pe s2 */
  --sm-accent-mark: #4d6600;    /* dungă de calificat, inelul discului */
  --sm-q-tint: #edf4db;         /* tenta rândului calificat; olive pe ea 5.77 */
  --sm-sage-fill: #dfe8d8;      /* text-hi pe ea 14.34 */
  --sm-on-sage-mid: var(--sm-text-mid); /* numele unui înscris confirmat prezent: 5.86 pe sage — se retrage, rămâne lizibil */
  /* Umplerea ÎNVINSULUI: distinctă și de card (1.54), și de banda juraților s2 (1.28); text-mid pe ea 4.79. */
  --sm-loser-fill: #cdd2c4;
  /* VERDICT = umplerea laturii câștigătoare (scorecard, pastilele juraților) = LIME APRINS, în ambele
     teme (it. 2, cererea ownerului; sage/olive se citeau stins). Ca UMPLERE lime-ul ține pe orice
     suprafață: cerneala pe el 15.28 light / 15.82 dark. */
  --sm-verdict-fill: #c8ff00;
  --sm-on-verdict: #141714;
  /* Tenta rândului câștigător din bracket: lime TRANSPARENT (+ muchie de 3px). Pe light e mai
     densă, altfel pe alb nu se vede. Textul text-hi peste ea rămâne ≥ 11:1 în ambele teme. */
  --sm-win-tint: rgb(200 255 0 / .38);
  /* Suprafața INVERSĂ: mare DOAR pe cardul de campion; mică pe categoria activă. Pe light devine INK. */
  --sm-paper: #141714;
  --sm-on-paper: #f3f4ef;       /* 16.34 */
  --sm-on-paper-mid: #b8bfb5;   /* 9.60 */
  --sm-switch-on: var(--sm-text-hi);
  --sm-close-filter: none;           /* X-ul Bootstrap e desenat negru: pe tema deschisa ramane cum e */  /* pista comutatorului PORNIT: butucul Bootstrap e alb fix, deci pista se alege sa-l arate */
  --sm-danger: #b3261e;         /* 6.54 pe s1 */
  --sm-danger-soft: #fbe3e0;
  --sm-on-danger-soft: #8c1d18; /* 7.45 */
  --sm-warning: #7a5a00;        /* 6.38 pe s1 */
  --sm-warning-soft: #fbeec8;
  --sm-on-warning-soft: #5c4300;/* 8.05 */
  /* LIVE = roșu, cu cuvântul scris (culoarea nu e singurul semnal). Lime-ul rămâne liber. */
  --sm-live: #c62828;
  --sm-on-live: #ffffff;        /* 5.62 */
  --sm-live-rgb: 198, 40, 40;
  /* LIVE ca LINIE / PUNCT (muchii, puncte): pe light = umplerea (5.62 vs s1); pe dark umplerea dă doar
     3.03 vs s1 și 2.49 pe tenta live → acolo urcă pe scara tonală. */
  --sm-live-mark: #c62828;
  --sm-live-tint: #f5cdc7;      /* fundalul battle-ului în desfășurare: 1.45 vs s1 · ink pe el 12.42 */
  --sm-gold: #e3b341;           /* umpleri de medalie; numeralul e OBLIGATORIU (vs alb 1.9–2.4) */
  --sm-silver: #b8bec5;
  --sm-bronze: #d99a66;
  --sm-on-medal: #141714;       /* 9.28 / 9.64 / 7.54 */
  /* ADÂNCIME cu sens (NN/g „Flat 2.0"): pe light umbrele se văd. */
  /* CUTIILE RIDICATE (card de concurs, panou de clasament, card de top 3). Pe LIGHT umbra face treaba, deci
     suprafața și conturul rămân cele de azi. Pe DARK o umbră neagră pe pagină aproape neagră nu se vede deloc
     (V L3, ownerul) — acolo ridicarea o duc SUPRAFAȚA (o treaptă mai deschisă) și CONTURUL. */
  --sm-card-surface: var(--sm-s1); --sm-card-edge: var(--sm-edge);
  /* BENZILE SECUNDARE din cutiile ridicate (totalul de puncte, legenda, banda de vot, șina grilei): pe light stau
     pe s2, adică o treaptă mai JOS decât cardul alb. Pe dark cardul s-a ridicat el însuși pe s2, deci banda trebuie
     să coboare la s1 — altfel se topește în card (V L3: „partea de jos cu PUNCTE e aceeași culoare”). */
  --sm-strip-surface: var(--sm-s2);
  --sm-elev-card: 0 1px 2px rgb(20 23 20 / .06), 0 1px 1px rgb(20 23 20 / .04);
  --sm-elev-float: 0 6px 20px rgb(20 23 20 / .10);
  --sm-elev-peak: 0 12px 32px rgb(20 23 20 / .22);
  --sm-glass-bg: rgb(255 255 255 / .86);

  /* ---- TIPOGRAFIE (o familie; ierarhia din mărime + greutate + lățime + culoare) ---- */
  --sm-font: 'Twemoji Country Flags', 'Archivo', system-ui, sans-serif;
  --sm-fs-label: clamp(0.75rem, 0.7rem + 0.15vw, 0.8125rem);   /* 12 → 13 */
  --sm-fs-body: clamp(0.9375rem, 0.9rem + 0.12vw, 1rem);       /* 15 → 16 */
  --sm-fs-title: clamp(1.125rem, 0.97rem + 0.7vw, 1.5rem);     /* 18 → 24 */
  --sm-fs-display: clamp(1.75rem, 1.35rem + 1.75vw, 2.75rem);  /* 28 → 44 */
  --sm-w-display: 800;          /* pe dark 750: textul deschis pe închis pare mai gros */

  /* ---- FORMĂ ---- */
  --sm-r-row: 8px;              /* rânduri, cipuri */
  --sm-r-card: 12px;            /* carduri */
  --sm-r-pill: 999px;           /* pastile, controale de filtrare, stări */

  /* ---- TIER 2 · MAPAREA rolurilor existente → skin ---- */
  /* fonturi: o singură familie (Space Mono iese de pe pagină) */
  --kf-font: var(--sm-font); --kf-font-display: var(--sm-font); --kf-font-mono: var(--sm-font);
  --font-sans: var(--sm-font); --font-display: var(--sm-font); --font-mono: var(--sm-font);
  /* suprafețe */
  --kf-bg: var(--sm-bg); --bg: var(--sm-bg); --bg-elevated: var(--sm-s1);
  --kf-surface: var(--sm-s1); --kf-surface-bright: var(--sm-s1);
  --kf-surface-2: var(--sm-s2); --kf-surface-3: var(--sm-s3); --kf-surface-inset: var(--sm-s3);
  /* Fundalul PAGINII, separat de cel al SUPRAFEȚELOR. `tokens.css` scria `html, body { background: var(--paper) }`,
     iar `--paper` e rolul suprafeței (s1, alb în light) — pe o pagină asta dă alb, nu tenta de fundal. Nu se vedea
     fiindcă îl corecta kf (`html:has(> body.kf) { background: var(--kf-bg) }`), dar kf-ul dispare la L10, iar
     documentele standalone nici nu-l încarcă: măsurat pe /_error/404, canvasul ieșise ALB, în timp ce /concursuri
     (cu skin ȘI cu kf) stătea corect pe `--sm-bg`. Regula din `@layer app` citește acum `--page-bg`, cu `--paper`
     drept fallback — paginile fără skin rămân identice. Pe `<html>` contează separat de `<body>`: fundalul lui e
     cel propagat pe canvas (peste scroll și overscroll), al body-ului se oprește la cutia body. */
  --page-bg: var(--sm-bg);
  --paper: var(--sm-s1); --card: var(--sm-s1); --surface: var(--sm-s1);
  --paper-2: var(--sm-s2); --surface-2: var(--sm-s2); --side-surface: var(--sm-s2);
  /* inversul NU mai e un rol general: e rezervat cardului de campion (--sm-paper). Benzile și
     butoanele care îl foloseau devin liniștite. */
  --surface-inverse: var(--sm-s3); --text-on-inverse: var(--sm-text-hi);
  --text-on-inverse-mid: var(--sm-text-mid);
  --surface-inverse-rgb: var(--sm-s3-rgb); --surface-2-rgb: var(--sm-s2-rgb); --text-rgb: var(--sm-text-hi-rgb);
  /* text */
  --kf-text: var(--sm-text-hi); --kf-text-variant: var(--sm-text-mid); --kf-outline: var(--sm-line);
  --text: var(--sm-text-hi); --fg1: var(--sm-text-hi);
  --fg2: var(--sm-text-mid); --fg3: var(--sm-text-mid); --fg4: var(--sm-text-mid);
  --text-secondary: var(--sm-text-mid); --text-muted: var(--sm-text-mid); --text-faint: var(--sm-text-mid);
  /* linii */
  /* `--border-subtle` = culoarea conectorilor NEREZOLVAȚI din bracket → linie vizibilă (it. 2: „liniile
     nu prea se văd"). Cardurile își pun conturul explicit (`--sm-edge`), deci nu se îngroașă. */
  --kf-line: var(--sm-hair); --border-hair: var(--sm-hair); --border-subtle: var(--sm-line);
  --kf-line-strong: var(--sm-line); --border-strong: var(--sm-line); --border-control: var(--sm-line);
  /* SELECȚIE + CTA = NEUTRE (lime-ul are un singur sens: rezultatul) */
  --kf-primary: var(--sm-text-hi); --kf-on-primary: var(--sm-bg);
  --kf-primary-solid: var(--sm-text-hi); --kf-on-solid: var(--sm-bg);
  --kf-accent: var(--sm-text-hi); --kf-marker: var(--sm-text-hi); --kf-accent-strip: var(--sm-s3);
  --primary: var(--sm-text-hi); --primary-strong: var(--sm-text-hi); --accent: var(--sm-text-hi);
  --on-primary: var(--sm-bg); --focus-ring: var(--sm-text-hi);
  --volt: var(--sm-s3); --volt-ink: var(--sm-text-hi);
  --kf-tint: var(--sm-s2); --kf-on-tint: var(--sm-text-hi);
  --primary-soft: var(--sm-s2); --on-primary-soft: var(--sm-text-hi); --accent-soft: var(--sm-s2);
  --audience-edge: var(--sm-line);
  /* REZULTAT = lime (umpleri) / accent (linii și text: lime pe dark, olive pe light) */
  --winner-bg: var(--sm-win-tint); --winner-fg: var(--sm-text-hi);
  --winner-edge: var(--sm-verdict-fill); --winner-ink: var(--sm-text-hi);
  --success: var(--sm-accent-text); --success-soft: var(--sm-q-tint);
  --kf-success: var(--sm-accent-text); --kf-success-soft: var(--sm-q-tint);
  /* Învinsul: umplere PROPRIE — pe s2/s3 pastilele juraților se topeau în card și în bandă (it. 2). */
  --loser-fill: var(--sm-loser-fill); --loser-fg: var(--sm-text-mid);
  /* stări semantice */
  --danger: var(--sm-danger); --danger-soft: var(--sm-danger-soft);
  --kf-danger: var(--sm-danger); --kf-danger-soft: var(--sm-danger-soft);
  --warning: var(--sm-warning); --warning-soft: var(--sm-warning-soft); --on-warning-soft: var(--sm-on-warning-soft);
  --kf-warning: var(--sm-warning); --kf-warning-soft: var(--sm-warning-soft); --kf-on-warning-soft: var(--sm-on-warning-soft);
  --golden-soft: var(--sm-warning-soft); --on-golden: var(--sm-on-warning-soft);
  --live: var(--sm-live); --live-ink: var(--sm-on-live);
  --status-active-bg: var(--sm-live); --status-active-fg: var(--sm-on-live);
  --battle-progress-bg: var(--sm-live); --battle-progress-fg: var(--sm-on-live);
  --kf-secondary: var(--sm-live); --kf-on-secondary: var(--sm-on-live);
  --status-done-bg: var(--sm-s2); --status-done-fg: var(--sm-text-mid);
  /* L2: singurele stări rămase pe hexul din `@layer app` (bej și bleu pastel, în afara paletei). „Deschis” nu intră
     aici: pe paginile cu skin puntea kf îl duce deja pe s2 / text-hi. */
  --status-draft-bg: var(--sm-s2); --status-draft-fg: var(--sm-text-mid);
  /* „ai ceva nesalvat” e o ATENȚIONARE, nu un rezultat (D3a): semnalul de pe câmp, de pe bara de salvare și
     textul ei citesc același rol. Call-site-ul stă în `@layer app` cu `!important` (ca să bată stările
     Bootstrap), iar un `!important` dintr-un layer anterior NU poate fi bătut din `@layer skin` — de aceea
     schimbarea trece prin token, nu prin regulă. */
  --dirty-signal: var(--sm-warning); --dirty-surface: var(--sm-warning-soft);
  /* Butonul dezactivat: în loc de opacitate pe umplerea de cerneală (o pată gri), pereche tonală lizibilă. */
  --btn-disabled-bg: var(--sm-s3); --btn-disabled-fg: var(--sm-text-mid);
  --status-closed-bg: var(--sm-s3); --status-closed-fg: var(--sm-text-hi);
  /* Numărătoarea de zile de pe afiș (`.cbc-days`) stătea pe portocaliul kf, neremapat. */
  --kf-alert: var(--sm-warning); --kf-alert-soft: var(--sm-warning-soft); --kf-on-alert-soft: var(--sm-on-warning-soft);
  --battle-completed-bg: var(--sm-accent-fill); --battle-completed-fg: var(--sm-on-accent);
  --battle-pending-bg: var(--sm-s2); --battle-pending-fg: var(--sm-text-mid);
  /* medalii */
  --rank-gold: var(--sm-gold); --rank-silver: var(--sm-silver); --rank-bronze: var(--sm-bronze);
  --rank-4: var(--sm-s3); --on-rank: var(--sm-on-medal);
  /* Paleta brută citită direct de componente, NEremapată intenționat (B159 L0a.5, măsurat cu ui-probe pe stilurile
     calculate, 2026-09-17): `--rank-1..3-ink` = rangul din calificare 4.77 light / 8.38 dark pe fundal; trofeul
     câștigătorului (`.bk-entry__trophy`) 4.85 / 4.89 pe tenta lime compusă (prag grafic 3:1). `--status-closed-*`
     are un singur consumator, `.cat-panel-hdr--info`, pe care niciun template nu-l mai pune (cod mort → L0.7). */
  /* formă */
  --radius-sm: var(--sm-r-row); --radius-md: var(--sm-r-row); --radius-lg: var(--sm-r-card);
  --kf-r-sm: var(--sm-r-row);
  /* ROLURI (B159 L0.8d, registrul din tokens.css): skinul spune O DATĂ ce face cu fiecare rol, în loc să anuleze
     rețeta selector cu selector. DOAR rolurile acoperite complet pe pagina de eveniment (validată de owner): titlul
     paginii și titlurile de conținut fără majuscule, numele / cifrele la 800, starea la 700, tab-urile fără majuscule,
     colțurile de rând / card. Eticheta, controlul, pastila, câmpul și colțul de status NU sunt remapate încă — ar
     schimba elemente nevalidate (L1, cu ownerul). `--sm-w-display` trece singur la 750 pe dark. */
  --type-display-weight: var(--sm-w-display); --type-display-case: none; --type-display-tracking: 0;
  --type-title-weight: 800; --type-title-case: none; --type-title-tracking: 0;
  --type-name-weight: 800;
  --type-tab-case: none; --type-tab-tracking: 0;
  --type-number-weight: 800;
  --type-status-weight: 700;
  --radius-row: var(--sm-r-row); --radius-card: var(--sm-r-card);
  /* L2: pastilele (stil / format / top N / discriminator / nivel) și insignele de stare — colțul 0 e idiomul kf. */
  --radius-chip: var(--sm-r-pill); --radius-status: var(--sm-r-pill);
  --shadow-hover-strip: none;
  /* CONTROALE (B159 L1.1, D2a): butoanele fără majuscule / tracking, 700 (ca Login și votul, validate).
     FORMA (B172, 2026-09-19 — ownerul: „începe să mă omoare toate butoanele astea rotunde peste tot"):
     controlul NU mai e pastilă. Motivul măsurat: înainte de skin un SINGUR lucru din tot site-ul era complet
     rotund — `.style-pill`, adică semnătura identității unui stil de dans. Tokenul ăsta hrănește, prin
     `tokens.css` (`--bs-btn-border-radius`), TOATE butoanele Bootstrap, plus `.btn-ink`, `.btn-xs`,
     `.btn-login`, `.filter-pill` și paginarea — ~35 de clase. Pastila a încetat să însemne ceva.
     Regula, de acum: **rotund = o stare sau o identitate pe care o CITEȘTI (`--radius-chip`,
     `--radius-status`, medaliile, punctele); colț de rând = un control pe care îl APEȘI.** Skinul o scrisese
     deja o dată, pentru cipuri (vezi `.j-pill`/`.e-chip`, „o formă, un sens"); butoanele o călcau.
     Nu 4px: scara casei e 8 / 12 / pastilă (DESIGN_RESEARCH §3.4), iar 8px e deja raza CÂMPULUI — butonul se
     potrivește acum cu inputul de lângă el, fără valoare nouă în sistem.
     ⚠️ Deviem de la Material 3, care face butoane pastilă. Asumat: §3.4 arată că dovada pe „rotund = mai multe
     clickuri" a picat la replicare, deci raza e brand, nu conversie — și e coerentă cu Carbon (regimul productiv).
     `.filter-pill` își pierde forma din nume; rebotezarea e refactor separat, nu aici. */
  --type-control-weight: 700; --type-control-case: none; --type-control-tracking: 0;
  --radius-control: var(--sm-r-row);
  /* ETICHETE (B159 L1.6, A6 — aprobat de owner): 600, majusculele rămân (etichete de 1–2 cuvinte, D4a), tracking .06em. */
  --type-label-weight: 600; --type-label-tracking: .06em;
  /* CÂMPURI (B159 L1.3): colțul de rând — formularul de înscriere (`--entry-radius`, 6px în kf) și rolul `field`. */
  --entry-radius: var(--sm-r-row); --radius-field: var(--sm-r-row);
  /* Treptele butoanelor (D2a): PLIN = text-hi (o dată per formular / modal / rând de comandă), hover pe text-mid;
     CONTURAT / GHOST = hover pe s2; ROȘU doar pe ireversibil. Perechile: plin 16.34 / 15.26, hover 6.68 / 9.94,
     roșu 6.54 / 9.33, roșu hover 9.11 / 11.02. */
  --sm-btn-fill: var(--sm-text-hi); --sm-on-btn-fill: var(--sm-bg); --sm-btn-fill-hover: var(--sm-text-mid);
  --sm-btn-hover: var(--sm-s2); --sm-on-btn-hover: var(--sm-text-hi);
  --sm-on-danger: #ffffff; --sm-danger-hover: #8c1d18;
  /* Rolul „ok” (B159 L1.4, D3a): o confirmare („te-ai înscris”, „prezent”, „în fișă”) e NEUTRĂ + bifa scrisă — lime-ul
     rămâne rezultatul (câștigător, calificat); `--success` global NU se remapează, îl citesc „gata” / calificat. */
  --sm-ok: var(--sm-text-hi);
}

/* ---- TIER 1 · DARK (doar valorile brute; maparea de mai sus se re-rezolvă singură) ----
   Fără fallback `@media (prefers-color-scheme: dark)`: theme_boot() pune data-theme pe <html>
   sincron, în <head>, înainte de primul paint. Fără JS pagina rămâne pe light — tema lizibilă. */
[data-theme="dark"] {
  --sm-bg: #101310;             /* gri-verde, NU negru: halația textului + loc pentru elevație */
  --sm-s1: #191d19;
  --sm-s2: #262c26;
  --sm-s2-rgb: 38, 44, 38;
  --sm-s3: #313831;
  --sm-s3-rgb: 49, 56, 49;
  --sm-hair: #313831;
  --sm-edge: #454d44;           /* 1.95 pe s1 · 2.14 pe bg */
  --sm-line: #737b72;           /* 3.90 pe s1 · 3.27 pe s2 · 4.28 pe bg */
  --sm-text-hi: #e6e9e3;        /* off-white: 13.91 pe s1 (NU #fff — vibrează pe închis) */
  --sm-text-hi-rgb: 230, 233, 227;
  --sm-text-mid: #b8bfb5;       /* 9.06 pe s1 · 6.41 pe s3 */
  --sm-on-accent: #101310;      /* 15.82 pe lime */
  --sm-accent-text: #c8ff00;    /* 14.43 pe s1 — doar greutăți 600+, șiruri scurte */
  --sm-accent-mark: #c8ff00;
  --sm-q-tint: #1b2616;         /* text-hi pe ea 12.83 */
  --sm-sage-fill: #3f5c40;      /* text-hi pe ea 6.08 */
  --sm-on-sage-mid: #c9d0c6;    /* 4.73 pe sage: mai stins decât text-hi (6.08), peste prag */
  --sm-loser-fill: #3b433a;     /* vs s1 1.67 · vs s2 1.39 · text-mid pe ea 5.44 */
  --sm-on-verdict: #101310;     /* 15.82 pe lime */
  --sm-win-tint: rgb(200 255 0 / .16);
  --sm-paper: #e9eae4;          /* hârtie caldă, NU #fff: albul pur orbește în sală */
  --sm-on-paper: #141714;       /* 14.93 */
  --sm-on-paper-mid: #4a5147;   /* 6.78 */
  --sm-switch-on: var(--sm-s3);
  --sm-close-filter: invert(1) grayscale(100%) brightness(200%);  /* ...si se inverseaza pe tema inchisa */       /* pe dark cerneala e DESCHISA, deci pista pornita ramane inchisa; inelul o distinge */
  --sm-danger: #ff9d8f;         /* 8.51 pe s1 */
  --sm-danger-soft: #3b1c18;
  --sm-on-danger-soft: #ffb4ab; /* 9.06 */
  --sm-on-danger: #101310;      /* 9.33 pe danger */
  --sm-danger-hover: #ffb4ab;   /* text 11.02 */
  --sm-warning: #e8c466;        /* 10.17 pe s1 */
  --sm-warning-soft: #33270a;
  --sm-on-warning-soft: #ffe08a;/* 11.34 */
  --sm-live-tint: #43231f;      /* 1.22 vs s1 · text-hi pe el 11.43 */
  --sm-live-mark: #ff6b5e;      /* 6.11 vs s1 · 5.01 pe tenta live */
  /* Cipurile de ajustare pe pagina asta folosesc umplerile de LIGHT și pe dark: pe dark amber/portocaliul
     cu text alb dădeau 2.94 / 3.56:1. Pagina juratului (judge.css) își păstrează tokenii ei. */
  --adj-penalty-1: var(--c-adj-p1-light); --adj-penalty-2: var(--c-adj-p2-light); --adj-penalty-3: var(--c-adj-p3-light);
  --adj-bonus-1: var(--c-adj-b1-light); --adj-bonus-2: var(--c-adj-b2-light); --adj-bonus-3: var(--c-adj-b3-light);
  /* pe dark umbrele nu se văd (Material): adâncimea = treaptă de suprafață + muchie de lumină */
  --sm-card-surface: var(--sm-s2); --sm-card-edge: var(--sm-line);
  --sm-strip-surface: var(--sm-s1);
  --sm-elev-card: inset 0 1px 0 rgb(255 255 255 / .05);
  --sm-elev-float: 0 8px 24px rgb(0 0 0 / .5);
  --sm-elev-peak: 0 12px 32px rgb(0 0 0 / .45);
  --sm-glass-bg: rgb(25 29 25 / .84);
  --sm-w-display: 750;
}

/* ── 2. COMPONENTE ──────────────────────────────────────────────────────────────────────── */