:root{
/* Brand scale — derived from the logo blue. */
--brand-50:#E8F3FF;--brand-100:#CCE5FF;--brand-200:#99CBFF;--brand-300:#66B1FF;--brand-400:#59A3FB;
--brand-500:#0088FF;--brand-600:#0071CA;--brand-700:#005A9E;--brand-800:#004273;--brand-900:#002B4D;
/* Neutrals */
--ink:#0D1319;--neutral-700:#333C45;--neutral-600:#4A5560;--neutral-500:#5A6875;--neutral-400:#8A96A3;
--neutral-300:#B4BEC9;--neutral-200:#D5DBE2;--neutral-100:#E8ECF0;--neutral-50:#F4F6F8;--neutral-25:#FAFBFC;
--white:#FFFFFF;
/* Semantic, muted */
--positive:#1E7F5C;--attention:#A8761E;--critical:#A32B21;

/* Semantic aliases — use these in components. */
--text-primary:var(--ink);
--text-secondary:var(--neutral-600);
--text-muted:var(--neutral-500);
--text-disabled:var(--neutral-400);
--text-inverse:var(--white);
--text-link:var(--brand-600);          /* 4.98:1 on white — the lightest blue legal for text */
--text-link-hover:var(--brand-700);
--text-accent:var(--brand-700);

--surface-page:var(--white);
--surface-subtle:var(--neutral-25);
--surface-muted:var(--neutral-50);
--surface-card:var(--white);
--surface-structural:var(--brand-900);  /* the 7% deep-blue structural blocks */
--surface-structural-alt:var(--brand-800);
--surface-accent-wash:var(--brand-50);  /* highlighted table row, quiet accent fills */
--surface-offset:var(--brand-100);      /* the signature offset backing plate */

--action-primary-bg:var(--brand-600);   /* never brand-500: white on it fails contrast */
--action-primary-bg-hover:var(--brand-700);
--action-primary-bg-active:var(--brand-800);
--action-primary-fg:var(--white);
--action-secondary-border:var(--ink);
--action-tertiary-fg:var(--brand-700);
--action-disabled-bg:var(--neutral-100);
--action-disabled-fg:var(--neutral-400);

--focus-ring:var(--brand-600);
--focus-halo:var(--brand-100);

--border-default:var(--neutral-200);
--border-subtle:var(--neutral-100);
--border-strong:var(--ink);
--border-accent:var(--brand-600);

/* brand-500 is display-only: headline type at 24px+ and large graphic fills. */
--brand-display-only:var(--brand-500);
}

:root{
--font-core:"Inter","Helvetica Neue",Arial,sans-serif;
--weight-regular:400;--weight-medium:500;--weight-semibold:600;

--type-display:600 48px/52px var(--font-core);
--type-h1:600 34px/40px var(--font-core);
--type-h2:600 26px/32px var(--font-core);
--type-h3:600 20px/28px var(--font-core);
--type-h4:600 16px/24px var(--font-core);
--type-body-l:400 17px/27px var(--font-core);
--type-body:400 15px/24px var(--font-core);
--type-body-s:400 13px/20px var(--font-core);
--type-caption:400 12px/16px var(--font-core);
--type-overline:600 11px/14px var(--font-core);
--type-metric:600 40px/44px var(--font-core);

--tracking-display:-0.02em;--tracking-heading:-0.015em;--tracking-tight:-0.01em;
--tracking-body:0;--tracking-overline:0.08em;

--measure-text:720px;    /* 60–75 characters */
--measure-content:1200px;
}
/* Type utilities — flat, no nesting, safe to use directly in markup. */
.t-display{font:var(--type-display);letter-spacing:var(--tracking-display);margin:0}
.t-h1{font:var(--type-h1);letter-spacing:var(--tracking-heading);margin:0}
.t-h2{font:var(--type-h2);letter-spacing:var(--tracking-heading);margin:0}
.t-h3{font:var(--type-h3);letter-spacing:var(--tracking-tight);margin:0}
.t-h4{font:var(--type-h4);letter-spacing:var(--tracking-tight);margin:0}
.t-body-l{font:var(--type-body-l);margin:0}
.t-body{font:var(--type-body);margin:0}
.t-body-s{font:var(--type-body-s);margin:0}
.t-caption{font:var(--type-caption);margin:0;color:var(--text-muted)}
.t-overline{font:var(--type-overline);letter-spacing:var(--tracking-overline);text-transform:uppercase;margin:0;color:var(--text-muted)}
.t-metric{font:var(--type-metric);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;letter-spacing:var(--tracking-tight);margin:0}
.tabular{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}

