/* ============================================================
   Split din app.css pe layer/audienta (audit 2026-08-06 SF, ADR 0023).
   Precedenta layerelor (ultimul castiga): vendor < app < kf (tokens..utilities).
   Ordinea @layer e declarata IDENTIC in capul fiecarui fisier -
   prima declaratie stabileste ordinea, repetarea e no-op.
   ATENTIE: ordinea <link>-urilor e CONTRACT de cascada (intra-layer
   castiga ultimul incarcat): tokens, scoreboard, components, admin,
   base-layout, kf-skin; pagina juratului: tokens, judge, base-layout.
   NU adauga/reordona <link>-uri fara audit de coliziuni (ADR 0023).
   tokens.css - S1 TOKENS (tokeni globali + bridge Bootstrap + [data-theme])
   + tokenii --kf-* (@layer tokens) + REMAP-ul global nelayered :root = SSOT skin.
   Importa Bootstrap in layer(vendor). Se incarca PRIMUL pe ORICE pagina.
   ============================================================ */
@layer vendor, app, tokens, base, layout, components, utilities;
@import url("../vendor-local/bootstrap/bootstrap.min-0hrUfGv.css") layer(vendor);

@layer app {
/* === 1. TOKENS ============================================= */



:root {

    color-scheme: light dark;   /* native form/scrollbar theming */



    /* ============================================================

       THREE-TIER TOKENS — vezi skill `design-token-theming`.

       1) RAW (--c-*)      valori brute, fără rol — sursa unică de culoare

       2) SEMANTIC         --bg/--surface/--text/--border-…/--accent/… ← componentele folosesc ASTEA
                           (NU scrie „--border-" cu asterisc urmat de slash aici: asteriscul lipit de
                            slash ÎNCHIDE comentariul pe loc. CSS nu imbrichează comentarii — primul
                            terminator câștigă, iar restul textului e înghițit ca regulă invalidă.
                            Bug real: aici comentariul se închidea la rândul de mai sus, iar
                            `--c-ink-950` de mai jos era aruncat tăcut.)

       3) (component)      rar, doar la nevoie reală

       Tema = re-mapează SEMANTIC → RAW. Light = :root. Dark = [data-theme="dark"].

       Tokenii „value-named" istorici (--ink/--paper/--fg…/--card) sunt ALIASURI care

       țintesc rolurile → flipează corect în dark fără să rescriem fiecare componentă.

       ============================================================ */



    /* ---------- TIER 1 · RAW PALETTE ---------- */

    --c-ink-950: #0c0a08;   /* darkest — dark-mode page bg */

    --c-ink-900: #141210;   /* near-black — text / ink surfaces / strong borders */

    --c-ink-800: #1c1a16;   /* dark surface — dark-mode cards */

    --c-ink-700: #4d463d;   /* secondary text */

    --c-ink-500: #837b6e;   /* muted text / labels */

    --c-ink-300: #b3a994;   /* faint / units */

    --c-paper:   #f5f1e8;   /* warm newsprint — page bg */

    --c-paper-2: #ede7d8;   /* deeper newsprint — zebra / blocks */

    --c-card:    #fffdf7;   /* off-white card */

    --c-hair:    #d8cfbd;   /* hairline */

    --c-subtle:  #e3dccc;

    --c-white:   #ffffff;

    /* brand accents (≈ theme-invariant) */

    --c-flash:        #ff2e63;

    --c-flash-strong: #d40d44;

    --c-flash-soft:   #ffd9e3;

    --c-volt:         #d8ff3e;

    --c-volt-ink:     #1a1d00;

    /* dark-mode-only neutrals */

    --c-dark-hair: #34302a;   /* hairline on dark */

    --c-dark-line: #4a443c;   /* strong border on dark */

    /* ---------- AJUSTĂRI (ADR 0021) — cod de culoare pe NIVEL, o singură definiție ----------
       Cele trei trepte de penalizare (slip/repeat < crash/bite < misbehavior) și cele trei de bonus.
       Valorile brute stau AICI, o dată; ecranele le mapează la rolul `--adj-*` potrivit fundalului
       lor (public = light-first în :root mai jos, jurat = dark-first în judge.css). Înainte trăiau
       doar în judge.css, sub nume luate după variantele vechi (`--judge-pen-wipe` — „wipe" nu mai
       există din am.2), iar scorecardul avea un roșu/verde plat, fără nivel: aceeași penalizare
       arăta diferit pe cele două ecrane care o descriu. Tonurile sunt destul de închise cât să
       poarte text alb în ambele teme. */

    --c-adj-p1-dark: #ca8a04;  --c-adj-p1-light: #a16207;

    --c-adj-p2-dark: #ea580c;  --c-adj-p2-light: #c2410c;

    --c-adj-p3-dark: #dc2626;  --c-adj-p3-light: #b91c1c;

    --c-adj-b1-dark: #4d7c0f;  --c-adj-b1-light: #3f6212;

    --c-adj-b2-dark: #15803d;  --c-adj-b2-light: #166534;

    --c-adj-b3-dark: #047857;  --c-adj-b3-light: #065f46;



    /* ---------- TIER 2 · SEMANTIC ROLES — LIGHT (default) ---------- */

    --bg:              var(--c-paper);     /* page background */

    --bg-elevated:     var(--c-paper-2);   /* zebra rows / sunk blocks */

    --surface:         var(--c-card);      /* cards, panels */

    --surface-2:       var(--c-paper-2);   /* secondary surface */

    --surface-inverse: var(--c-ink-900);   /* dark strips: navbar, btn-ink, active */

    --text:            var(--c-ink-900);   /* primary text */

    --text-secondary:  var(--c-ink-700);

    --text-muted:      var(--c-ink-500);

    --text-faint:      var(--c-ink-300);

    --text-on-inverse: var(--c-paper);     /* text on surface-inverse */

    --border-hair:     var(--c-hair);      /* hairline borders (role: rămâne numele) */

    --border-subtle:   var(--c-subtle);

    --border-strong:   var(--c-ink-900);   /* 2px ink frames */

    /* Conturul unui CONTROL nefilled (pill/chip/tab inactiv, buton outline) — cutia ESTE ținta de

       click, deci marginea ei trebuie să se vadă (WCAG 1.4.11, 3:1). Separat de --border-strong

       fiindcă separatoarele și ramele de card NU intră sub regula asta: ele pot rămâne plate. */

    --border-control:  var(--c-ink-900);

    --accent:          var(--c-flash);

    --accent-strong:   var(--c-flash-strong);

    --accent-soft:     var(--c-flash-soft);

    --on-primary:      var(--c-white);     /* text pe --primary PLIN (remapat pe temă în blocul kf) */

    --on-danger:       var(--c-white);     /* text pe --danger PLIN (idem) */

    --live:            var(--c-volt);

    --live-ink:        var(--c-volt-ink);

    --shadow-color:    var(--c-ink-900);   /* hard offset shadow color */

    --focus-ring:      var(--c-flash);



    /* ---------- LEGACY ALIASES (țintesc rolurile; flipează în dark) ---------- */

    --primary:        var(--accent);

    --primary-strong: var(--accent-strong);

    --primary-soft:    var(--accent-soft);

    --on-primary-soft: var(--accent-strong);   /* text pe tenta de accent (remapat pe temă în kf) */

    --volt:           var(--live);          /* electric lime — LIVE / highlight / hover */

    --volt-ink:       var(--live-ink);

    --ink:            var(--c-ink-900);     /* raw ink — decorativ; pt TEXT folosește --text */

    --paper:          var(--bg);            /* attn: pt text-pe-inchis folosește --text-on-inverse */

    --paper-2:        var(--bg-elevated);

    --card:           var(--surface);

    --fg1: var(--text);  --fg2: var(--text-secondary);  --fg3: var(--text-muted);  --fg4: var(--text-faint);



    /* ---------- AJUSTĂRI — rolul per nivel (light; dark mai jos, jurat în judge.css) ----------
       Componenta `.adj-chip` folosește DOAR astea, niciodată valorile brute. */

    --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);

    --adj-on:        var(--c-white, #fff);   /* text pe fundalul plin al chipului */



    /* ---------- SEMANTIC ---------- */

    --success:      #0f8a3d;

    --danger:       #d92121;

    --warning:      #d98a00;

    /* bordura avertismentelor soft (.dup-warn) — fost #ffe08a literal (audit 2026-08-06);

       aceeași valoare pe dark azi = comportamentul de dinainte, până decide un audit de contrast */

    --warning-border: #ffe08a;

    --success-soft: #dff3e3;

    --danger-soft:  #fbe0e0;

    --warning-soft: #fbeccd;

    --on-warning-soft: #8a5a00;   /* text amber pe warning-soft (tie) */

    --golden-soft:  #ffeec2;      /* bg bandă rundă de departajare (golden) — theme-INDEPENDENT, ca .sc-round--c* */

    --on-golden:    #6b4e00;      /* text pe golden-soft */

    --sc-round-ink: #22303f;      /* text pe tintele pastel .sc-round--c* — theme-INDEPENDENT (altfel --fg2/--fg3 flipează deschis în dark → invizibil) */



    /* ---------- WINNER (token DEDICAT, NU --success semantic) ----------

       Câștigătorul citește DOAR aceste 4 roluri → re-skin global dintr-un loc.

       Default = verdele legacy; blocul global kf le remapează la lime. */

    --winner-bg:   var(--success-soft);

    --winner-fg:   var(--success);

    --winner-edge: var(--success);

    --winner-ink:  var(--success);



    /* ---------- VOTUL PUBLICULUI (ADR 0030) — roluri DEDICATE, ca la winner ----------

       Banda de vot NU are voie să strige: publicul nu decide verdictul, e o notă de culoare lângă

       rezultatul juriului. Prima variantă (lime plin) atrăgea mai multă atenție decât scorul —

       feedback user 2026-08-15. Acum: suprafață NEUTRĂ + o muchie de accent care dă identitatea.

       Cifrele rămân mari (se citesc din sală), dar culoarea nu mai concurează cu verdictul. */

    --audience-bg:   var(--surface-2);

    --audience-fg:   var(--fg2);

    --audience-lbl:  var(--fg3);

    --audience-edge: var(--volt);



    /* ---------- CONTEST STATUS ---------- */

    /* -fg-urile sunt SCRIS pe pastilă la --font-xs (11px) greutate 900 — deci prag 4.5, nu 3.0.

       Nuanțele „vii" de dinainte (#0f8a3d / #2f6df0 / #837b6e) stăteau la 3.4–3.8 pe propriile

       fundaluri. Fundalurile rămân neatinse; s-a coborât DOAR cerneala. */

    --status-draft-bg:    #e8e2d4; --status-draft-fg:    #6b6158;

    --status-open-bg:     #dff3e3; --status-open-fg:     #0b6b2f;

    --status-closed-bg:   #dfe9ff; --status-closed-fg:   #1a4fbf;

    --status-active-bg:   #d8ff3e; --status-active-fg:   #141210;  /* LIVE = volt */

    --status-done-bg:     #ede7d8; --status-done-fg:     #615a4f;



    /* ---------- BATTLE STATUS ---------- */

    --battle-pending-bg:    #e8e2d4; --battle-pending-fg:    #6b6158;

    --battle-progress-bg:   #d8ff3e; --battle-progress-fg:   #141210;

    --battle-completed-bg:  #dff3e3; --battle-completed-fg:  #0b6b2f;



    /* ---------- CATEGORY-ROW TINTS ----------

       Foste „dance-style badge" bg-uri; consumate acum DOAR de .category-row--0..5 ca tentă.

       Badge-ul real de stil = .style-pill (hue din nume). -fg-urile + slots 6/7 = moarte (scoase). */

    --style0-bg: #ffd9e3; --style1-bg: #dfe9ff; --style2-bg: #d3f3e6;

    --style3-bg: #ffe9c9; --style4-bg: #e8ddff; --style5-bg: #ffdcd2;



    /* ---------- RANK / PODIUM ----------

       O culoare de medalie e folosită în DOUĂ feluri opuse: ca FUNDAL (treapta de podium, cu text

       peste) și ca TEXT (locul din tabel, trofeul din bracket). Un singur token nu le poate servi

       pe amândouă: fundalul vrea culoarea vie și FIXĂ (aurul e auriu în orice temă), textul vrea să

       urce/coboare cu tema. De aceea două roluri. Textul de pe treaptă era ALB = 2.79:1 pe aur;

       medaliile rămân vii, cerneala devine închisă (--on-rank). */

    --rank-gold:   #c79200;      /* FILL — theme-independent */

    --rank-silver: #8f8a7e;

    --rank-bronze: #cd7f32;      /* urcat de la #b06a2c: cu ink dădea 4.04, cu alb 4.25 — pica pe

                                    ambele variante. #cd7f32 = bronzul din skill-ul de referință. */

    --rank-4:      #8b929e;      /* neutru pt locul 4 (fără medalie), urcat de la #6b7280 */

    --on-rank:     var(--c-ink-900);   /* text pe treapta de podium */

    /* ...ca TEXT pe o suprafață (.rank-1/2/3, .rank-top, trofee) — se remapează în dark */

    --rank-gold-ink:   #8a6600;

    --rank-silver-ink: #66625a;

    --rank-bronze-ink: #8a5220;



    /* ---------- TYPE ---------- */

    /* "Twemoji Country Flags" = polyfill steaguri (Windows n-are glife) — unicode-range îl

       limitează STRICT la codepoint-urile de steag, restul textului nu e afectat. */

    --font-display: "Twemoji Country Flags", "Archivo", system-ui, sans-serif;

    --font-sans:    "Twemoji Country Flags", "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;

    --font-mono:    "Twemoji Country Flags", "Space Mono", ui-monospace, SFMono-Regular, Menlo, monospace;



    /* Compact type scale (keeps existing var names for template compatibility).

       Scală unică 3xs→10xl (F3 audit 2026-07-20): fostele ~40 valori literale de font-size au fost

       snap-uite la aceste trepte (diferențe mici ≤~0.8px la text; trepte NOI la display ca să nu

       sară mult). REUSE-FIRST: folosește un token de aici, NU font-size literal. */

    --font-3xs:  0.55rem;       /* ← .55/.56 */

    --font-2xs:  0.6rem;        /* 9.6px — micro badge/label; ← .62/.63/.64 */

    --font-xs:   0.7rem;        /* 11px — labels uppercase; ← .65/.66/.67/.68/.72 */

    --font-sm:   0.75rem;       /* 12px — text secundar; ← .74/.76 */

    --font-md:   0.8125rem;     /* 13px — tabele dense; ← .78/.8/.82 */

    --font-base: 0.875rem;      /* 14px — text normal; ← .85 */

    --font-lg:   1rem;          /* ← .95/1/1.02/1.05 */

    --font-xl:   1.125rem;      /* ← 1.1/1.15 */

    --font-2xl:  1.3rem;        /* ← 1.25/1.3/1.35 */

    --font-3xl:  1.5rem;        /* ← 1.4/1.5 */

    --font-4xl:  1.65rem;       /* ← 1.6/1.65 */

    --font-5xl:  1.85rem;       /* ← 1.8/1.85 */

    --font-6xl:  2rem;          /* ← 2 */

    --font-7xl:  2.25rem;       /* ← 2.2 */

    --font-8xl:  2.5rem;        /* ← 2.4/2.5/2.6 */

    --font-9xl:  3rem;          /* ← 3 */

    --font-10xl: 5rem;          /* ← 5 (display uriaș) */



    /* ---------- SPACING ---------- */

    --pad-badge: 0.15rem 0.45rem;

    --pad-pill:  0.2rem 0.6rem;

    --pad-chip:  0.2rem 0.5rem;

    --space-1: 0.25rem;  --space-2: 0.5rem;  --space-3: 0.75rem;  --space-4: 1rem;

    /* Breakpoints (referință — CSS nu acceptă var() în @media): mobil ≤640px, tabletă ≤992px */

    --tap-min: 44px;     /* touch target minim (a11y) — WCAG 2.5.5 AAA / Apple HIG 44pt. IMPLICITUL. */

    /* Podeaua legală: WCAG 2.2 SC 2.5.8 „Target Size (Minimum)", nivel AA = 24×24px. Se folosește

       DOAR unde înălțimea chiar costă (controale secundare, dese, pe un ecran deja plin) și acțiunea

       e reversibilă dintr-un tap. Nu e o alternativă de gust la --tap-min. */

    --tap-aa: 24px;

    /* Înălțimea navbarului. Navbarul e `position: sticky; top: 0` → ORICE alt element lipicios

       trebuie să se oprească SUB el, deci are nevoie de valoarea asta, nu de un 58px copiat. */

    --nav-h: 58px;

    /* Înălțimea COMUNĂ a controalelor din bară (link / buton / meniu cont / temă). Alinierea

       optică a barei vine din faptul că toate patru citesc ACEST token, nu din patru paddinguri

       nimerite. Pe telefon urcă la --tap-min (vezi blocul @media). */

    --nav-ctl-h: 34px;



    /* ---------- RADII (sharp) ---------- */

    --radius-sm: 2px;

    --radius-md: 2px;

    --radius-lg: 3px;

    /* Bordura inputurilor de înscriere = punctată + colțuri rotunjite (excepție voită de la kf-sharp,

       NU e zeroit în tema kf → rămâne rotund pe /concursuri). Grosimea stripului din stânga stă în

       `--entry-strip` — identică în toate stările (gol / completat / greșit) ca să nu sară layoutul. */

    --entry-radius: 6px;

    --entry-strip: 2px;



    /* ---------- BORDERS ---------- */

    --border:    1px solid var(--border-hair);  /* hairline — compat cu codul existent */

    --border-dark: 2px solid var(--border-strong);



    /* ---------- ELEVATION — hard offset, no blur ---------- */

    --shadow-hard:    4px 4px 0 0 var(--shadow-color);

    --shadow-hard-sm: 2px 2px 0 0 var(--shadow-color);



    /* ---------- ZEBRA + HOVER rows ---------- */

    --row-odd-bg:   var(--bg-elevated);

    --row-hover-bg: var(--live);

}



/* ---------- DARK THEME — re-mapează DOAR rolurile semantice (TIER 2) ----------

   Componentele nu se ating. Badge-urile (status/style/tier) rămân intenționat vii

   (pastel pe fundal închis = pop). Vezi skill `design-token-theming`. */

[data-theme="dark"] {

    --adj-penalty-1: var(--c-adj-p1-dark);

    --adj-penalty-2: var(--c-adj-p2-dark);

    --adj-penalty-3: var(--c-adj-p3-dark);

    --adj-bonus-1:   var(--c-adj-b1-dark);

    --adj-bonus-2:   var(--c-adj-b2-dark);

    --adj-bonus-3:   var(--c-adj-b3-dark);

    --bg:              var(--c-ink-950);   /* #0c0a08 page */

    --bg-elevated:     var(--c-ink-900);   /* zebra rows */

    --surface:         var(--c-ink-800);   /* #1c1a16 cards */

    --surface-2:       var(--c-ink-900);

    --surface-inverse: #000000;            /* navbar / btn-ink strip */

    --text:            var(--c-paper);     /* light text */

    --text-secondary:  #d2caba;

    --text-muted:      #a79e8d;

    --text-faint:      #8b8274;

    --text-on-inverse: var(--c-paper);     /* stays light on dark strips */

    --border-hair:     var(--c-dark-hair); /* #34302a */

    --border-subtle:   #2a2620;

    --border-strong:   var(--c-dark-line); /* #4a443c — frames visible on dark */

    --shadow-color:    #000000;            /* hard offset shadow */

    /* accents pop on dark as-is; soften the large alert fills + lift status hues */

    --success: #4cc97e; --danger: #ff6b6b; --warning: #f0b541;

    --success-soft: #14301f; --danger-soft: #3a1717; --warning-soft: #332611;

    /* medaliile CA TEXT urcă pe scara tonală; ca FUNDAL (--rank-*) rămân neschimbate */

    --rank-gold-ink: #d9a600; --rank-silver-ink: #a8a294; --rank-bronze-ink: #d08a4a;

}



/* System preference when the user has NOT chosen (no-JS / first paint fallback). */

@media (prefers-color-scheme: dark) {

    :root:not([data-theme]) {

        --adj-penalty-1: var(--c-adj-p1-dark); --adj-penalty-2: var(--c-adj-p2-dark); --adj-penalty-3: var(--c-adj-p3-dark);

        --adj-bonus-1: var(--c-adj-b1-dark); --adj-bonus-2: var(--c-adj-b2-dark); --adj-bonus-3: var(--c-adj-b3-dark);

        --bg: var(--c-ink-950); --bg-elevated: var(--c-ink-900);

        --surface: var(--c-ink-800); --surface-2: var(--c-ink-900); --surface-inverse: #000000;

        --text: var(--c-paper); --text-secondary: #d2caba; --text-muted: #a79e8d; --text-faint: #8b8274;

        --text-on-inverse: var(--c-paper);

        --border-hair: var(--c-dark-hair); --border-subtle: #2a2620; --border-strong: var(--c-dark-line);

        --shadow-color: #000000;

        --success: #4cc97e; --danger: #ff6b6b; --warning: #f0b541;

        --success-soft: #14301f; --danger-soft: #3a1717; --warning-soft: #332611;

        --rank-gold-ink: #d9a600; --rank-silver-ink: #a8a294; --rank-bronze-ink: #d08a4a;

    }

}



/* ---------- BOOTSTRAP 5.3 THEME BRIDGE ----------

   Utilitățile Bootstrap (.text-muted, .text-secondary, .nav-tabs, .bg-light, dropdown…) se

   colorează prin --bs-*; le legăm la tokenii NOȘTRI ca să flipeze cu [data-theme] pe tot site-ul.

   Selectorul include [data-bs-theme] ca să bată regulile proprii Bootstrap dark (specificitate

   egală → câștigă app.css, încărcat DUPĂ bootstrap.min.css). Brand newsprint/ink păstrat. */

:root,

[data-bs-theme="light"],

[data-bs-theme="dark"] {

    --bs-body-bg:                  var(--bg);

    --bs-body-color:               var(--text);

    --bs-emphasis-color:           var(--text);

    --bs-heading-color:            var(--text);

    --bs-secondary-color:          var(--text-muted);   /* .text-muted, .text-secondary */

    --bs-secondary-bg:             var(--surface-2);

    --bs-tertiary-color:           var(--text-faint);

    --bs-tertiary-bg:              var(--surface-2);

    --bs-border-color:             var(--border-hair);

    --bs-border-color-translucent: var(--border-hair);

    --bs-link-color:               var(--accent);

    --bs-link-hover-color:         var(--accent-strong);

}

/* Utilitățile pe RGB nu citesc tokenii direct → override scurt cu tokeni (cele folosite). */

.bg-light     { background-color: var(--surface-2) !important; }

.bg-secondary { background-color: var(--surface-inverse) !important; color: var(--text-on-inverse) !important; }



/* Base overrides — Bootstrap bg-light → paper newsprint */

html, body {

    font-family: var(--font-sans);

    background: var(--paper);

    color: var(--fg1);

}

/* Alert bootstrap adaptat la tokens */

.alert-danger   { background: var(--danger-soft);  border-color: var(--danger);  color: var(--danger);  }

.alert-success  { background: var(--success-soft); border-color: var(--success); color: var(--success); }

.alert-warning  { background: var(--warning-soft); border-color: var(--warning); color: var(--warning); }



/* Bootstrap form-control/-select adaptate la temă (altfel rămân albe în dark).

   Override-uri mai specifice (ex. .login-card .form-control) au prioritate. */

.form-control, .form-select {

    background-color: var(--surface);

    border-color: var(--border-hair);

    color: var(--text);

}

.form-control::placeholder { color: var(--text-faint); }

.form-control:focus, .form-select:focus {

    background-color: var(--surface);

    color: var(--text);

    border-color: var(--accent);

    box-shadow: 0 0 0 .15rem var(--accent-soft);

}





} /* END @layer app */

