:root {
    --color-bg: #f7f8fa;
    --color-bg-top: #fcfcfd;
    --color-bg-bottom: #f3f5f7;
    --color-surface: #ffffff;
    --color-surface-soft: #fbfcfd;
    --color-border: #dde2ea;
    --color-border-strong: #cbd3df;
    --color-text: #252b36;
    --color-muted: #6f7682;
    --color-primary: #3f4b5d;
    --color-primary-dark: #2f3948;
    --color-primary-light: #f1f3f6;
    --color-accent-red: #c9142b;
    --color-accent-red-dark: #a90f22;
    --color-accent-red-soft: #fff1f3;
    --color-accent-yellow: #ffd200;
    --color-danger: #c9142b;
    --color-danger-soft: #fce8e8;
    --color-success: #2f7d4f;
    --color-success-soft: #e7f6ec;
    --color-warning: #8a6800;
    --color-warning-soft: #fff8dc;
    --color-info: #40566b;
    --color-info-soft: #f2f7fb;
    --color-focus-ring: rgba(63, 75, 93, 0.28);
    --radius-small: 6px;
    --radius: 10px;
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --shadow: 0 12px 28px rgba(28, 39, 55, 0.07);
    --shadow-soft: 0 1px 2px rgba(28, 39, 55, 0.05);
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    min-height: 100vh;
    background: linear-gradient(180deg, var(--color-bg-top) 0, var(--color-bg) 32rem, var(--color-bg-bottom) 100%);
    background-attachment: fixed;
    color: var(--color-text);
    font-size: 15px;
    line-height: 1.45;
    -webkit-font-smoothing: antialiased;
}

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

a:hover {
    text-decoration: underline;
}

h3 {
    margin: 0.75rem 0 0.25rem;
    font-size: 1rem;
    line-height: 1.2;
}

:where(a, button, input, select, textarea, summary):focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

@media (max-width: 800px) {
    body {
        background-attachment: scroll;
    }
}