/* KapaZero · tokens de diseño compartidos (Control y STL Snapper). FUENTE ÚNICA: shared/kz-tokens.css.
   No editar las copias de src/web-control/shared ni src/web-stl-snapper/shared: editar aquí y ejecutar .claude/scripts/sincronizar-shared.sh.
   Todo color sale de un token con versión clara y oscura. Los tokens propios de una app (p. ej. el visor 3D de STL) van en su CSS. */
:root{
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 0.5h8L5 5.5z' fill='%235b6372' fill-opacity='.8'/%3E%3C/svg%3E"); --bg:#f3f4f7; --surface:#ffffff; --surface-2:#f8f9fb; --ink:#1a1e27; --muted:#5b6372; --line:#dde1e8; --line-strong:#c6ccd6;
  --accent:#3a5a96; --accent-ink:#ffffff; --accent-soft:#e6ecf7; --focus:#2f6fe0;
  --pos:#1f6b3a; --neg:#a3262a;
  --amber-bg:#fdf3d6; --amber-fg:#7a4100; --green-bg:#dcf3e2; --green-fg:#1d5a2c; --red-bg:#f8d9d9; --red-fg:#8f1d1d;
  --blue-bg:#d9e6fd; --blue-fg:#1a4480; --purple-bg:#ecdcf7; --purple-fg:#5a3a6e; --orange-bg:#ffe5d0; --orange-fg:#8b3a00; --cyan-bg:#d4eef2; --cyan-fg:#0c5460; --pink-bg:#fbdcec; --pink-fg:#8a1f5a;
  --shadow:0 12px 40px rgba(20,30,50,.18);
  --danger-solid:#c62828; --danger-solid-hover:#b01f1f; --scrim:rgba(10,14,22,.5);
  --c-coste:#c0392b; --c-pvp:#9a7400; --c-gan:#3f8f4f; --c-pvpf:#c46f00; --c-ganf:#1f6b2e; --c-ink:#1a1e27;
  --f-display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;
  --f-body:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 0.5h8L5 5.5z' fill='%239aa3b2' fill-opacity='.8'/%3E%3C/svg%3E"); --bg:#12151b; --surface:#1a1e26; --surface-2:#20252f; --ink:#e7eaf0; --muted:#9aa3b2; --line:#2c323d; --line-strong:#3b4350;
  --accent:#8aa8e6; --accent-ink:#0f1520; --accent-soft:#243251; --focus:#8fb4ff; --pos:#6fd08f; --neg:#ff8a85;
  --amber-bg:#4a3510; --amber-fg:#f8d48a; --green-bg:#173d24; --green-fg:#9fe0b2; --red-bg:#4a1c1d; --red-fg:#ffb3b0;
  --blue-bg:#1c2f52; --blue-fg:#a9c6ff; --purple-bg:#372447; --purple-fg:#dcbcf2; --orange-bg:#4a2a12; --orange-fg:#ffc394; --cyan-bg:#123d44; --cyan-fg:#9fe3ee; --pink-bg:#4a1d36; --pink-fg:#ffb3da;
  --c-coste:#ff9b8f; --c-pvp:#f2d27a; --c-gan:#9fd8aa; --c-pvpf:#ffb35c; --c-ganf:#6fd08f; --c-ink:#eef0f4;
  --shadow:0 12px 40px rgba(0,0,0,.5); color-scheme:dark;
  --danger-solid:#d93a3a; --danger-solid-hover:#c43030;}}
:root[data-theme="dark"]{
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 0.5h8L5 5.5z' fill='%239aa3b2' fill-opacity='.8'/%3E%3C/svg%3E"); --bg:#12151b; --surface:#1a1e26; --surface-2:#20252f; --ink:#e7eaf0; --muted:#9aa3b2; --line:#2c323d; --line-strong:#3b4350;
  --accent:#8aa8e6; --accent-ink:#0f1520; --accent-soft:#243251; --focus:#8fb4ff; --pos:#6fd08f; --neg:#ff8a85;
  --amber-bg:#4a3510; --amber-fg:#f8d48a; --green-bg:#173d24; --green-fg:#9fe0b2; --red-bg:#4a1c1d; --red-fg:#ffb3b0;
  --blue-bg:#1c2f52; --blue-fg:#a9c6ff; --purple-bg:#372447; --purple-fg:#dcbcf2; --orange-bg:#4a2a12; --orange-fg:#ffc394; --cyan-bg:#123d44; --cyan-fg:#9fe3ee; --pink-bg:#4a1d36; --pink-fg:#ffb3da;
  --c-coste:#ff9b8f; --c-pvp:#f2d27a; --c-gan:#9fd8aa; --c-pvpf:#ffb35c; --c-ganf:#6fd08f; --c-ink:#eef0f4;
  --shadow:0 12px 40px rgba(0,0,0,.5); color-scheme:dark;
  --danger-solid:#d93a3a; --danger-solid-hover:#c43030;}
/* tonos derivados (bordes suaves) */
:root{
  --accent-line:color-mix(in srgb,var(--accent) 38%,var(--surface));
  --green-line:color-mix(in srgb,var(--pos) 30%,var(--surface));
  --red-line:color-mix(in srgb,var(--neg) 30%,var(--surface));
  --orange-line:color-mix(in srgb,var(--orange-fg) 30%,var(--surface));
  --amber-line:color-mix(in srgb,var(--amber-fg) 30%,var(--surface));
}