/* ============================================================
   武侠小说站 · 阅读器独立样式
   从 frontend.css 提取，仅供阅读页加载
   ============================================================ */

/* ---------- CSS 变量 ---------- */
:root {
    --primary: #c8323a;
    --primary-hover: #a82830;
    --primary-soft: #fef2f2;
    --primary-border: #fecaca;
    --primary-glow: rgba(200, 50, 58, 0.12);

    --bg: #f8f7f4;
    --bg-subtle: #f1efeb;
    --surface: #ffffff;
    --surface-2: #fafaf9;
    --text: #1a1a1c;
    --text-2: #52525b;
    --muted: #8b8b92;
    --border: #e7e5e1;
    --border-strong: #d4d0c9;

    --btn-inverse-bg: #1a1a1c;
    --btn-inverse-fg: #ffffff;

    --gold: #c8841a;
    --gold-soft: #fef9e7;
    --gold-glow: rgba(200, 132, 26, 0.1);
    --jade: #15803d;
    --jade-soft: #f0fdf4;
    --success: #16a34a;
    --success-soft: #dcfce7;
    --warning: #ca8a04;
    --warning-soft: #fef9c3;
    --info: #2563eb;
    --info-soft: #dbeafe;
    --danger: #dc2626;
    --danger-soft: #fee2e2;

    --font-sans: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "PingFang SC", "Microsoft YaHei", serif;
    --font-size: 17px;

    --radius-sm: 6px;
    --radius: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.03);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.06);
    --shadow: 0 4px 16px rgba(0, 0, 0, 0.05), 0 2px 6px rgba(0, 0, 0, 0.04);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.07), 0 4px 14px rgba(0, 0, 0, 0.05);
    --shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.1);

    --header-h: 62px;
    --transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-smooth: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-bounce: 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

[data-theme="dark"] {
    --primary: #f87171;
    --primary-hover: #fca5a5;
    --primary-soft: #2a1a1c;
    --primary-border: #4a2226;
    --primary-glow: rgba(248, 113, 113, 0.1);
    --bg: #0c0c0d;
    --bg-subtle: #18181a;
    --surface: #1a1a1d;
    --surface-2: #212124;
    --text: #f4f4f5;
    --text-2: #c4c4c8;
    --muted: #8b8b92;
    --border: #29292c;
    --border-strong: #3f3f43;
    --btn-inverse-bg: #f4f4f5;
    --btn-inverse-fg: #1a1a1d;
    --gold: #eab308;
    --gold-soft: #422006;
    --gold-glow: rgba(234, 179, 8, 0.08);
    --jade: #4ade80;
    --jade-soft: #052e16;
    --success: #4ade80;
    --success-soft: rgba(34, 197, 94, 0.18);
    --warning: #fbbf24;
    --warning-soft: rgba(234, 179, 8, 0.18);
    --info: #60a5fa;
    --info-soft: rgba(59, 130, 246, 0.18);
    --danger: #f87171;
    --danger-soft: rgba(239, 68, 68, 0.18);
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
    --shadow: 0 4px 16px rgba(0, 0, 0, 0.5), 0 2px 6px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.6);
    --shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.7);
}

[data-theme="black"] {
    --primary: #f87171;
    --primary-hover: #fca5a5;
    --primary-soft: #1f1112;
    --primary-border: #3a1c1e;
    --primary-glow: rgba(248, 113, 113, 0.08);
    --bg: #000;
    --bg-subtle: #0d0d0d;
    --surface: #0a0a0a;
    --surface-2: #141414;
    --text: #d4d4d4;
    --text-2: #999;
    --muted: #666;
    --border: #1f1f1f;
    --border-strong: #2e2e2e;
    --btn-inverse-bg: #d4d4d4;
    --btn-inverse-fg: #0a0a0a;
    --gold: #ca8a04;
    --gold-soft: #1f1404;
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.8);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.8);
    --shadow: 0 4px 16px rgba(0, 0, 0, 0.8);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.9);
    --shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.9);
}

[data-theme="green"] {
    --primary: #4caf50;
    --primary-hover: #388e3c;
    --primary-soft: #e8f5e9;
    --primary-border: #a5d6a7;
    --primary-glow: rgba(76, 175, 80, 0.1);
    --bg: #e6efe8;
    --bg-subtle: #dbe8dd;
    --surface: #f0f5f1;
    --surface-2: #e8f0e9;
    --text: #263328;
    --text-2: #4a5c4e;
    --muted: #7d8f80;
    --border: #c5d5c7;
    --border-strong: #b0c0b2;
    --btn-inverse-bg: #263328;
    --btn-inverse-fg: #f0f5f1;
    --gold: #689f38;
    --gold-soft: #f1f8e9;
    --jade: #43a047;
    --shadow-xs: 0 1px 2px rgba(38, 51, 40, 0.05);
    --shadow-sm: 0 1px 3px rgba(38, 51, 40, 0.07);
    --shadow: 0 4px 16px rgba(38, 51, 40, 0.09);
    --shadow-lg: 0 12px 40px rgba(38, 51, 40, 0.12);
    --shadow-xl: 0 20px 60px rgba(38, 51, 40, 0.15);
}

[data-theme="sepia"] {
    --primary: #b45309;
    --primary-hover: #92400e;
    --primary-soft: #fef3c7;
    --primary-border: #fcd34d;
    --primary-glow: rgba(180, 83, 9, 0.1);
    --bg: #f5efe0;
    --bg-subtle: #ede4d3;
    --surface: #faf6ee;
    --surface-2: #f3ebda;
    --text: #3d2b1a;
    --text-2: #6b5340;
    --muted: #9c8568;
    --border: #d9cbb5;
    --border-strong: #c4b299;
    --btn-inverse-bg: #3d2b1a;
    --btn-inverse-fg: #faf6ee;
    --gold: #b7870a;
    --gold-soft: #fef9c3;
    --gold-glow: rgba(183, 135, 10, 0.08);
    --jade: #658c3c;
    --jade-soft: #f0f8e8;
    --shadow-xs: 0 1px 2px rgba(61, 43, 26, 0.06);
    --shadow-sm: 0 1px 3px rgba(61, 43, 26, 0.08);
    --shadow: 0 4px 16px rgba(61, 43, 26, 0.1);
    --shadow-lg: 0 12px 40px rgba(61, 43, 26, 0.14);
    --shadow-xl: 0 20px 60px rgba(61, 43, 26, 0.18);
}

