/* Лексика · направление C «Спокойный поток»
   Единственный источник базовых значений: primitive → semantic → component. */

/* Primitive */
:root {
  --lx-ink-950:#0a0e17;
  --lx-ink-900:#101623;
  --lx-ink-800:#18202f;
  --lx-ink-700:#232c3d;
  --lx-ink-600:#384256;
  --lx-ink-500:#566074;
  --lx-ink-450:#697386;
  --lx-ink-400:#7e8798;
  --lx-ink-300:#a8b0be;
  --lx-ink-200:#cdd3dc;
  --lx-ink-100:#e6e9ee;
  --lx-ink-50:#f3f5f8;
  --lx-paper:#fafbfc;
  --lx-white:#fff;
  --lx-black:#000;

  --lx-cobalt-700:#2a4fc4;
  --lx-cobalt-600:#3257de;
  --lx-cobalt-500:#3b6bf0;
  --lx-cobalt-400:#6b93f6;
  --lx-cobalt-300:#a6c0fa;
  --lx-cobalt-100:#e4ecfe;
  --lx-cyan-700:#06758f;
  --lx-cyan-500:#37c6e0;
  --lx-cyan-400:#63d4e9;

  --lx-amber-600:#c7841e;
  --lx-amber-500:#e39b2e;
  --lx-amber-400:#f0b44e;
  --lx-amber-100:#fbebd0;
  --lx-green-600:#2c7a57;
  --lx-green-500:#349e6c;
  --lx-green-400:#46c08a;
  --lx-green-100:#dcf0e6;
  --lx-clay-600:#c24438;
  --lx-clay-500:#e0574a;
  --lx-clay-400:#ee7568;
  --lx-clay-100:#fbe3e0;
  --lx-red-600:#c4362c;
  --lx-red-500:#e0433a;
  --lx-red-100:#fbe1de;
  --lx-ochre-600:#b0791e;
  --lx-ochre-100:#f7ead1;

  --lx-dark-canvas:#05070c;
  --lx-dark-text:#f1f4f9;
  --lx-dark-border:#2a3446;
  --lx-dark-border-strong:#3a465c;
  --lx-hc-secondary:#1a2130;
  --lx-hc-tertiary:#333b4c;
  --lx-hc-focus:#ffd400;

  --lx-alpha-white-06:rgb(255 255 255 / .06);
  --lx-alpha-white-08:rgb(255 255 255 / .08);
  --lx-alpha-white-10:rgb(255 255 255 / .1);
  --lx-alpha-white-12:rgb(255 255 255 / .12);
  --lx-alpha-white-16:rgb(255 255 255 / .16);
  --lx-alpha-ink-06:rgb(16 22 35 / .06);
  --lx-alpha-ink-08:rgb(16 22 35 / .08);
  --lx-alpha-ink-12:rgb(16 22 35 / .12);
  --lx-alpha-cobalt-16:rgb(107 147 246 / .16);
  --lx-alpha-cobalt-40:rgb(59 107 240 / .4);
  --lx-alpha-cobalt-50:rgb(107 147 246 / .5);
  --lx-alpha-green-16:rgb(70 192 138 / .16);
  --lx-alpha-clay-16:rgb(238 117 104 / .16);
  --lx-alpha-amber-16:rgb(240 180 78 / .16);

  --lx-stream:linear-gradient(135deg,var(--lx-cobalt-500),var(--lx-cyan-500));
  --lx-stream-action:linear-gradient(135deg,var(--lx-cobalt-500),var(--lx-cyan-700));
  --lx-stream-soft:linear-gradient(135deg,var(--lx-cobalt-400),var(--lx-cyan-400));
  --lx-stream-horizontal:linear-gradient(90deg,var(--lx-cobalt-500),var(--lx-cyan-500));
  --lx-stream-glow:0 22px 56px rgb(59 107 240 / .34),0 8px 28px rgb(55 198 224 / .16);
  --lx-shadow-1:0 1px 2px var(--lx-alpha-ink-06);
  --lx-shadow-2:0 6px 18px var(--lx-alpha-ink-08);
  --lx-shadow-3:0 18px 44px var(--lx-alpha-ink-12);
  --lx-shadow-dark-1:0 1px 2px rgb(0 0 0 / .4);
  --lx-shadow-dark-2:0 8px 22px rgb(0 0 0 / .5);
  --lx-shadow-dark-3:0 20px 48px rgb(0 0 0 / .6);

  --lx-space-1:4px;
  --lx-space-2:8px;
  --lx-space-3:12px;
  --lx-space-4:16px;
  --lx-space-5:20px;
  --lx-space-6:24px;
  --lx-space-8:32px;
  --lx-space-10:40px;
  --lx-space-12:48px;
  --lx-space-16:64px;
  --lx-space-20:80px;

  --lx-radius-xs:6px;
  --lx-radius-sm:10px;
  --lx-radius-md:14px;
  --lx-radius-lg:18px;
  --lx-radius-xl:24px;
  --lx-radius-2xl:30px;
  --lx-radius-pill:999px;

  --lx-font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  --lx-font-serif:ui-serif,Georgia,"Times New Roman",serif;
  --lx-font-mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --lx-font-display:clamp(40px,11vw,60px);
  --lx-font-title-1:27px;
  --lx-font-title-2:22px;
  --lx-font-title-3:19px;
  --lx-font-body-lg:17px;
  --lx-font-body:16px;
  --lx-font-label:14px;
  --lx-font-caption:12px;
  --lx-font-vocab:clamp(34px,10vw,52px);

  --lx-duration-fast:140ms;
  --lx-duration-base:220ms;
  --lx-duration-slow:360ms;
  --lx-ease-standard:cubic-bezier(.22,1,.36,1);
  --lx-ease-emphasized:cubic-bezier(.32,.72,0,1);

  --lx-content-utility:760px;
  --lx-content-reading:680px;
  --lx-touch-min:44px;
  --lx-z-nav:20;
  --lx-z-sheet:40;
  --lx-z-toast:50;
}

