:root {
    color-scheme: dark;
    --page: #0c1a2e;
    --page-deep: #081321;
    --surface: rgba(31, 52, 82, .82);
    --surface-solid: #1c3150;
    --surface-raised: #28466f;
    --surface-soft: rgba(255, 255, 255, .06);
    --surface-hover: rgba(255, 255, 255, .11);
    --text: #f7f9fd;
    --muted: #b8c7db;
    --faint: #8295b1;
    --border: rgba(255, 255, 255, .10);
    --border-strong: rgba(255, 255, 255, .18);
    --accent: #ffc928;
    --accent-strong: #ffad1f;
    --accent-ink: #172238;
    --blue: #6bc8ff;
    --blue-strong: #3988ff;
    --danger: #ff7c82;
    --success: #61d5a6;
    --shadow: 0 18px 44px rgba(0, 0, 0, .22);
    --radius-xl: 14px;
    --radius-lg: 11px;
    --radius-md: 8px;
    --content: 1580px;
    --topbar-height: 54px;
    --focus: 0 0 0 3px rgba(107, 200, 255, .38);
}

html[data-theme="light"] {
    color-scheme: light;
    --page: #eaf2fa;
    --page-deep: #dce8f4;
    --surface: rgba(255, 255, 255, .82);
    --surface-solid: #ffffff;
    --surface-raised: #f0f6fc;
    --surface-soft: rgba(20, 49, 84, .06);
    --surface-hover: rgba(20, 49, 84, .10);
    --text: #14243a;
    --muted: #536b88;
    --faint: #71839a;
    --border: rgba(21, 48, 82, .12);
    --border-strong: rgba(21, 48, 82, .22);
    --shadow: 0 18px 44px rgba(44, 73, 108, .14);
}