:root {
    --sn-coral: #D97757;
    --sn-coral-deep: #BF5F42;
    --sn-coral-soft: #EFC4B0;
    --sn-coral-wash: #F7E5DA;
    --sn-paper: #F4F1E8;
    --sn-paper-2: #EAE6D8;
    --sn-paper-3: #DCD6C2;
    --sn-white: #FBF9F3;
    --sn-ink: #3D3929;
    --sn-ink-2: #6B6657;
    --sn-ink-3: #9A9485;
    --sn-ink-4: #BDB7A6;
    --sn-hairline: #D9D3C2;
    --sn-leaf: #4F9F6E;
    --sn-leaf-deep: #3E8358;
    --sn-leaf-soft: #D7EADD;
    --sn-leaf-wash: #EAF3EC;
    --sn-sage: #7A8C6F;
    --sn-slate: #3A4A5A;
    --sn-amber: #C9923A;

    --sn-bg: var(--sn-paper);
    --sn-bg-soft: var(--sn-paper-2);
    --sn-card: var(--sn-white);
    --sn-text: var(--sn-ink);
    --sn-text-muted: var(--sn-ink-2);
    --sn-text-subtle: var(--sn-ink-3);
    --sn-border: var(--sn-hairline);
    --sn-primary: var(--sn-coral);
    --sn-primary-hover: var(--sn-coral-deep);
    --sn-success: var(--sn-leaf);
    --sn-success-hover: var(--sn-leaf-deep);
    --sn-success-soft: var(--sn-leaf-wash);
    --sn-success-border: rgba(79, 159, 110, 0.3);
    --sn-success-focus: 0 0 0 3px rgba(79, 159, 110, 0.18);
    --sn-danger: #B94A42;
    --sn-danger-bg: #F7DDD7;
    --sn-warning: var(--sn-amber);
    --sn-warning-bg: #F7ECCE;
    --sn-info: var(--sn-slate);
    --sn-info-bg: #E5E9EC;

    --sn-radius-xs: 6px;
    --sn-radius-sm: 8px;
    --sn-radius-md: 10px;
    --sn-radius-lg: 12px;
    --sn-shadow-sm: 0 6px 18px rgba(61, 57, 41, 0.07);
    --sn-shadow-md: 0 12px 28px rgba(61, 57, 41, 0.1);
    --sn-focus: 0 0 0 3px rgba(217, 119, 87, 0.18);
    --sn-ease: cubic-bezier(0.2, 0.6, 0.2, 1);
    --sn-dur-base: 150ms;

    --sn-font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", Arial, sans-serif;
    --sn-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
}

html {
    min-width: 0;
    background: var(--sn-bg);
    color: var(--sn-text);
    font-size: 14px;
    -webkit-text-size-adjust: 100%;
}

body {
    min-width: 0;
    font-family: var(--sn-font-sans);
    font-size: 13.5px;
    line-height: 1.58;
    color: var(--sn-text);
    background:
        radial-gradient(circle at 12% 0%, rgba(247, 229, 218, 0.72), transparent 28rem),
        linear-gradient(180deg, var(--sn-paper) 0%, #EFEBDC 100%);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

button,
input,
select,
textarea {
    font-family: inherit;
}

a {
    color: var(--sn-primary-hover);
}

img,
svg,
canvas,
video {
    max-width: 100%;
}