/* ████████████████████████████████████████████████████████████████
   KINETIC FLOW — design nou (light/airy, line-less, rotunjit).
   Tokens namespaced --kf-* ca să coexiste cu „Battle Broadcast" (legacy)
   până migrăm fiecare pagină. Sursă: .claude/newdesign/kinetic_flow/DESIGN.md
   ████████████████████████████████████████████████████████████████ */

@layer tokens {
  :root {
    /* ---------- TIER 1 · RAW (Material roles din DESIGN.md) ---------- */
    /* lime */
    --c-kf-lime:        #ccff00;   /* primary-container — buton lime (RAR, doar CTA critic) */
    --c-kf-lime-tint:   #eef7c6;   /* lime pal — badge-uri/accente soft (lime „diluat") */
    --c-kf-lime-dim:    #abd600;   /* inverse-primary */
    --c-kf-olive:       #506600;   /* primary — solid / accent text */
    --c-kf-olive-2:     #5b7300;   /* on-primary-container — text pe lime */
    --c-kf-olive-ink:   #161e00;   /* on-primary-fixed */
    /* purple */
    --c-kf-purple:      #7000ff;   /* secondary-container */
    /* orange / alert (tertiary) */
    --c-kf-orange:      #b42800;   /* tertiary */
    --c-kf-orange-2:    #ca2f00;   /* on-tertiary-container */
    --c-kf-orange-soft: #ffe8e3;   /* tertiary-container */
    /* cyan / info (al treilea neon — callout) */
    --c-kf-cyan:        #0a7d88;   /* text cyan închis pe light */
    --c-kf-cyan-soft:   #d6f7fb;   /* bg soft */
    /* error */
    --c-kf-error:       #ba1a1a;
    --c-kf-error-soft:  #ffdad6;
    --c-kf-error-2:     #93000a;   /* on-error-container — ȘI text pe danger PLIN în dark */
    /* success / done (verde kf — distinct de lime-winner) */
    --c-kf-green:       #2f6b3a;
    --c-kf-green-soft:  #c8efce;
    --c-kf-green-2:     #0b3d1d;
    /* warning / tie (amber kf — distinct de orange-alert/error) */
    --c-kf-amber:       #7a5800;
    --c-kf-amber-soft:  #ffe6a0;
    --c-kf-amber-2:     #5a3e00;
    /* neutrals / surfaces */
    --c-kf-bg:        #f9f9f6;   /* background */
    --c-kf-s-lowest:  #ffffff;   /* surface-container-lowest */
    --c-kf-s-low:     #f4f4f1;   /* surface-container-low — tonal card */
    --c-kf-s:         #eeeeeb;   /* surface-container */
    --c-kf-s-high:    #e8e8e5;   /* surface-container-high */
    --c-kf-s-highest: #e2e3e0;   /* surface-container-highest */
    --c-kf-on:        #1a1c1a;   /* on-surface */
    --c-kf-on-var:    #444933;   /* on-surface-variant */
    --c-kf-outline:   #747a60;   /* outline */
    --c-kf-outline-v: #c4c9ac;   /* outline-variant */
    --c-kf-inverse-on:#f1f1ee;   /* inverse-on-surface */

    /* ---------- TIER 2 · SEMANTIC ROLES (light) ---------- */
    --kf-bg:            var(--c-kf-bg);
    --kf-surface:       var(--c-kf-s-low);    /* carduri / panouri (line-less) */
    --kf-surface-2:     var(--c-kf-s);        /* nested / chips bg */
    --kf-surface-3:     var(--c-kf-s-high);
    --kf-surface-inset: var(--c-kf-s-highest);/* ghost input / inset */
    --kf-surface-bright:var(--c-kf-s-lowest); /* rânduri „feed" */
    --kf-text:          var(--c-kf-on);
    --kf-text-variant:  var(--c-kf-on-var);
    --kf-outline:       var(--c-kf-outline);

    --kf-primary:       var(--c-kf-lime);     /* buton lime, bg (RAR) */
    --kf-on-primary:    var(--c-kf-olive-2);  /* text pe lime */
    --kf-tint:          var(--c-kf-lime-tint);/* badge/accent soft (lime diluat) */
    --kf-on-tint:       var(--c-kf-olive);    /* text pe tentă */
    --kf-primary-solid: var(--c-kf-olive);    /* buton solid (submit) */
    --kf-on-solid:      var(--c-kf-s-lowest);  /* text alb pe solid */
    --kf-accent:        var(--c-kf-olive);    /* etichete date / accent text */
    --kf-accent-strip:  var(--c-kf-lime);     /* lime ca FUNDAL PLIN (--volt, hover de rând,
                                                 badge LIVE) — text ink deasupra, 14.65:1 */
    /* MARKER = accentul desenat SUBȚIRE peste o suprafață: subliniere de tab activ, bară de
       progres, strip de hover, inset de focus, border-top. Lime FIX nu poate face asta: pe
       tema light dă 1.05–1.11:1 față de suprafețele deschise, adică marcajul DISPARE — bara
       de procente din clasament și sublinierea tabului activ erau practic absente pe light.
       Un marcaj trebuie să contrasteze cu ce e SUB el, deci urmează tema. */
    --kf-marker:        var(--kf-primary-solid);

    --kf-secondary:     var(--c-kf-purple);
    --kf-on-secondary:  var(--c-kf-s-lowest);

    --kf-alert:         var(--c-kf-orange);
    --kf-alert-soft:    var(--c-kf-orange-soft);
    --kf-on-alert-soft: var(--c-kf-orange-2);

    --kf-info:          var(--c-kf-cyan);       /* callout/info (cyan) */
    --kf-info-soft:     var(--c-kf-cyan-soft);

    --kf-danger:        var(--c-kf-error);
    --kf-danger-soft:   var(--c-kf-error-soft);
    --kf-on-danger:     var(--c-kf-s-lowest);   /* text pe danger PLIN (buton roșu) */

    --kf-success:        var(--c-kf-green);      /* done / qualified / positive */
    --kf-success-soft:   var(--c-kf-green-soft);

    --kf-warning:        var(--c-kf-amber);      /* tie / locked / atenție */
    --kf-warning-soft:   var(--c-kf-amber-soft);
    --kf-on-warning-soft:var(--c-kf-amber-2);

    /* ---------- TYPOGRAPHY ---------- */
    --kf-font:         'Twemoji Country Flags', 'Archivo', system-ui, sans-serif;
    --kf-font-display: 'Twemoji Country Flags', 'Archivo', sans-serif;  /* Archivo 900 "Black" — gros dar aerisit (fost Anton, prea condensat) */
    --kf-font-mono:    'Twemoji Country Flags', 'Space Mono', ui-monospace, monospace;
    --kf-fs-body:    1rem;     /* 16 — singurul fs kf consumat; restul scalei = superseded de --font-* legacy */

    /* ---------- RADII (brutalist pătrățos) ---------- */
    --kf-r-sm:   0;           /* singurul radius kf consumat; restul = superseded de --radius-* remapat la 0 */

    /* ---------- SPACING (unit 4px) ---------- */
    --kf-2: .5rem;  --kf-3: .75rem;  --kf-4: 1rem;
    --kf-5: 1.5rem;  --kf-6: 2rem;   --kf-7: 2.5rem;  --kf-8: 3rem;
    --kf-gutter: 1.5rem;       /* 24px */

    /* ---------- STRUCTURĂ (brutalist FLAT: hairline subțire, zero umbre) ---------- */
    --kf-line:   #cdd0bd;                      /* hairline muted deschis (NU negru gros) */
    --kf-line-strong: var(--c-kf-outline);     /* hairline mai vizibil la nevoie */
    --kf-border: 1px solid var(--kf-line);     /* 1px subțire */
    /* FLAT — zero umbre: --shadow-hard* (legacy) e remapat la `none`, nu mai trebuie token kf separat. */
  }

  /* ---------- DARK (remap doar rolurile; accentele rămân vii) ---------- */
  [data-theme="dark"] {
    --kf-bg:            #14160f;
    --kf-surface:       #1f211c;
    --kf-surface-2:     #262822;
    --kf-surface-3:     #2f312b;
    --kf-surface-inset: #34362f;
    --kf-surface-bright:#1a1c17;
    --kf-text:          var(--c-kf-inverse-on);
    --kf-text-variant:  #b9bda6;
    --kf-outline:       #8a8f74;
    --kf-on-primary:    var(--c-kf-olive-ink);  /* text mai închis pe lime */
    --kf-tint:          #2c3a00;                 /* tentă lime întunecată */
    --kf-on-tint:       var(--c-kf-lime-dim);
    /* ACCENTUL SE URCĂ PE SCARA TONALĂ (Material 3: primary = tone 40 light / tone 80 dark).
       olive (#506600 = tone 40) pe fundal închis dă 2.3–2.8:1 — sub pragul de text al oricărei
       teme. lime-dim (= `inverse-primary` din DESIGN.md, adică exact primary-ul temei inverse)
       dă 8.8–10.7:1. NU inventa un hex nou aici: tonul potrivit era deja în paletă, nelegat.
       Consecință obligatorie: pe solid lime textul devine INK, nu alb (alb pe lime-dim = 1.70). */
    --kf-accent:        var(--c-kf-lime-dim);
    --kf-primary-solid: var(--c-kf-lime-dim);
    --kf-on-solid:      var(--c-kf-olive-ink);
    --kf-on-danger:     var(--c-kf-error-2);     /* danger dark = #ffb4ab deschis → ink, nu alb */
    --kf-line:          #3a3d31;                 /* hairline subțire pe fundal închis */
    --kf-line-strong:   var(--c-kf-outline);
    /* semantice pe dark — soft-urile light ar da fundal greșit (remap unlayered = ambele teme) */
    --kf-success:        #7ddb96; --kf-success-soft: #15311d;
    --kf-warning:        #e8c466; --kf-warning-soft: #33270a; --kf-on-warning-soft: #ffe6a0;
    --kf-danger:         #ffb4ab; --kf-danger-soft:  #3a1717;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   SCHIMBARE TOTALĂ kf — remap GLOBAL al tokenilor de SKIN din @layer app → valori kf.
   Nelayered → bate @layer app (inclusiv [data-theme=dark]) în AMBELE teme;
   tokenii --kf-* sunt theme-aware → light+dark automat. Atinge DOAR skin
   (culoare/font/umbră/rază); width/grid/flex/gap/size rămân legacy → ARANJAMENTUL NEATINS.
   Stările semantice (--success/--danger/--warning + soft) = remapate la kf-native
   (--kf-success/-danger/-warning, theme-aware) → done/penalty/tie/fav urmează paleta kf.
   Codarea pe criterii (.sc-round--c0/c1/c2 hardcodate; golden via --golden-soft/--on-golden
   definite DOAR în :root base, neremapate aici/dark) = PĂSTRATĂ light intenționat (theme-independent).
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  /* fonturi: display → Archivo 900 "Black" (headere/numere mari peste tot); sans/mono rămân (= kf) */
  --font-display: var(--kf-font-display);
  /* flat total + colțuri ascuțite */
  --shadow-hard: none; --shadow-hard-sm: none;
  --radius-sm: 0; --radius-md: 0; --radius-lg: 0;
  /* borduri: gata cu ramele ink 2px groase → hairline kf.
     EXCEPȚIE --border-control: conturul unui control nefilled nu poate coborî la hairline (1.43:1)
     fără ca pastila/tabul să înceteze să arate a control — `--kf-line-strong` (4.06/3.63) era
     definit și nefolosit exact pentru cazul ăsta. Carduri/antete rămân plate: nu sunt controale. */
  --border-strong: var(--kf-line); --border-hair: var(--kf-line); --border-subtle: var(--kf-line);
  --border-control: var(--kf-line-strong);
  /* accent/live/highlight → lime kf */
  /* --volt = lime (theme-INDEPENDENT, lime în ambele teme) → „ink pe lime" trebuie să fie ÎNCHIS FIX,
     nu un token care se inversează (kf-text→alb pe dark) sau olive cu contrast slab. olive-ink = #161e00. */
  --volt: var(--kf-accent-strip); --volt-ink: var(--c-kf-olive-ink);
  --primary: var(--kf-primary-solid); --accent: var(--kf-primary-solid);
  --primary-strong: var(--kf-primary-solid); --primary-soft: var(--kf-tint);
  --on-primary-soft: var(--kf-on-tint);
  /* PERECHEA lui --primary/--danger. Orice `background: var(--primary)` are nevoie de un text
     care se întoarce ODATĂ CU EL: în dark solidul urcă la lime-dim, deci albul (1.70:1) devine ink.
     `--c-white` literal lângă un fundal tematizat = bug garantat la prima temă nouă. */
  --on-primary: var(--kf-on-solid); --on-danger: var(--kf-on-danger);
  --accent-soft: var(--kf-tint);       /* era roz flash — singura urmă de Battle-Broadcast în focus/pills */
  --focus-ring: var(--kf-primary-solid);
  /* semantice → kf-native (done/penalty/tie/fav + alerte/badge/spots, dintr-un loc) */
  --success: var(--kf-success); --success-soft: var(--kf-success-soft);
  --danger:  var(--kf-danger);  --danger-soft:  var(--kf-danger-soft);
  --warning: var(--kf-warning); --warning-soft: var(--kf-warning-soft);
  --on-warning-soft: var(--kf-on-warning-soft);
  /* suprafețe */
  --paper: var(--kf-surface); --paper-2: var(--kf-surface-bright); --card: var(--kf-surface);
  --surface: var(--kf-surface); --surface-2: var(--kf-surface-bright);
  --surface-inverse: var(--kf-text); --text-on-inverse: var(--kf-surface-bright);
  /* text */
  --text: var(--kf-text);
  --fg1: var(--kf-text); --fg2: var(--kf-text);
  --fg3: var(--kf-text-variant); --fg4: var(--kf-outline);
  --text-secondary: var(--kf-text); --text-muted: var(--kf-text-variant); --text-faint: var(--kf-outline);
  /* winner → lime kf (toate regulile is-win/winner urmează automat) */
  --winner-bg: var(--kf-tint); --winner-fg: var(--kf-on-tint);
  --winner-edge: var(--kf-primary-solid); --winner-ink: var(--kf-text);
  /* votul publicului → suprafață neutră + muchie lime (identitate fără strigăt, vezi rolurile) */
  --audience-bg: var(--kf-surface-bright); --audience-fg: var(--kf-text);
  /* muchia votului: `--kf-primary-solid` (marcaj care urmează tema), NU `--kf-accent-strip` (lime).
     Lime e UMPLERE: ca linie de 3px pe `--audience-bg` (alb pe light) dădea 1.06:1, adică muchia —
     singura purtătoare de identitate a benzii, fundalul fiind voit neutru — nu se vedea deloc. */
  --audience-lbl: var(--kf-text-variant); --audience-edge: var(--kf-primary-solid);
}

/* ============================================================
   CHIP DE AJUSTARE (ADR 0021 am.3) — penalizare/bonus, UN singur markup + UN singur stil,
   randat de macro-ul `templates/_adj_chip.html.twig` pe SCORECARD si pe ECRANUL JURATULUI.

   Sta in tokens.css fiindca e singurul fisier incarcat de AMBELE audiente (public: tokens →
   scoreboard → components → admin → base-layout → kf-skin; jurat: tokens → judge → base-layout).
   Alternativa — clase duplicate in scoreboard.css si judge.css — e exact mecanismul prin care
   cele doua ecrane au ajuns sa arate aceeasi penalizare altfel.

   Fundal PLIN in culoarea nivelului, ca butonul selectat al juratului: aceeasi penalizare are
   aceeasi culoare de la tapul juratului pana pe scorecardul public.
   ============================================================ */
@layer app {
  .adj-chip {
      display: inline-flex; align-items: baseline; gap: .25em;
      padding: 0 .3rem; border-radius: var(--radius-sm, 4px);
      font-size: var(--font-2xs); font-weight: 700; line-height: 1.5;
      text-transform: uppercase; letter-spacing: .02em;
      color: var(--adj-on); background: var(--adj-penalty-2);
      /* Cuvintele sunt mai late decat semnele de dinainte („misbehavior" vs „−−−"): chipul cedeaza
         latime si se rupe in loc sa impinga nota afara din celula. */
      min-width: 0; overflow-wrap: break-word;
  }
  .adj-chip--penalty1 { background: var(--adj-penalty-1); }
  .adj-chip--penalty2 { background: var(--adj-penalty-2); }
  .adj-chip--penalty3 { background: var(--adj-penalty-3); }
  .adj-chip--bonus1   { background: var(--adj-bonus-1); }
  .adj-chip--bonus2   { background: var(--adj-bonus-2); }
  .adj-chip--bonus3   { background: var(--adj-bonus-3); }
  /* Numarul de repetari si procentul sunt secundare fata de cuvant — aceeasi culoare, mai discrete. */
  .adj-chip__count,
  .adj-chip__pct { font-weight: 400; opacity: .85; }
}