/* ---------- 基础重置 ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden;}

body{
    margin:0;overflow-x:hidden;
    font-family:var(--font-sans);
    background:var(--bg);
    color:var(--text);
    line-height:1.75;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:optimizeLegibility;
    font-feature-settings:"kern","liga","clig","calt";
}

a{color:var(--primary);text-decoration:none;transition:color var(--transition),opacity var(--transition);}
a:hover{color:var(--primary-hover);}
img{max-width:100%;display:block;}
h1,h2,h3,h4,h5{line-height:1.35;font-weight:700;letter-spacing:0.02em;}

::selection{background:var(--primary);color:#fff;}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:4px;}

/* ---------- 容器 ---------- */
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 28px;}

/* ---------- 按钮基础 ---------- */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:6px;
    padding:10px 22px;border-radius:var(--radius);font-size:14px;font-weight:600;
    border:1px solid transparent;cursor:pointer;font-family:inherit;
    transition:all var(--transition);text-decoration:none;line-height:1.4;
    -webkit-tap-highlight-color:transparent;
}
.btn:active{transform:scale(0.97);}
.btn-primary{
    background:var(--primary);color:#fff;
    border-color:var(--primary);
}
.btn-primary:hover{background:var(--primary-hover);color:#fff;}
.btn-sm{padding:7px 14px;font-size:13px;}

/* ---------- 细滚动条 ---------- */
*{
    scrollbar-width:thin;
    scrollbar-color:var(--border-strong) transparent;
}
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:8px;}
::-webkit-scrollbar-thumb:hover{background:var(--muted);}
::-webkit-scrollbar-corner{background:transparent;}

/* ============================================================
   阅读器头部
   ============================================================ */
.read-progress{position:fixed;top:0;left:0;height:3px;background:var(--primary);z-index:200;width:0;transition:width 0.1s linear;}
.reader-header{
    position:sticky;top:0;z-index:100;
    background:rgba(255,255,255,0.92);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border-bottom:1px solid var(--border);
    transition:transform 0.3s cubic-bezier(0.4,0,0.2,1);
}
body.reader-hide-header .reader-header{transform:translateY(-100%);}
.reader-header.reader-headroom-pinned{transform:translateY(0);}
[data-theme="dark"] .reader-header{background:rgba(26,26,29,0.92);}
[data-theme="black"] .reader-header{background:rgba(0,0,0,0.92);border-bottom-color:rgba(255,255,255,0.05);}
[data-theme="sepia"] .reader-header{background:rgba(245,239,224,0.92);}
[data-theme="green"] .reader-header{background:rgba(230,239,232,0.92);}
.reader-header-inner{
    display:flex;align-items:center;gap:16px;
    height:58px;padding:0 20px;
    max-width:1280px;margin:0 auto;
}
.reader-brand{
    display:flex;align-items:center;gap:8px;
    text-decoration:none;flex-shrink:0;
}
.reader-brand .brand-icon{
    width:28px;height:28px;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg, var(--primary), var(--primary-hover));
    color:#fff;border-radius:6px;font-size:14px;font-weight:700;
}
.brand-text-desktop{font-size:14px;font-weight:600;color:var(--text);display:none;}
@media(min-width:640px){.brand-text-desktop{display:inline;}}
.reader-novel-title{
    flex:1;min-width:0;
    display:flex;align-items:baseline;gap:8px;
    font-size:14px;font-weight:600;color:var(--text);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    text-decoration:none;text-align:left;
    transition:color var(--transition);
}
.reader-novel-title:hover{color:var(--primary);}
.reader-novel-name{flex-shrink:1;overflow:hidden;text-overflow:ellipsis;}
.reader-novel-author{
    flex-shrink:0;font-size:12.5px;font-weight:400;color:var(--muted);
}
.reader-novel-author::before{
    content:'·';margin-right:8px;color:var(--border-strong);
}
.reader-tools{
    display:flex;align-items:center;gap:4px;
    flex-shrink:0;
}
.reader-tools button{
    background:transparent;border:none;
    width:34px;height:34px;display:flex;align-items:center;justify-content:center;
    cursor:pointer;color:var(--text);border-radius:50%;
    transition:all var(--transition);
    -webkit-tap-highlight-color:transparent;
}
.reader-tools button:hover{background:var(--bg-subtle);color:var(--primary);}
.reader-tools button:active{transform:scale(0.92);}
.reader-tools svg{width:18px;height:18px;}
#font-size-display{font-size:13px;color:var(--text-2);min-width:22px;text-align:center;font-weight:500;}
.tool-sep{width:1px;height:20px;background:var(--border);margin:0 4px;}
.show-mobile{display:none!important;}
.show-pc{display:none!important;}
@media(max-width:768px){
    .show-mobile{display:inline-flex!important;}
    .tool-hide-mobile{display:none!important;}
    .reader-novel-title{justify-content:center;}
    .reader-novel-author{font-size:11.5px;}
    .reader-novel-author::before{margin-right:6px;}
}
@media(min-width:769px){
    .show-pc{display:flex!important;}
}

/* ============================================================
   阅读器布局
   ============================================================ */
.reader-layout{display:flex;justify-content:center;gap:0;max-width:1280px;margin:0 auto;padding:0 24px;}
.reader-main{flex:1;padding:40px 24px 72px;min-width:0;}

@media(min-width:769px){
    body.reader-page{height:100vh;overflow:hidden;}
    .reader-layout{height:calc(100vh - 58px);overflow:hidden;}
    .reader-main{overflow-y:auto;min-height:0;}
    .reader-sidebar{position:static;max-height:none;}
}