:root{
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;
--space-8:32px;--space-12:48px;--space-16:64px;--space-24:96px;
--grid-columns:12; /* @kind other */--grid-gutter:24px;--grid-margin:32px;
--control-height:44px;--control-height-s:32px;
--badge-height:22px;
--offset-shift:7px;   /* signature offset backing: 6–8px right and down */
}

:root{
--radius-s:4px;--radius-m:8px;--radius-card:12px;--radius-section:20px;--radius-max:20px;
--border-width:1px;--border-width-strong:1.5px;--rule-accent-width:3px;
--stroke-icon:1.5px;
}

:root{
/* The only shadow in the system. Popovers, menus, toasts — nothing else. */
--shadow-overlay:0 4px 16px rgba(13,19,25,0.08);
--shadow-none:none;
}

:root{
/* Categorical order alternates blue and grey so neighbouring series stay
   distinguishable in greyscale print. */
--chart-1:#0071CA;--chart-2:#5A6875;--chart-3:#59A3FB;
--chart-4:#004273;--chart-5:#8A96A3;--chart-6:#99CBFF;
--chart-axis:var(--neutral-200);
--chart-grid:var(--neutral-100);
--chart-label:var(--neutral-600);
/* Sequential ramp */
--chart-seq-1:var(--brand-50);--chart-seq-2:var(--brand-100);--chart-seq-3:var(--brand-300);
--chart-seq-4:var(--brand-500);--chart-seq-5:var(--brand-700);--chart-seq-6:var(--brand-900);
}

html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{margin:0;background:var(--surface-page);color:var(--text-primary);font:var(--type-body);font-feature-settings:"cv05" 1}
h1,h2,h3,h4,p,figure{margin:0}
p{text-align:left;hyphens:none;text-wrap:pretty;max-width:var(--measure-text)}
a{color:var(--text-link);text-decoration:none;border-bottom:1px solid var(--brand-200);transition:color 120ms linear,border-color 120ms linear}
a:hover{color:var(--text-link-hover);border-bottom-color:var(--brand-600)}
*:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
table{border-collapse:collapse}


/* Кнопки — перенесены из components/core/Button.jsx дизайн-системы. */
.ds-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:var(--control-height);padding:0 20px;border-radius:var(--radius-s);
  font:var(--type-h4);letter-spacing:var(--tracking-tight);cursor:pointer;
  transition:background-color 120ms linear,color 120ms linear,border-color 120ms linear;
  box-shadow:none;white-space:nowrap;text-decoration:none;box-sizing:border-box}
.ds-btn-primary{background:var(--action-primary-bg);color:var(--action-primary-fg);
  border:1px solid var(--action-primary-bg)}
.ds-btn-primary:hover{background:var(--action-primary-bg-hover);border-color:var(--action-primary-bg-hover)}
.ds-btn-secondary{background:var(--white);color:var(--ink);
  border:var(--border-width-strong) solid var(--action-secondary-border)}
.ds-btn-secondary:hover{background:var(--neutral-50)}
.ds-btn-lg{height:56px;padding:0 32px;font:var(--type-h3);letter-spacing:var(--tracking-tight)}
