/* Uzeltech · общий слой: сброс, переключатель версий, утилиты */
@import url('https://fonts.googleapis.com/css2?family=Golos+Text:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Golos Text', 'Segoe UI', Roboto, system-ui, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  background: var(--ground);
  color: var(--ink);
}
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 3px; }
.mono { font-family: 'IBM Plex Mono', ui-monospace, monospace; }
.num { font-variant-numeric: tabular-nums; }
h1, h2, h3, h4 { margin: 0; font-weight: 600; letter-spacing: -.015em; text-wrap: balance; }

/* ── переключатель версий ─────────────────────────────────────── */
.vsw {
  display: flex; align-items: center; gap: 4px;
  padding: 0 18px; height: 46px;
  background: var(--vsw-bg); border-bottom: 1px solid var(--vsw-line);
  position: sticky; top: 0; z-index: 100;
  overflow-x: auto; scrollbar-width: none;
}
.vsw::-webkit-scrollbar { display: none; }
.vsw-home {
  font-family: 'IBM Plex Mono', monospace; font-size: 12px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase; color: var(--accent);
  margin-right: 20px; white-space: nowrap;
}
.vsw a:not(.vsw-home) {
  font-size: 13px; padding: 5px 12px; border-radius: 4px; white-space: nowrap;
  color: var(--vsw-dim); transition: background .15s, color .15s;
}
.vsw a:not(.vsw-home):hover { background: var(--vsw-hover); color: var(--ink); }
.vsw a.on { background: var(--accent); color: var(--accent-on); }

.snap {
  font-family: 'IBM Plex Mono', monospace; font-size: 10.5px; letter-spacing: .06em;
  padding: 3px 8px; border-radius: 3px; background: var(--warn-bg); color: var(--warn);
  white-space: nowrap;
}

/* ── утилиты ──────────────────────────────────────────────────── */
.bar { height: 5px; border-radius: 3px; background: var(--bar-bg); overflow: hidden; }
.bar > i { display: block; height: 100%; background: var(--accent); border-radius: 3px; }
.bar.ok > i { background: var(--ok); }
.bar.warn > i { background: var(--warn); }
.bar.crit > i { background: var(--crit); }
.spark { display: block; overflow: visible; }

.pill {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: 'IBM Plex Mono', monospace; font-size: 10.5px; letter-spacing: .05em;
  padding: 3px 8px; border-radius: 3px; white-space: nowrap; text-transform: uppercase;
}
.pill.ok { background: var(--ok-bg); color: var(--ok); }
.pill.warn { background: var(--warn-bg); color: var(--warn); }
.pill.crit { background: var(--crit-bg); color: var(--crit); }
.pill.mute { background: var(--bar-bg); color: var(--dim); }

.dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; background: currentColor; }

table { border-collapse: collapse; width: 100%; font-size: 13.5px; }
th, td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
thead th {
  font-family: 'IBM Plex Mono', monospace; font-size: 10px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--dim); font-weight: 500;
  position: sticky; top: 0; background: var(--surface); z-index: 1;
}
tbody tr:last-child td { border-bottom: none; }
.scroll { overflow: auto; }
.right { text-align: right; }

.loading { color: var(--dim); font-size: 13px; padding: 20px; }
.err { color: var(--crit); font-size: 13px; padding: 14px; border: 1px solid var(--crit); border-radius: 5px; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

.vsw-out{margin-left:auto;background:none;border:1px solid var(--vsw-line);color:var(--vsw-dim);
  font-size:12px;padding:5px 12px;border-radius:4px;white-space:nowrap;transition:color .15s,border-color .15s}
.vsw-out:hover{color:var(--ink);border-color:var(--dim)}
/* атрибут hidden должен побеждать display у оверлеев */
[hidden]{display:none!important}

/* ── визуализация: общий слой ───────────────────────────────────── */
.uz-chart{margin:14px 0 4px;font-variant-numeric:tabular-nums}
.uz-title{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--dim);margin:14px 0 8px}
.uz-legend{display:flex;justify-content:space-between;gap:14px;margin-top:7px;
  font-size:12px;line-height:1.4;flex-wrap:wrap}
