/**
 * Agreed — theme tokens (dark/light), shared with csClockMan.
 */

html[data-theme="dark"],
html[data-theme="dark"] body {
    color-scheme: dark;
}
html[data-theme="light"],
html[data-theme="light"] body {
    color-scheme: light;
}

:root,
[data-theme="dark"] {
    --color-bg: #0a0c10;
    --color-bg-elevated: #141820;
    --color-bg-card: #1a2030;
    --color-bg-input: #2a3348;
    --color-bg-hover: #343f56;
    --topbar-bg-from: #0a1628;
    --topbar-bg-to: #060d18;

    --color-text: #f4f7fc;
    --color-text-muted: #c5d0e0;
    --color-text-label: #dce4f0;
    --color-text-faint: #8d99ad;

    --color-border: #5a6578;
    --color-border-soft: rgba(255, 255, 255, 0.1);
    --color-primary: #6b9fd4;
    --color-primary-hover: #5a8fc4;
    --color-primary-contrast: #0a0c10;
    --color-success: #4ade80;
    --color-warning: #fbbf24;
    --color-danger: #ef4444;

    --tint-primary: rgba(107, 159, 212, 0.16);
    --tint-success: rgba(74, 222, 128, 0.14);
    --tint-warning: rgba(251, 191, 36, 0.14);
    --tint-danger: rgba(239, 68, 68, 0.14);
    --tint-muted: rgba(255, 255, 255, 0.08);

    --radius-md: 8px;
    --radius-lg: 12px;
    --topbar-height: 60px;
    --content-width: 640px;
    --font-sans: "Segoe UI", system-ui, -apple-system, sans-serif;
    --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.3);
}

[data-theme="light"] {
    --color-bg: #eef1f6;
    --color-bg-elevated: #ffffff;
    --color-bg-card: #ffffff;
    --color-bg-input: #ffffff;
    --color-bg-hover: #e8ecf3;
    --topbar-bg-from: #0a66c2;
    --topbar-bg-to: #084c8c;

    --color-text: #1a1f2e;
    --color-text-muted: #4a5568;
    --color-text-label: #374151;
    --color-text-faint: #6b7280;

    --color-border: #c5cdd8;
    --color-border-soft: #e2e7ee;
    --color-primary: #1565c0;
    --color-primary-hover: #0d47a1;
    --color-primary-contrast: #ffffff;
    --color-success: #15803d;
    --color-warning: #b45309;
    --color-danger: #dc2626;

    --tint-primary: rgba(21, 101, 192, 0.1);
    --tint-success: rgba(21, 128, 61, 0.1);
    --tint-warning: rgba(180, 83, 9, 0.1);
    --tint-danger: rgba(220, 38, 38, 0.08);
    --tint-muted: rgba(0, 0, 0, 0.05);

    --shadow-card: 0 1px 3px rgba(15, 23, 42, 0.08);
}

*, *::before, *::after { box-sizing: border-box; }

body {
    margin: 0;
    font-family: var(--font-sans);
    background: var(--color-bg);
    color: var(--color-text);
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
}

a { color: var(--color-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

.material-icons { font-size: 20px; vertical-align: middle; line-height: 1; }