:root { color-scheme: light; --color-bg: #f6f5f1; --color-surface: #fbfaf7; --color-text: #202124; --color-muted: #666b70; --color-border: #d6d8da; --color-link: #315f82; --color-link-hover: #244a67; --color-focus: #1e668f; --font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", sans-serif; --font-mono: ui-monospace, "Cascadia Code", "SFMono-Regular", Consolas, "Liberation Mono", monospace; --content-max: 72ch; --site-max: 72rem; --rule: 1px solid var(--color-border); } :root[data-theme="dark"] { color-scheme: dark; --color-bg: #17191b; --color-surface: #1d2022; --color-text: #e9e9e6; --color-muted: #a0a3a6; --color-border: #363a3e; --color-link: #86b6d8; --color-link-hover: #add3ed; --color-focus: #86b6d8; } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { color-scheme: dark; --color-bg: #17191b; --color-surface: #1d2022; --color-text: #e9e9e6; --color-muted: #a0a3a6; --color-border: #363a3e; --color-link: #86b6d8; --color-link-hover: #add3ed; --color-focus: #86b6d8; } }