/* Тема «Бланк сертификата»: холодная бумага бланка, синие чернила печати, гильош.
   Шрифт — Golos Text (OFL), лежит рядом в /static/fonts. */
@font-face { font-family: "Golos Text"; font-weight: 400; font-display: swap; src: url(/static/fonts/golos-text-cyrillic-400-normal.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-weight: 400; font-display: swap; src: url(/static/fonts/golos-text-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Golos Text"; font-weight: 500; font-display: swap; src: url(/static/fonts/golos-text-cyrillic-500-normal.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-weight: 500; font-display: swap; src: url(/static/fonts/golos-text-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Golos Text"; font-weight: 600; font-display: swap; src: url(/static/fonts/golos-text-cyrillic-600-normal.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-weight: 600; font-display: swap; src: url(/static/fonts/golos-text-latin-600-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Golos Text"; font-weight: 700; font-display: swap; src: url(/static/fonts/golos-text-cyrillic-700-normal.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-weight: 700; font-display: swap; src: url(/static/fonts/golos-text-latin-700-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* бумага и чернила */
  --paper: #EBF1EF;      /* фон: бумага бланка */
  --sheet: #FAFCFB;      /* лист: карточки */
  --ink: #13233F;        /* текст: тёмно-синие чернила */
  --ink-2: #56677C;      /* вторичный текст */
  --rule: #CFDAD6;       /* линии граф */
  --stamp: #2B50A1;      /* синяя печать */
  --stamp-red: #B3342B;  /* красная печать: проблема */
  --stamp-green: #1F7A55;/* «соответствует» */
  --guilloche: #8FB7AA;  /* гильош */
  --series-1: #2B50A1; --series-2: #C8782A; --series-3: #1F7A55; --series-4: #8A3F8F;
  --series-5: #4F79C9; --series-6: #A8871E; --series-7: #5F7D95; --series-8: #B3342B;

  --font-anthropic-sans: "Golos Text", "PT Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-anthropic-serif: "Golos Text", "PT Sans", system-ui, sans-serif;
  --color-fg: var(--ink); --color-fg-muted: var(--ink-2); --color-bg: var(--paper); --color-panel: var(--sheet);
  --color-border-line: var(--rule); --color-ok: var(--stamp-green); --color-warn: #A86A12; --color-bad: var(--stamp-red);
  --cds-font-size-caption: 12.5px; --cds-font-size-body: 14.5px; --cds-font-size-heading: 15.5px; --cds-font-size-title: 30px;
  --cds-font-weight-medium: 600;
  --cds-gap-xs: 4px; --cds-gap-sm: 8px; --cds-gap-md: 16px; --cds-gap-lg: 24px; --cds-gap-xl: 36px;
  --cds-pad-xs: 4px; --cds-pad-sm: 8px; --cds-pad-md: 12px; --cds-pad-lg: 18px; --cds-pad-xl: 28px;
  --cds-radius: 4px;
  --cds-chart-muted: #B5C4C0; --cds-chart-grid: #DFE7E4; --cds-chart-axis: #BCCAC6; --cds-chart-reference: #7C8C99;
  --cds-chart-status-critical: var(--stamp-red);
  --cds-surface-popover: var(--sheet); --cds-border: var(--rule); --cds-shadow-popover: 0 8px 24px rgba(19, 35, 63, .14);
  --cds-text-secondary: var(--ink-2); --cds-dur-slow: 320ms; --cds-ease-out: cubic-bezier(.2, .7, .2, 1);
}
@media (prefers-color-scheme: dark) {
  :root {
    --paper: #0E1A2B; --sheet: #13233A; --ink: #E4ECF5; --ink-2: #92A3B8; --rule: #253A53;
    --stamp: #7FA2F2; --stamp-red: #F28B7F; --stamp-green: #6CD3A3; --guilloche: #2E5560;
    --series-1: #7FA2F2; --series-2: #E9A25C; --series-3: #6CD3A3; --series-4: #C987CC;
    --series-5: #A9C1F5; --series-6: #D9BE5C; --series-7: #93A9BC; --series-8: #F28B7F;
    --cds-chart-muted: #3C5068; --cds-chart-grid: #1E3148; --cds-chart-axis: #34495F; --cds-chart-reference: #8C9DB0;
    --cds-shadow-popover: 0 8px 24px rgba(0, 0, 0, .5);
  }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-anthropic-sans);
  font-size: var(--cds-font-size-body); line-height: 1.45; font-feature-settings: "tnum" 1; }
a { color: var(--stamp); }
:focus-visible { outline: 2px solid var(--stamp); outline-offset: 2px; }

/* верхняя строка */
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 10px clamp(16px, 3vw, 44px); font-size: var(--cds-font-size-caption); color: var(--ink-2);
  border-bottom: 1px solid var(--rule); background: var(--paper); }
.topbar .who { display: flex; gap: 18px; align-items: center; }
.topbar a { color: var(--ink); text-decoration: none; }
.topbar a:hover { text-decoration: underline; }
.topbar b { color: var(--ink); font-weight: 600; }
.topbar .src { display: flex; gap: 4px 18px; flex-wrap: wrap; }
@media (max-width: 640px) { .topbar { padding: 8px 16px; gap: 4px 12px; } .topbar .src span + span { display: none; } }

#dash-root { padding: 22px clamp(16px, 3vw, 44px) 64px; max-width: 1520px; margin: 0 auto; }
.dash-skeleton { color: transparent !important; position: relative; }
.dash-skeleton::after { content: ""; position: absolute; left: 0; top: 28%; width: 58%; height: 44%; border-radius: 3px; background: var(--rule); }

/* вход и управление */
.login-wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px; position: relative; overflow: hidden; }
.login-wrap::before { content: ""; position: absolute; width: 760px; height: 760px; right: -220px; top: -180px;
  background: var(--guilloche); -webkit-mask: url(/static/guilloche-rosette.svg) center / contain no-repeat;
  mask: url(/static/guilloche-rosette.svg) center / contain no-repeat; opacity: .55; pointer-events: none; }
.box { position: relative; width: min(100%, 400px); background: var(--sheet); border: 1px solid var(--rule); border-radius: 6px;
  padding: 30px 28px 26px; box-shadow: 0 0 0 6px var(--paper), 0 0 0 7px var(--rule); }
.box h1 { font-weight: 600; margin: 0 0 4px; font-size: 22px; letter-spacing: -.01em; }
.box .sub { color: var(--ink-2); font-size: 13px; margin: 0 0 22px; }
.box label { display: block; font-size: 12.5px; color: var(--ink-2); margin-bottom: 4px; }
.box input, .box button, .admin input, .admin button, .admin textarea { font: inherit; width: 100%; padding: 10px 12px; border-radius: 4px;
  border: 1px solid var(--rule); background: var(--paper); color: var(--ink); margin-bottom: 14px; }
.box input:focus, .admin input:focus, .admin textarea:focus { border-color: var(--stamp); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--stamp) 18%, transparent); }
.box button, .admin button { background: var(--stamp); color: #fff; border: 0; cursor: pointer; font-weight: 600; }
.box button:hover, .admin button:hover { filter: brightness(1.08); }
.err { color: var(--stamp-red); font-size: 13px; margin-bottom: 12px; }
.admin { max-width: 880px; margin: 26px auto; padding: 0 16px; }
.admin section { background: var(--sheet); border: 1px solid var(--rule); border-radius: 4px; padding: 20px; margin-bottom: 16px; }
.admin h2 { font-size: 16px; margin: 0 0 8px; }
.admin pre { white-space: pre-wrap; font-size: 12px; max-height: 360px; overflow: auto; background: var(--paper); padding: 10px; border-radius: 4px; }
.admin .row { display: flex; gap: 10px; flex-wrap: wrap; } .admin .row > * { flex: 1 1 200px; }
.admin table { width: 100%; border-collapse: collapse; font-size: 13px; } .admin td, .admin th { padding: 6px; border-bottom: 1px solid var(--rule); text-align: left; }
.muted { color: var(--ink-2); font-size: 13px; }