/* =========================================================
   Micul Inginer – temele Roz, Cosmic și Curse (Luminos și Noapte sunt în stilurile de bază).
   „html:root[...]” e mai puternic decât regulile de zi/noapte, deci tema aleasă câștigă mereu.
   ========================================================= */
html:root[data-theme="pink"]{
  --bg:#fff2f8; --panel:#ffffff; --ink:#3b1d33; --muted:#8a5c7c; --line:#f6d2e4;
  --accent:#e0457b; --accent-2:#a742c9; --accent-ink:#fff; --soft:#ffe4f0; --soft-2:#f4e6ff;
  --good:#1f9d55; --warn:#c06a00; --bad:#d23c5f; --canvas:#ffeaf4; --tip:#fff6fb; --tip-line:#f3b8d4;
  --warnbg:#ffe8ee; --warnline:#f5b3c6; --hl:#a742c9; --shadow:0 10px 30px rgba(160,40,100,.10);
  color-scheme:light;
}
html:root[data-theme="space"]{
  --bg:#0a0f24; --panel:#131a3a; --ink:#e9edff; --muted:#a2abd9; --line:#283166;
  --accent:#8b6cff; --accent-2:#22d3ee; --accent-ink:#fff; --soft:#241d5a; --soft-2:#0f3448;
  --good:#34d399; --warn:#fbbf24; --bad:#fb7185; --canvas:#0e1532; --tip:#1d1a4d; --tip-line:#4b45b8;
  --warnbg:#3a1432; --warnline:#7c2655; --hl:#22d3ee; --shadow:0 10px 30px rgba(0,0,0,.45);
  color-scheme:dark;
}
html:root[data-theme="race"]{
  --bg:#eef0f3; --panel:#ffffff; --ink:#15171c; --muted:#5d6470; --line:#d8dce3;
  --accent:#e10600; --accent-2:#f5a300; --accent-ink:#fff; --soft:#ffe6e4; --soft-2:#fff3d6;
  --good:#11884a; --warn:#b86e00; --bad:#c81e1e; --canvas:#e3e7ec; --tip:#fff8e6; --tip-line:#f0cf7a;
  --warnbg:#fde9e9; --warnline:#f1b4b4; --hl:#f5a300; --shadow:0 10px 30px rgba(20,25,35,.10);
  color-scheme:light;
}
html:root[data-theme="cubes"]{
  --bg:#bfe6ff; --panel:#ffffff; --ink:#1b2430; --muted:#55657a; --line:#9fb3c8;
  --accent:#2f9e44; --accent-2:#1c7ed6; --accent-ink:#fff; --soft:#e3f6e6; --soft-2:#e1efff;
  --good:#2f9e44; --warn:#e67700; --bad:#e03131; --canvas:#eaf6ff; --tip:#fff9db; --tip-line:#f5c84b;
  --warnbg:#fff0e6; --warnline:#f7b98a; --hl:#f59f00; --shadow:0 5px 0 rgba(27,36,48,.18);
  color-scheme:light;
}
html[data-theme="dark"]{color-scheme:dark}

/* fundaluri cu personalitate (discrete, ca textul să rămână ușor de citit) */
html[data-mi="pink"] body{background-color:var(--bg);background-image:radial-gradient(circle at 12px 12px, rgba(224,69,123,.10) 2.5px, transparent 3px),radial-gradient(circle at 36px 36px, rgba(167,66,201,.08) 2px, transparent 2.5px);background-size:48px 48px}
html[data-mi="space"] body{background-color:var(--bg);background-image:
  radial-gradient(1.2px 1.2px at 20px 30px, #fff 50%, transparent 51%),radial-gradient(1px 1px at 80px 120px, #cfd6ff 50%, transparent 51%),
  radial-gradient(1.5px 1.5px at 160px 60px, #fff 50%, transparent 51%),radial-gradient(1px 1px at 230px 170px, #a5f3fc 50%, transparent 51%),
  radial-gradient(1.2px 1.2px at 300px 90px, #fff 50%, transparent 51%),radial-gradient(ellipse at 85% -10%, rgba(139,108,255,.25), transparent 55%),
  radial-gradient(ellipse at -10% 110%, rgba(34,211,238,.15), transparent 50%);background-size:340px 220px,340px 220px,340px 220px,340px 220px,340px 220px,100% 100%,100% 100%;background-attachment:fixed}
html[data-mi="race"] body{background-color:var(--bg)}
html[data-mi="race"] .top{border-bottom:0}
html[data-mi="race"] header.top{position:relative}
html[data-mi="race"] .top::after,html[data-mi="race"] header.top::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:8px;
  background:repeating-conic-gradient(#15171c 0 25%, #fff 0 50%) 0 0/16px 16px;pointer-events:none}
html[data-mi="race"] header.top{margin-bottom:8px}

/* Cuburi: cer cu nori pixelați, iarbă și pământ sub antet, totul din blocuri cu umbră tare (aspect 3D) */
html[data-mi="cubes"] body{background-color:var(--bg);background-image:
  linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px),linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px);
  background-size:32px 32px}
html[data-mi="cubes"] header.top{position:relative;border-bottom:0;margin-bottom:14px}
html[data-mi="cubes"] header.top::after{content:"";position:absolute;left:0;right:0;bottom:-14px;height:14px;pointer-events:none;
  background:linear-gradient(#51cf66 0 6px, transparent 6px),repeating-linear-gradient(90deg,#8d5a2b 0 14px,#a0692f 14px 28px,#7a4a22 28px 42px);}
html[data-mi="cubes"] .btn{border:2px solid #1b2430;border-radius:6px;box-shadow:0 4px 0 #1b2430;transform:translateY(-2px);transition:transform .06s,box-shadow .06s}
html[data-mi="cubes"] .btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 5px 0 #1b2430}
html[data-mi="cubes"] .btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 0 0 #1b2430}
html[data-mi="cubes"] .card,html[data-mi="cubes"] .panel,html[data-mi="cubes"] .stat,html[data-mi="cubes"] .faq details,html[data-mi="cubes"] .banner{border:2px solid #1b2430;border-radius:8px;box-shadow:0 5px 0 rgba(27,36,48,.85)}
html[data-mi="cubes"] .panel{overflow:hidden}
html[data-mi="cubes"] .tp-menu,html[data-mi="cubes"] dialog .dlg{border-radius:8px}
html[data-mi="cubes"] .tp-opt{border-radius:6px}

/* logo-ul ia culoarea temei */
html[data-mi] .brand svg rect,html[data-mi] .logo svg rect{fill:var(--accent)}

/* butonul 🎨 și meniul */
.tpick{position:relative;display:inline-flex}
.tp-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:6px;
  box-shadow:0 18px 40px rgba(0,0,0,.25);width:min(280px,86vw);display:grid;gap:4px}
.tp-opt{display:flex;gap:10px;align-items:center;text-align:left;border:2px solid transparent;background:transparent;color:var(--ink);padding:8px 10px;border-radius:12px;font:inherit;cursor:pointer}
.tp-opt:hover{background:var(--soft)}
.tp-opt[aria-checked="true"]{border-color:var(--accent);background:var(--soft)}
.tp-opt small{display:block;color:var(--muted);font-weight:600;font-size:12px}
.tp-em{font-size:22px;width:30px;text-align:center}
@media (max-width:700px){ .tp-l{display:none} }