/* Semantic · light/default */
:root,
:root[data-theme="light"] {
  color-scheme:light;
  --lx-bg:var(--lx-paper);
  --lx-surface:var(--lx-white);
  --lx-surface-translucent:rgb(255 255 255 / .82);
  --lx-surface-sunken:var(--lx-ink-50);
  --lx-surface-immersive:var(--lx-ink-950);
  --lx-text-primary:var(--lx-ink-900);
  --lx-text-secondary:var(--lx-ink-500);
  --lx-text-tertiary:var(--lx-ink-450);
  --lx-text-on-accent:var(--lx-white);
  --lx-text-on-immersive:var(--lx-dark-text);
  --lx-border:var(--lx-ink-200);
  --lx-border-strong:var(--lx-ink-300);
  --lx-border-immersive:var(--lx-alpha-white-12);
  --lx-fill:rgb(56 66 86 / .075);

  --lx-accent:var(--lx-cobalt-500);
  --lx-accent-hover:var(--lx-cobalt-600);
  --lx-accent-active:var(--lx-cobalt-700);
  --lx-accent-soft:var(--lx-cobalt-100);
  --lx-accent-stream:var(--lx-stream-action);
  --lx-focus:var(--lx-cobalt-500);
  --lx-focus-ring:0 0 0 3px var(--lx-alpha-cobalt-40);

  --lx-success:var(--lx-green-600);
  --lx-success-soft:var(--lx-green-100);
  --lx-warning:var(--lx-ochre-600);
  --lx-warning-soft:var(--lx-ochre-100);
  --lx-danger:var(--lx-red-600);
  --lx-danger-soft:var(--lx-red-100);
  --lx-learn-known:var(--lx-green-600);
  --lx-learn-known-soft:var(--lx-green-100);
  --lx-learn-missed:var(--lx-clay-600);
  --lx-learn-missed-soft:var(--lx-clay-100);
  --lx-learn-mastered:var(--lx-amber-600);
  --lx-learn-mastered-soft:var(--lx-amber-100);
  --lx-learn-new:var(--lx-ink-400);

  --lx-progress-track:var(--lx-ink-100);
  --lx-progress-fill:var(--lx-stream);
  --lx-shadow-surface:var(--lx-shadow-2);
  --lx-shadow-raised:var(--lx-shadow-3);
}

