:root {
    color-scheme: light;
    --bg: #f7f7f5;
    --surface: #ffffff;
    --surface-2: #f1f1ef;
    --border: #e4e4e1;
    --border-strong: #d5d5d1;
    --text: #1c1c1a;
    --text-muted: #6f6f6a;
    --text-faint: #9a9a94;
    --accent: #1c1c1a;
    --accent-contrast: #ffffff;
    --accent-soft: #efefec;
    --danger: #b3261e;
    --success: #2f7d4f;
    --radius: 12px;
    --radius-sm: 8px;
    --shadow: 0 1px 2px rgba(20, 20, 18, 0.05), 0 8px 24px rgba(20, 20, 18, 0.05);
    --font: "Inter", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, Arial, sans-serif;
    --mono: "SFMono-Regular", ui-monospace, "Cascadia Code", Consolas, monospace;
}

[data-theme="dark"] {
    color-scheme: dark;
    --bg: #121211;
    --surface: #1b1b19;
    --surface-2: #242422;
    --border: #2e2e2b;
    --border-strong: #3b3b37;
    --text: #ececea;
    --text-muted: #a3a39d;
    --text-faint: #77776f;
    --accent: #ececea;
    --accent-contrast: #161614;
    --accent-soft: #262624;
    --danger: #f2b8b5;
    --success: #7dd3a0;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 12px 32px rgba(0, 0, 0, 0.35);
}

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

html,
body {
    height: 100%;
}

body {
    margin: 0;
    font-family: var(--font);
    font-size: 15px;
    line-height: 1.55;
    color: var(--text);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
    font: inherit;
    color: inherit;
}

button {
    cursor: pointer;
}

h1,
h2,
h3,
p {
    margin: 0;
}

svg.icon {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex: none;
}

::selection {
    background: var(--accent-soft);
}

:focus-visible {
    outline: 2px solid var(--text);
    outline-offset: 2px;
    border-radius: 4px;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-thumb {
    background: var(--border-strong);
    border: 3px solid transparent;
    background-clip: padding-box;
    border-radius: 999px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--text-faint);
    background-clip: padding-box;
}