.chapter-article{
    background:var(--surface);
    border-radius:var(--radius-xl);
    padding:36px 64px;
    box-shadow:var(--shadow-sm);
    border:1px solid var(--border);
    font-size:var(--font-size);
    line-height:1.85;
    color:var(--text);
    max-width:38em;
    margin:0 auto;
}
.chapter-title{
    font-size:28px;font-weight:700;margin:0 0 8px;
    text-align:center;color:var(--text);
    letter-spacing:0.02em;
}
.chapter-meta{
    display:flex;justify-content:center;gap:12px;
    color:var(--muted);font-size:13px;margin-bottom:36px;
    padding-bottom:24px;border-bottom:1px solid var(--border);
}
.chapter-meta span+span::before{content:'·';margin-right:12px;color:var(--border-strong);}
.chapter-body p{margin:0 0 var(--reader-ps, 0.9em);text-indent:2em;letter-spacing:var(--reader-ls, 0.01em);line-height:var(--reader-lh, 1.85);word-break:break-word;}
.chapter-volume{font-size:14px;color:var(--muted);margin:0 0 8px;}
.chapter-volume-tag{display:block;font-size:15px;font-weight:400;color:var(--muted);margin-bottom:6px;letter-spacing:2px;}
.reader-content{padding:36px 0 80px;}

html[data-font="sans"] .chapter-article,
html[data-font="sans"] .chapter-body{font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;}
html[data-font="sans"] .chapter-title{font-family:inherit;}

.kbd-hint{text-align:center;margin-top:20px;font-size:13px;color:var(--muted);}
.kbd{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:4px;background:var(--bg-subtle);border:1px solid var(--border-strong);font-size:12px;color:var(--text-2);}

