/* ============================================
   NovelCraft - 基础变量与重置
   支持 8 种主题色调 + 深色/浅色模式
   ============================================ */

/* 默认主题 (蓝色) */
:root {
    --bg-primary: #f2f2f7;
    --bg-secondary: #ffffff;
    --bg-tertiary: #f9f9fb;
    --bg-grouped: #f2f2f7;
    --glass-bg: rgba(255,255,255,0.72);
    --glass-bg-heavy: rgba(255,255,255,0.88);
    --glass-border: rgba(0,0,0,0.06);
    --glass-shadow: 0 2px 20px rgba(0,0,0,0.06);
    --accent: #007aff;
    --accent-light: rgba(0,122,255,0.1);
    --accent-hover: #0056cc;
    --accent-soft: #e8f2ff;
    --accent-gradient: linear-gradient(135deg, #007aff, #5856d6);
    --green: #34c759;
    --orange: #ff9500;
    --red: #ff3b30;
    --red-light: rgba(255,59,48,0.1);
    --purple: #af52de;
    --teal: #5ac8fa;
    --pink: #ff2d55;
    --text-primary: #1c1c1e;
    --text-secondary: #636366;
    --text-tertiary: #aeaeb2;
    --text-invert: #ffffff;
    --separator: rgba(60,60,67,0.08);
    --separator-opaque: #e5e5ea;
    --radius-xs: 8px;
    --radius-sm: 12px;
    --radius-md: 16px;
    --radius-lg: 22px;
    --radius-xl: 28px;
    --radius-full: 9999px;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.04);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.08);
    --shadow-lg: 0 8px 40px rgba(0,0,0,0.12);
    --shadow-float: 0 16px 48px rgba(0,0,0,0.16);
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'PingFang SC', 'Microsoft YaHei', sans-serif;
    --font-serif: 'Noto Serif SC', 'STSong', 'SimSun', serif;
    --font-mono: 'SF Mono', 'Fira Code', 'Consolas', monospace;
    --font-size-base: 16px;
    --ease-spring: cubic-bezier(0.175,0.885,0.32,1.275);
    --ease-smooth: cubic-bezier(0.25,0.1,0.25,1);
    --ease-ios: cubic-bezier(0.23,1,0.32,1);
    --duration-fast: 0.2s;
    --duration-normal: 0.35s;
    --duration-slow: 0.5s;
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --sidebar-width: 300px;
}

/* 深色模式 */
@media (prefers-color-scheme: dark) {
    :root {
        --bg-primary: #000; --bg-secondary: #1c1c1e; --bg-tertiary: #2c2c2e;
        --bg-grouped: #1c1c1e; --glass-bg: rgba(28,28,30,0.72); --glass-bg-heavy: rgba(28,28,30,0.88);
        --glass-border: rgba(255,255,255,0.08); --text-primary: #f5f5f7;
        --text-secondary: #98989d; --text-tertiary: #636366;
        --separator: rgba(84,84,88,0.36); --separator-opaque: #38383a;
        --accent-soft: rgba(0,122,255,0.15);
    }
}

/* 强制浅色/深色 */
[data-theme-mode="light"] {
    --bg-primary: #f2f2f7; --bg-secondary: #ffffff; --bg-tertiary: #f9f9fb;
    --bg-grouped: #f2f2f7; --glass-bg: rgba(255,255,255,0.72); --glass-bg-heavy: rgba(255,255,255,0.88);
    --glass-border: rgba(0,0,0,0.06); --text-primary: #1c1c1e;
    --text-secondary: #636366; --text-tertiary: #aeaeb2;
    --separator: rgba(60,60,67,0.08); --separator-opaque: #e5e5ea;
    --accent-soft: #e8f2ff;
}
[data-theme-mode="dark"] {
    --bg-primary: #000; --bg-secondary: #1c1c1e; --bg-tertiary: #2c2c2e;
    --bg-grouped: #1c1c1e; --glass-bg: rgba(28,28,30,0.72); --glass-bg-heavy: rgba(28,28,30,0.88);
    --glass-border: rgba(255,255,255,0.08); --text-primary: #f5f5f7;
    --text-secondary: #98989d; --text-tertiary: #636366;
    --separator: rgba(84,84,88,0.36); --separator-opaque: #38383a;
    --accent-soft: rgba(0,122,255,0.15);
}

/* 主题色调 */
[data-theme-color="sunset"]   { --accent: #ff6b35; --accent-light: rgba(255,107,53,0.12); --accent-hover: #e55d2b; --accent-soft: rgba(255,107,53,0.08); --accent-gradient: linear-gradient(135deg, #ff6b35, #ff3b30); }
[data-theme-color="forest"]   { --accent: #2d8a56; --accent-light: rgba(45,138,86,0.12); --accent-hover: #23704a; --accent-soft: rgba(45,138,86,0.08); --accent-gradient: linear-gradient(135deg, #2d8a56, #1a6b3c); }
[data-theme-color="plum"]     { --accent: #7c3aed; --accent-light: rgba(124,58,237,0.12); --accent-hover: #6d28d9; --accent-soft: rgba(124,58,237,0.08); --accent-gradient: linear-gradient(135deg, #7c3aed, #a855f7); }
[data-theme-color="rose"]     { --accent: #e11d48; --accent-light: rgba(225,29,72,0.12); --accent-hover: #be123c; --accent-soft: rgba(225,29,72,0.08); --accent-gradient: linear-gradient(135deg, #e11d48, #fb7185); }
[data-theme-color="ocean"]    { --accent: #0ea5e9; --accent-light: rgba(14,165,233,0.12); --accent-hover: #0284c7; --accent-soft: rgba(14,165,233,0.08); --accent-gradient: linear-gradient(135deg, #0ea5e9, #38bdf8); }
[data-theme-color="amber"]    { --accent: #d97706; --accent-light: rgba(217,119,6,0.12); --accent-hover: #b45309; --accent-soft: rgba(217,119,6,0.08); --accent-gradient: linear-gradient(135deg, #d97706, #f59e0b); }
[data-theme-color="slate"]    { --accent: #475569; --accent-light: rgba(71,85,105,0.12); --accent-hover: #334155; --accent-soft: rgba(71,85,105,0.08); --accent-gradient: linear-gradient(135deg, #475569, #64748b); }

/* 全局重置 */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html { height:100%; -webkit-text-size-adjust:100%; }
body { height:100%; font-family:var(--font-sans); font-size:var(--font-size-base); line-height:1.5; color:var(--text-primary); background:var(--bg-primary); overflow:hidden; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
input,textarea,select,button { font-family:inherit; font-size:inherit; color:inherit; }
button { border:none; background:none; cursor:pointer; outline:none; }
a { text-decoration:none; color:var(--accent); }

/* 自定义滚动条 */
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(0,0,0,0.12); border-radius:3px; }
::-webkit-scrollbar-thumb:hover { background:rgba(0,0,0,0.2); }
@media (prefers-color-scheme: dark) {
    ::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.15); }
    ::-webkit-scrollbar-thumb:hover { background:rgba(255,255,255,0.25); }
}
[data-theme-mode="dark"] ::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.15); }
[data-theme-mode="dark"] ::-webkit-scrollbar-thumb:hover { background:rgba(255,255,255,0.25); }

::selection { background:var(--accent-light); color:var(--accent); }
.hidden { display:none !important; }