/* ============================================================================
   house.css — TEMA NOASTRĂ (skin unic Mircea) pentru hub-ul celor 150+ jucători.
   Design tokens pe 3 straturi (primitive → semantic → component), model W3C.
   PROPUNERE 2026-07-12 — Mircea poate retuna orice valoare. Theme-aware (light/dark).
   „Vederea lor" (brand) suprascrie doar --brand-* prin brands/<jucator>.css.
   ============================================================================ */

:root {
  /* --- 1. PRIMITIVE (paleta brută) --- */
  --c-indigo-950:#0e1020; --c-indigo-900:#171a33; --c-indigo-800:#2a2f52;
  --c-ink-950:#12121a; --c-ink-900:#1b1b28; --c-ink-700:#2b2b3d;
  --c-cream-50:#f6f1e7; --c-cream-100:#efe7d7; --c-cream-200:#e4d7bf;
  --c-gold-500:#c8a24a; --c-gold-400:#d9b968; --c-gold-300:#e6cd8e;
  --c-plum-500:#8a6ab0; --c-plum-400:#a487c9;
  --c-slate-500:#6b7392; --c-slate-400:#8b93b0; --c-slate-300:#a9b0c9;
  --c-white:#ffffff; --c-black:#000000;
  --c-ok:#5aa06e; --c-warn:#c98a3a; --c-stop:#b25a5a;

  /* --- 2. SEMANTIC (rol, nu culoare) — LIGHT implicit --- */
  --bg:            var(--c-cream-50);
  --surface:       var(--c-white);
  --surface-2:     var(--c-cream-100);
  --ink:           #23233a;
  --ink-soft:      #55556f;
  --line:          #d8cdb4;
  --accent:        var(--c-gold-500);
  --accent-soft:   var(--c-gold-300);
  --link:          #7a5bb0;

  /* chip-uri onești (semantică unică, moștenită de toți jucătorii) */
  --chip-calc:     var(--c-slate-500);   /* rezultat de calcul */
  --chip-verbatim: var(--c-plum-500);    /* text verbatim al LOR */
  --chip-nostru:   var(--c-gold-500);    /* interpretarea NOASTRĂ */
  --chip-viu:      var(--c-ok);          /* strat viu (azi) */
  --chip-indisp:   var(--c-slate-400);   /* indisponibil onest */

  /* --- 3. FONT / SPAȚIERE / FORMĂ --- */
  --font-titlu: "Fraunces","Georgia",serif;
  --font-text:  "Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r-sm:8px; --r-md:14px; --r-lg:22px;
  --sp-1:6px; --sp-2:12px; --sp-3:20px; --sp-4:32px;
  --maxw:1100px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:          var(--c-ink-950);
    --surface:     var(--c-ink-900);
    --surface-2:   var(--c-ink-700);
    --ink:         #ece7f2;
    --ink-soft:    #a9a2bd;
    --line:        #33334a;
    --accent:      var(--c-gold-400);
    --accent-soft: var(--c-gold-500);
    --link:        var(--c-plum-400);
  }
}
:root[data-theme="dark"] {
  --bg:var(--c-ink-950); --surface:var(--c-ink-900); --surface-2:var(--c-ink-700);
  --ink:#ece7f2; --ink-soft:#a9a2bd; --line:#33334a;
  --accent:var(--c-gold-400); --accent-soft:var(--c-gold-500); --link:var(--c-plum-400);
}

/* --- COMPONENTE comune (moștenite de orice jucător în house-view) --- */
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--font-text); line-height:1.6; }
h1,h2,h3 { font-family:var(--font-titlu); font-weight:600; line-height:1.2; }
a { color:var(--link); text-decoration:none; }
a:hover { text-decoration:underline; }

.wrap { max-width:var(--maxw); margin:0 auto; padding:var(--sp-3); }
.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
        padding:var(--sp-3); margin:var(--sp-2) 0; }
.card .txt { white-space:pre-wrap; }           /* verbatim INTEGRAL, zero trunchiere */

.chip { display:inline-block; font-size:12px; padding:2px 10px; border-radius:20px;
        color:var(--c-white); margin-right:6px; }
.chip.calc{background:var(--chip-calc)} .chip.verbatim{background:var(--chip-verbatim)}
.chip.nostru{background:var(--chip-nostru)} .chip.viu{background:var(--chip-viu)}
.chip.indisp{background:var(--chip-indisp)}

/* empty-state onest — „gol = gol, zero fabricație" (regulă moștenită) */
.indisp { color:var(--ink-soft); font-style:italic; border-left:3px solid var(--chip-indisp);
          padding-left:var(--sp-2); }

/* bara-hub (navigare între jucători) + comutator vedere */
.hubbar { position:sticky; top:0; z-index:9; background:var(--surface-2);
          border-bottom:1px solid var(--line); padding:var(--sp-2) var(--sp-3);
          display:flex; gap:var(--sp-2); align-items:center; flex-wrap:wrap; }
.hubbar .pill { padding:6px 14px; border-radius:20px; border:1px solid var(--line);
                background:var(--surface); color:var(--ink-soft); font-size:13px; cursor:pointer; }
.hubbar .pill.act { background:var(--accent); color:var(--c-black); border-color:var(--accent); }
.viewtoggle { margin-left:auto; }

/* responsive */
@media (max-width:720px){ .wrap{padding:var(--sp-2)} .hubbar{gap:6px} }
img,svg,table { max-width:100%; }
.scrollx { overflow-x:auto; }