.chapter-nav{
    display:grid;grid-template-columns:1fr auto 1fr;gap:12px;
    margin-top:48px;padding-top:32px;border-top:1px solid var(--border);
}
.chapter-nav a,.chapter-nav .btn-disabled{
    display:inline-flex;align-items:center;gap:8px;
    padding:12px 20px;border-radius:var(--radius);
    border:1px solid var(--border);color:var(--text-2);
    font-size:14px;font-weight:500;transition:all var(--transition);
    text-align:center;justify-content:center;
}
.chapter-nav a:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-soft);}
.chapter-nav .nav-label{font-size:14px;font-weight:600;color:inherit;}
.chapter-nav .nav-text{font-size:12.5px;color:var(--muted);max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.chapter-nav a.next{justify-self:end;}
.chapter-nav a.prev{justify-self:start;}
.chapter-nav .toc-btn{
    justify-self:center;padding:12px 24px;
    background:var(--surface);border:1px solid var(--border-strong);
    color:var(--text);font-weight:600;
}
.chapter-nav .toc-btn:hover{background:var(--primary);color:#fff;border-color:var(--primary);}

/* ============================================================
   章末"已读完"引导卡片
   ============================================================ */
.chapter-end-card{
    max-width:38em;margin:40px auto 0;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-xs);
    overflow:hidden;
    transition:box-shadow var(--transition);
}
.chapter-end-card:hover{box-shadow:var(--shadow-sm);}
.end-card-inner{padding:22px 24px;}
.end-card-check{
    display:flex;align-items:center;gap:8px;
    font-size:15px;font-weight:600;color:var(--jade);
}
.end-card-check svg{flex-shrink:0;}
.end-card-progress{margin-top:14px;}
.end-card-progress-bar{
    height:6px;border-radius:99px;background:var(--bg-subtle);overflow:hidden;
}
.end-card-progress-bar span{
    display:block;height:100%;
    background:linear-gradient(90deg, var(--primary), var(--gold));
    border-radius:99px;transition:width 0.6s cubic-bezier(0.4,0,0.2,1);
}
.end-card-progress-text{
    display:flex;justify-content:space-between;
    margin-top:8px;font-size:12.5px;color:var(--muted);
}
.end-card-next{
    display:flex;flex-direction:column;gap:4px;
    padding:16px 24px;border-top:1px solid var(--border);
    background:var(--bg-subtle);
    text-decoration:none;transition:background var(--transition);
}
.end-card-next:hover{background:var(--primary-soft);}
.end-card-next-label{font-size:12px;color:var(--muted);}
.end-card-next-title{font-size:15px;font-weight:600;color:var(--primary);}
.end-card-next-done{align-items:flex-start;}
.end-card-back-novel{
    font-size:13px;color:var(--primary);font-weight:600;text-decoration:none;
    margin-top:2px;
}
.end-card-back-novel:hover{text-decoration:underline;}

@media(max-width:768px){
    .chapter-end-card{margin:28px 0 0;border-radius:var(--radius);}
    .end-card-inner{padding:18px 18px;}
    .end-card-next{padding:14px 18px;}
}

/* ============================================================
   夜读自动切换提示
   ============================================================ */
.reader-toast{
    position:fixed;left:50%;bottom:90px;z-index:120;
    transform:translateX(-50%) translateY(16px);
    background:var(--btn-inverse-bg);color:#fff;
    padding:10px 18px;border-radius:99px;font-size:13px;
    box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;
    transition:opacity 0.3s, transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
    max-width:90vw;text-align:center;
}
.reader-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.reader-toast a{color:#fbbf24;text-decoration:underline;margin-left:6px;font-weight:600;}
@media(min-width:769px){.reader-toast{bottom:32px;}}

.reader-footer{
    text-align:center;padding:24px;color:var(--muted);font-size:13px;
}

/* ============================================================
   移动端底部导航栏
   ============================================================ */
.mobile-bottom-bar{
    display:flex;align-items:center;justify-content:space-between;
    position:fixed;left:0;right:0;bottom:0;z-index:80;
    background:rgba(255,255,255,0.95);
    backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    border-top:1px solid var(--border);
    padding:10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    box-shadow:0 -4px 20px rgba(0,0,0,0.06);
    opacity:0;transform:translateY(100%);
    pointer-events:none;
    transition:opacity 0.25s ease, transform 0.25s ease;
}
/* 沉浸态（默认隐藏）下不显示；点击中央切换后显示 */
body:not(.reader-ui-hidden) .mobile-bottom-bar{
    opacity:1;transform:translateY(0);
    pointer-events:auto;
}
[data-theme="dark"] .mobile-bottom-bar{background:rgba(26,26,29,0.95);}
.mobile-bottom-bar .bar-btn{
    display:inline-flex;flex-direction:column;align-items:center;gap:2px;
    background:transparent;border:none;padding:6px 10px;border-radius:var(--radius-sm);
    color:var(--text-2);font-size:11px;cursor:pointer;transition:all var(--transition);
    -webkit-tap-highlight-color:transparent;
}
.mobile-bottom-bar .bar-btn:hover{color:var(--text);}
.mobile-bottom-bar .bar-btn:active{transform:scale(0.92);}
.mobile-bottom-bar .bar-btn svg{width:22px;height:22px;}
.mobile-bottom-bar .bar-btn.disabled{opacity:0.3;pointer-events:none;}
.mobile-bottom-bar .bar-btn.bar-next{border:1px solid var(--primary);border-radius:var(--radius);padding:6px 14px;flex-direction:row;gap:4px;font-size:12px;font-weight:600;color:var(--primary);}

@media(min-width:769px){
    .mobile-bottom-bar{display:none!important;}
}

/* ============================================================
   阅读设置面板
   ============================================================ */
.settings-overlay{
    display:none;position:fixed;inset:0;z-index:89;
    background:rgba(0,0,0,0.4);opacity:0;pointer-events:none;
    transition:opacity 0.25s ease;
}
.settings-overlay.show{opacity:1;pointer-events:auto;}

.reader-settings-panel{
    display:none;
    position:fixed;bottom:0;left:0;right:0;z-index:93;
    background:var(--surface);border-radius:18px 18px 0 0;
    box-shadow:var(--shadow-xl);padding:0 0 env(safe-area-inset-bottom, 16px);
    transform:translateY(100%);transition:transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.reader-settings-panel.open{transform:translateY(0);}

@media(min-width:769px){
    .reader-settings-panel{
        display:block;
        bottom:auto;top:50%;left:50%;right:auto;
        width:380px;max-width:calc(100vw - 32px);
        border-radius:var(--radius-xl);
        padding:0;
        transform:translate(-50%, -50%) scale(0.94);
        opacity:0;pointer-events:none;visibility:hidden;
        transition:transform 0.25s cubic-bezier(0.34,1.56,0.64,1), opacity 0.2s, visibility 0s linear 0.25s;
    }
    .reader-settings-panel.open{
        transform:translate(-50%, -50%) scale(1);
        opacity:1;pointer-events:auto;visibility:visible;
        transition:transform 0.25s cubic-bezier(0.34,1.56,0.64,1), opacity 0.2s, visibility 0s;
    }
    .settings-overlay{display:block;}
}

.settings-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:16px 20px;border-bottom:1px solid var(--border);
    font-size:15px;font-weight:600;
}
.settings-close{
    background:none;border:none;cursor:pointer;color:var(--muted);
    padding:4px;border-radius:4px;transition:all var(--transition);
}
.settings-close:hover{color:var(--text);background:var(--bg-subtle);}

.settings-body{padding:16px 20px;display:flex;flex-direction:column;gap:18px;}
.settings-row{display:flex;align-items:center;justify-content:space-between;}
.settings-label{font-size:14px;color:var(--text);font-weight:500;}
.settings-controls{display:flex;align-items:center;gap:10px;}
.settings-val{font-size:14px;color:var(--text-2);min-width:28px;text-align:center;font-weight:600;}
.settings-btn{
    background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--radius);
    padding:8px 14px;font-family:inherit;font-size:14px;font-weight:600;
    color:var(--text);cursor:pointer;transition:all var(--transition);
}
.settings-btn:hover{background:var(--primary-soft);border-color:var(--primary-border);}

.settings-pills{display:flex;gap:4px;background:var(--bg-subtle);border-radius:var(--radius);padding:3px;}
.settings-pill{
    background:transparent;border:none;border-radius:calc(var(--radius) - 2px);
    padding:7px 14px;font-family:inherit;font-size:13px;font-weight:500;
    color:var(--text-2);cursor:pointer;transition:all 0.15s;
    display:inline-flex;align-items:center;gap:4px;
}
.settings-pill.active{background:var(--surface);color:var(--text);font-weight:600;box-shadow:var(--shadow-xs);}
.settings-pill:not(.active):hover{color:var(--text);background:rgba(0,0,0,0.04);}
[data-theme="dark"] .settings-pill:not(.active):hover{background:rgba(255,255,255,0.06);}
.settings-themes .settings-pill{padding:5px 10px;gap:3px;font-size:12px;line-height:1;}
.settings-themes .settings-pill svg{opacity:0.7;flex-shrink:0;}
.settings-themes .settings-pill.active svg{opacity:1;color:var(--primary);}
.settings-themes .settings-pill span{white-space:nowrap;}
.settings-btn-wide{padding:8px 24px;}

@media(min-width:769px){
    .settings-overlay{display:block;}
}

@media(max-width:768px){
    .reader-settings-panel{display:block;}
    .settings-overlay{display:block;}
}

/* ============================================================
   目录抽屉
   ============================================================ */
.toc-overlay{
    display:none;position:fixed;inset:0;z-index:101;
    background:rgba(0,0,0,0.35);
}
.toc-drawer{
    display:none;
    position:fixed;left:0;top:0;bottom:0;z-index:102;
    width:80vw;max-width:380px;
    background:var(--surface);
    box-shadow:4px 0 30px rgba(0,0,0,0.15);
    transform:translateX(-100%);
    transition:transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display:flex;flex-direction:column;
}
.toc-drawer.open{transform:translateX(0);}
.toc-overlay.show{display:block;}

.toc-head{
    display:flex;align-items:center;gap:10px;
    padding:16px 20px;border-bottom:1px solid var(--border);
    font-size:16px;font-weight:700;flex-shrink:0;
}
.toc-novel-name{font-size:12px;color:var(--muted);font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;text-align:right;}
.toc-close{
    background:none;border:none;cursor:pointer;color:var(--muted);
    padding:4px;border-radius:4px;flex-shrink:0;
}
.toc-close:hover{color:var(--text);background:var(--bg-subtle);}

.toc-body{flex:1;overflow-y:auto;padding:8px 0 24px;-webkit-overflow-scrolling:touch;}
.toc-empty{text-align:center;color:var(--muted);padding:40px 20px;font-size:14px;}

.toc-volume{padding:0;}
.toc-volume-title{
    padding:10px 20px 4px;margin:0;
    font-size:13px;font-weight:600;color:var(--muted);
    text-transform:uppercase;letter-spacing:0.5px;
    border-bottom:1px solid var(--border);
}

.toc-chapter-list{list-style:none;padding:0;margin:0;}
.toc-chapter-item{
    display:flex;align-items:center;gap:8px;
    padding:10px 20px;
    font-size:14px;color:var(--text-2);
    text-decoration:none;
    border-bottom:1px solid var(--border);
    transition:background 0.15s;
}
.toc-chapter-item:hover{background:var(--bg-subtle);color:var(--text);}
.toc-chapter-item.active{color:var(--primary);font-weight:600;background:var(--primary-soft);}
.toc-ch-title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.toc-ch-badge{
    font-size:10px;padding:2px 6px;border-radius:3px;
    background:var(--primary);color:#fff;font-weight:600;
    flex-shrink:0;
}

@media(min-width:769px){
    .toc-overlay{display:none!important;}
}
@media(max-width:768px){
    .toc-drawer{display:flex;}
    .toc-overlay{display:none;}
}

/* ============================================================
   移动端阅读区域优化
   ============================================================ */
@media(max-width:768px){
    .chapter-article{padding:20px 20px 24px;border-radius:var(--radius);font-size:var(--font-size);line-height:1.9;}
    .chapter-title{font-size:20px;margin-bottom:6px;}
    .chapter-meta{flex-wrap:wrap;font-size:11.5px;margin-bottom:24px;padding-bottom:18px;gap:4px;}
    .chapter-body p{text-indent:2em;margin-bottom:var(--reader-ps, 0.9em);line-height:var(--reader-lh, 1.85);}

    .chapter-nav a,.chapter-nav .btn-disabled{padding:12px 14px;font-size:13px;text-align:center;}
    .chapter-nav .nav-text{font-size:12.5px;max-width:180px;}

    .reader-footer{padding:16px;font-size:12px;padding-bottom:80px;}

    .kbd-hint{display:none;}

    .mark-login-hint{padding:14px;font-size:13px;}
}

/* ============================================================
   划线批注
   ============================================================ */
mark.hl{background:linear-gradient(180deg, transparent 55%, rgba(250,200,80,0.55) 55%);color:inherit;padding:0 2px;border-radius:2px;cursor:pointer;transition:background var(--transition);}
mark.hl:hover{background:linear-gradient(180deg, transparent 55%, rgba(250,200,80,0.85) 55%);}
mark.hl[data-has-note="1"]{border-bottom:2px solid var(--primary);}
mark.hl.hl-flash{animation:hl-flash 1.6s ease-out;}
@keyframes hl-flash{0%{background:rgba(200,50,58,0.45);}100%{background:linear-gradient(180deg, transparent 55%, rgba(250,200,80,0.55) 55%);}}

.mark-toolbar{position:absolute;z-index:60;display:none;flex-direction:row;gap:6px;background:var(--btn-inverse-bg);color:var(--btn-inverse-fg);padding:6px;border-radius:var(--radius);box-shadow:var(--shadow-lg);}
.mark-toolbar.visible{display:flex;}
.mark-toolbar::after{content:'';position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);border:6px solid transparent;border-top-color:var(--btn-inverse-bg);border-bottom:none;}
.mark-tool-btn{background:transparent;border:none;color:#fff;font-size:13.5px;font-family:inherit;padding:6px 14px;border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;transition:background var(--transition);}
.mark-tool-btn:hover{background:rgba(255,255,255,0.15);}

.mark-popover{position:absolute;z-index:60;width:310px;max-width:calc(100vw - 24px);background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:14px;display:none;}
.mark-popover.visible{display:block;}
.mark-popover textarea{width:100%;border:1px solid var(--border-strong);border-radius:var(--radius);padding:10px 14px;font-family:inherit;font-size:14px;line-height:1.7;color:var(--text);background:var(--surface);resize:vertical;}
.mark-popover textarea:focus{outline:none;border-color:var(--text-2);}
.mark-popover-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:10px;}

