/* Дизайн-система агентов — generated from tokens.json */

@font-face { font-family: "IBM Plex Sans"; src: url("fonts/IBMPlexSans-Light.ttf") format("truetype"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/IBMPlexSans-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/IBMPlexSans-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/IBMPlexSans-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("fonts/IBMPlexMono-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("fonts/IBMPlexMono-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("fonts/IBMPlexMono-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("fonts/IBMPlexMono-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  /* color */
  --paper: #eceae5;
  --paper-raised: #fafaf8;
  --paper-card: #ffffff;
  --paper-mute: #f5f3ef;
  --row-hover: #fafaf8;
  --border: #eceae5;
  --border-strong: #e0ddd8;
  --border-faint: #f0edea;
  --border-row: #f8f6f3;
  --fg: #1c1917;
  --fg-soft: #57534e;
  --fg-muted: #78716c;
  --fg-label: #9c9589;
  --fg-faint: #c7c2ba;
  --fg-on-ink: #fafaf8;
  --ink: #de4c2b;
  --ink-hover: #c9401f;
  --ink-soft: #fdeee9;
  --accent: #44599e;
  --accent-bg: #eceff6;
  --accent-line: #c4cde6;
  --ok: #5b7a3b;
  --ok-bg: #f3f5ee;
  --ok-dot: #8fa86a;
  --ok-border: #d9e0c8;
  --warn: #c24a2b;
  --warn-bg: #fdeee9;
  --warn-dot: #ee6040;
  --warn-border: #f7c9bb;
  --err: #a32912;
  --err-bg: #fbe7e2;
  --err-dot: #d0361b;
  --err-border: #f0b9ab;
  --info: var(--accent);
  --info-bg: var(--accent-bg);
  --idle: #9c9589;
  --idle-bg: #f5f3ef;
  --idle-dot: #cec9c1;
  --tag-bg: #f5f3ef;
  --tag-fg: #78716c;
  --sb-bg: #e6ebf7;
  --sb-fg: #4e5a7f;
  --sb-fg-strong: #15245a;
  --sb-label: #8a95b6;
  --sb-hover: #dbe2f3;
  --sb-active: #ffffff;
  --sb-active-fg: var(--ink);
  --sb-line: #c8d1ea;
  --sb-badge-bg: #d3dbf0;
  --sb-badge-fg: #44599e;
  --d-indigo: #44599e;
  --d-indigo-bg: #eceff6;
  --d-green: #15245a;
  --d-green-bg: #e8eaf1;
  --d-amber: #ee6040;
  --d-amber-bg: #fdeee9;
  --d-rose: #819ade;
  --d-rose-bg: #eef1fa;
  --d-teal: #cad3b7;
  --d-teal-bg: #f3f5ee;
  --d-stone: #57534e;
  --d-stone-bg: #f0eeeb;
  /* radius */
  --radius: 7px;
  --radius-sm: 6px;
  --radius-lg: 10px;
  --radius-xl: 12px;
  --radius-pill: 999px;
  --radius-tag: 10px;
  /* shadow */
  --shadow-nav: 0 1px 2px rgba(0,0,0,.07), 0 0 0 1px rgba(0,0,0,.04);
  --shadow-card-hover: 0 2px 8px rgba(0,0,0,.05);
  --shadow-panel: -1px 0 0 rgba(0,0,0,.06);
  --shadow-modal: 0 16px 48px rgba(28,25,23,.18);
  /* fontSize */
  --fs-display: 36px;
  --fs-h1: 22px;
  --fs-h2: 16px;
  --fs-body: 14px;
  --fs-sm: 13px;
  --fs-xs: 11.5px;
  --fs-label: 10.5px;
  /* letterSpacing */
  --tracking-label: 0.09em;
  --tracking-caps: 0.14em;
  /* layout */
  --sidebar-w: 232px;
  --sidebar-rail: 60px;
  --topbar-h: 52px;
}

.text-display { font-family: var(--font-sans); font-size: 36px; line-height: 1; font-weight: 300; }
.text-h1 { font-family: var(--font-sans); font-size: 22px; line-height: 1.15; font-weight: 600; letter-spacing: -0.01em; }
.text-h2 { font-family: var(--font-sans); font-size: 16px; line-height: 1.5; font-weight: 600; }
.text-crumb { font-family: var(--font-sans); font-size: 14.5px; line-height: 1.2; font-weight: 600; }
.text-body { font-family: var(--font-sans); font-size: 14px; line-height: 1.5; font-weight: 400; }
.text-sm { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; font-weight: 400; }
.text-xs { font-family: var(--font-sans); font-size: 11.5px; line-height: 1.5; font-weight: 500; }
.text-label { font-family: var(--font-sans); font-size: 10.5px; line-height: 1.5; font-weight: 600; letter-spacing: 0.09em; text-transform: uppercase; }
.mono-mark { font-family: var(--font-mono); font-size: 11.5px; line-height: 1.5; font-weight: 700; letter-spacing: 0.06em; }
.mono-metric { font-family: var(--font-mono); font-size: 16px; line-height: 1.3; font-weight: 600; }
.mono-clock { font-family: var(--font-mono); font-size: 12px; line-height: 1.5; font-weight: 400; }