/* WESEO Design-Tokens (geteilt von WESEO Theme und WESEO Studio). Quelle: research/04-designsystem.md */
@font-face{font-family:"Inter";src:url("fonts/Inter-Variable.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Inter Fallback";src:local("Arial");size-adjust:107%;ascent-override:90%;descent-override:22%;line-gap-override:0%}
:root{
  --ws-font-sans:"Inter","Inter Fallback",Helvetica,Arial,sans-serif;
  --ws-font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --ws-bg:#ffffff; --ws-surface:#ffffff; --ws-card:#f9f9f9;
  --ws-ink:#1f1f1f; --ws-muted:#545454; --ws-muted-strong:#323232; --ws-ash:#909090;
  --ws-line:rgba(240,240,240,.7); --ws-line-strong:#f0f0f0;
  --ws-field-border:color-mix(in srgb,var(--ws-ink) 45%,var(--ws-surface));
  --ws-primary:#1f1f1f; --ws-on-primary:#ffffff;
  --ws-tint:rgba(31,31,31,.07); --ws-tint-strong:rgba(31,31,31,.13);
  --ws-hover-wash:color-mix(in srgb,var(--ws-ink) 4%,transparent);
  --ws-yellow:#fcff00; --ws-on-yellow:#1f1f1f;          /* Gelb nur als Fläche */
  --ws-block:#1f1f1f; --ws-block-fg:#ffffff; --ws-block-muted:rgba(255,255,255,.72);
  --ws-block-line:color-mix(in srgb,#fff 14%,#1f1f1f);
  --ws-ok:#34863c; --ws-warn:#9a6f00; --ws-danger:#dc3232;
  --ws-ok-tint:rgba(52,134,60,.08); --ws-warn-tint:rgba(154,111,0,.08); --ws-danger-tint:rgba(220,50,50,.08);
  --ws-radius-xs:4px; --ws-radius-sm:10px; --ws-radius-md:15px; --ws-radius-lg:19px; --ws-radius-pill:999px;
  --ws-shadow-card:none;
  --ws-shadow-menu:0 24px 48px -28px color-mix(in srgb,var(--ws-ink) 45%,transparent);
  --ws-shadow-modal:0 24px 60px -24px rgba(0,0,0,.5);
  --ws-shadow-panel:-12px 0 32px -24px rgba(0,0,0,.35);
  --ws-backdrop:rgba(10,12,16,.32);
  --ws-focus-outline:2px solid var(--ws-ink); --ws-focus-offset:2px;
  --ws-focus-ring:0 0 0 3px color-mix(in srgb,var(--ws-yellow) 85%,transparent);
  --ws-fs-meta:.65rem; --ws-fs-xs:.7rem; --ws-fs-sm:.8125rem; --ws-fs-ui:.875rem; --ws-fs-md:.95rem;
  --ws-fs-section:clamp(1.15rem,1.6vw,1.4rem); --ws-fs-kpi:clamp(2rem,2.6vw,2.6rem);
  --ws-fs-title:clamp(2.2rem,4vw,3.5rem);               /* Admin: kleiner als Sphere-Hero (bis 5.5rem) */
  --ws-fw-light:300; --ws-fw-regular:400; --ws-fw-ui:500; --ws-fw-strong:600;
  --ws-tracking-display:-0.02em; --ws-tracking-meta:.14em; --ws-tracking-th:.06em;
  --ws-space-1:.25rem; --ws-space-2:.5rem; --ws-space-3:.75rem; --ws-space-4:1rem;
  --ws-space-5:1.25rem; --ws-space-6:1.5rem; --ws-space-8:2rem; --ws-space-12:3rem;
  --ws-card-pad:1.1rem 1.15rem 1rem; --ws-btn-pad:10px 15px; --ws-field-pad:.5rem .65rem;
  --ws-topbar-h:4rem; --ws-sidebar-w:240px; --ws-assistant-w:420px; --ws-content-max:1440px;
  --ws-title-bar-w:4rem; --ws-title-bar-h:.55rem; --ws-nav-active-h:4px;
  --ws-ease:cubic-bezier(.33,1,.68,1); --ws-ease-inout:cubic-bezier(.65,0,.35,1);
  --ws-t-fast:150ms; --ws-t-ui:220ms; --ws-t-content:560ms;
  --ws-z-topbar:40; --ws-z-panel:45; --ws-z-modal:60; --ws-z-progress:80;
  color-scheme:light;
}
/* Dunkles Erscheinungsbild (KURO Sphere / suite.weseo.io, research/04-designsystem.md §9).
   Aktiv über html[data-theme="dark"] (WESEO Studio setzt es im Backend pro Benutzer). Gelb bleibt fest. */
html[data-theme="dark"]{
  --ws-bg:#1f1f1f; --ws-surface:#2a2a2a; --ws-card:#2c2c2c;
  --ws-ink:#ffffff; --ws-muted:#c4cfd3; --ws-muted-strong:#eaeef0; --ws-ash:#8a9194;
  --ws-line:rgba(84,84,84,.6); --ws-line-strong:#545454;
  --ws-field-border:#8a8a8a;
  --ws-primary:#ffffff; --ws-on-primary:#1f1f1f;
  --ws-tint:rgba(255,255,255,.16); --ws-tint-strong:rgba(255,255,255,.26);
  --ws-hover-wash:rgba(255,255,255,.05);
  --ws-block-line:#404040;
  --ws-ok:#46b450; --ws-warn:#ffb900; --ws-danger:#e25757;
  --ws-ok-tint:rgba(70,180,80,.14); --ws-warn-tint:rgba(255,185,0,.14); --ws-danger-tint:rgba(226,87,87,.16);
  --ws-shadow-menu:0 24px 48px -12px rgba(0,0,0,.66);
  --ws-backdrop:rgba(0,0,0,.6);
  color-scheme:dark;
}