.mark-bubble{position:absolute;z-index:60;width:330px;max-width:calc(100vw - 24px);background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:16px;display:none;}
.mark-bubble.visible{display:block;}
.mark-bubble-quote{font-size:14.5px;line-height:1.8;color:var(--text);background:var(--primary-soft);border-left:3px solid var(--primary);padding:10px 14px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-bottom:10px;max-height:130px;overflow-y:auto;word-wrap:break-word;}
.mark-bubble-note{font-size:14px;line-height:1.7;color:var(--text-2);padding:8px 0 10px;border-bottom:1px dashed var(--border);margin-bottom:10px;white-space:pre-wrap;word-wrap:break-word;display:none;}
.mark-bubble-note.visible{display:block;}
.mark-bubble-meta{display:flex;gap:12px;font-size:12.5px;color:var(--muted);margin-bottom:10px;}
.mark-bubble-meta span:first-child{color:var(--text-2);font-weight:500;}
.mark-bubble-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;}
.mark-bubble-link{font-size:13px;color:var(--muted);cursor:pointer;transition:color var(--transition);}
.mark-bubble-link:hover{color:var(--primary);}
.mark-bubble-delete{font-size:13px;}
#mark-bubble-delete-form{display:none;}
#mark-bubble-delete-form.visible{display:block;}

.mark-login-hint{margin-top:36px;padding:16px;text-align:center;background:var(--surface);border:1px dashed var(--border-strong);border-radius:var(--radius);color:var(--muted);font-size:14px;}
.mark-login-hint a{color:var(--primary);font-weight:500;}

.mark-toast{position:fixed;left:50%;bottom:48px;transform:translateX(-50%) translateY(20px);background:var(--btn-inverse-bg);color:var(--btn-inverse-fg);padding:10px 20px;border-radius:var(--radius);font-size:14px;box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:all var(--transition);z-index:120;}
.mark-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

