:root {
  color-scheme: light dark;
  --font-anthropic-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-anthropic-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --color-fg: #1f2328; --color-fg-muted: #5f6672; --color-bg: #f6f6f3; --color-panel: #ffffff;
  --color-border-line: #e3e3de; --color-ok: #2b8a3e; --color-warn: #c2410c; --color-bad: #d9480f;
  --cds-font-size-caption: 0.78rem; --cds-font-size-body: 0.92rem; --cds-font-size-heading: 1.02rem; --cds-font-size-title: 1.7rem;
  --cds-font-weight-medium: 600;
  --cds-gap-xs: 0.25rem; --cds-gap-sm: 0.5rem; --cds-gap-md: 0.9rem; --cds-gap-lg: 1.4rem; --cds-gap-xl: 2rem;
  --cds-pad-xs: 0.3rem; --cds-pad-sm: 0.55rem; --cds-pad-md: 0.8rem; --cds-pad-lg: 1.1rem; --cds-pad-xl: 1.6rem;
  --cds-radius: 10px;
  --cds-chart-grid: rgba(0, 0, 0, 0.07); --cds-chart-axis: rgba(0, 0, 0, 0.35); --cds-chart-reference: #868e96;
  --cds-surface-popover: #ffffff; --cds-border: #dcdcd6; --cds-shadow-popover: 0 6px 20px rgba(0, 0, 0, 0.12);
  --cds-text-secondary: #5f6672; --cds-dur-slow: 300ms; --cds-ease-out: cubic-bezier(.2, .8, .2, 1);
}
@media (prefers-color-scheme: dark) {
  :root {
    --color-fg: #e8e8e3; --color-fg-muted: #a3a8b0; --color-bg: #17181a; --color-panel: #202124;
    --color-border-line: #33353a; --color-ok: #69db7c; --color-warn: #ffa94d; --color-bad: #ff8787;
    --cds-chart-grid: rgba(255, 255, 255, 0.08); --cds-chart-axis: rgba(255, 255, 255, 0.4); --cds-chart-reference: #adb5bd;
    --cds-surface-popover: #2a2b2f; --cds-border: #3a3c42; --cds-shadow-popover: 0 6px 20px rgba(0, 0, 0, 0.5);
    --cds-text-secondary: #a3a8b0;
  }
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--color-bg); color: var(--color-fg); font-family: var(--font-anthropic-sans); }
#dash-root { padding: clamp(0.9rem, 3vw, 2rem); max-width: 90rem; margin: 0 auto; }
.dash-skeleton { color: transparent !important; position: relative; }
.dash-skeleton:empty, .dash-skeleton > * { visibility: hidden; }
.dash-skeleton::after { content: ""; position: absolute; inset: 0; border-radius: 6px; background: var(--color-border-line); animation: dash-pulse 1.4s ease-in-out infinite; visibility: visible; }
@keyframes dash-pulse { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
