/* NSHNO Design Tokens v1.0
 * Single source of truth for web surfaces: nshno.tech vitrine, regional cabinet.
 * Fonts: Golos Text (UI + headlines), system monospace (service labels).
 * Each surface ships Golos Text locally: city site /news-assets/fonts/, vitrine /fonts/.
 */
:root {
  --font-ui: "Golos Text", "PT Sans", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-display: "Golos Text", "PT Sans", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Consolas, monospace;

  --paper: #F7F5F0;
  --surface: #FFFFFF;
  --ink: #1B1A17;
  --muted: #6F6A5F;
  --line: #E5E1D8;

  --accent: #C6471C;
  --accent-press: #A93B15;
  --danger: #B3261E;
  --warning: #8A5A00;
  --ok: #2E6E52;
  --info: #2E5E8C;

  --radius-control: 4px;
  --radius-card: 12px;
  --radius-sheet: 16px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  --text-13: 13px;
  --text-15: 15px;
  --text-17: 17px;
  --text-20: 20px;
  --text-26: 26px;
  --text-34: 34px;
  --text-44: 44px;

  --leading-tight: 1.15;
  --leading-body: 1.45;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #171614;
    --surface: #201E1B;
    --ink: #F2EFE8;
    --muted: #9C9689;
    --line: #35322C;
    --accent: #E0643A;
    --accent-press: #C8471D;
  }
}

:root[data-theme="dark"] {
  --paper: #171614;
  --surface: #201E1B;
  --ink: #F2EFE8;
  --muted: #9C9689;
  --line: #35322C;
  --accent: #E0643A;
  --accent-press: #C8471D;
}

:root[data-theme="light"] {
  --paper: #F7F5F0;
  --surface: #FFFFFF;
  --ink: #1B1A17;
  --muted: #6F6A5F;
  --line: #E5E1D8;
  --accent: #C6471C;
  --accent-press: #A93B15;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: var(--text-15);
  line-height: var(--leading-body);
}

h1, h2, h3 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: var(--leading-tight);
  letter-spacing: -0.01em;
  margin: 0 0 var(--space-4);
}

h1 { font-size: var(--text-44); }
h2 { font-size: var(--text-34); }
h3 { font-size: var(--text-26); }

p { margin: 0 0 var(--space-4); }

.mono {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--text-13);
}

a {
  color: var(--accent);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
a:hover { border-bottom-color: var(--accent); }

.card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  padding: var(--space-5);
}

.btn {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: var(--text-15);
  font-weight: 500;
  color: var(--surface);
  background: var(--accent);
  border: 1px solid var(--accent);
  border-radius: var(--radius-control);
  padding: 10px 16px;
  cursor: pointer;
  text-decoration: none;
}
.btn:hover { background: var(--accent-press); border-color: var(--accent-press); }

.tag {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: var(--text-13);
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  padding: 2px 8px;
}

.category-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 6px;
}
.cat-accident  { background: #B3402E; }
.cat-fire      { background: #C05A20; }
.cat-crime     { background: #8A3B5C; }
.cat-utility   { background: #2E6E8C; }
.cat-transport { background: #A86900; }
.cat-news      { background: #2E6E5E; }
.cat-afisha    { background: #7A4E9E; }
.cat-problem   { background: #C05A20; }
.cat-opening   { background: #4E7A3B; }
.cat-other     { background: #5B6470; }

@media (max-width: 720px) {
  h1 { font-size: var(--text-34); }
  h2 { font-size: var(--text-26); }
  h3 { font-size: var(--text-20); }
  .card { padding: var(--space-4); }
}