/* Semantic · dark */
:root[data-theme="dark"] {
  color-scheme:dark;
  --lx-bg:var(--lx-ink-950);
  --lx-surface:var(--lx-ink-800);
  --lx-surface-translucent:rgb(24 32 47 / .82);
  --lx-surface-sunken:var(--lx-ink-900);
  --lx-surface-immersive:var(--lx-dark-canvas);
  --lx-text-primary:var(--lx-dark-text);
  --lx-text-secondary:var(--lx-ink-300);
  --lx-text-tertiary:var(--lx-ink-400);
  --lx-text-on-accent:var(--lx-white);
  --lx-text-on-immersive:var(--lx-dark-text);
  --lx-border:var(--lx-dark-border);
  --lx-border-strong:var(--lx-dark-border-strong);
  --lx-border-immersive:var(--lx-alpha-white-12);
  --lx-fill:var(--lx-alpha-white-10);

  --lx-accent:var(--lx-cobalt-400);
  --lx-accent-hover:var(--lx-cobalt-300);
  --lx-accent-active:var(--lx-cobalt-500);
  --lx-accent-soft:var(--lx-alpha-cobalt-16);
  --lx-focus:var(--lx-cobalt-400);
  --lx-focus-ring:0 0 0 3px var(--lx-alpha-cobalt-50);

  --lx-success:var(--lx-green-400);
  --lx-success-soft:var(--lx-alpha-green-16);
  --lx-warning:var(--lx-amber-400);
  --lx-warning-soft:var(--lx-alpha-amber-16);
  --lx-danger:var(--lx-clay-400);
  --lx-danger-soft:var(--lx-alpha-clay-16);
  --lx-learn-known:var(--lx-green-400);
  --lx-learn-known-soft:var(--lx-alpha-green-16);
  --lx-learn-missed:var(--lx-clay-400);
  --lx-learn-missed-soft:var(--lx-alpha-clay-16);
  --lx-learn-mastered:var(--lx-amber-400);
  --lx-learn-mastered-soft:var(--lx-alpha-amber-16);
  --lx-learn-new:var(--lx-ink-300);

  --lx-progress-track:var(--lx-alpha-white-10);
  --lx-progress-fill:var(--lx-stream);
  --lx-shadow-surface:var(--lx-shadow-dark-2);
  --lx-shadow-raised:var(--lx-shadow-dark-3);
}

/* Auto follows the OS when no explicit data-theme is set. */
@media (prefers-color-scheme:dark) {
  :root:not([data-theme]) {
    color-scheme:dark;
    --lx-bg:var(--lx-ink-950);
    --lx-surface:var(--lx-ink-800);
    --lx-surface-translucent:rgb(24 32 47 / .82);
    --lx-surface-sunken:var(--lx-ink-900);
    --lx-surface-immersive:var(--lx-dark-canvas);
    --lx-text-primary:var(--lx-dark-text);
    --lx-text-secondary:var(--lx-ink-300);
    --lx-text-tertiary:var(--lx-ink-400);
    --lx-text-on-accent:var(--lx-white);
    --lx-text-on-immersive:var(--lx-dark-text);
    --lx-border:var(--lx-dark-border);
    --lx-border-strong:var(--lx-dark-border-strong);
    --lx-border-immersive:var(--lx-alpha-white-12);
    --lx-fill:var(--lx-alpha-white-10);
    --lx-accent:var(--lx-cobalt-400);
    --lx-accent-hover:var(--lx-cobalt-300);
    --lx-accent-active:var(--lx-cobalt-500);
    --lx-accent-soft:var(--lx-alpha-cobalt-16);
    --lx-focus:var(--lx-cobalt-400);
    --lx-focus-ring:0 0 0 3px var(--lx-alpha-cobalt-50);
    --lx-success:var(--lx-green-400);
    --lx-success-soft:var(--lx-alpha-green-16);
    --lx-warning:var(--lx-amber-400);
    --lx-warning-soft:var(--lx-alpha-amber-16);
    --lx-danger:var(--lx-clay-400);
    --lx-danger-soft:var(--lx-alpha-clay-16);
    --lx-learn-known:var(--lx-green-400);
    --lx-learn-known-soft:var(--lx-alpha-green-16);
    --lx-learn-missed:var(--lx-clay-400);
    --lx-learn-missed-soft:var(--lx-alpha-clay-16);
    --lx-learn-mastered:var(--lx-amber-400);
    --lx-learn-mastered-soft:var(--lx-alpha-amber-16);
    --lx-learn-new:var(--lx-ink-300);
    --lx-progress-track:var(--lx-alpha-white-10);
    --lx-progress-fill:var(--lx-stream);
    --lx-shadow-surface:var(--lx-shadow-dark-2);
    --lx-shadow-raised:var(--lx-shadow-dark-3);
  }
}