.touch-swipe-hint{
    display:none;text-align:center;color:var(--muted);font-size:12px;
    padding:8px 0 4px;opacity:0.7;
}
@media(max-width:768px){
    .touch-swipe-hint{display:block;}
}

/* ============================================================
   阅读页评论侧边栏
   ============================================================ */
.reader-sidebar{width:300px;flex-shrink:0;border-left:1px solid var(--border);background:var(--surface);display:flex;flex-direction:column;max-height:calc(100vh - 58px);position:sticky;top:58px;overflow-y:auto;}
.sidebar-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 16px;border-bottom:1px solid var(--border);
    font-size:14px;font-weight:600;color:var(--text);flex-shrink:0;
}
.sidebar-count{color:var(--muted);font-weight:400;font-size:12.5px;}
.sidebar-close{
    background:transparent;border:none;cursor:pointer;color:var(--muted);
    padding:4px;border-radius:4px;transition:all var(--transition);
    display:flex;align-items:center;justify-content:center;
}
.sidebar-close:hover{color:var(--text);background:var(--bg-subtle);}
.sidebar-overlay{
    display:none;position:fixed;inset:0;z-index:85;
    background:rgba(0,0,0,0.35);
}
.sidebar-overlay.show{display:block;}

.sidebar-empty{
    padding:40px 20px;text-align:center;color:var(--muted);font-size:14px;
}
.sidebar-comments{
    padding:8px 16px 16px;flex:1;overflow-y:auto;
}
.sidebar-comment{
    padding:14px 0;border-bottom:1px solid var(--border);
}
.sidebar-comment:last-child{border-bottom:none;}
.sidebar-comment-meta{
    display:flex;align-items:center;gap:8px;flex-wrap:wrap;
    margin-bottom:8px;font-size:13px;
}
.sidebar-comment-meta strong{font-weight:600;color:var(--text);font-size:13.5px;}
.sidebar-avatar{
    width:28px;height:28px;border-radius:50%;flex-shrink:0;
    background:linear-gradient(135deg, var(--primary), var(--primary-hover));
    color:#fff;display:flex;align-items:center;justify-content:center;
    font-size:12px;font-weight:700;
}
.sidebar-avatar.is-mark{
    background:linear-gradient(135deg, var(--gold), #d97706);
}
.sidebar-comment-quote{
    display:block;margin-bottom:8px;padding:8px 12px;
    background:var(--bg-subtle);border-left:3px solid var(--gold);
    border-radius:0 var(--radius-sm) var(--radius-sm) 0;
    font-size:12.5px;color:var(--text-2);line-height:1.6;
    text-decoration:none;transition:background var(--transition);
}
.sidebar-comment-quote:hover{background:var(--border);color:var(--text);}
.sidebar-comment-body{
    font-size:13.5px;line-height:1.7;color:var(--text);
    word-break:break-word;overflow-wrap:break-word;
}
.sidebar-comment-time{
    font-size:11.5px;color:var(--muted);margin-top:6px;
}
.sidebar-more{
    padding:14px 16px;border-top:1px solid var(--border);text-align:center;
}

@media(min-width:1100px){.reader-layout{padding:0 36px;}}

@media(max-width:768px){
    .reader-sidebar{
        display:flex;
        position:fixed;top:auto;bottom:0;left:0;right:0;
        width:100%;max-height:70vh;border-left:none;
        border-top:1px solid var(--border);border-radius:var(--radius-lg) var(--radius-lg) 0 0;
        z-index:90;
        transform:translateY(100%);
        visibility:hidden;
        transition:transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.28s;
    }
    .reader-sidebar.open{
        transform:translateY(0);
        visibility:visible;
        transition:transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s;
    }
    .reader-main{padding:0 0 16px;}
    .reader-layout{padding:0;}

    /* 移动端沉浸阅读：顶部导航栏改为固定定位，默认隐藏，点击中央与底部栏同步切换显隐 */
    .reader-header{position:fixed;top:0;left:0;right:0;}
    body.reader-ui-hidden .reader-header{transform:translateY(-100%);}
    body:not(.reader-ui-hidden) .reader-layout{padding-top:54px;}
    body:not(.reader-ui-hidden) .reader-layout.paged{padding-top:0;}
}

/* ============================================================
   移动端：翻页阅读模式（书页翻动）
   ============================================================ */
@media(max-width:768px){
    .reader-layout.paged{
        overflow:hidden;
        perspective:1600px;
        perspective-origin:50% 20%;
    }
    .reader-layout.paged .reader-main{
        padding:0;overflow:hidden;
        height:100vh;
        max-height:100vh;
    }
    /* 顶栏可见时翻页舞台让出固定导航高度，沉浸态占满全屏 */
    body:not(.reader-ui-hidden) .reader-layout.paged .reader-main{
        height:calc(100vh - 58px);
        max-height:calc(100vh - 58px);
        margin-top:58px;
    }
    .reader-layout.paged .reader-main .container{
        padding:0;height:100%;overflow:hidden;
    }
    .reader-layout.paged .chapter-article{
        border-radius:0;border:none;box-shadow:none;
        height:100%;overflow:hidden;position:relative;
        display:flex;flex-direction:column;background:var(--surface);
    }
    /* 章节标题/元信息只在每页页眉显示，原节点隐藏 */
    .reader-layout.paged .chapter-title,
    .reader-layout.paged .chapter-meta,
    .reader-layout.paged .chapter-end-card,
    .reader-layout.paged .chapter-nav,
    .reader-layout.paged .kbd-hint{
        display:none;
    }

    .reader-layout.paged .chapter-body{
        flex:1 1 auto;min-height:0;display:flex;margin:0;overflow:hidden;
    }
    .paged-stage{
        position:relative;flex:1 1 auto;width:100%;overflow:hidden;background:var(--surface);
    }
    .paged-page{
        position:absolute;inset:0;
        display:flex;flex-direction:column;
        background:var(--surface);overflow:hidden;
        will-change:transform;
        transform:translateY(100%);   /* 默认藏于舞台下方 */
        transition:transform 0.36s cubic-bezier(0.22,0.61,0.36,1);
        backface-visibility:hidden;
        box-shadow:0 -6px 18px -8px rgba(0,0,0,0.18); /* 上沿投影，强化层叠质感 */
    }
    /* 左右翻页方向：页面初始藏于舞台右侧，投影移至左沿 */
    .reader-layout.paged.paged-dir-h .paged-page{
        transform:translateX(100%);
        box-shadow:6px 0 18px -8px rgba(0,0,0,0.18);
    }
    .paged-page .page-head{
        flex:0 0 auto;padding:16px 20px 4px;
    }
    .paged-page .page-head .ph-title{
        margin:0;font-size:17px;font-weight:600;line-height:1.4;color:var(--text);
    }
    .paged-page .page-head .ph-meta{
        margin:8px 0 12px;padding-bottom:12px;border-bottom:1px solid var(--border);
        font-size:11px;color:var(--muted);display:flex;gap:12px;flex-wrap:wrap;
    }
    .paged-page .page-body{
        flex:1 1 auto;overflow:hidden;padding:4px 20px 14px;min-height:0;
    }
    /* 每页底部页脚：分页信息（第 X / Y 页），书本式常驻底部 */
    .paged-page .page-foot{
        flex:0 0 auto;
        display:flex;align-items:center;justify-content:center;gap:5px;
        padding:2px 20px calc(8px + env(safe-area-inset-bottom,0px));
        font-size:11px;color:var(--muted);
        font-variant-numeric:tabular-nums;
    }
    .paged-page .page-foot .pf-cur{color:var(--text);font-weight:600;}
    .paged-page .page-foot .pf-total{font-weight:600;}
    .reader-layout.paged .chapter-body p,
    .reader-layout.paged .page-body p{
        text-indent:2em;margin:0 0 var(--reader-ps,0.9em);
        line-height:var(--reader-lh,1.85);
        font-size:var(--font-size);word-break:break-word;
    }
}

/* ============================================================
   Flash 消息
   ============================================================ */
.site-flash{
    position:relative;
    display:flex;align-items:flex-start;gap:10px;
    padding:12px 16px 12px 14px;border-radius:var(--radius);
    margin:14px 0;
    font-size:14px;line-height:1.55;
    border:1px solid;
    animation:flash-in 0.32s cubic-bezier(0.4, 0, 0.2, 1);
}
@keyframes flash-in{
    from{opacity:0;transform:translateY(-6px);}
    to{opacity:1;transform:translateY(0);}
}
@keyframes flash-out{
    to{opacity:0;transform:translateY(-6px);max-height:0;padding-top:0;padding-bottom:0;margin:0;border-width:0;}
}
.site-flash-icon{
    flex-shrink:0;width:18px;height:18px;margin-top:2px;
}
.site-flash-content{flex:1;min-width:0;}
.site-flash-close{
    flex-shrink:0;
    background:transparent;border:none;cursor:pointer;
    color:inherit;opacity:0.55;padding:2px;border-radius:4px;
    transition:opacity var(--transition), background var(--transition);
    -webkit-tap-highlight-color:transparent;
    align-self:flex-start;
}
.site-flash-close:hover{opacity:1;background:rgba(0,0,0,0.06);}
[data-theme="dark"] .site-flash-close:hover{background:rgba(255,255,255,0.08);}
.site-flash-close svg{width:14px;height:14px;display:block;}
.site-flash-success{
    background:var(--jade-soft);color:var(--jade);
    border-color:rgba(21,128,61,0.2);
}
.site-flash-success .site-flash-icon{color:var(--jade);}
.site-flash-info{
    background:var(--bg-subtle);color:var(--text-2);
    border-color:var(--border);
}
.site-flash-info .site-flash-icon{color:var(--text-2);}
.site-flash-error{
    background:var(--primary-soft);color:var(--primary);
    border-color:var(--primary-border);
}
.site-flash-error .site-flash-icon{color:var(--primary);}
.site-flash.is-hiding{
    animation:flash-out 0.28s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

/* ============================================================
   空状态
   ============================================================ */
.empty-state{
    text-align:center;
    padding:52px 24px;
    color:var(--muted);
    background:var(--bg-subtle);
    border:2px dashed var(--border-strong);
    border-radius:var(--radius-lg);
    font-size:14px;
    line-height:1.7;
}
.empty-state-icon{
    width:64px;height:64px;margin:0 auto 18px;
    display:flex;align-items:center;justify-content:center;
    background:var(--surface);
    border-radius:50%;
    box-shadow:var(--shadow-sm);
    color:var(--text-2);
}
.empty-state-icon svg{width:32px;height:32px;}
.empty-state p{margin:0 0 4px;color:var(--text-2);font-weight:500;}
.empty-state .empty-state-sub{margin:0 0 18px;font-size:13px;color:var(--muted);font-weight:400;}
.empty-state .btn{margin-top:6px;}

/* ============================================================
   返回顶部按钮
   ============================================================ */
.back-to-top{
    position:fixed;right:18px;bottom:84px;z-index:60;
    width:44px;height:44px;border-radius:50%;
    background:var(--surface);color:var(--text-2);
    border:1px solid var(--border);
    display:flex;align-items:center;justify-content:center;
    box-shadow:var(--shadow);
    cursor:pointer;opacity:0;pointer-events:none;
    transform:translateY(10px);
    transition:all var(--transition);
    -webkit-tap-highlight-color:transparent;
}
.back-to-top.show{opacity:1;pointer-events:auto;transform:translateY(0);}
.back-to-top:hover{background:var(--primary);color:#fff;border-color:var(--primary);}
.back-to-top svg{width:18px;height:18px;}
.back-top-pct{
    position:absolute;bottom:-2px;left:50%;transform:translateX(-50%);
    font-size:9px;font-weight:700;color:var(--primary);
    background:var(--surface);border-radius:999px;padding:1px 5px;
    border:1px solid var(--border);line-height:1;
}
.back-to-top:hover .back-top-pct{background:var(--primary);color:#fff;border-color:var(--primary);}

/* ============================================================
   阅读页：用户菜单 & 登录入口
   ============================================================ */
.user-menu{position:relative;}
.reader-tools .user-menu-btn{
    width:auto;height:auto;border-radius:var(--radius-sm);
    display:inline-flex;align-items:center;gap:6px;
    background:transparent;border:1px solid transparent;cursor:pointer;
    color:var(--text);font-family:inherit;font-size:13.5px;font-weight:500;
    padding:5px 8px;
    transition:background var(--transition),border-color var(--transition);
    white-space:nowrap;
}
.user-menu-btn:hover{background:var(--bg-subtle);border-color:var(--border);}
.user-menu.open .user-menu-btn{background:var(--bg-subtle);border-color:var(--border);}
.user-avatar{
    width:28px;height:28px;border-radius:50%;flex-shrink:0;
    background:linear-gradient(135deg, var(--primary), var(--primary-hover));
    color:#fff;display:flex;align-items:center;justify-content:center;
    font-size:13px;font-weight:700;line-height:1;
}
.user-name-desktop{max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.user-menu-caret{width:10px;height:10px;flex-shrink:0;opacity:0.5;transition:transform var(--transition);}
.user-menu.open .user-menu-caret{transform:rotate(180deg);opacity:0.85;}

.user-menu-dropdown{
    position:absolute;top:calc(100% + 8px);right:0;width:240px;
    background:var(--surface);border:1px solid var(--border);
    border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
    z-index:70;display:none;
    animation:reader-menu-in 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}
.user-menu.open .user-menu-dropdown,.user-menu-open .user-menu-dropdown[data-_back="user-menu"]{display:block;}
@keyframes reader-menu-in{
    from{opacity:0;transform:translateY(-6px) scale(0.98);}
    to{opacity:1;transform:translateY(0) scale(1);}
}

.user-menu-head{
    display:flex;align-items:center;gap:10px;padding:10px 10px 12px;
    margin:0 0 2px;border-bottom:1px solid var(--border);
}
.user-menu-head-avatar{
    width:36px;height:36px;border-radius:50%;
    background:linear-gradient(135deg, var(--primary), var(--primary-hover));
    color:#fff;display:flex;align-items:center;justify-content:center;
    font-size:15px;font-weight:700;flex-shrink:0;
}
.user-menu-head-meta{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;}
.user-menu-head-name{font-size:14px;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.user-menu-section{display:flex;flex-direction:column;gap:1px;padding:4px 0;}
.user-menu-section+.user-menu-section{border-top:1px solid var(--border);margin-top:4px;}
.user-menu-dropdown a{
    display:flex;align-items:center;padding:8px 10px;border-radius:var(--radius-sm);
    color:var(--text-2);text-decoration:none;font-size:13.5px;
    transition:background var(--transition),color var(--transition);
}
.user-menu-dropdown a:hover{background:var(--bg-subtle);color:var(--text);}
.user-menu-logout{margin:0;padding:0;}
.user-menu-logout button[type="submit"]{
    display:flex;align-items:center;width:100%;padding:8px 10px;
    border:none;border-radius:var(--radius-sm);cursor:pointer;
    font-family:inherit;font-size:13.5px;text-align:left;
    color:var(--primary);background:var(--primary-soft);
    transition:background var(--transition),color var(--transition);
}
.user-menu-logout button[type="submit"]:hover{background:var(--primary);color:#fff;}

.reader-login-link{
    display:inline-flex;align-items:center;gap:4px;
    color:var(--primary);font-size:13.5px;font-weight:600;
    text-decoration:none;padding:5px 10px;border-radius:var(--radius-sm);
    transition:background var(--transition);
}
.reader-login-link:hover{background:var(--primary-soft);}

.topbar-lang-toggle{
    background:transparent;border:1px solid var(--border);cursor:pointer;
    color:var(--text-2);font-size:12px;font-weight:600;
    padding:3px 8px;border-radius:var(--radius-sm);
    transition:all var(--transition);font-family:inherit;
}
.topbar-lang-toggle:hover{color:var(--primary);border-color:var(--primary);}

/* 移动端：头像 + 登录按钮缩简 */
@media(max-width:768px){
    .user-menu-btn{padding:4px 6px;}
    .user-name-desktop{display:none;}
    .reader-login-link{font-size:13px;padding:4px 8px;}
}

/* ============================================================
   触摸态
   ============================================================ */
.btn,.me-nav-link,.me-mini-cover,.me-mini-title,.novel-card,.me-bottom-nav-item,.me-bottom-sheet-link,
.history-continue,.me-mobile-hero-stat,.me-continue-cta,.me-rating-cta,.catalog-filter button,
.me-mobile-hero-action,.header-search-toggle,.user-menu-btn{
    -webkit-tap-highlight-color:transparent;
}

/* ============================================================
   极小屏 400px
   ============================================================ */
@media(max-width:400px){
    .container{padding:0 14px;}
    .reader-header-inner{height:54px;padding:0 14px;gap:12px;}
    .reader-novel-title{font-size:13px;}
    .reader-novel-author{display:none;}
    .chapter-article{padding:16px 16px 20px;}
    .chapter-title{font-size:18px;}
    .chapter-meta{font-size:11px;gap:8px;}
    .mobile-bottom-bar{padding:8px 12px calc(8px + env(safe-area-inset-bottom, 0px));}
    .mobile-bottom-bar .bar-btn{padding:5px 8px;font-size:10.5px;}
    .mobile-bottom-bar .bar-btn svg{width:20px;height:20px;}
    .mobile-bottom-bar .bar-btn.bar-next{padding:5px 10px;font-size:11px;}
    .reader-settings-panel{border-radius:14px 14px 0 0;}
    .settings-head{padding:14px 16px;font-size:14px;}
    .settings-body{padding:14px 16px;gap:14px;}
    .settings-btn{padding:7px 12px;font-size:13px;}
    .empty-state{padding:36px 18px;}
    .site-flash{padding:10px 14px;font-size:13px;border-radius:var(--radius-sm);margin:10px 0;}
}

/* 768 以下 container padding */
@media(max-width:768px){
    .container{padding:18px;}
}