/* Токены оформления дашборда (те же имена, что использует страница) — светлая и тёмная темы */
:root {
  --color-bg: #f7f8f6; --color-panel: #ffffff; --color-fg: #1d2420; --color-fg-muted: #5d6862;
  --color-border-line: #dfe3df; --color-ok: #2f7a4b; --color-warn: #a4640a; --color-bad: #b3322c;
  --series-1: #2f6fb0; --series-2: #b0612f; --series-3: #6a4fb3; --series-4: #2f9b8f;
  --series-5: #b03f72; --series-6: #7d8a2e; --series-7: #4f6b8a; --series-8: #8a5a3c;
  --cds-chart-grid: #e8ebe8; --cds-chart-axis: #c4cac5; --cds-chart-muted: #b9c1bb;
  --cds-chart-reference: #8b948e; --cds-chart-status-critical: #c23a33;
  --cds-surface-popover: #ffffff; --cds-border: #d5dad6; --cds-shadow-popover: 0 6px 20px rgba(20, 30, 25, .14);
  --cds-text-secondary: #5d6862;
  --font-anthropic-sans: "PT Sans", "Helvetica Neue", Arial, sans-serif;
  --font-anthropic-serif: "PT Serif", Georgia, serif;
  --cds-font-size-caption: 12.5px; --cds-font-size-body: 14px; --cds-font-size-heading: 16px; --cds-font-size-title: 28px;
  --cds-font-weight-medium: 600;
  --cds-gap-xs: 4px; --cds-gap-sm: 8px; --cds-gap-md: 14px; --cds-gap-lg: 20px; --cds-gap-xl: 32px;
  --cds-pad-xs: 4px; --cds-pad-sm: 8px; --cds-pad-md: 14px; --cds-pad-lg: 18px;
  --cds-radius: 8px; --cds-dur-slow: .4s; --cds-ease-out: cubic-bezier(.2, .7, .2, 1);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #141816; --color-panel: #1c211e; --color-fg: #e6ebe7; --color-fg-muted: #9aa59f;
    --color-border-line: #2e3531; --color-ok: #6cc28d; --color-warn: #e0a64b; --color-bad: #ef8a83;
    --series-1: #7fb2e6; --series-2: #e6a17a; --series-3: #a996e8; --series-4: #6fcfc3;
    --series-5: #e68ab1; --series-6: #bfcb6a; --series-7: #93abc6; --series-8: #c9a07f;
    --cds-chart-grid: #262c29; --cds-chart-axis: #3a423e; --cds-chart-muted: #4b544f;
    --cds-chart-reference: #7c8780; --cds-chart-status-critical: #f0857d;
    --cds-surface-popover: #232925; --cds-border: #353d38; --cds-shadow-popover: 0 6px 20px rgba(0, 0, 0, .5);
    --cds-text-secondary: #9aa59f;
    color-scheme: dark;
  }
}
[hidden] { display: none !important; }
html, body { margin: 0; background: var(--color-bg); color: var(--color-fg); font-family: var(--font-anthropic-sans); font-size: 14px; }
.dash-skeleton:empty, .dash-skeleton { position: relative; }
.dash-skeleton:empty::after { content: ""; display: block; height: 100%; min-height: 1em; border-radius: 6px; background: var(--cds-chart-grid); }

/* Шапка сервера: роль и выход */
.srv-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 10px max(16px, 3vw); border-bottom: 1px solid var(--color-border-line); background: var(--color-panel); font-size: 13px; }
.srv-bar b { font-weight: 600; }
.srv-bar a { color: var(--color-fg-muted); }
#dash-root { padding: 24px max(16px, 3vw) 48px; max-width: 1400px; margin: 0 auto; }

/* Страница входа */
body.login { display: grid; place-items: center; min-height: 100vh; padding: 16px; box-sizing: border-box; }
.login-box { width: min(100%, 380px); background: var(--color-panel); border: 1px solid var(--color-border-line);
  border-radius: 10px; padding: 28px; display: flex; flex-direction: column; gap: 12px; }
.login-box h1 { font-family: var(--font-anthropic-serif); font-weight: 400; font-size: 26px; margin: 0; }
.login-box p { margin: 0; color: var(--color-fg-muted); line-height: 1.45; }
.login-box form { display: flex; flex-direction: column; gap: 8px; }
.login-box label { font-size: 12.5px; color: var(--color-fg-muted); }
.login-box input { font: inherit; padding: 10px 12px; border-radius: 6px; border: 1px solid var(--color-border-line); background: var(--color-bg); color: var(--color-fg); }
.login-box button { font: inherit; font-weight: 600; padding: 10px 12px; border-radius: 6px; border: 0; background: var(--color-fg); color: var(--color-bg); cursor: pointer; }
.login-box button:focus-visible, .login-box input:focus-visible { outline: 2px solid var(--series-1); outline-offset: 2px; }
.login-box .ok { color: var(--color-ok); } .login-box .err { color: var(--color-bad); }
