:root{
  --site-font:ui-rounded,"SF Pro Rounded","Aptos Rounded","Segoe UI Variable","Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  --site-font-weight:560;
  --site-font-strong:760;

  --bg:#050505;
  --bg-elev:#090909;
  --panel:#0d0d0d;
  --card:#111111;
  --card-hover:#191919;
  --card-soft:#1f1f1f;
  --line:#2c2c2c;
  --line-soft:#202020;
  --text:#f2f2f2;
  --text-strong:#ffffff;
  --muted:#a8a8a8;
  --muted-2:#888888;

  --accent:#e8e8e8;
  --accent-hover:#ffffff;
  --accent-strong:#c7c7c7;
  --accent-soft:rgba(255,255,255,.08);
  --accent-soft-2:rgba(255,255,255,.14);
  --neutral-accent:#b6b6b6;
  --champagne:#c7c7c7; /* Устаревший нейтральный псевдоним. */
  --on-accent:#0b0b0b;

  --success:#8f8f8f;
  --success-soft:rgba(255,255,255,.08);
  --presence-online:#54c88a; /* Цвет точки «в сети». */
  --danger:#d96b6b;
  --danger-soft:rgba(217,107,107,.14);
  --warn:#b6b6b6;
  --warn-soft:rgba(255,255,255,.08);

  /* Единственный семантический цвет монохромной системы: события. */
  --event:#5b93ff;
  --event-strong:#8fb6ff;
  --event-contrast:#08121f;
  --event-soft:rgba(91,147,255,.13);
  --event-line:rgba(91,147,255,.46);

  --bubble:#1b1b1b; /* Устаревший фон сообщений. */

  --radius-xs:6px;
  --radius-sm:8px;
  --radius-md:10px;
  --radius-lg:12px;
  --radius-xl:16px;
  --radius-full:999px;

  --shadow-sm:0 1px 2px rgba(0,0,0,.22);
  --shadow-md:0 8px 20px rgba(0,0,0,.26);
  --shadow-lg:0 18px 44px rgba(0,0,0,.38);
  --shadow-pop:0 18px 48px rgba(0,0,0,.46);

  --transition:all .18s cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.22,.61,.36,1);
  --ease-emph:cubic-bezier(.16,1,.3,1);
  --dur-fast:.14s;
  --dur-mid:.26s;
  --dur-slow:.45s;

  --topbar-h:56px;
  --bottnav-h:56px;
  --sidebar-w:232px;
  --rail-w:300px;
  --shell-max:1240px;
  --shell-gap:20px;
  --content-max:640px; /* Ширина ленты. */

  --z-topbar:120;
  --z-dropdown:140;
  --z-sheet:160;
  --z-modal:180;
  /* Всплывающие панели полей (sn-fields.js) уходят в body и должны
     оставаться выше модального окна, но ниже уведомлений. */
  --z-popover:190;
  --z-toast:200;

  /* Общая «галочка» выпадающих списков. */
  --sn-chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");

  /* Semantic aliases: new product surfaces use intent names while legacy
     components can keep their stable tokens during the gradual migration. */
  --surface-canvas:var(--bg);
  --surface-raised:var(--bg-elev);
  --surface-panel:var(--panel);
  --surface-card:var(--card);
  --surface-card-hover:var(--card-hover);
  --surface-muted:var(--card-soft);
  --border-default:var(--line);
  --border-subtle:var(--line-soft);
  --content-primary:var(--text-strong);
  --content-secondary:var(--text);
  --content-muted:var(--muted);
  --action-primary:var(--accent);
  --action-primary-hover:var(--accent-hover);
  --action-on-primary:var(--on-accent);

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

  --type-caption:11px;
  --type-label:12px;
  --type-body-sm:13px;
  --type-body:15px;
  --type-title-sm:18px;
  --type-title:24px;
  --type-display:clamp(28px,4vw,48px);
  --leading-tight:1.2;
  --leading-body:1.5;
  --leading-relaxed:1.65;

  --control-h-sm:32px;
  --control-h:40px;
  --control-h-lg:48px;
  --focus-ring:0 0 0 3px color-mix(in srgb,var(--text-strong) 32%,transparent);

  color-scheme:dark;
}

html[data-theme="light"]{
  --bg:#f8f8f8;
  --bg-elev:#ffffff;
  --panel:#ffffff;
  --card:#ffffff;
  --card-hover:#f1f1f1;
  --card-soft:#ededed;
  --line:#d6d6d6;
  --line-soft:#e7e7e7;
  --text:#202020;
  --text-strong:#0b0b0b;
  --muted:#5f5f5f;
  --muted-2:#767676;

  --accent:#1d1d1d;
  --accent-hover:#000000;
  --accent-strong:#111111;
  --accent-soft:rgba(0,0,0,.06);
  --accent-soft-2:rgba(0,0,0,.10);
  --neutral-accent:#707070;
  --champagne:#111111;
  --on-accent:#ffffff;

  --success:#707070;
  --success-soft:rgba(0,0,0,.06);
  --presence-online:#2f9e5f; /* Цвет точки «в сети». */
  --danger:#c0392f;
  --danger-soft:rgba(192,57,47,.10);
  --warn:#707070;
  --warn-soft:rgba(0,0,0,.06);

  --event:#2563d6;
  --event-strong:#1b4fb0;
  --event-contrast:#ffffff;
  --event-soft:rgba(37,99,214,.10);
  --event-line:rgba(37,99,214,.38);

  --bubble:#f1f1f1;

  --shadow-sm:0 1px 2px rgba(20,24,35,.06);
  --shadow-md:0 8px 18px rgba(20,24,35,.08);
  --shadow-lg:0 18px 42px rgba(20,24,35,.10);
  --shadow-pop:0 16px 38px rgba(20,24,35,.14);

  color-scheme:light;
}

:where(button,[href],input,select,textarea,[tabindex]:not([tabindex="-1"])):focus-visible{
  outline:2px solid var(--text-strong);
  outline-offset:2px;
  box-shadow:var(--focus-ring);
}

@media (forced-colors:active){
  :where(button,[href],input,select,textarea,[tabindex]:not([tabindex="-1"])):focus-visible{
    outline:2px solid CanvasText;
    box-shadow:none;
  }
}