.uz-legend b{font-size:14px;font-weight:600}
.uz-dim{color:var(--dim);font-size:11.5px}

/* план/факт и порог */
.uz-track{position:relative;height:9px;border-radius:5px;background:var(--bar-bg);overflow:visible}
.uz-track > i{display:block;height:100%;border-radius:5px;transition:width .5s ease}
.uz-track > u{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--ink);
  opacity:.75;border-radius:1px}

/* рейтинг */
.uz-bars{display:grid;gap:6px}
.uz-bar-row{display:grid;grid-template-columns:minmax(74px,26%) 1fr auto;gap:11px;align-items:center;
  font-size:12.5px}
.uz-bar-l{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uz-bar-t{height:8px;border-radius:4px;background:var(--bar-bg);overflow:hidden}
.uz-bar-t > i{display:block;height:100%;border-radius:4px}
.uz-bar-v{color:var(--ink);white-space:nowrap;font-size:12px}
.uz-bar-v em{font-style:normal;color:var(--dim);margin-left:6px;font-size:11px}

/* динамика */
.uz-area svg{display:block;width:100%;height:96px}

/* структура */
.uz-donut{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.uz-donut-l{display:grid;gap:5px;font-size:12.5px;min-width:180px;flex:1}
.uz-donut-l div{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center}
.uz-donut-n{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uz-dot{width:8px;height:8px;border-radius:2px;display:block}

@media print{.uz-track > i,.uz-bar-t > i{print-color-adjust:exact;-webkit-print-color-adjust:exact}}

/* ── доказательная база (shared/evidence.js) ──────────────────── */
.ev { margin-top: 14px; border-top: 1px solid var(--line); }
.ev-toggle {
  width: 100%; display: flex; justify-content: space-between; align-items: center;
  padding: 11px 0; background: none; border: 0; color: var(--dim); font-size: 13px;
}
.ev-toggle:hover { color: var(--ink-2); }
.ev-sum { font-family: 'IBM Plex Mono', monospace; font-size: 11.5px; }
.ev-body { display: none; padding-bottom: 6px; }
.ev.open .ev-body { display: block; }
.ev.open .ev-sum { opacity: .6; }

.ev-step {
  border-left: 2px solid var(--ok); padding: 10px 0 12px 14px; margin-bottom: 14px;
}
.ev-step.raw { border-left-color: var(--warn); }
.ev-head { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 8px; }
.ev-purpose { font-size: 13.5px; color: var(--ink-2); flex: 1; min-width: 180px; }
.ev-badge {
  font-family: 'IBM Plex Mono', monospace; font-size: 10px; letter-spacing: .05em;
  text-transform: uppercase; padding: 3px 7px; border-radius: 3px; white-space: nowrap;
}
.ev-badge.ok { background: var(--ok-bg); color: var(--ok); }
.ev-badge.raw { background: var(--warn-bg); color: var(--warn); }
.ev-badge.cat { background: var(--bar-bg); color: var(--dim); }
.ev-ms { font-size: 10.5px; color: var(--dim); }

.ev-sql {
  font-family: 'IBM Plex Mono', monospace; font-size: 11.5px; line-height: 1.55;
  background: var(--surface-2); border-radius: 5px; padding: 10px 12px;
  overflow-x: auto; margin: 0 0 9px; color: var(--ink-2); white-space: pre;
}
.ev-rows { overflow-x: auto; border: 1px solid var(--line); border-radius: 5px; }
.ev-rows table { font-size: 12.5px; }
.ev-rows th { background: var(--surface-2); font-size: 11px; text-transform: uppercase;
  letter-spacing: .04em; color: var(--dim); }
.ev-note { font-size: 11.5px; color: var(--dim); margin-top: 7px; }
.ev-err { font-size: 12.5px; color: var(--crit); background: var(--crit-bg);
  padding: 8px 11px; border-radius: 5px; }
.ev-caveats {
  margin: 9px 0 0; padding: 9px 12px 9px 26px; list-style: disc;
  background: var(--warn-bg); border-radius: 5px;
}
.ev-caveats li { font-size: 12px; line-height: 1.5; color: var(--warn); margin: 3px 0; }