/* High contrast remains an explicit accessibility preference. */
:root[data-contrast="high"] {
  --lx-bg:var(--lx-white);
  --lx-surface:var(--lx-white);
  --lx-surface-translucent:var(--lx-white);
  --lx-surface-sunken:var(--lx-white);
  --lx-surface-immersive:var(--lx-black);
  --lx-text-primary:var(--lx-black);
  --lx-text-secondary:var(--lx-hc-secondary);
  --lx-text-tertiary:var(--lx-hc-tertiary);
  --lx-text-on-accent:var(--lx-white);
  --lx-text-on-immersive:var(--lx-white);
  --lx-border:var(--lx-hc-secondary);
  --lx-border-strong:var(--lx-black);
  --lx-border-immersive:var(--lx-white);
  --lx-fill:var(--lx-ink-100);
  --lx-accent:var(--lx-cobalt-700);
  --lx-accent-hover:var(--lx-cobalt-700);
  --lx-accent-active:var(--lx-ink-950);
  --lx-accent-soft:var(--lx-cobalt-100);
  --lx-focus:var(--lx-black);
  --lx-focus-ring:0 0 0 3px var(--lx-black),0 0 0 6px var(--lx-hc-focus);
}

/* Component */
:root {
  --lx-button-height:48px;
  --lx-button-height-sm:var(--lx-touch-min);
  --lx-button-radius:var(--lx-radius-md);
  --lx-button-bg:var(--lx-accent);
  --lx-button-bg-hover:var(--lx-accent-hover);
  --lx-button-bg-active:var(--lx-accent-active);
  --lx-button-fg:var(--lx-text-on-accent);
  --lx-button-secondary-bg:var(--lx-accent-soft);
  --lx-button-secondary-fg:var(--lx-accent-hover);
  --lx-button-disabled-bg:var(--lx-fill);
  --lx-button-disabled-fg:var(--lx-text-tertiary);

  --lx-input-height:52px;
  --lx-input-radius:var(--lx-radius-md);
  --lx-input-bg:var(--lx-surface);
  --lx-input-fg:var(--lx-text-primary);
  --lx-input-placeholder:var(--lx-text-tertiary);
  --lx-input-border:var(--lx-border);
  --lx-input-focus-border:var(--lx-focus);
  --lx-input-error-border:var(--lx-danger);

  --lx-card-bg:var(--lx-surface);
  --lx-card-fg:var(--lx-text-primary);
  --lx-card-border:var(--lx-border);
  --lx-card-radius:var(--lx-radius-xl);
  --lx-card-shadow:var(--lx-shadow-surface);
  --lx-card-shadow-hover:var(--lx-shadow-raised);

  --lx-tabbar-height:64px;
  --lx-tabbar-radius:var(--lx-radius-xl);
  --lx-tabbar-bg:var(--lx-surface-translucent);
  --lx-tabbar-fg:var(--lx-text-secondary);
  --lx-tabbar-active-bg:var(--lx-accent-soft);
  --lx-tabbar-active-fg:var(--lx-accent-hover);

  --lx-sheet-bg:var(--lx-surface);
  --lx-sheet-fg:var(--lx-text-primary);
  --lx-sheet-radius:var(--lx-radius-2xl);
  --lx-progress-height:7px;
}

/* Compatibility aliases during the screen-by-screen migration. */
:root {
  --bg:var(--lx-bg);
  --surface:var(--lx-surface-translucent);
  --surface-solid:var(--lx-surface);
  --label:var(--lx-text-primary);
  --secondary:var(--lx-text-secondary);
  --tertiary:var(--lx-text-tertiary);
  --line:var(--lx-border);
  --blue:var(--lx-accent);
  --green:var(--lx-learn-known);
  --red:var(--lx-danger);
  --fill:var(--lx-fill);
  --shadow:var(--lx-shadow-surface);
  --radius:var(--lx-card-radius);
}

@media (prefers-reduced-motion:reduce) {
  :root {
    --lx-duration-fast:1ms;
    --lx-duration-base:1ms;
    --lx-duration-slow:1ms;
  }
}