/* Authoritative palettes. Surfaces, text and action colors have separate roles. */
:root {
    color-scheme: dark;
    --bg: #181818;
    --bg-surface: #202020;
    --bg-card: #272727;
    --bg-hover: #303030;
    --input-bg: #242424;
    --text: #ededed;
    --text-dim: #adadad;
    --text-muted: #a0a0a0;
    --border: #393939;
    --accent: #91b0f5;
    --accent-hover: #426bd0;
    --accent-solid: #3b64d2;
    --accent-pressed: #3457ac;
    --accent-dim: rgba(145,176,245,.13);
    --on-accent: #ffffff;
    --selection-bg: #2a354d;
    --selection-text: #b7cdff;
    --green: #7cc4a0;
    --orange: #e4ba79;
    --red: #ed969b;
    --status-success-text: var(--green);
    --status-warning-text: var(--orange);
    --status-error-text: var(--red);
    /* Solid data bars are distinct from the lighter, readable status text. */
    --status-success-fill: #34c759;
    --status-warning-fill: #ff9f0a;
    --status-error-fill: #ff453a;
    --status-success-bg: color-mix(in srgb, var(--green) 10%, var(--bg-card));
    --status-warning-bg: color-mix(in srgb, var(--orange) 10%, var(--bg-card));
    --status-error-bg: color-mix(in srgb, var(--red) 10%, var(--bg-card));
    --border-control: #797d85;
    --scrollbar-thumb: #73777f;
    --avatar-bg: var(--bg-hover);
    --avatar-text: var(--text-dim);
    --chart-visits: var(--accent);
    --chart-pageviews: var(--green);
    --font-family-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-family-mono: ui-monospace, SFMono-Regular, Consolas, monospace;
    --font-body: 14px;
    --font-control: 13px;
    --font-caption: 12px;
    --font-heading: 24px;
    --font-section: 16px;
    --line-body: 1.5;
    --weight-medium: 500;
    --weight-heading: 600;
    --control-height: 36px;
    /* The shell keeps the blue card size fixed; the mark gets breathing room. */
    --brand-mark-size: 82%;
}
.light {
    color-scheme: light;
    --bg: #f0f1f3;
    --bg-surface: #f7f8fa;
    --bg-card: #ffffff;
    --bg-hover: #e7eaf0;
    --input-bg: #f9fafb;
    --text: #25282d;
    --text-dim: #535a65;
    --text-muted: #606874;
    --border: #d5dae2;
    --border-control: #838d9b;
    --scrollbar-thumb: #838d9b;
    --accent: #335cbb;
    --accent-hover: #3156ba;
    --accent-solid: #3b64d2;
    --accent-pressed: #284b9f;
    --accent-dim: rgba(59,100,210,.09);
    --selection-bg: #e5ebfa;
    --selection-text: #3357a8;
    --green: #247151;
    --orange: #8a5a14;
    --red: #b33d43;
    /* Derived custom properties resolve where declared, not where consumed.
       Redeclare them on the theme scope so body.light cannot inherit dark mixes. */
    --status-success-text: var(--green);
    --status-warning-text: var(--orange);
    --status-error-text: var(--red);
    --status-success-fill: var(--green);
    --status-warning-fill: var(--orange);
    --status-error-fill: var(--red);
    --status-success-bg: color-mix(in srgb, var(--green) 10%, var(--bg-card));
    --status-warning-bg: color-mix(in srgb, var(--orange) 10%, var(--bg-card));
    --status-error-bg: color-mix(in srgb, var(--red) 10%, var(--bg-card));
    --avatar-bg: var(--bg-hover);
    --avatar-text: var(--text-dim);
    --chart-visits: var(--accent);
    --chart-pageviews: var(--green);
}