/* ========================================
   全局视口稳定化
   · 修复视图切换时「加载中(短) → 渲染后(长)」造成滚动条出现/消失
     导致 viewport 宽度 ±17px 横向抖动（导航栏/内容整体跳动）
   · 使用 scrollbar-gutter: stable 预留滚动条宽度，
     未滚动时不显示灰色占位条（比 overflow-y:scroll 视觉更整洁）
   · 同时防止 max-width:100vw 容器因滚动条出现产生横向溢出
   ======================================== */
html {
    scrollbar-gutter: stable;
    overflow-y: auto;
    max-width: 100%;
    overflow-x: clip;
}

/* ========================================
   前端样式增强 - 作品卡片/大纲/角色优化
   ======================================== */

/* 首页工作台 */
.home-workspace-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr);
    gap: 28px;
    align-items: center;
    padding: 28px 30px;
    background: var(--card);
    border: 1px solid var(--border);
    border-top: 3px solid var(--brand);
    border-radius: 8px;
    box-shadow: var(--shadow-soft);
}

/* ===== 工具站首屏 Hero（紧凑版） ===== */
.home-tool-hero {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    padding: 22px clamp(20px, 3vw, 36px) 56px;
    color: #fff;
    background:
        radial-gradient(900px 260px at 88% -40%, rgba(167,139,250,.42), transparent 60%),
        linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 48%, var(--accent) 100%);
    box-shadow: 0 10px 26px rgba(79, 70, 229, .24);
}
.home-tool-hero::after {
    content: "";
    position: absolute;
    right: -50px;
    top: -50px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    pointer-events: none;
}
.home-tool-hero-inner { position: relative; z-index: 1; max-width: 680px; }
.home-tool-hero .home-workspace-kicker {
    display: inline-flex;
    align-items: center;
    color: rgba(255, 255, 255, .88);
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .22);
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 11px;
    letter-spacing: .04em;
}
.home-tool-hero h2 {
    margin: 10px 0 6px;
    color: #fff;
    font-size: clamp(20px, 2.6vw, 27px);
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -0.01em;
}
.home-tool-hero > .home-tool-hero-inner > p {
    color: rgba(255, 255, 255, .86);
    font-size: 13px;
    line-height: 1.55;
    margin: 0 0 12px;
    max-width: 580px;
}
.home-tool-hero .home-primary-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 0 18px;
    border-radius: 9px;
    background: #fff;
    color: var(--brand-dark);
    font-weight: 700;
    font-size: 13.5px;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .2);
    white-space: nowrap;
}
.home-tool-hero .home-primary-action:hover { filter: brightness(.96); transform: translateY(-1px); }
.home-hero-features {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 16px;
    margin: 12px 0 2px;
}
.home-hero-feature {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: rgba(255, 255, 255, .9);
}
.home-hero-feature svg { width: 13px; height: 13px; opacity: .92; }
.home-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
}
.home-tool-hero .home-secondary-action {
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .3);
    color: #fff;
    min-height: 36px;
    padding: 0 16px;
    font-size: 13px;
}
.home-tool-hero .home-secondary-action:hover { background: rgba(255, 255, 255, .24); border-color: #fff; color: #fff; }
.home-tool-hero .home-workspace-total {
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .28);
    color: rgba(255, 255, 255, .9);
    margin-top: 0;
    min-height: 36px;
    font-size: 12.5px;
}
.home-tool-hero .home-workspace-total svg { width: 14px; height: 14px; }
.home-tool-hero .home-workspace-total b { color: #fff; }
.home-tool-hero .home-workspace-total svg { color: #fff; }
@media (max-width: 640px) {
    .home-tool-hero .home-hero-actions .home-primary-action { width: 100%; justify-content: center; }
}


.home-workspace-kicker,
.home-section-kicker {
    color: var(--brand);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
}

.home-workspace-copy h2,
.home-works-title-row h2 {
    color: var(--text);
    letter-spacing: 0;
}

.home-workspace-copy h2 {
    margin: 6px 0 8px;
    font-size: 26px;
    line-height: 1.3;
}

.home-workspace-copy p {
    max-width: 620px;
    color: var(--text-sub);
    font-size: 14px;
    line-height: 1.7;
}

.home-workspace-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
}

.home-primary-action,
.home-secondary-action,
.home-text-action {
    min-height: 40px;
    border-radius: 7px;
    padding: 0 16px;
    border: 1px solid transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.home-primary-action {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--accent));
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.28);
}

.home-primary-action:hover { filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 6px 16px rgba(99, 102, 241, 0.36); }
.home-secondary-action { color: var(--text-sub); background: var(--card-2); border-color: var(--border); }
.home-secondary-action:hover { color: var(--brand); border-color: var(--brand); }
.home-secondary-action.is-loading span:first-child { animation: homeRefreshSpin .8s linear infinite; }
@keyframes homeRefreshSpin { to { transform: rotate(360deg); } }

.home-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0 4px;
}

.home-summary-item {
    min-height: 66px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 10px 12px;
    background: var(--card-2);
    border: 1px solid var(--border);
    border-left: 3px solid var(--brand);
    border-radius: 7px;
}
.home-summary-item.running { border-left-color: var(--st-run); }
.home-summary-item.paused { border-left-color: var(--st-err); }
.home-summary-item.done { border-left-color: var(--st-ok); }
.home-summary-label { color: var(--muted); font-size: 11.5px; }
.home-summary-item strong { color: var(--text); font-size: 20px; font-variant-numeric: tabular-nums; line-height: 1.1; }
.home-summary-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.home-summary-icon { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; flex: 0 0 auto; }
.home-summary-icon svg { width: 15px; height: 15px; }
.home-summary-icon.indigo { background: #eef2ff; color: #6366f1; }
.home-summary-icon.amber { background: #fffbeb; color: #f59e0b; }
.home-summary-icon.rose { background: #fff1f2; color: #f43f5e; }
.home-summary-icon.emerald { background: #ecfdf5; color: #10b981; }
[data-theme="dark"] .home-summary-icon.indigo { background: #1e1b4b; color: #a5b4fc; }
[data-theme="dark"] .home-summary-icon.amber { background: #451a03; color: #fbbf24; }
[data-theme="dark"] .home-summary-icon.rose { background: #4c0519; color: #fda4af; }
[data-theme="dark"] .home-summary-icon.emerald { background: #064e3b; color: #34d399; }

.home-action-bookshelf .home-action-icon { color: var(--st-ok); background: var(--st-ok-soft); }
.home-works-section { margin-top: 8px; }
.home-works-title-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.home-works-title-row h2 { margin-top: 3px; font-size: 20px; line-height: 1.35; }
.home-text-action { min-height: 34px; padding: 0 10px; color: var(--muted); background: transparent; }
.home-text-action:hover { color: var(--st-err); background: var(--st-err-soft); }

.home-works-toolbar {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) 150px 150px;
    gap: 10px;
    margin-top: 14px;
}

.home-work-search {
    min-width: 0;
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 0 11px;
    color: var(--muted);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 7px;
}
.home-work-search:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.home-work-search input { min-width: 0; flex: 1; padding: 0; border: 0; outline: 0; color: var(--text); background: transparent; font: inherit; font-size: 13px; }
.home-work-search input::placeholder { color: var(--muted); }
.home-work-search button { display: none; width: 26px; height: 26px; border: 0; border-radius: 5px; color: var(--muted); background: var(--card-2); cursor: pointer; font-size: 18px; }
.home-work-search.has-value button { display: inline-flex; align-items: center; justify-content: center; }
.home-work-select { min-width: 0; min-height: 40px; padding: 0 10px; color: var(--text-sub); background: var(--card); border: 1px solid var(--border); border-radius: 7px; font: inherit; font-size: 13px; }
.home-work-select:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.home-results-count { color: var(--muted); font-size: 12px; white-space: nowrap; }

.home-work-card:focus-visible,
.home-action-card:focus-visible,
.home-works-tab:focus-visible,
button:focus-visible {
    outline: 3px solid var(--brand-soft);
    outline-offset: 2px;
}

.home-work-empty-state { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 58px 20px; text-align: center; color: var(--muted); }
.home-work-empty-state strong { color: var(--text); font-size: 16px; }
.home-work-empty-state p { max-width: 460px; font-size: 13px; line-height: 1.6; }
.home-empty-action { margin-top: 8px; min-height: 36px; padding: 0 14px; color: #fff; background: var(--brand); border: 0; border-radius: 7px; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.home-work-card[aria-busy="true"] { opacity: .7; pointer-events: none; }
.home-cta-button:disabled { opacity: .72; cursor: wait; transform: none; }
.home-submit-spinner { width: 15px; height: 15px; border: 2px solid rgba(255,255,255,.45); border-top-color: #fff; border-radius: 50%; animation: homeRefreshSpin .7s linear infinite; }
.home-stage-options-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px 18px; }
.home-chapter-scale-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }

.recycle-dialog { width: min(720px, 92vw); max-height: min(720px, 86vh); display: flex; flex-direction: column; overflow: hidden; background: var(--card); border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 24px 70px rgba(15, 23, 42, .28); }
.recycle-dialog-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid var(--border); }
.recycle-dialog-head h2 { margin-top: 3px; color: var(--text); font-size: 20px; letter-spacing: 0; }
.recycle-dialog-list { min-height: 160px; padding: 10px 20px 20px; overflow-y: auto; }
.recycle-item { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--border); }
.recycle-item:last-child { border-bottom: 0; }
/* 封面缩略图：与首页书架同款绿底兜底，比例 2:3 的小书脊 */
.recycle-item-cover { position: relative; flex: 0 0 auto; width: 52px; height: 74px; border-radius: 4px; overflow: hidden; background: #294c3f; color: #f4f1de; box-shadow: 0 1px 4px rgba(0,0,0,.18); align-self: center; }
.recycle-item-cover::after { content: ''; position: absolute; inset: 0; border: 1px solid #ffffff15; border-left: 3px solid #ffffff0b; pointer-events: none; border-radius: inherit; }
.recycle-cover-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.recycle-cover-fallback { display: flex; align-items: center; justify-content: center; height: 100%; padding: 6px; box-sizing: border-box; font-family: 'Songti SC', SimSun, serif; font-size: 12px; line-height: 1.4; text-align: center; overflow: hidden; overflow-wrap: anywhere; }
.recycle-item-body { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; gap: 4px; }
.recycle-item-meta { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.recycle-item-meta strong { overflow: hidden; color: var(--text); font-size: 14px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.recycle-item-meta span { color: var(--muted); font-size: 12px; }
.recycle-item-subtitle { display: flex; flex-wrap: wrap; gap: 6px 10px; color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.recycle-item-actions { flex: 0 0 auto; display: flex; gap: 8px; }
.recycle-dialog-head-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.recycle-clear-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--border); border-radius: 6px; background: transparent; color: var(--muted); font-size: 12px; cursor: pointer; transition: color .16s, border-color .16s, background-color .16s; }
.recycle-clear-btn:hover:not(:disabled) { color: #ae5d50; border-color: #ae5d50; background: color-mix(in srgb, #ae5d50 8%, transparent); }
.recycle-clear-btn:disabled { opacity: .45; cursor: not-allowed; }
[data-theme="dark"] .recycle-clear-btn:hover:not(:disabled) { color: #eca99a; border-color: #eca99a; background: color-mix(in srgb, #eca99a 12%, transparent); }

@media (max-width: 900px) {
    .home-workspace-hero { grid-template-columns: 1fr; padding: 22px; }
    .home-works-toolbar { grid-template-columns: minmax(0, 1fr) 145px; }
    .home-work-search { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
    .navbar.navbar-fixed { height: 56px; padding: 0 10px; }
    .navbar-brand { gap: 7px; font-size: 14px; width: auto; }
    .navbar-brand .navbar-logo-full { height: 28px; max-width: 112px; }
    .navbar-brand .navbar-logo-full.is-fallback { height: 28px; width: 28px; }
    .navbar.navbar-fixed .navbar-nav { margin-left: 8px; }
    .navbar-item { padding: 7px 9px; font-size: 13px; }
    .navbar-user { gap: 4px; }
    .navbar-user-btns { gap: 3px; }
    .navbar-user-btns .navbar-icon-btn { display: none; }
    .navbar-user-card { display: none; }
    .theme-toggle-btn { width: 32px; height: 32px; }
    html, body { max-width: 100%; overflow-x: clip; }
    .container, .view { width: 100% !important; max-width: 100% !important; margin: 0 !important; }
    .container { padding-top: 56px; }
    .view { min-height: calc(100vh - 56px); }
    #home-shell { min-height: calc(100vh - 56px); }
    .home-left-nav { padding: 8px 10px; }
    #home-shell { width: 100% !important; overflow-x: clip !important; }
    .home-right-main, .home-workspace-hero, .home-workspace-copy, .home-summary-grid, .home-works-section, .home-works-toolbar, .home-works-grid { min-width: 0 !important; max-width: 100% !important; box-sizing: border-box; }
    .home-right-main { width: 100% !important; flex: 0 0 100% !important; padding: 14px !important; overflow: hidden !important; }
    .home-right-main > * { width: 100%; max-width: 100%; box-sizing: border-box; }
    .home-workspace-copy { width: 100% !important; min-width: 0 !important; overflow: visible !important; }
    .home-workspace-copy p { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; overflow: visible !important; white-space: normal !important; text-overflow: clip !important; overflow-wrap: anywhere !important; word-break: break-word !important; }
    .home-workspace-hero { padding: 19px 16px; gap: 20px; }
    .home-workspace-copy h2 { font-size: 22px; }
    .home-summary-grid { grid-template-columns: 1fr !important; }
    .home-summary-item { min-width: 0; min-height: 78px; padding: 12px; }
    .home-summary-item strong { font-size: 21px; }
    .home-works-toolbar { grid-template-columns: 1fr; }
    .home-work-search { grid-column: auto; }
    .home-works-header { align-items: flex-start; gap: 8px; }
    .home-works-tabs { max-width: 100%; margin-left: 0 !important; overflow-x: auto; padding-bottom: 3px; }
    .home-works-tab { flex: 0 0 auto; white-space: nowrap; }
    .home-results-count { display: none; }
    .recycle-item { flex-wrap: wrap; align-items: flex-start; }
    .recycle-item-body { flex: 1 1 auto; min-width: 0; }
    .recycle-item-actions { flex: 1 1 100%; width: 100%; margin-top: 2px; }
    .recycle-item-actions .btn { flex: 1; justify-content: center; }
    .home-works-pager { position: static !important; width: 100%; margin-top: 10px; padding: 10px 4px calc(10px + env(safe-area-inset-bottom)); box-shadow: none !important; }
}

@media (max-width: 420px) {
    .home-summary-grid { grid-template-columns: 1fr; }
    .home-workspace-copy { width: 100% !important; max-width: calc(100vw - 60px) !important; overflow: visible !important; }
    .home-workspace-copy p { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; overflow: visible !important; white-space: normal !important; text-overflow: clip !important; overflow-wrap: anywhere !important; word-break: break-word !important; line-height: 1.7; }
    .writer-empty-tip { padding-left: 16px !important; padding-right: 16px !important; font-size: 13px; line-height: 1.8; }
    .writer-empty-tip h3 { font-size: 17px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* 作品详情 / 编辑器 */
.writer-unified-toolbar { height: 60px !important; min-height: 60px; gap: 8px !important; padding: 7px 12px !important; background: var(--card) !important; }
.writer-toolbar-identity { width: clamp(240px, 24vw, 360px); min-width: 0; flex: 0 1 360px; display: flex; align-items: center; gap: 9px; }
.writer-back-btn { width: 34px; height: 34px; flex: 0 0 34px; border: 1px solid var(--border); border-radius: 7px; color: var(--text-sub); background: var(--card-2); font-size: 23px; line-height: 1; cursor: pointer; }
.writer-back-btn:hover { color: var(--brand); border-color: var(--brand); }
.writer-work-identity { min-width: 0; flex: 1; }
.writer-work-title-row { display: flex; align-items: center; gap: 7px; min-width: 0; }
.writer-work-title-row h1 { min-width: 0; overflow: hidden; color: var(--text); font-size: 14px; line-height: 1.25; letter-spacing: 0; text-align: left; text-overflow: ellipsis; white-space: nowrap; margin: 0; }
.writer-work-status { flex: 0 0 auto; padding: 2px 6px; border-radius: 5px; color: var(--muted); background: var(--card-2); font-size: 9px; font-weight: 700; }
.writer-work-status.running { color: var(--st-run); background: var(--st-run-soft); }
.writer-work-status.done { color: var(--st-ok); background: var(--st-ok-soft); }
.writer-work-status.paused { color: var(--st-pause); background: var(--st-pause-soft); }
.writer-work-status.error { color: var(--st-err); background: var(--st-err-soft); }
.writer-work-meta { display: flex; gap: 9px; margin-top: 3px; color: var(--muted); font-size: 9.5px; white-space: nowrap; }
.writer-save-state::before { content: ''; display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: var(--muted); vertical-align: 1px; }
.writer-save-state.dirty { color: var(--st-run); }
.writer-save-state.dirty::before { background: var(--st-run); }
.writer-save-state.saved { color: var(--st-ok); }
.writer-save-state.saved::before { background: var(--st-ok); }
.writer-save-state.readonly { color: var(--muted); }.writer-save-state.readonly::before{background:var(--muted)}
.writer-toolbar-actions { margin-left: auto; flex: 0 0 auto; display: flex; align-items: center; gap: 5px; }
.writer-edit-btn { color: var(--brand) !important; background: var(--brand-soft) !important; border-color: color-mix(in srgb, var(--brand) 28%, transparent) !important; }
.writer-save-btn { color: #fff !important; background: var(--st-ok) !important; border-color: var(--st-ok) !important; }
.writer-copy-btn { color: var(--text-sub) !important; background: var(--card-2) !important; border-color: var(--border) !important; }
#writerMobileChapterBtn, .writer-sidebar-close, .writer-mobile-tools-btn, .writer-mobile-scrim, .writer-mobile-actions-btn { display: none; }

.writer-body { position: relative; height: calc(100dvh - 120px) !important; min-height: 520px !important; }
.writer-center, .writer-center-scroll, .writer-paper, .writer-empty-tip { min-width: 0; max-width: 100%; }
.writer-center { min-height: 0; }
.writer-empty-tip { width: 100%; overflow-wrap: anywhere; }
.writer-pop-panel { top: 60px !important; }
/* 阅读背景与应用主题解耦：reading-* 只作用于正文区域。 */
.writer-center.reading-paper, .writer-body.reading-paper, .writer-center.reading-paper .writer-paper { background: #f0ece3 !important; }
.writer-center.reading-paper .writer-prose { color: #333 !important; }
.writer-center.reading-paper .writer-chapter-title { color: #263238 !important; border-color: #d6c49e !important; }
.writer-center.reading-paper .writer-empty-tip { color: #9a8d6d !important; }
.writer-center.reading-paper .writer-center-footer { color: #6b5a3c !important; background: rgba(251,246,234,.96) !important; border-color: #e6d9ba !important; }
.writer-center.reading-white, .writer-body.reading-white, .writer-center.reading-white .writer-paper { background: #fff !important; }
.writer-center.reading-white .writer-prose { color: #27272a !important; }
.writer-center.reading-white .writer-chapter-title { color: #20242a !important; border-color: #d4d4d8 !important; }
.writer-center.reading-white .writer-empty-tip { color: #71717a !important; }
.writer-center.reading-white .writer-center-footer { color: #52525b !important; background: rgba(255,255,255,.96) !important; border-color: #e4e4e7 !important; }
.writer-center.reading-green, .writer-body.reading-green, .writer-center.reading-green .writer-paper { background: #dcefe0 !important; }
.writer-center.reading-green .writer-prose { color: #243b29 !important; }
.writer-center.reading-green .writer-chapter-title { color: #18301e !important; border-color: #9bc5a3 !important; }
.writer-center.reading-green .writer-empty-tip { color: #50705a !important; }
.writer-center.reading-green .writer-center-footer { color: #31543a !important; background: rgba(220,239,224,.96) !important; border-color: #a8cdb0 !important; }
.writer-center.reading-dark, .writer-body.reading-dark, .writer-center.reading-dark .writer-paper { background: #22252b !important; }
.writer-center.reading-dark .writer-prose, .writer-center.reading-dark .writer-prose p { color: #d6d8dd !important; }
.writer-center.reading-dark .writer-chapter-title { color: #f0f1f3 !important; border-color: #4b505a !important; }
.writer-center.reading-dark .writer-empty-tip, .writer-center.reading-dark .writer-empty-tip h3 { color: #969ca7 !important; }
.writer-center.reading-dark .writer-center-footer { color: #b4bac4 !important; background: rgba(34,37,43,.96) !important; border-color: #434852 !important; }
.writer-center.reading-dark .writer-footer-plan, .writer-center.reading-dark .writer-footer-words { color: #b4bac4 !important; }
.writer-center.reading-dark mark.writer-search-hit { color: #ffe58f !important; background: #59531c !important; }
.writer-bg-auto-preview { display: grid !important; grid-template-columns: 1fr 1fr; overflow: hidden; padding: 0 !important; }
.writer-bg-auto-preview span:first-child { background: #fbf6ea; }
.writer-bg-auto-preview span:last-child { background: #22252b; }
.writer-center.is-loading .writer-paper { opacity: .46; pointer-events: none; }
.writer-center.is-loading::after { content: '正在加载章节…'; position: absolute; left: 50%; top: 50%; z-index: 4; transform: translate(-50%, -50%); padding: 9px 14px; color: var(--text); background: var(--card); border: 1px solid var(--border); border-radius: 7px; box-shadow: var(--shadow-md); font-size: 12px; font-weight: 700; }
.writer-sl-title-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.writer-sl-title-row > div { display: flex; align-items: baseline; gap: 8px; }
.writer-sl-title-row strong { color: var(--text); font-size: 14px; }
.writer-sl-title-row span { color: var(--muted); font-size: 11px; }
.writer-sl-filter label { margin: 0; color: var(--muted); font-size: 11px; }
.writer-sl-footer { color: var(--muted); font-size: 11px; text-align: center; }
.writer-sl-list .chapter-item { min-height: 54px; display: flex; align-items: center; gap: 9px; padding: 8px 9px !important; border-left: 0 !important; border: 1px solid transparent; }
.writer-sl-list .chapter-item.active { border-color: color-mix(in srgb, var(--brand) 35%, transparent); }
.chapter-index { width: 25px; flex: 0 0 25px; color: var(--muted); font-size: 10.5px; font-variant-numeric: tabular-nums; text-align: center; }
.chapter-item-main { min-width: 0; flex: 1; }
.writer-sl-list .chapter-item .chapter-name { overflow: hidden; margin: 0 0 3px !important; text-overflow: ellipsis; white-space: nowrap; }
.chapter-state-dot { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: var(--st-ok); }
.chapter-state-dot.draft { background: var(--st-pause); }
.writer-chapter-nav-btn { min-height: 28px; padding: 0 9px; border: 1px solid var(--border); border-radius: 6px; color: var(--text-sub); background: transparent; font: inherit; font-size: 11px; cursor: pointer; }
.writer-chapter-nav-btn:hover:not(:disabled) { color: var(--brand); border-color: var(--brand); }
.writer-chapter-nav-btn:disabled { opacity: .38; cursor: default; }
.writer-chapter-position { color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.writer-geninfo-panel { top: 0 !important; right: 68px !important; bottom: 0 !important; width: min(420px, calc(100% - 348px)) !important; max-width: 420px !important; max-height: none !important; border: 0 !important; border-left: 1px solid var(--border) !important; border-radius: 0 !important; background: var(--card) !important; box-shadow: -12px 0 32px rgba(15,23,42,.12) !important; }
.writer-content-panel .characters-grid { grid-template-columns: 1fr; max-height: none; }

.writer-sidebar-right { width: 68px !important; flex: 0 0 68px !important; min-height: 0; gap: 5px !important; padding: 12px 7px !important; overflow-y: auto; overflow-x: hidden; background: var(--card) !important; border-color: var(--border) !important; scrollbar-width: thin; }
.writer-tools-caption { width: 100%; margin: 2px 0 3px; color: var(--muted); font-size: 9px; font-weight: 700; text-align: center; }
.writer-sr-item { width: 52px !important; height: 54px !important; gap: 4px !important; border-radius: 7px !important; color: var(--muted) !important; }
.writer-sr-item:hover { color: var(--text) !important; background: var(--card-2) !important; border-color: var(--border) !important; }
.writer-sr-item.active { color: var(--brand) !important; background: var(--brand-soft) !important; border-color: color-mix(in srgb, var(--brand) 38%, transparent) !important; box-shadow: inset 3px 0 0 var(--brand); }
.writer-sr-item .sr-icon { width: 25px; height: 23px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid currentColor; border-radius: 5px; font-size: 11px; font-weight: 800; }
.writer-sr-item .sr-label { font-size: 10px !important; font-weight: 700 !important; }
.writer-sr-divider { width: 38px !important; margin: 6px 0 !important; background: var(--border) !important; }
.writer-tool-live-dot { display: none; position: absolute; top: 8px; right: 8px; width: 7px; height: 7px; border: 2px solid var(--card); border-radius: 50%; background: var(--st-run); }
.writer-tool-live-dot.active { display: block; animation: toolLivePulse 1.6s ease-in-out infinite; }
@keyframes toolLivePulse { 50% { opacity: .45; transform: scale(.82); } }

.writer-geninfo-head { min-height: 78px; align-items: flex-start !important; padding: 15px 17px !important; background: var(--card) !important; border-color: var(--border) !important; }
.writer-panel-kicker { margin-bottom: 2px; color: var(--brand); font-size: 10px; font-weight: 800; }
.writer-geninfo-title { color: var(--text) !important; font-size: 16px !important; letter-spacing: 0; }
.writer-panel-subtitle { margin-top: 3px; color: var(--muted); font-size: 11px; }
.writer-panel-head-actions { display: flex; align-items: center; gap: 6px; }
.writer-panel-refresh, .writer-geninfo-close { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border) !important; border-radius: 6px; color: var(--muted) !important; background: var(--card-2) !important; cursor: pointer; }
.writer-panel-refresh:hover, .writer-geninfo-close:hover { color: var(--brand) !important; border-color: var(--brand) !important; }
.writer-panel-refresh.is-loading { animation: homeRefreshSpin .65s linear infinite; }
.writer-geninfo-body { padding: 16px !important; background: var(--card); }

.writer-tool-summary { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 7px; margin-bottom: 17px; }
.writer-tool-summary > div { min-width: 0; padding: 10px; background: var(--card-2); border: 1px solid var(--border); border-radius: 7px; }
.writer-tool-summary span { display: block; overflow: hidden; margin-bottom: 5px; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.writer-tool-summary strong { display: block; overflow: hidden; color: var(--text); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.writer-tool-section { margin-top: 18px; }
.writer-tool-section h3 { margin: 0 0 9px; color: var(--text); font-size: 12px; letter-spacing: 0; }
.writer-tool-section > p { color: var(--text-sub); font-size: 12px; line-height: 1.7; }
.writer-tool-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.writer-tool-tags span { padding: 4px 7px; color: var(--brand); background: var(--brand-soft); border-radius: 5px; font-size: 10.5px; }
.writer-tool-timeline { display: flex; flex-direction: column; }
.writer-tool-timeline article { display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 9px; position: relative; padding-bottom: 16px; }
.writer-tool-timeline article:not(:last-child)::before { content: ''; position: absolute; left: 11px; top: 24px; bottom: 0; width: 1px; background: var(--border); }
.writer-tool-step { width: 23px; height: 23px; z-index: 1; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--brand); border-radius: 50%; font-size: 9px; font-weight: 800; }
.writer-tool-stage-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.writer-tool-stage-head strong { color: var(--text); font-size: 12px; }
.writer-tool-stage-head span { color: var(--muted); font-size: 10px; }
.writer-tool-timeline p { margin-top: 4px; color: var(--text-sub); font-size: 11.5px; line-height: 1.65; }
.writer-tool-character-list { display:flex; flex-direction:column; gap:10px; }
.writer-tool-character-list .writer-character-card { display:block; min-width:0; padding:14px; background:var(--card-2); border:1px solid var(--border); border-radius:8px; box-shadow:none; }
.writer-character-card-head { display:flex; align-items:center; gap:10px; min-width:0; margin-bottom:12px; }
.writer-tool-avatar { width:38px; height:38px; flex:0 0 38px; display:flex; align-items:center; justify-content:center; color:#fff; background:var(--brand); border-radius:7px; font-size:14px; font-weight:750; }
.writer-character-identity { min-width:0; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.writer-character-identity strong { max-width:100%; overflow:hidden; color:var(--text); font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.writer-character-identity span { padding:2px 6px; color:var(--brand); background:var(--brand-soft); border-radius:4px; font-size:9px; font-weight:650; }
.writer-character-editor { display:grid; grid-template-columns:minmax(0,1fr); gap:7px; margin-bottom:11px; }
.writer-character-editor select,.writer-character-editor input { width:100%; min-width:0; height:34px; padding:0 9px; border:1px solid var(--border); border-radius:6px; color:var(--text); background:var(--input-bg); font:inherit; font-size:11px; }
.writer-character-editor input[hidden] { display:none !important; }
.writer-character-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.writer-character-actions button { min-width:0; height:32px; border-radius:6px; font:inherit; font-size:10.5px; font-weight:650; cursor:pointer; }
.writer-character-save { color:#fff; background:var(--brand); border:1px solid var(--brand); }
.writer-character-generate { color:var(--text-sub); background:var(--card); border:1px solid var(--border); }
.writer-character-actions button:hover { filter:brightness(.98); border-color:var(--brand); }
.writer-character-desc { display:-webkit-box; overflow:hidden; margin:0 0 11px; color:var(--text-sub); font-size:11px; line-height:1.65; -webkit-box-orient:vertical; -webkit-line-clamp:4; }
.writer-character-meta { display:flex; flex-wrap:wrap; gap:5px; padding-top:9px; border-top:1px solid var(--border-soft); }
.writer-character-meta span { max-width:100%; overflow:hidden; padding:3px 6px; color:var(--muted); background:var(--card); border:1px solid var(--border-soft); border-radius:4px; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.writer-tool-note { margin-bottom:12px; padding:10px 11px; color:var(--text-sub); background:var(--brand-soft); border-left:2px solid var(--brand); border-radius:6px; font-size:10.5px; line-height:1.55; }
.writer-tool-setting-list { display: flex; flex-direction: column; gap: 7px; }
.writer-tool-setting-list details { overflow:visible; min-width:0; border:1px solid var(--border); border-radius:7px; background:var(--card-2); }
.writer-tool-setting-list details[open] { overflow:visible; }
.writer-tool-setting-list summary { display:flex; align-items:center; justify-content:space-between; min-height:42px; padding:10px 12px; color:var(--text); cursor:pointer; font-size:12px; font-weight:700; list-style:none; }
.writer-tool-setting-list details[open] summary { border-bottom:1px solid var(--border-soft); }
.writer-tool-setting-list summary::-webkit-details-marker { display: none; }
.writer-tool-setting-list details[open] summary b { transform: rotate(45deg); }
.writer-tool-setting-list summary b { color: var(--muted); transition: transform .15s; }
.writer-tool-setting-list pre { max-height:none; overflow:visible; margin:0; padding:0 12px 14px; color:var(--text-sub); font:11px/1.72 inherit; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; }
.writer-tool-empty { min-height: 280px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30px; text-align: center; }
.writer-tool-empty-icon { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; margin-bottom: 11px; color: var(--muted); background: var(--card-2); border: 1px solid var(--border); border-radius: 50%; }
.writer-tool-empty strong { color: var(--text); font-size: 13px; }
.writer-tool-empty p { max-width: 250px; margin-top: 6px; color: var(--muted); font-size: 11px; line-height: 1.65; }
.writer-mobile-tools-btn { position: fixed; right: 14px; bottom: 14px; z-index: 165; min-width: 50px; height: 40px; border: 0; border-radius: 7px; color: #fff; background: var(--brand); font: inherit; font-size: 12px; font-weight: 700; box-shadow: var(--shadow-brand); }

[data-theme="dark"] .writer-unified-toolbar { background: var(--card) !important; border-color: var(--border); }
[data-theme="dark"] .writer-back-btn { color: var(--text-sub); background: var(--card-2); border-color: var(--border); }

@media (max-width: 1180px) {
    .writer-toolbar-identity { width: 220px; flex-basis: 220px; }
    .writer-secondary-tools { display: none; }
}

@media (max-width: 1024px) {
    #writerMobileChapterBtn { display: inline-flex; align-items: center; }
    .writer-sidebar-left { position: absolute; inset: 0 auto 0 0; z-index: 180; width: min(330px, 86vw) !important; transform: translateX(-102%); box-shadow: 10px 0 28px rgba(15,23,42,.18); transition: transform .22s ease; }
    .writer-sidebar-close { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 0; border-radius: 5px; color: var(--muted); background: var(--card-2); font-size: 19px; cursor: pointer; }
    .writer-shell.chapter-drawer-open .writer-sidebar-left { transform: translateX(0); }
    .writer-mobile-scrim { position: absolute; inset: 0; z-index: 170; background: rgba(15,23,42,.36); }
    .writer-shell.chapter-drawer-open .writer-mobile-scrim, .writer-shell.tools-drawer-open .writer-mobile-scrim { display: block; }
    .writer-copy-btn { display: none !important; }
}

@media (max-width: 700px) {
    .writer-unified-toolbar { height: 58px !important; min-height: 58px; padding: 6px 8px !important; overflow-x: auto; scrollbar-width: none; }
    .writer-unified-toolbar::-webkit-scrollbar { display: none; }
    .writer-toolbar-identity { position: sticky; left: 0; z-index: 2; width: 160px; flex: 0 0 160px; padding-right: 7px; background: var(--card); }
    .writer-back-btn { width: 32px; height: 32px; flex-basis: 32px; }
    .writer-work-title-row h1 { max-width: 90px; font-size: 12px; }
    .writer-work-status { display: none; }
    .writer-work-meta span:not(.writer-save-state) { display: none; }
    .writer-work-meta { margin-top: 2px; font-size: 9px; }
    .writer-unified-toolbar .writer-tb-divider { display: none; }
    .writer-tb-group { flex: 0 0 auto; }
    .writer-tb-btn { height: 31px; padding: 0 7px; font-size: 10.5px; }
    .writer-tb-btn span:not(:first-child) { display: none; }
    #writerTopPauseLabel, #writerTopEditModeLabel { display: none !important; }
    .writer-task-control { display: none; }
    .writer-mobile-actions-btn { display: inline-flex; width: 32px; height: 32px; flex: 0 0 32px; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 6px; color: var(--text-sub); background: var(--card-2); font-weight: 800; }
    .writer-toolbar-actions { display: none; margin-left: 0; }
    .writer-publish-btn { display: inline-flex; width: 32px; min-width: 32px; padding: 0; overflow: hidden; color: transparent; }
    .writer-publish-btn::before { margin: 0 auto; color: #fff; }
    .writer-body { height: calc(100dvh - 118px) !important; min-height: 0 !important; }
    .writer-sidebar-right { position: absolute; left: 0; right: 0; bottom: 0; top: auto; z-index: 180; width: 100% !important; height: 74px; padding: 7px 10px !important; flex: 0 0 74px !important; flex-direction: row; justify-content: flex-start; overflow-x: auto; overflow-y: hidden; border: 1px solid var(--border); transform: translateY(105%); transition: transform .22s ease; }
    .writer-sidebar-right .writer-tools-caption, .writer-sidebar-right .writer-sr-divider { display: none; }
    .writer-sidebar-right .writer-sr-item { width: 58px !important; height: 58px !important; }
    .writer-sidebar-right .writer-sr-item.active { box-shadow: inset 0 -3px 0 var(--brand); }
    .writer-shell.tools-drawer-open .writer-sidebar-right { transform: translateY(0); }
    .writer-mobile-tools-btn { display: block; }
    .writer-geninfo-panel { right: 0 !important; width: 100% !important; max-width: 100% !important; z-index: 190 !important; }
    .writer-paper { padding: 34px 20px 100px !important; }
    .writer-chapter-title { margin-bottom: 24px; padding-bottom: 15px; font-size: 22px; }
    .writer-prose { font-size: 17px; line-height: 1.9; letter-spacing: 0; }
    .writer-center-footer { height: auto !important; min-height: 46px; padding: 7px 10px !important; gap: 8px; }
    .writer-footer-left { gap: 6px; }
    .writer-footer-right { display: none !important; }
    .writer-gen-panel { display: none !important; }
    .writer-search-panel { left: 10px !important; right: 10px !important; width: auto !important; }
}

/* ===== 作品卡片装饰图案和视觉增强 ===== */

/* 卡片装饰性背景图案 - 更丰富的几何图案 */
.home-work-card::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 140px;
    height: 140px;
    background:
        radial-gradient(circle at 30% 30%, rgba(99, 102, 241, 0.08) 0%, transparent 60%),
        linear-gradient(135deg, transparent 30%, rgba(139, 92, 246, 0.05) 50%, transparent 70%);
    pointer-events: none;
    opacity: 0.6;
    transition: opacity 0.3s ease;
}

/* 添加装饰性点状图案 */
.home-work-card::after {
    content: '';
    position: absolute;
    bottom: 16px;
    left: 16px;
    width: 60px;
    height: 60px;
    background-image:
        radial-gradient(circle, rgba(99, 102, 241, 0.15) 1px, transparent 1px);
    background-size: 8px 8px;
    pointer-events: none;
    opacity: 0.3;
    transition: opacity 0.3s ease;
}

.home-work-card:hover::before {
    opacity: 1;
}

.home-work-card:hover::after {
    opacity: 0.5;
}

/* 状态相关的装饰图案 - 覆盖之前的after选择器 */
.home-work-card[data-status="running"]::before {
    background:
        radial-gradient(circle at 30% 30%, rgba(255, 157, 92, 0.12) 0%, transparent 60%),
        linear-gradient(135deg, transparent 30%, rgba(255, 207, 143, 0.08) 50%, transparent 70%);
}

.home-work-card[data-status="running"] .status-badge-icon {
    content: '';
    position: absolute;
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
    background:
        radial-gradient(circle, rgba(255, 157, 92, 0.2) 0%, rgba(255, 157, 92, 0.05) 70%, transparent 100%);
    border-radius: 50%;
    animation: statusPulseRing 2s ease-in-out infinite;
    pointer-events: none;
}

@keyframes statusPulseRing {
    0%, 100% { transform: scale(1); opacity: 0.6; }
    50% { transform: scale(1.3); opacity: 0.2; }
}

.home-work-card[data-status="done"]::before {
    background:
        radial-gradient(circle at 30% 30%, rgba(52, 211, 153, 0.1) 0%, transparent 60%),
        linear-gradient(135deg, transparent 30%, rgba(16, 185, 129, 0.06) 50%, transparent 70%);
}

.home-work-card[data-status="done"] .card-complete-badge {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    background: linear-gradient(135deg, rgba(52, 211, 153, 0.15) 0%, rgba(16, 185, 129, 0.1) 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--st-ok);
    font-size: 18px;
    font-weight: 700;
    pointer-events: none;
    opacity: 0.8;
    box-shadow: 0 2px 8px rgba(52, 211, 153, 0.2);
}

.home-work-card[data-status="done"] .card-complete-badge::before {
    content: '✓';
}

.home-work-card[data-status="error"]::before {
    background:
        radial-gradient(circle at 30% 30%, rgba(255, 107, 129, 0.12) 0%, transparent 60%),
        linear-gradient(135deg, transparent 30%, rgba(239, 68, 68, 0.08) 50%, transparent 70%);
}

.home-work-card[data-status="error"] .card-error-badge {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    background: linear-gradient(135deg, rgba(255, 107, 129, 0.18) 0%, rgba(239, 68, 68, 0.12) 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--st-err);
    font-size: 20px;
    font-weight: 700;
    pointer-events: none;
    box-shadow: 0 2px 8px rgba(255, 107, 129, 0.25);
    animation: errorShake 0.5s ease-in-out;
}

.home-work-card[data-status="error"] .card-error-badge::before {
    content: '!';
}

@keyframes errorShake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    75% { transform: translateX(4px); }
}

.home-work-card[data-status="paused"]::before {
    background:
        radial-gradient(circle at 30% 30%, rgba(167, 139, 250, 0.1) 0%, transparent 60%),
        linear-gradient(135deg, transparent 30%, rgba(139, 92, 246, 0.06) 50%, transparent 70%);
}

/* 卡片标题增强 */
.home-work-card .card-title {
    position: relative;
    z-index: 1;
}

/* 进度条视觉增强 */
.home-work-card .progress-wrap {
    background: linear-gradient(90deg,
        rgba(var(--card-2-rgb, 248, 249, 250), 1) 0%,
        rgba(var(--card-2-rgb, 248, 249, 250), 0.5) 100%);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
}

.home-work-card .progress-inner {
    position: relative;
    overflow: hidden;
}

.home-work-card .progress-inner::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.3) 50%,
        transparent 100%);
    animation: progressShine 2s ease-in-out infinite;
}

@keyframes progressShine {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(200%); }
}

/* 运行状态的脉冲动画 */
.home-work-card[data-status="running"] .status-line {
    animation: statusPulse 2s ease-in-out infinite;
}

@keyframes statusPulse {
    0%, 100% { opacity: 1; transform: scaleY(1); }
    50% { opacity: 0.7; transform: scaleY(0.8); }
}


/* ===== 大纲显示优化 ===== */

.outline-box {
    background: linear-gradient(135deg, #fafbfc 0%, #f5f7fa 100%);
    padding: 20px;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* 大纲标题样式 */
.outline-box h3 {
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e2e8f0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.outline-box h3::before {
    content: '📋';
    font-size: 22px;
}

.outline-box h4 {
    font-size: 15px;
    font-weight: 600;
    color: #475569;
    margin: 18px 0 10px;
    padding-left: 12px;
    border-left: 3px solid #6366f1;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* 剧情大纲阶段卡片 */
.outline-stage {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 14px 16px;
    margin-bottom: 12px;
    transition: all 0.2s ease;
}

.outline-stage:hover {
    border-color: #6366f1;
    box-shadow: 0 2px 8px rgba(99, 102, 241, 0.1);
    transform: translateX(2px);
}

.outline-stage-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.outline-stage-number {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 12px;
    min-width: 60px;
    text-align: center;
}

.outline-stage-title {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    flex: 1;
}

.outline-stage-chapters {
    font-size: 12px;
    color: #64748b;
    background: #f1f5f9;
    padding: 3px 8px;
    border-radius: 6px;
}

.outline-stage-body {
    font-size: 13px;
    line-height: 1.6;
    color: #475569;
    padding-left: 12px;
}

/* 大纲列表样式 */
.outline-box ul {
    list-style: none;
    padding-left: 0;
    margin: 8px 0;
}

.outline-box li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 8px;
    line-height: 1.6;
    color: #475569;
}

.outline-box li::before {
    content: '▸';
    position: absolute;
    left: 6px;
    color: #6366f1;
    font-weight: 700;
}

.outline-box strong {
    color: #1e293b;
    font-weight: 600;
}


/* 角色网格容器 - 固定高度和滚动 */
.characters-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
    max-height: 70vh;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 8px;
}

/* 角色网格滚动条样式 */
.characters-grid::-webkit-scrollbar {
    width: 8px;
}

.characters-grid::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}

.characters-grid::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    border-radius: 4px;
}

.characters-grid::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
}

/* 角色卡片优化 */

.character-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 18px;
    margin-bottom: 16px;
    transition: all 0.25s ease;
    position: relative;
    overflow: hidden;
}

.character-card::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100px;
    height: 100px;
    background: radial-gradient(circle at 30% 30%, rgba(99, 102, 241, 0.06) 0%, transparent 70%);
    pointer-events: none;
}

.character-card:hover {
    border-color: #6366f1;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.12);
    transform: translateY(-2px);
}

/* 角色卡片头部 */
.character-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid #f1f5f9;
}

.character-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 24px;
    font-weight: 700;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.25);
}

.character-name-group {
    flex: 1;
}

.character-name {
    font-size: 17px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 4px;
}

.character-role {
    font-size: 13px;
    color: #64748b;
    background: #f1f5f9;
    padding: 3px 10px;
    border-radius: 12px;
    display: inline-block;
}

/* 角色属性网格 */
.character-attrs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 12px;
}

.character-attr-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.character-attr-label {
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
}

.character-attr-value {
    font-size: 13px;
    color: #1e293b;
    font-weight: 600;
}

/* 角色描述 */
.character-desc {
    font-size: 13px;
    line-height: 1.6;
    color: #475569;
    padding: 12px;
    background: #f8fafc;
    border-radius: 8px;
    border-left: 3px solid #6366f1;
}

/* 角色标签 */
.character-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 12px;
}

.character-tag {
    font-size: 12px;
    padding: 4px 10px;
    background: #ede9fe;
    color: #6366f1;
    border-radius: 12px;
    font-weight: 500;
}


/* ===== 暗黑模式适配 ===== */

[data-theme="dark"] .outline-box {
    background: linear-gradient(135deg, #1e293b 0%, #1a2332 100%);
    border-color: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .outline-box h3,
[data-theme="dark"] .outline-box h4,
[data-theme="dark"] .outline-stage-title,
[data-theme="dark"] .character-name {
    color: #f1f5f9;
}

[data-theme="dark"] .outline-stage,
[data-theme="dark"] .character-card {
    background: #0f172a;
    border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .outline-stage:hover,
[data-theme="dark"] .character-card:hover {
    border-color: #6366f1;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.2);
}

[data-theme="dark"] .character-desc {
    background: #1e293b;
    color: #cbd5e1;
}

[data-theme="dark"] .character-role,
[data-theme="dark"] .outline-stage-chapters {
    background: #1e293b;
    color: #94a3b8;
}


/* 响应式优化 */
@media (max-width: 768px) {
    .character-attrs {
        grid-template-columns: 1fr;
    }

    .outline-stage-header {
        flex-wrap: wrap;
    }

    .home-work-card::before,
    .home-work-card[data-status="running"]::after {
        width: 80px;
        height: 80px;
    }

    .characters-grid,
    .outline-enhanced-container {
        max-height: 60vh;
    }
}

.gr-score.unavailable { color: var(--muted); }
.gr-review-unavailable { margin-top: 10px; padding: 10px 12px; color: var(--text-sub); background: var(--card-2); border: 1px solid var(--border); border-left: 3px solid var(--muted); border-radius: 6px; font-size: 12px; line-height: 1.6; }
.gr-radar { color: var(--text-sub); }.gr-meta-chip{padding:3px 6px;color:var(--muted);background:var(--card-2);border-radius:4px;font-size:9.5px}.gr-meta-chip.emphasis{color:var(--brand);background:var(--brand-soft)}
.pr-unlocated { margin-top: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 6px; background: var(--card-2); }.pr-unlocated summary{color:var(--st-run);font-size:10px;font-weight:700;cursor:pointer}.pr-unlocated>div{margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}.pr-unlocated strong,.pr-unlocated span{font-size:9.5px}.pr-unlocated span{margin-left:6px;color:var(--muted)}.pr-unlocated p{margin-top:4px;color:var(--text-sub);font-size:10px;line-height:1.5}

.navbar-account { display:flex;align-items:center;gap:9px;padding:5px 10px 5px 5px;border:1px solid var(--border);border-radius:9px;color:var(--text);background:var(--card);cursor:pointer; }
.navbar-account-avatar { width:42px;height:42px;display:grid;place-items:center;border-radius:8px;color:#fff;background:var(--brand);font-size:16px;font-weight:800; }
.navbar-account-copy { min-width:0;display:flex;flex-direction:column;align-items:flex-start;line-height:1.2; }.navbar-account-copy strong{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.navbar-account-copy small{color:var(--muted);font-size:9px}
.navbar-user { position: relative; }
.account-menu { position:fixed;top:54px;right:16px;z-index:500;width:248px;max-height:calc(100dvh - 76px);overflow-y:auto;box-sizing:border-box;padding:7px;background:var(--card);border:1px solid var(--border);border-radius:10px;box-shadow:0 16px 40px rgba(15,23,42,.18); }
.account-menu[hidden]{display:none}
.account-menu-user{display:flex;align-items:center;gap:10px;min-width:0;padding:8px 8px 10px}
.account-menu-avatar{flex:0 0 auto;width:36px;height:36px;display:grid;place-items:center;border-radius:8px;color:#fff;background:var(--brand);font-size:14px;font-weight:800}
.account-menu-identity{min-width:0;display:flex;flex-direction:column;gap:2px}
.account-menu-identity strong,.account-menu-identity span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-menu-identity strong{font-size:12.5px;color:var(--text)}
.account-menu-identity span{color:var(--muted);font-size:10px}
.account-menu-stats{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px;padding:2px 8px 9px;border-bottom:1px solid var(--border)}
.account-menu-stats>div{min-width:0;padding:7px 8px;border-radius:6px;background:var(--card-2)}
.account-menu-stats span{display:block;color:var(--muted);font-size:9px}
.account-menu-stats b{display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--brand);font-size:11px}
.account-menu-links{padding:4px 0}
.account-menu button{display:flex;align-items:center;gap:9px;width:100%;padding:8px 9px;border:0;border-radius:6px;color:var(--text-sub);background:transparent;text-align:left;font:inherit;font-size:12px;cursor:pointer}
.account-menu button:hover{background:var(--card-2);color:var(--text)}
.account-menu-item .ui-icon,.account-menu-logout .ui-icon{width:15px;height:15px;flex:0 0 auto;color:var(--muted)}
.account-menu-item:hover .ui-icon{color:var(--brand)}
.account-menu-logout{margin-top:3px;padding-top:4px;border-top:1px solid var(--border)}
.account-menu .logout{color:var(--st-err)}
.account-menu .logout .ui-icon{color:var(--st-err)}
.account-menu button:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.account-center-body{padding:18px;overflow-y:auto}.account-plan-card{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.account-plan-card>div{padding:12px;background:var(--card-2);border:1px solid var(--border);border-radius:7px}.account-plan-card span,.account-plan-card strong{display:block}.account-plan-card span{margin-bottom:5px;color:var(--muted);font-size:9.5px}.account-plan-card strong{color:var(--text);font-size:13px}.account-usage{margin-top:16px}.account-usage>div:first-child{display:flex;justify-content:space-between;color:var(--muted);font-size:10px}.account-usage b{color:var(--brand)}.account-usage-bar{height:7px;margin-top:8px;overflow:hidden;background:var(--card-2);border-radius:4px}.account-usage-bar i{display:block;height:100%;background:var(--brand)}.account-note{margin-top:18px;padding:12px;border-left:3px solid var(--brand);background:var(--brand-soft);border-radius:6px}.account-note strong{color:var(--text);font-size:11px}.account-note p{margin-top:5px;color:var(--text-sub);font-size:10px;line-height:1.6}
.writer-tool-count { display: none; position: absolute; top: 4px; right: 4px; min-width: 16px; height: 16px; padding: 0 4px; align-items: center; justify-content: center; color: #fff; background: var(--st-err); border: 2px solid var(--card); border-radius: 8px; font-size: 8px; font-weight: 800; }
.writer-tool-count.has-count { display: inline-flex; }
.writer-task-config-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
.writer-task-config-list > div { min-width: 0; padding: 8px 9px; background: var(--card-2); border: 1px solid var(--border); border-radius: 6px; }
.writer-task-config-list span { display: block; margin-bottom: 3px; color: var(--muted); font-size: 9px; }
.writer-task-config-list strong { color: var(--text-sub); font-size: 11px; }
.writer-model-routing { display: flex; flex-wrap: wrap; gap: 6px; }
.writer-model-routing > span { display: inline-flex; align-items: center; gap: 5px; padding: 5px 7px; color: var(--brand); background: var(--brand-soft); border-radius: 5px; font-size: 9.5px; }
.writer-model-routing b { color: var(--text-sub); font-weight: 700; }
.writer-continuity-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
.writer-continuity-stats span { padding: 7px; color: var(--muted); background: var(--card-2); border-radius: 5px; font-size: 9.5px; }
.writer-continuity-stats b { color: var(--text); }
.writer-task-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.writer-task-actions button { min-height: 34px; padding: 6px; border: 1px solid var(--border); border-radius: 6px; color: var(--text-sub); background: var(--card-2); font-size: 9.5px; cursor: pointer; }
.writer-task-actions button:hover { color: var(--brand); border-color: var(--brand); }.writer-task-actions button.danger:hover{color:var(--st-err);border-color:var(--st-err)}
.writer-mobile-actions-mask { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: flex-end; justify-content: center; background: rgba(15,23,42,.42); }
.writer-mobile-actions-sheet { width: 100%; padding: 14px 14px calc(14px + env(safe-area-inset-bottom)); background: var(--card); border-radius: 10px 10px 0 0; box-shadow: 0 -12px 30px rgba(15,23,42,.2); }
.writer-mobile-actions-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }.writer-mobile-actions-head strong{color:var(--text);font-size:14px}.writer-mobile-actions-head button{width:30px;height:30px;border:0;border-radius:6px;color:var(--muted);background:var(--card-2);font-size:18px}
.writer-mobile-actions-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }.writer-mobile-actions-grid button{min-height:42px;border:1px solid var(--border);border-radius:7px;color:var(--text-sub);background:var(--card-2);font-size:12px;font-weight:700}
.writer-review-section .gr-card, .writer-review-section .pr-card { margin-bottom: 10px; box-shadow: none; }
.writer-compare-summary { margin-bottom: 10px; padding: 9px 10px; color: var(--text-sub); background: var(--card-2); border: 1px solid var(--border); border-radius: 6px; font-size: 11px; }
.pr-table-scroll { width: 100%; overflow-x: auto; }
.pr-table-scroll .pr-table { min-width: 680px; }
.utility-dialog { width: min(620px,92vw); max-height: 84vh; display: flex; flex-direction: column; overflow: hidden; background: var(--card); border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 24px 70px rgba(15,23,42,.28); }
.utility-dialog-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid var(--border); }
.utility-dialog-head h2 { margin-top: 2px; color: var(--text); font-size: 18px; }
.utility-task-summary { display: flex; gap: 8px; padding: 11px 18px; border-bottom: 1px solid var(--border); }
.utility-task-summary span { padding: 5px 8px; color: var(--muted); background: var(--card-2); border-radius: 5px; font-size: 10px; }
.utility-task-summary b { color: var(--text); }
.utility-task-list { min-height: 160px; padding: 8px 12px 14px; overflow-y: auto; }
.utility-task-item { width: 100%; display: grid; grid-template-columns: 8px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 10px; border: 0; border-bottom: 1px solid var(--border); color: var(--text); background: transparent; text-align: left; cursor: pointer; }
.utility-task-item:hover { background: var(--card-2); }
.utility-task-item strong, .utility-task-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.utility-task-item strong { font-size: 12px; }.utility-task-item small { margin-top: 3px; color: var(--muted); font-size: 9.5px; }.utility-task-item > b { color: var(--brand); font-size: 10px; }
.utility-state-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }.utility-state-dot.running{background:var(--st-run)}.utility-state-dot.done{background:var(--st-ok)}.utility-state-dot.paused{background:var(--st-pause)}.utility-state-dot.error{background:var(--st-err)}
.history-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 14px 0 10px; }
.history-toolbar label { min-width: 220px; display: flex; align-items: center; gap: 8px; margin: 0; color: var(--muted); font-size: 11px; }
.history-toolbar input { min-width: 0; flex: 1; padding: 8px 10px; color: var(--text); background: var(--card); border: 1px solid var(--border); border-radius: 6px; }
.history-toolbar > span { color: var(--muted); font-size: 11px; }
.history-card-shell { padding: 16px !important; }
.history-grid { grid-template-columns: repeat(auto-fill,minmax(260px,1fr)) !important; }
.history-card { min-width: 0; display: grid !important; grid-template-columns: 42px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 12px !important; color: var(--text); text-align: left; cursor: pointer; }
.history-cover { width: 42px; height: 50px; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--brand); border-radius: 5px 8px 8px 5px; font-family: serif; font-weight: 800; }
.history-card-main { min-width: 0; }.history-open { color: var(--brand); font-size: 10px; font-weight: 700; }
.history-empty { grid-column: 1/-1; min-height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; color: var(--muted); text-align: center; }
.history-empty strong { color: var(--text); }.history-empty button { padding: 7px 11px; border: 0; border-radius: 6px; color: #fff; background: var(--brand); cursor: pointer; }
.history-pager { display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 14px; }
.history-pager button { padding: 6px 10px; border: 1px solid var(--border); border-radius: 6px; color: var(--text-sub); background: var(--card); cursor: pointer; }.history-pager button:disabled{opacity:.4;cursor:default}.history-pager span{color:var(--muted);font-size:10px}
.work-card-stage { min-width: 0; display: flex; align-items: center; gap: 7px; margin: -6px 0 11px; }
.work-card-stage span { flex: 0 0 auto; padding: 3px 6px; color: var(--brand); background: var(--brand-soft); border-radius: 4px; font-size: 9px; font-weight: 700; }
.work-card-stage b { flex: 1; min-width: 0; overflow: hidden; color: var(--muted); font-size: 9.5px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.work-card-cost { flex: 0 0 auto; margin-left: 2px; color: #b8860b; font-size: 10px; font-weight: 700; white-space: nowrap; font-style: normal; }
[data-theme="dark"] .work-card-cost { color: #fbbf24; }

@media (max-width: 600px) {
    .navbar-account-copy { display:none; }
    .navbar-account { padding:3px; }
    .account-menu { right:8px; top:52px; width:min(230px,calc(100vw - 16px)); }
    .account-plan-card { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .history-toolbar { align-items: stretch; flex-direction: column; }
    .history-toolbar label { width: 100%; min-width: 0; }
    .history-grid { grid-template-columns: 1fr !important; }
    .writer-task-config-list, .writer-continuity-stats, .home-stage-options-grid, .home-chapter-scale-grid { grid-template-columns: 1fr; }
}

/* 页面比例系统：统一首页与作品详情的桌面/宽屏画布。
   · 用户要求"显示铺满全屏"，原 app-canvas-max=1600px 卡上限（超宽屏不铺满），
     现提升到 99999px 让 width 公式直接等于 100% - 2*gutter，
     相当于全屏宽度减去舒适内边距（左右各 ~16–32px）。
*/
:root {
    --app-canvas-max: 99999px;
    --app-canvas-gutter: clamp(16px, 2vw, 32px);
    --home-nav-fluid: clamp(176px, 13vw, 208px);
    --writer-chapter-fluid: clamp(244px, 19vw, 288px);
    --writer-tools-w: 64px;
    --writer-reading-max: 920px;
}

/* ============================================
   公共双栏壳：.app-with-side-nav（唯一导航栏 + 右侧内容列）
   · 桌面默认 grid：左列 = --home-left-nav-w (240px)，右列 = 1fr
   · 宽屏 ≥1181px：grid 左列切换为 --home-nav-fluid（流体 176-208px）
   · 平板 ≤1180px：壳退化为 block，aside 自动变顶部横排（见各断点）
   ============================================ */
.app-with-side-nav {
    display: grid;
    grid-template-columns: var(--home-left-nav-w, 240px) minmax(0, 1fr);
    gap: 0;
    width: 100%;
}
.app-with-side-nav-right {
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.app-with-side-nav .view {
    min-height: calc(100vh - 60px);
}
/* 单栏视图（写作 / 书架）：隐藏公共双栏壳，让出整屏空间
   !important 必需：≤1180px 的断点里为「壳退化为 block」写了 `.app-with-side-nav{display:block!important}`，
   同权重下会盖掉本行 → 手机上打开写作页时左侧导航横条与整块空壳仍留在页面顶部，
   把编辑器挤到 ~790px 之下（实测复现：横条 + 大块空白，需滚动才看到正文/生成信息面板）。 */
body.no-side-nav .app-with-side-nav { display: none !important; }

/* 使用教程：以固定覆盖层叠加在当前视图之上
   · 不再用 display 切换整个主壳（会导致大量 DOM 重建 → 切换卡顿）
   · 返回时仅隐藏覆盖层，原视图始终保留在文档流中，无需重新布局 */
#view-tutorial.active {
    display: block !important;
    position: fixed;
    top: 60px; left: 0; right: 0; bottom: 0;
    padding: 0 !important; margin: 0 !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 100;
    background: #f7f8fa;
}
body.tutorial-open { overflow: hidden !important; }
/* 覆盖层内 sticky 元素相对滚动容器定位（覆盖片段中 top:56px 的写法） */
#view-tutorial .tut-sidebar,
#view-tutorial .tut-toc { top: 0 !important; height: calc(100vh - 60px) !important; }
/* 覆盖层内锚点跳转留少量间距 */
#view-tutorial .tut-section,
#view-tutorial .tut-section h3 { scroll-margin-top: 12px; }

@media (min-width: 1181px) {
    /* 壳左列宽度同步为 --home-nav-fluid（跟 aside 自身 width 完全一致，不留缝） */
    .app-with-side-nav {
        grid-template-columns: var(--home-nav-fluid) minmax(0, 1fr);
        height: calc(100vh - 60px);
    }
    .container, .view {
        /* 左右边框顶满：0 居中偏移 / 0 外边距 / 0 宽屏上限，真正 100% 视口宽 */
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: 0 !important;
    }
    .navbar.navbar-fixed {
        /* 有侧栏视图：顶栏内容从左 aside 右侧开始（padding-left=侧栏流体宽）
           · 不用 gutter 居中公式：因为现在容器本身就是 100% 宽，不需要居中 */
        padding-left: var(--home-nav-fluid) !important;
        padding-right: 24px !important;
    }
    .home-left-nav {
        /* 左侧导航位置固定：不随页面滚动、不随导航切换移动、自身不允许滚动
           · 用 sticky 而非 fixed：保留在 flex/grid 文档流中的占位宽度，
             避免右侧内容需额外 padding-left 补位导致布局错乱
           · align-self: start 同时适配 flex（首页）与 grid（账户页）
           · overflow-y: hidden 禁止菜单自身滚动，保证位置固定 */
        position: sticky !important;
        top: 60px !important;          /* 顶栏 navbar 高 60px */
        align-self: start !important;
        height: calc(100vh - 60px) !important; /* 从顶栏下方到视口底 */
        overflow-y: hidden !important; /* 不允许自身滚动（位置固定） */
        overflow-x: hidden !important;

        width: var(--home-nav-fluid) !important;
        flex: 0 0 var(--home-nav-fluid) !important;
        padding-inline: 10px !important;
    }
    .home-right-main { padding: 18px clamp(18px, 2vw, 28px) 32px !important; }
    .home-workspace-hero { grid-template-columns: minmax(0, 1.45fr) minmax(340px, .75fr); gap: clamp(22px, 3vw, 42px); padding: 28px clamp(26px, 3vw, 44px); }
    .home-quick-actions-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-works-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important; }
    .writer-sidebar-left { width: var(--writer-chapter-fluid) !important; flex: 0 0 var(--writer-chapter-fluid) !important; }
    .writer-sidebar-right { width: var(--writer-tools-w) !important; flex-basis: var(--writer-tools-w) !important; }
    .writer-paper { width: min(100%, var(--writer-reading-max)) !important; max-width: var(--writer-reading-max) !important; padding-inline: clamp(48px, 5vw, 76px) !important; }
    .writer-geninfo-panel { right: var(--writer-tools-w) !important; width: min(430px, calc(100% - var(--writer-chapter-fluid) - var(--writer-tools-w))) !important; max-width: 430px !important; }
}
@media (min-width: 1700px) {
    .home-works-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .writer-paper { --writer-reading-max: 980px; }
}
@media (min-width: 701px) and (max-width: 1180px) {
    /* 公共壳退化为单列：aside 变成顶部横排导航，右侧内容跟随 */
    .app-with-side-nav { display: block; }
    .app-with-side-nav-right { min-width: 0; }
    /* 强制取消宽屏 sticky + 固定高度，让 aside 回到流式横排 */
    .app-with-side-nav .home-left-nav {
        position: static !important;
        top: auto !important;
        align-self: auto !important;
        height: auto !important;
        flex-direction: row !important;
        width: 100% !important;
        flex: 0 0 auto !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        padding: 10px 16px !important;
    }
    .container, .view { width: 100% !important; max-width: 100% !important; }
    .writer-paper { width: min(100%, 860px) !important; max-width: 860px !important; padding-inline: clamp(34px, 6vw, 64px) !important; }
}

/* ============================================
   单栏视图（无主导航：写作 / 书架）：
   顶栏 padding-left 不再留主导航宽度偏移，与右侧 padding 对齐
   · 主视图：status（写作三栏内自身有章节/工具侧栏，无主框架左导航）
   · 主视图：history（书架，纯单栏）
   · 由 navigateTo(target) 切换时动态给 <body> 加 .no-side-nav 类
   ============================================ */
/* 默认桌面：对齐 main.css 默认 navbar padding */
body.no-side-nav .navbar.navbar-fixed {
    padding-left: 24px !important;
    padding-right: 24px !important;
}
@media (min-width: 1181px) {
    /* 宽屏单栏：容器现在 100% 贴边，不再需要对称居中公式，左右常数 padding 即可 */
    body.no-side-nav .navbar.navbar-fixed {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}
@media (min-width: 701px) and (max-width: 1180px) {
    body.no-side-nav .navbar.navbar-fixed {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* 左侧导航账户服务分组 */
.home-nav-group-label { margin: 18px 10px 6px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.home-left-nav .home-nav-item:has(.home-nav-item-icon:not(:has(.ui-icon))) .home-nav-item-icon { font-size: 12px; font-weight: 800; }

/* 统一线性图标 */
.ui-icon { width: 18px; height: 18px; display: inline-block; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.navbar-item { display: inline-flex; align-items: center; gap: 7px; }
.navbar-icon-btn .ui-icon, .theme-toggle-btn .ui-icon { width: 19px; height: 19px; }
.home-nav-item-icon .ui-icon { width: 18px; height: 18px; }
.home-text-action { display: inline-flex; align-items: center; gap: 6px; }
.home-text-action .ui-icon { width: 15px; height: 15px; }
.view-title-with-icon { display: inline-flex; align-items: center; gap: 8px; }
.view-title-with-icon .ui-icon { width: 20px; height: 20px; color: var(--brand); }

/* 作品卡片 v2：清晰的数据层级与稳定尺寸 */
.home-works-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important; gap: 14px !important; padding: 2px !important; }
.home-work-card { min-height: 248px; position: relative !important; overflow: hidden !important; padding: 17px !important; border-radius: 8px !important; border-color: var(--border) !important; box-shadow: 0 1px 2px rgba(15,23,42,.04) !important; transform: none !important; }
.home-work-card:hover { border-color: color-mix(in srgb, var(--brand) 42%, var(--border)) !important; box-shadow: 0 8px 22px rgba(15,23,42,.09) !important; transform: translateY(-2px) !important; }
.home-work-card::before, .home-work-card::after, .status-badge-icon, .card-complete-badge, .card-error-badge, .card-warning-badge { display: none !important; }
.work-card-accent { position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--muted); }
.home-work-card[data-status="running"] .work-card-accent { background: var(--st-run); }
.home-work-card[data-status="done"] .work-card-accent { background: var(--st-ok); }
.home-work-card[data-status="paused"] .work-card-accent, .home-work-card[data-status="interrupted"] .work-card-accent { background: var(--st-pause); }
.home-work-card[data-status="error"] .work-card-accent { background: var(--st-err); }
.home-work-card .card-header { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: 10px; align-items: center; margin: 0 0 19px; }
.work-cover-mark { width: 42px; height: 48px; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--brand); border-radius: 5px 8px 8px 5px; box-shadow: inset 3px 0 0 rgba(255,255,255,.22); font-family: 'Songti SC','SimSun',serif; font-size: 17px; font-weight: 800; }
.home-work-card[data-status="running"] .work-cover-mark { background: #d97706; }
.home-work-card[data-status="done"] .work-cover-mark { background: #059669; }
.home-work-card[data-status="paused"] .work-cover-mark, .home-work-card[data-status="interrupted"] .work-cover-mark { background: #7c3aed; }
.home-work-card[data-status="error"] .work-cover-mark { background: #dc2626; }
.work-card-heading { min-width: 0; }
.home-work-card .card-title { min-height: 0 !important; margin: 0 0 5px !important; overflow: hidden; color: var(--text); font-size: 14px; font-weight: 750; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; display: block !important; }
.home-work-card .status-text { display: flex; align-items: center; gap: 5px; color: var(--muted) !important; font-size: 10.5px; font-weight: 600; }
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--muted); }
.home-work-card[data-status="running"] .status-dot { background: var(--st-run); animation: toolLivePulse 1.6s ease-in-out infinite; }
.home-work-card[data-status="done"] .status-dot { background: var(--st-ok); }
.home-work-card[data-status="paused"] .status-dot, .home-work-card[data-status="interrupted"] .status-dot { background: var(--st-pause); }
.home-work-card[data-status="error"] .status-dot { background: var(--st-err); }
.home-work-card .status-tag { align-self: start; padding: 4px 7px !important; border-radius: 5px !important; gap: 4px; font-size: 9.5px !important; font-weight: 700 !important; }
.home-work-card .status-tag svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.work-progress-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; color: var(--muted); font-size: 10.5px; }
.work-progress-head strong { color: var(--text-sub); font-size: 11px; font-variant-numeric: tabular-nums; }
.home-work-card .progress-wrap { height: 5px !important; margin: 0 0 17px !important; background: var(--card-2) !important; box-shadow: none !important; }
.home-work-card .progress-inner { animation: none !important; box-shadow: none !important; }
.home-work-card .progress-inner::after { display: none !important; }
.home-work-card .info-list { display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 7px !important; margin: 0 !important; }
.home-work-card .info-item { min-width: 0; display: flex; align-items: center; gap: 6px !important; padding: 8px 7px; color: var(--muted); background: var(--card-2); border: 1px solid transparent; border-radius: 6px; font-size: 10px !important; white-space: nowrap; }
.home-work-card .info-item .icon { color: var(--muted); opacity: 1 !important; }
.home-work-card .info-item .icon svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.home-work-card .info-item span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.home-work-card .info-item b { color: var(--text-sub); font-weight: 700; }
.home-work-card .card-operate { min-height: 38px; margin-top: auto !important; padding-top: 13px !important; align-items: center; justify-content: space-between !important; border-color: var(--border) !important; }
.work-card-open { display: inline-flex; align-items: center; gap: 5px; color: var(--brand); font-size: 10.5px; font-weight: 700; }
.work-card-open svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.home-work-card:hover .work-card-open svg { transform: translateX(2px); }
.work-card-buttons { display: flex; align-items: center; gap: 5px; }
.home-work-card .operate-btn { width: 30px !important; height: 30px !important; border: 1px solid var(--border) !important; border-radius: 6px !important; background: var(--card) !important; color: var(--muted) !important; }
.home-work-card .operate-btn:hover { color: var(--brand) !important; border-color: var(--brand) !important; background: var(--brand-soft) !important; }
.home-work-card .btn-del:hover { color: var(--st-err) !important; border-color: var(--st-err) !important; background: var(--st-err-soft) !important; }
.home-work-card .btn-pin.active { color: #f59e0b !important; border-color: #f59e0b !important; background: rgba(245,158,11,.12) !important; }
.home-work-card .operate-btn svg { width: 15px !important; height: 15px !important; fill: none !important; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
[data-theme="dark"] .home-work-card { box-shadow: 0 1px 2px rgba(0,0,0,.32) !important; }
[data-theme="dark"] .home-work-card:hover { box-shadow: 0 8px 22px rgba(0,0,0,.4) !important; }

@media (max-width: 600px) {
    .home-work-card { min-height: 232px; }
    .home-work-card .info-item { padding: 7px 6px; }
}

/* ===== 前端精简显示最终覆盖 ===== */
:root { --compact-sidebar: 190px; }
@media (min-width: 1181px) {
  .app-with-side-nav { grid-template-columns: var(--compact-sidebar) minmax(0,1fr) !important; }
  .home-left-nav { width: var(--compact-sidebar) !important; flex-basis: var(--compact-sidebar) !important; padding: 16px 8px !important; }
}
.home-left-nav .home-nav-item { min-height: 38px !important; height: 38px !important; padding: 0 10px !important; gap: 8px !important; font-size: 13px !important; border-radius: 6px !important; }
.home-left-nav .home-nav-item-icon .ui-icon { width: 16px !important; height: 16px !important; }
.home-left-nav .home-nav-group-label { margin: 14px 10px 5px !important; font-size: 9px !important; }
.home-right-main { padding-top: 14px !important; }
.home-workspace-hero { padding: 20px 24px !important; gap: 20px !important; }
.home-workspace-copy h2 { margin: 4px 0 5px !important; font-size: 23px !important; }
.home-workspace-copy p { line-height: 1.5 !important; }
.home-workspace-actions { margin-top: 14px !important; }
.home-summary-grid { gap: 8px !important; }
.home-summary-item { min-height: 68px !important; padding: 10px 12px !important; }
.home-summary-item strong { font-size: 22px !important; }
.home-quick-actions-row { display: none !important; }
.home-works-section { margin-top: 14px !important; }
.home-works-title-row h2 { font-size: 19px !important; }
.home-works-toolbar { margin-top: 10px !important; }
.home-works-header { margin-top: 10px !important; padding-bottom: 6px !important; }
.home-work-empty { min-height: 160px !important; padding: 32px 16px !important; }
.home-work-card { min-height: 218px !important; padding: 14px !important; }
.home-work-card .card-header { margin-bottom: 12px !important; }
.home-work-card .progress-wrap { margin-bottom: 12px !important; }
.home-work-card .card-operate { margin-top: 12px !important; padding-top: 10px !important; }
.account-page-main { padding: 18px 22px 30px !important; }
.account-page-hero { padding: 18px 22px !important; margin-bottom: 14px !important; }
.account-page-hero h2 { font-size: 22px !important; }
.wallet-stat-strip > div { min-height: 105px !important; padding: 16px 18px !important; }
.wallet-stat-strip strong { margin: 9px 0 4px !important; font-size: 22px !important; }
.wallet-stat-icon { width: 28px !important; height: 28px !important; }
.wallet-fund-card { margin-top: 16px !important; }
.wallet-fund-card > header { padding: 16px 18px !important; }
.wallet-fund-card h3 { font-size: 17px !important; }
.wallet-fund-body { padding: 18px !important; }
.wallet-amount-grid { gap: 8px !important; margin-bottom: 18px !important; }
.wallet-amount-option { min-height: 72px !important; padding: 11px 13px !important; }
.wallet-amount-option strong { font-size: 14px !important; }
.wallet-amount-option span { margin: 6px 0 2px !important; font-size: 15px !important; }
.wallet-pay-grid { gap: 8px !important; margin-bottom: 12px !important; }
.wallet-pay-method { min-height: 52px !important; padding: 10px 12px !important; }
.wallet-redeem-inline { margin-top: 18px !important; padding-top: 16px !important; }
.account-page-card { padding: 16px !important; }
.wallet-order-row { padding: 10px 0 !important; }
.account-ledger-list .account-ledger-row { padding: 12px 16px !important; }
.account-empty { padding: 28px 14px !important; }
@media (max-width: 760px) {
  .account-left-nav { height: 46px !important; min-height: 46px !important; padding: 5px 8px !important; }
  .account-left-nav .home-nav-item { height: 34px !important; min-height: 34px !important; }
  .home-workspace-hero { padding: 16px !important; }
  .home-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .account-page-main { padding: 12px 10px 24px !important; }
  .account-page-hero { padding: 16px !important; }
  .wallet-stat-strip > div { min-height: 82px !important; }
  .wallet-fund-body { padding: 14px !important; }
}

/* ===== 虞初式创作工作台：信息层级与操作密度优化 ===== */
.home-workspace-hero {
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--brand) 12%, transparent), transparent 34%), var(--card);
    box-shadow: var(--shadow-md);
}
.home-workspace-hero::after {
    content: 'AI NOVEL WORKSPACE';
    position: absolute;
    right: 28px;
    bottom: 13px;
    color: color-mix(in srgb, var(--brand) 18%, transparent);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.8px;
    pointer-events: none;
}
.home-summary-item { position: relative; min-height: 84px; }
.home-summary-item strong { font-size: 28px; }
.home-quick-actions-row { gap: 12px; }
.home-action-card { border-radius: var(--r-card); box-shadow: var(--shadow-soft); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.home-action-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); border-color: color-mix(in srgb, var(--brand) 38%, var(--border)); }
.home-works-section { padding-top: 6px; }
.home-works-header { margin-top: 16px; padding: 0 2px 9px; border-bottom: 1px solid var(--border); }
.home-works-grid { align-items: stretch; }
.home-work-card { min-height: 246px; }
.home-work-card .card-operate { margin-top: 18px !important; }
.writer-shell { box-shadow: 0 12px 34px rgba(15,23,42,.08); }
.writer-topbar { min-height: 62px; }
.writer-work-title-row h1 { letter-spacing: -.2px; }
.writer-sidebar-right { width: 78px; }
.writer-sr-item { min-height: 58px; border-radius: 9px; transition: background .16s ease, transform .16s ease, color .16s ease; }
.writer-sr-item:hover { transform: translateX(-1px); }
.writer-sr-item.active { box-shadow: inset 3px 0 0 var(--brand), 0 4px 12px rgba(99,102,241,.12); }
.writer-content-panel .writer-geninfo-head, .writer-geninfo-panel .writer-geninfo-head { position: static; }
.writer-live-progress { display:grid; grid-template-columns:minmax(160px,1fr) minmax(100px,220px) 44px; align-items:center; gap:12px; min-height:52px; padding:9px 18px; border-bottom:1px solid var(--border); background:var(--card); }
.writer-live-progress-copy { min-width:0; }
.writer-live-progress-copy strong,.writer-live-progress-copy span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.writer-live-progress-copy strong { color:var(--text); font-size:12px; }
.writer-live-progress-copy span { margin-top:2px; color:var(--muted); font-size:10px; }
.writer-live-progress-track { height:7px; overflow:hidden; border-radius:4px; background:var(--card-2); }
.writer-live-progress-track i { display:block; height:100%; border-radius:inherit; background:var(--brand); transition:width .25s ease; }
.writer-live-progress > b { color:var(--brand); font-size:11px; text-align:right; }
.writer-workspace { flex:1 1 0; display:flex; min-width:0; min-height:0; overflow:hidden; }
.writer-workspace > .writer-center { flex:1 1 0; overflow:hidden; }
.writer-workspace .writer-center-scroll { min-height:0; overflow:auto; overscroll-behavior:contain; }
.writer-workspace .writer-live-progress,.writer-workspace .writer-center-footer { flex-shrink:0; }
.writer-workspace .writer-live-progress { grid-template-columns:minmax(0,1fr) minmax(50px,100px) 38px; gap:8px; }
.writer-workspace .writer-center-footer { height:auto; min-height:40px; flex-wrap:wrap; gap:6px 12px; padding:8px 12px; }
.writer-model-output { flex:0 0 36%; max-width:440px; display:flex; flex-direction:column; min-width:0; min-height:0; overflow:hidden; border-left:1px solid var(--border); background:var(--card); color:var(--text); }
/* 面板本身是 display:flex，会盖掉浏览器对 [hidden] 的默认 display:none，
   所以必须显式声明；studio.css 里的 `#view-status .writer-model-output` 是 ID 选择器，
   特异性比这里高，故加 !important（同一写法在 ai-tools.css 里已有先例）。 */
.writer-model-output[hidden] { display:none !important; }
.writer-model-output.is-collapsed { flex:0 0 48px; }
.writer-model-output.is-collapsed .writer-model-output-head { flex-direction:column; padding:10px 4px; }
.writer-model-output.is-collapsed .writer-model-output-head > :not(strong):not(button) { display:none; }
.writer-model-output.is-collapsed .writer-model-output-head strong { writing-mode:vertical-rl; }
.writer-model-output.is-collapsed .writer-model-output-head button { padding:5px 3px; }
.writer-model-output-head { flex-shrink:0; display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; padding:8px 18px; font-size:11px; }
.writer-model-output-head strong { font-size:12px; }
#writerModelOutputModel { flex:1; min-width:60px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); }
#writerModelOutputState { color:var(--muted); }
.writer-model-output-head label { display:inline-flex; align-items:center; gap:4px; cursor:pointer; }
.writer-model-output-head input { accent-color:var(--brand); }
.writer-model-output-head button { padding:4px 9px; border:1px solid var(--border); border-radius:6px; background:var(--card); color:var(--text); font:inherit; cursor:pointer; }
.writer-model-output-head button:hover { color:var(--brand); border-color:var(--brand); }
.writer-model-output-body { flex:1 1 0; min-height:0; overflow:auto; overscroll-behavior:contain; overflow-anchor:none; padding:10px 18px; background:var(--card-2); }
.writer-model-output-body[hidden] { display:none; }
.writer-model-output-body pre { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; font-family:ui-monospace,monospace; font-size:12px; line-height:1.65; color:var(--text); }
@media (max-width:1180px) {
  .writer-workspace { flex-direction:column; }
  .writer-workspace .writer-live-progress { grid-template-columns:minmax(0,1fr) 38px; }
  .writer-workspace .writer-live-progress-track { grid-column:1 / -1; grid-row:2; }
  .writer-model-output { flex:0 0 auto; max-width:none; border-left:0; border-top:1px solid var(--border); }
  .writer-model-output-body { flex:0 0 auto; height:clamp(90px,20dvh,180px); }
  .writer-model-output.is-collapsed { flex:0 0 auto; }
  .writer-model-output.is-collapsed .writer-model-output-head { flex-direction:row; padding:8px 12px; }
  .writer-model-output.is-collapsed .writer-model-output-head strong { writing-mode:horizontal-tb; flex:1; }
  .writer-model-output.is-collapsed .writer-model-output-head button { padding:4px 9px; }
}
@media (max-width:700px) {
  .writer-model-output-head { padding:8px 12px; }
  .writer-model-output-body { height:clamp(60px,16dvh,120px); padding:8px 12px; }
}
.writer-chapter-copy-actions { display:flex; justify-content:flex-end; gap:8px; margin-bottom:14px; }
.writer-chapter-copy-actions[hidden] { display:none; }
.writer-chapter-copy-actions button,.writer-tool-center-head button,.writer-panel-expand { min-height:30px; padding:5px 10px; border:1px solid var(--border); border-radius:6px; color:var(--text-sub); background:var(--card); font:inherit; font-size:11px; cursor:pointer; }
.writer-chapter-copy-actions button:hover,.writer-tool-center-head button:hover,.writer-panel-expand:hover { color:var(--brand); border-color:var(--brand); background:var(--brand-soft); }
.writer-tool-center { width:100%; min-height:0; color:var(--text); }
.writer-tool-center.is-expanded { padding:4px 0 48px; }
.writer-center.tool-expanded .writer-paper { background:var(--card-2) !important; }
.writer-center.tool-expanded .writer-center-footer { visibility:hidden; pointer-events:none; }
.writer-center.tool-expanded .writer-chapter-copy-actions { display:none !important; }
.writer-tool-center-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; padding:0 0 14px; border-bottom:1px solid var(--border); }
.writer-tool-center-head span,.writer-tool-center-head strong { display:block; }
.writer-tool-center-head span { color:var(--brand); font-size:10px; font-weight:700; }
.writer-tool-center-head strong { margin-top:4px; color:var(--text); font-size:20px; letter-spacing:0; }
.writer-tool-center-head button { min-width:82px; font-weight:600; }
/* 大纲编辑条的「← 返回章节」是裸 .btn-mini，配色已由 main.css 的 .btn-mini 基础样式统一提供
   （以前它白字无底色，见 main.css 那段注释）。这里只补编辑条自己的尺寸与字重，别再重复写颜色，
   否则基础样式一改就两处对不上。 */
.writer-outline-editor-bar > button { min-height:30px; padding:5px 12px; font-weight:500; letter-spacing:0; }
.writer-outline-editor-bar > button:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
.writer-outline-editor-bar > button:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
.writer-outline-editor-bar > button:active { transform:scale(.98); }
#writerToolCenterBody { width:100%; }
#writerToolCenterBody > .writer-geninfo-body { max-height:none !important; overflow:visible !important; padding:0 !important; background:transparent !important; }
.writer-tool-center .writer-tool-summary { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; margin-bottom:20px; }
.writer-tool-center .writer-tool-summary > div { min-height:74px; padding:13px 14px; border-radius:7px; background:var(--card); box-shadow:0 1px 2px rgba(15,23,42,.04); }
.writer-tool-center .writer-tool-summary strong { font-size:17px; }
.writer-tool-center .writer-tool-section,.writer-tool-center .writer-geninfo-live,.writer-tool-center .wgp-timeline,.writer-tool-center .wgp-log { padding:16px; border:1px solid var(--border); border-radius:7px; background:var(--card); box-shadow:0 1px 2px rgba(15,23,42,.04); }
.writer-tool-center .writer-tool-section + .writer-tool-section { margin-top:12px; }
.writer-tool-center .writer-tool-section h3,.writer-tool-center .writer-geninfo-subtitle { font-size:13px; }
.writer-tool-center .writer-tool-character-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.writer-tool-center .writer-tool-character-list .writer-character-card { margin:0 !important; padding:16px !important; border-radius:8px !important; background:var(--card) !important; }
.writer-tool-center .writer-character-editor { grid-template-columns:minmax(140px,1fr) auto; align-items:center; }
.writer-tool-center .writer-character-actions { grid-template-columns:auto auto; }
.writer-tool-center .writer-character-actions button { padding:0 13px; }
.writer-tool-center .writer-tool-avatar { width:42px; height:42px; flex-basis:42px; border-radius:7px !important; }
.writer-tool-center .writer-character-identity strong { font-size:15px; }
.writer-tool-center .writer-character-desc { font-size:12px; -webkit-line-clamp:5; }
.writer-tool-center .writer-tool-setting-list details { background:var(--card); }
.writer-tool-center .polish-compare-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.writer-outline-edit-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:34px; padding:0 14px; border:none; border-radius:7px; color:#ffffff; background:linear-gradient(135deg, #F97316 0%, #FB923C 100%); box-shadow:0 2px 8px rgba(249, 115, 22, 0.25); font:inherit; font-size:12px; font-weight:700; cursor:pointer; transition:all .22s cubic-bezier(0.4, 0, 0.2, 1); }
.writer-outline-edit-btn svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.writer-outline-edit-btn:hover { color:#ffffff; background:linear-gradient(135deg, #EA580C 0%, #F97316 100%); box-shadow:0 4px 16px rgba(249, 115, 22, 0.4); transform:translateY(-1px); }
.writer-outline-edit-btn:active { transform:translateY(0); box-shadow:0 2px 6px rgba(249, 115, 22, 0.3); }
.writer-outline-edit-btn:focus-visible { outline:2px solid rgba(249, 115, 22, 0.5); outline-offset:2px; }
.writer-outline-edit-btn:disabled { color:#94A3B8; background:#334155; border:1px solid #475569; box-shadow:none; cursor:not-allowed; transform:none; opacity:0.6; }
.writer-panel-expand { display:inline-flex; align-items:center; justify-content:center; min-width:48px; height:30px; padding:0 9px !important; font-weight:600 !important; }
.writer-content-panel .writer-panel-expand,.writer-geninfo-panel .writer-panel-expand { color:var(--brand) !important; background:var(--brand-soft) !important; border-color:color-mix(in srgb,var(--brand) 28%,var(--border)) !important; }
@media (max-width:700px) {
  .writer-live-progress { grid-template-columns:1fr 38px; padding:8px 12px; }
  .writer-live-progress-track { grid-column:1 / -1; grid-row:2; }
  .writer-tool-center .writer-tool-character-list { grid-template-columns:1fr; }
  .writer-tool-center .writer-character-editor { grid-template-columns:1fr; }
  .writer-character-actions { grid-template-columns:1fr 1fr; }
}
.writer-content-panel .writer-geninfo-body { padding-top: 18px; }
.writer-tool-summary { position: static; }
.writer-tool-section { border-radius: 10px; }
.writer-outline-editor { padding: 2px 0; }
.writer-outline-editor-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.writer-outline-editor textarea.outline-textarea, .writer-outline-editor .input-mini { max-width: 100%; box-sizing: border-box; }
.writer-memory-row { min-height: 34px; align-items: center; }
.writer-center-footer { min-height: 48px; }

@media (max-width: 900px) {
    .home-workspace-hero { grid-template-columns: 1fr; gap: 18px; }
    .home-workspace-hero::after { right: 18px; bottom: 10px; }
    .writer-sidebar-right { width: 70px; }
}

@media (max-width: 600px) {
    .home-workspace-hero { padding: 22px 18px; }
    .home-workspace-copy h2 { font-size: 23px; }
    .home-summary-item { min-height: 76px; padding: 12px; }
    .home-summary-item strong { font-size: 24px; }
    .home-works-toolbar { grid-template-columns: 1fr; }
    .home-works-header { align-items: flex-start; }
    .writer-shell { border-radius: 0; box-shadow: none; }
    .writer-topbar { min-height: 56px; }
}

/* ===== 主页视觉与排版优化 ===== */
.home-workspace-kicker,
.home-section-kicker {
    display: flex;
    align-items: center;
    gap: 7px;
}
.home-workspace-kicker::before,
.home-section-kicker::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--brand), var(--brand-hover));
    box-shadow: 0 0 0 3px var(--brand-soft);
}
.home-workspace-copy h2 { letter-spacing: -0.01em; }
.home-summary-item { transition: transform .16s ease, box-shadow .16s ease; }
.home-summary-item:hover { transform: translateY(-2px); box-shadow: var(--shadow-soft); }
.home-summary-label { letter-spacing: 0.02em; }
.home-workspace-total {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 16px;
    padding: 7px 13px;
    border-radius: 999px;
    color: var(--text-sub);
    font-size: 13px;
    background: var(--card-2);
    border: 1px solid var(--border);
}
.home-workspace-total svg { color: var(--brand); flex: 0 0 auto; }
.home-workspace-total b { color: var(--text); font-weight: 800; font-variant-numeric: tabular-nums; }

/* ===== 侧边栏内容面板滚动 ===== */
.writer-content-panel .writer-geninfo-body {
    flex:1 1 auto;
    min-height:0;
    max-height:none;
    overflow-y:auto;
    overflow-x:hidden;
    padding-bottom:32px !important;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
}

.writer-content-panel .writer-geninfo-body::-webkit-scrollbar {
    width: 6px;
}

.writer-content-panel .writer-geninfo-body::-webkit-scrollbar-track {
    background: rgba(241, 245, 249, 0.5);
    border-radius: 3px;
}

.writer-content-panel .writer-geninfo-body::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    border-radius: 3px;
}

.writer-content-panel .writer-geninfo-body::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
}

/* 大纲盒子在旧布局中的滚动 */
.outline-box {
    max-height: 70vh;
    overflow-y: auto;
}

.outline-box::-webkit-scrollbar {
    width: 8px;
}

.outline-box::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}

.outline-box::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    border-radius: 4px;
}

/* ============================================================
 * 移动端显示重构（仅在窄屏生效，覆盖精简块里未做响应式的 !important 规则）
 * 解决：窄屏下 .home-left-nav 未压平成横向导航、.home-right-main 被挤压成 124px、
 *       首页 hero 文案竖排、总结卡拥挤、作品卡过窄等问题。
 * ============================================================ */
@media (max-width: 900px) {
    /* 容器与视图全宽，不横向溢出；navbar 为 sticky（文档流占位），无需再 padding-top */
    body, html { overflow-x: hidden; }
    body { padding: 0 !important; margin: 0; }
    .container { max-width: 100% !important; width: 100% !important; padding-top: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
    .view, .view.active { width: 100% !important; max-width: 100% !important; min-width: 0 !important; }

    /* 公共双栏壳退化为单列（覆盖基础 grid-template-columns: 240px 1fr）
       否则 ≤700px 时左侧导航仍占 240px，右侧内容被挤成 140px，导致竖排。 */
    .app-with-side-nav {
        display: block !important;
        grid-template-columns: none !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .app-with-side-nav-right { min-width: 0 !important; width: 100% !important; display: flex; flex-direction: column; }
    #home-shell, #app-with-side-nav { width: 100% !important; max-width: 100% !important; }

    /* 左侧主导航压平为顶部横向滚动栏 */
    #home-shell { flex-direction: column !important; }
    .home-left-nav {
        position: static !important;
        top: auto !important;
        width: 100% !important;
        flex: 0 0 auto !important;
        flex-basis: auto !important;
        flex-direction: row !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        padding: 8px 10px !important;
        overflow-x: auto !important;
        align-items: center !important;
        gap: 6px !important;
        height: auto !important;
        min-height: 0 !important;
    }
    .home-left-nav .home-nav-item {
        min-height: 38px !important;
        height: 38px !important;
        padding: 0 14px !important;
        gap: 8px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
        flex: 0 0 auto !important;
        width: auto !important;
    }
    .home-left-nav .home-nav-group-label { margin: 0 8px 0 4px !important; font-size: 11px !important; }
    .home-right-main { padding: 14px 12px 72px !important; min-width: 0 !important; width: 100% !important; }

    /* 首屏 hero：单列堆叠，文案可读，按钮自适应 */
    .home-workspace-hero {
        padding: 18px 16px !important;
        gap: 14px !important;
        grid-template-columns: 1fr !important;
        display: grid !important;
    }
    .home-workspace-copy h2 { font-size: 22px !important; }
    .home-workspace-copy p { line-height: 1.55 !important; }
    .home-workspace-actions { margin-top: 12px !important; flex-wrap: wrap !important; gap: 10px !important; }

    /* 总结卡：适配窄屏，避免拥挤 */
    .home-summary-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 10px !important; }
    .home-summary-item { min-height: 76px !important; padding: 12px !important; }
    .home-summary-item strong { font-size: 24px !important; }

    /* 作品列表：单列，卡片可读 */
    .home-works-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
    .home-work-card { padding: 16px !important; }
    .home-work-card .card-header { grid-template-columns: 40px minmax(0,1fr) auto !important; gap: 8px !important; }
    .home-work-card .info-list { grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 6px !important; }
    .home-work-card .info-item { padding: 7px 6px !important; font-size: 10px !important; }
    .home-work-card .card-title { font-size: 14px !important; }
    .home-works-toolbar { grid-template-columns: 1fr !important; gap: 8px !important; }
    .home-works-header { flex-wrap: wrap !important; }

    /* 顶栏：品牌不换行、导航与用户区自适应，避免「知叙AI网」竖排 */
    .navbar { padding: 0 12px !important; height: 56px !important; }
    .navbar-brand { white-space: nowrap !important; flex: 0 0 auto !important; width: auto !important; }
    .navbar-brand .navbar-logo-full { height: 32px; max-width: 116px; }
    .navbar-brand .navbar-logo-full.is-fallback { height: 28px !important; width: 28px !important; }
    .navbar-nav { gap: 2px !important; }
    .navbar-item { padding: 6px 10px !important; font-size: 13px !important; gap: 4px !important; }
    .navbar-user-copy, .navbar-account-copy, .navbar-user-meta { display: none !important; }
    .navbar-user-btns { gap: 2px !important; }
    .navbar-icon-btn, .theme-toggle-btn { width: 34px !important; height: 34px !important; }
}

@media (max-width: 480px) {
    .home-summary-grid { grid-template-columns: 1fr 1fr !important; }
    .home-work-card .info-list { grid-template-columns: 1fr 1fr 1fr !important; }
    .home-workspace-copy h2 { font-size: 20px !important; }
    .wallet-stat-strip > div { min-height: 74px !important; padding: 12px !important; }
    .wallet-stat-strip { grid-template-columns: 1fr 1fr 1fr !important; gap: 8px !important; }
    .wallet-stat-strip > div > span:not(.wallet-stat-icon) { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
    .wallet-stat-strip small { white-space: normal !important; overflow-wrap: anywhere !important; word-break: break-word !important; display: block !important; }
    .account-page-main { padding: 12px 10px 24px !important; }
    .account-page-content, .account-page-body { padding: 0 !important; }
}

/* ============================================================
 * 最终视觉系统 v3：布局、层级、主题色与响应式统一
 * 说明：保留现有 DOM/API 和业务脚本，只收敛最终视觉表现。
 * ============================================================ */
:root {
    --ui-bg: #f4f7fb;
    --ui-surface: #ffffff;
    --ui-surface-soft: #f8fafc;
    --ui-surface-warm: #fffdf8;
    --ui-border: #dce4ee;
    --ui-border-strong: #c8d5e4;
    --ui-text: #172033;
    --ui-text-secondary: #506078;
    --ui-text-muted: #8090a6;
    --ui-brand: #4263eb;
    --ui-brand-hover: #3153d6;
    --ui-brand-soft: #e9efff;
    --ui-success: #079669;
    --ui-success-soft: #e5f8f1;
    --ui-warning: #c77800;
    --ui-warning-soft: #fff4d9;
    --ui-danger: #d83a4a;
    --ui-danger-soft: #ffeaed;
    --ui-shadow-sm: 0 1px 2px rgba(23,32,51,.05);
    --ui-shadow-md: 0 8px 24px rgba(36,55,84,.08);
    --ui-radius-sm: 6px;
    --ui-radius-md: 10px;
    --ui-radius-lg: 14px;
}

html, body { background: var(--ui-bg); color: var(--ui-text); }
body { letter-spacing: 0; }
.container { background: transparent; }
/* navbar 已改为 sticky（文档流占位），container 无需再额外 padding-top，避免导航下方产生双重空隙 */
.container { padding-top: 0 !important; }

/* 公共顶部导航 */
.navbar.navbar-fixed {
    /* 用 sticky 而非 fixed：吸顶的同时在文档流中占位，避免滚动时遮挡内容 */
    position: sticky !important;
    top: 0 !important;
    z-index: 150 !important;
    background: var(--ui-surface) !important;
    border-bottom: 1px solid var(--ui-border) !important;
    box-shadow: 0 1px 8px rgba(36,55,84,.05) !important;
}
.navbar-brand { color: var(--ui-text) !important; letter-spacing: 0 !important; width: 150px; flex: 0 0 auto; }
.navbar-brand .navbar-logo-full { height: 42px; width: auto; max-width: 150px; display: block; object-fit: contain; }
.navbar-brand .navbar-logo-full.is-fallback { height: 36px; width: 36px; border-radius: 8px; }
.navbar-brand .logo-dark { display: none; }
[data-theme="dark"] .navbar-brand .logo-light { display: none; }
[data-theme="dark"] .navbar-brand .logo-dark { display: block; }
.navbar-item { color: var(--ui-text-secondary) !important; }
.navbar-item:hover, .navbar-item.active { color: var(--ui-brand) !important; background: var(--ui-brand-soft) !important; }
.theme-toggle-btn, .navbar-icon-btn { background: var(--ui-surface-soft) !important; border-color: var(--ui-border) !important; color: var(--ui-text-secondary) !important; }
.navbar-account { border-color: var(--ui-border) !important; background: var(--ui-surface) !important; color: var(--ui-text) !important; }

/* 公共页面壳与导航 */
.app-with-side-nav { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius-lg) !important; box-shadow: var(--ui-shadow-sm) !important; overflow: visible !important; }
.app-with-side-nav-right { background: var(--ui-bg) !important; }
.home-left-nav { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; }
.home-nav-item { color: var(--ui-text-secondary) !important; border: 1px solid transparent !important; }
.home-nav-item:hover { color: var(--ui-brand) !important; background: var(--ui-brand-soft) !important; }
.home-nav-item.active { color: var(--ui-brand) !important; background: var(--ui-brand-soft) !important; border-color: #cbd7ff !important; }
.home-nav-item-icon { background: var(--ui-surface-soft) !important; color: var(--ui-text-secondary) !important; box-shadow: none !important; }
.home-nav-item.active .home-nav-item-icon { background: var(--ui-brand) !important; color: #fff !important; box-shadow: 0 4px 10px rgba(66,99,235,.2) !important; }
.home-nav-group-label { color: var(--ui-text-muted) !important; }
        .home-right-main { background: var(--ui-bg) !important; }

        /* 左导航底部链接区：与主导航项明确分级（贴底 + 分隔线 + 弱化字号），原仅靠内联样式，视觉层次不清 */
        .home-left-nav .home-nav-footer {
            margin-top: auto;
            padding: 12px 12px 14px;
            border-top: 1px solid var(--ui-border);
            display: flex;
            flex-wrap: wrap;
            gap: 4px 12px;
        }
        .home-left-nav .home-nav-footer a {
            font-size: 11px;
            color: var(--ui-text-muted);
            text-decoration: none;
            transition: color .15s ease;
        }
        .home-left-nav .home-nav-footer a:hover { color: var(--ui-brand); }
        /* 横排导航（<1180px，main.css 2721 与本文件 1650 均触发）：底部 5 个链接挤进横排会破坏布局，隐藏之；
           移动端这些链接通过账户菜单 / 帮助入口仍可达，不损失可达性 */
        @media (max-width: 1180px) {
            .home-left-nav .home-nav-footer { display: none !important; }
        }

        /* 首页内容区底部备案号 footer：合规悬挂（备案通过后必须可见），所有终端显示，不随左导航横排隐藏 */
        .home-site-footer {
            margin-top: 16px;
            padding: 14px 4px 4px;
            border-top: 1px solid var(--ui-border);
            text-align: center;
            font-size: 12px;
            color: var(--ui-text-muted);
        }
        .home-site-footer a { color: var(--ui-text-muted); text-decoration: none; transition: color .15s ease; }
        .home-site-footer a:hover { color: var(--ui-brand); }

/* 小说作品页（#view-create）只展示作品列表：隐藏冗余快捷入口（首屏 hero/统计条已迁至工作台页） */
#view-create .home-workspace-hero,
#view-create .home-quick-actions-row { display: none !important; }
#view-create .home-works-section, #view-create #homeWorksGrid, #view-create #homeWorksPager { margin-top: 0 !important; }
#view-create .home-works-section { padding-top: 4px !important; }

/* 让作品页内容区可正常滚动：原先 .home-right-main / #home-shell overflow:hidden 会把
   超出可视高度的内容（如多行作品卡片、「我的作品」标题）裁剪掉，且页面无法滚动。
   改为 visible 让页面级滚动生效；给被吸顶导航覆盖的滚动锚点加偏移避免跳转遮挡。 */
.home-right-main { overflow: visible !important; }
#home-shell { overflow: visible !important; }
.home-works-title-row, .home-works-header, .home-works-toolbar, #homeWorksGrid, .home-works-section { scroll-margin-top: 76px; }

/* 首页工作台 */
.home-workspace-hero { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-top: 3px solid var(--ui-brand) !important; border-radius: var(--ui-radius-md) !important; box-shadow: var(--ui-shadow-sm) !important; }
.home-workspace-copy h2 { color: var(--ui-text) !important; letter-spacing: 0 !important; }
.home-workspace-copy p, .home-section-kicker, .home-workspace-kicker { color: var(--ui-text-secondary) !important; }
.home-workspace-kicker::before, .home-section-kicker::before { background: var(--ui-brand) !important; box-shadow: 0 0 0 3px var(--ui-brand-soft) !important; }
.home-summary-item { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-left: 3px solid var(--ui-brand) !important; border-radius: var(--ui-radius-sm) !important; box-shadow: none !important; }
.home-summary-item:nth-child(2) { border-left-color: var(--ui-warning) !important; }
.home-summary-item:nth-child(3) { border-left-color: var(--ui-danger) !important; }
.home-summary-item:nth-child(4) { border-left-color: var(--ui-success) !important; }
.home-summary-item strong { color: var(--ui-text) !important; }
.home-summary-label, .home-summary-item span { color: var(--ui-text-secondary) !important; }
.home-action-card { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius-md) !important; box-shadow: var(--ui-shadow-sm) !important; }
.home-action-card:hover { border-color: #b8c7ff !important; box-shadow: var(--ui-shadow-md) !important; }
.home-action-icon { box-shadow: none !important; }

/* 作品列表工具区与分页：改为流式，不遮挡最后一张卡片 */
.home-works-section { background: transparent !important; }
.home-works-title-row h2 { color: var(--ui-text) !important; }
.home-works-toolbar { gap: 10px !important; }
.home-work-search, .home-work-select { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; color: var(--ui-text-secondary) !important; border-radius: var(--ui-radius-sm) !important; }
.home-work-search:focus-within, .home-work-select:focus { border-color: var(--ui-brand) !important; box-shadow: 0 0 0 3px var(--ui-brand-soft) !important; }
.home-works-header { border-color: var(--ui-border) !important; }
.home-works-tab { color: var(--ui-text-muted) !important; }
.home-works-tab.active { color: var(--ui-brand) !important; border-bottom-color: var(--ui-brand) !important; }
.home-results-count { color: var(--ui-text-muted) !important; }
.home-work-card { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius-md) !important; box-shadow: var(--ui-shadow-sm) !important; }
.home-work-card:hover { border-color: #b9c8ff !important; box-shadow: var(--ui-shadow-md) !important; }
.home-work-card .card-operate { border-color: var(--ui-border) !important; }
.home-work-card .info-item { background: var(--ui-surface-soft) !important; border-color: #edf1f6 !important; }
.home-work-card .operate-btn { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; }
.home-work-card .operate-btn:hover { color: var(--ui-brand) !important; border-color: var(--ui-brand) !important; background: var(--ui-brand-soft) !important; }
.home-works-pager {
    position: fixed !important;
    left: var(--home-left-nav-w, 240px) !important;
    right: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    margin: 0 !important;
    padding: 10px 16px !important;
    background: var(--ui-bg) !important;
    border-top: 1px solid var(--ui-border) !important;
    box-shadow: 0 -4px 12px rgba(0,0,0,.08) !important;
    z-index: 60 !important;
    justify-content: center !important;
}
.home-pager-btn, .home-pager-num { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; color: var(--ui-text-secondary) !important; }
.home-pager-num.active { background: var(--ui-brand) !important; color: #fff !important; border-color: var(--ui-brand) !important; }
/* 分页 fixed 固定底部后，给作品网格留出底部空间避免遮挡最后一行 */
.home-works-grid { padding-bottom: 56px !important; }

/* 钱包/账户 */
.account-page-view { background: var(--ui-bg) !important; }
.account-page-main { color: var(--ui-text) !important; }
.wallet-stat-strip, .wallet-fund-card, .account-page-card { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; box-shadow: var(--ui-shadow-sm) !important; border-radius: var(--ui-radius-md) !important; }
.wallet-stat-strip strong, .wallet-fund-card h3, .account-page-card h3 { color: var(--ui-text) !important; }
.wallet-stat-strip small, .wallet-stat-strip > div > span:not(.wallet-stat-icon), .wallet-fund-card header p { color: var(--ui-text-muted) !important; }
.wallet-amount-option, .wallet-pay-method { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; color: var(--ui-text) !important; }
.wallet-amount-option.active, .wallet-pay-method.active { border-color: var(--ui-brand) !important; background: var(--ui-brand-soft) !important; box-shadow: 0 0 0 2px rgba(66,99,235,.14) !important; }
.wallet-redeem-inline, .wallet-order-row, .account-ledger-row { border-color: var(--ui-border) !important; }
.account-action.primary { background: var(--ui-brand) !important; border-color: var(--ui-brand) !important; }
.account-action.primary:hover { background: var(--ui-brand-hover) !important; border-color: var(--ui-brand-hover) !important; }

/* 编辑器工作台 */
.writer-shell { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius-lg) !important; box-shadow: var(--ui-shadow-md) !important; overflow: hidden; }
.writer-topbar { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; }
.writer-work-title-row h1 { color: var(--ui-text) !important; letter-spacing: 0 !important; }
.writer-work-meta, .writer-work-status { color: var(--ui-text-muted) !important; }
.writer-tb-btn { color: var(--ui-text-secondary) !important; border-color: var(--ui-border) !important; background: var(--ui-surface) !important; }
.writer-tb-btn:hover, .writer-tb-btn.primary { color: var(--ui-brand) !important; border-color: #b9c8ff !important; background: var(--ui-brand-soft) !important; }
.writer-sidebar-left, .writer-sidebar-right { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; }
.writer-center-panel, .writer-content-panel { background: var(--ui-surface-soft) !important; }
.writer-paper { background: var(--ui-surface-warm) !important; box-shadow: 0 1px 3px rgba(23,32,51,.06) !important; }

/* 深色主题：与浅色变量一一对应 */
[data-theme="dark"] {
    --ui-bg: #0b1018;
    --ui-surface: #141b27;
    --ui-surface-soft: #101722;
    --ui-surface-warm: #18202c;
    --ui-border: #283548;
    --ui-border-strong: #3a4a62;
    --ui-text: #edf2fa;
    --ui-text-secondary: #a8b6c9;
    --ui-text-muted: #74849b;
    --ui-brand: #7c9cff;
    --ui-brand-hover: #9bb3ff;
    --ui-brand-soft: rgba(124,156,255,.16);
    --ui-success: #38d5a3;
    --ui-success-soft: rgba(56,213,163,.14);
    --ui-warning: #f5b84b;
    --ui-warning-soft: rgba(245,184,75,.14);
    --ui-danger: #ff7182;
    --ui-danger-soft: rgba(255,113,130,.14);
    --ui-shadow-sm: 0 1px 2px rgba(0,0,0,.35);
    --ui-shadow-md: 0 10px 28px rgba(0,0,0,.35);
}
[data-theme="dark"] html, [data-theme="dark"] body { background: var(--ui-bg) !important; color: var(--ui-text) !important; }
[data-theme="dark"] .app-with-side-nav, [data-theme="dark"] .navbar.navbar-fixed, [data-theme="dark"] .home-left-nav,
[data-theme="dark"] .home-workspace-hero, [data-theme="dark"] .home-summary-item, [data-theme="dark"] .home-action-card,
[data-theme="dark"] .home-work-card, [data-theme="dark"] .wallet-stat-strip, [data-theme="dark"] .wallet-fund-card,
[data-theme="dark"] .account-page-card, [data-theme="dark"] .writer-shell, [data-theme="dark"] .writer-topbar,
[data-theme="dark"] .writer-sidebar-left, [data-theme="dark"] .writer-sidebar-right { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; }
[data-theme="dark"] .app-with-side-nav-right, [data-theme="dark"] .home-right-main, [data-theme="dark"] .account-page-view { background: var(--ui-bg) !important; }
[data-theme="dark"] .home-work-card .info-item { background: var(--ui-surface-soft) !important; border-color: var(--ui-border) !important; }
[data-theme="dark"] .home-work-search, [data-theme="dark"] .home-work-select, [data-theme="dark"] .wallet-amount-option,
[data-theme="dark"] .wallet-pay-method, [data-theme="dark"] .writer-tb-btn, [data-theme="dark"] .home-pager-btn,
[data-theme="dark"] .home-pager-num { background: var(--ui-surface-soft) !important; border-color: var(--ui-border) !important; color: var(--ui-text-secondary) !important; }
[data-theme="dark"] .writer-paper { background: var(--ui-surface-warm) !important; color: var(--ui-text) !important; }
[data-theme="dark"] .home-workspace-copy h2, [data-theme="dark"] .home-works-title-row h2,
[data-theme="dark"] .wallet-stat-strip strong, [data-theme="dark"] .wallet-fund-card h3,
[data-theme="dark"] .account-page-card h3, [data-theme="dark"] .writer-work-title-row h1 { color: var(--ui-text) !important; }

/* 钱包流水在手机端改为可读卡片，避免列标题互相挤压 */
@media (max-width: 600px) {
    .wallet-order-row { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 7px 12px !important; padding: 12px 0 !important; }
    .wallet-order-row > div:first-child { grid-column: 1 / -1; }
    .wallet-order-row > span, .wallet-order-row > b, .wallet-order-row > em { justify-self: start !important; }
    .account-ledger-list .account-ledger-row { display: grid !important; grid-template-columns: 1fr auto !important; gap: 5px 10px !important; padding: 12px 14px !important; }
    .account-ledger-row .description { min-width: 0; overflow-wrap: anywhere; }
    .account-ledger-row .delta { justify-self: end; }
    .account-ledger-row .time, .account-ledger-row .balance { color: var(--ui-text-muted); font-size: 11px; }
    .account-page-card { border-radius: var(--ui-radius-md) !important; }
    .home-works-pager { margin-top: 12px !important; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* ============================================================
 * 导航与工作台：新建作品已迁移到「工作台」页面
 * ============================================================ */


/* 工作台页面布局：落地页式（Hero / 战绩条 / 能力卡 / 流程 / 最近作品 / 快速开始表单） */
#view-workspace { min-height: calc(100vh - 60px); background: transparent; }
#view-workspace .workspace-body {
    position: relative;
    margin-top: 0;
    border-radius: 14px;
    box-shadow: var(--ui-shadow-md);
}
.workspace-main {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 14px clamp(20px, 3vw, 36px) 32px;
}
.workspace-body {
    background: var(--ui-surface);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-lg);
    box-shadow: var(--ui-shadow-sm);
    padding: 16px 18px;
}
.workspace-create-form .home-create-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 14px; align-items: start; }
/* 顶部「小说想法」卡：全宽 + 大输入框（创作起点） */
#view-workspace .home-idea-card { padding: 14px 16px; margin-bottom: 14px; }
/* 核心参数竖排容器 */
#view-workspace .home-config-stack { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
/* 高级配置卡 */
#view-workspace .home-advanced-card { align-self: start; }
#view-workspace .home-advanced-body { display: grid; gap: 12px; margin-top: 6px; }
#view-workspace .home-scale-label { display: block; font-size: 12px; color: var(--ui-text-muted); margin-bottom: 4px; }
.workspace-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--ui-border);
}
#view-workspace .home-field-card {
    background: var(--ui-surface-soft);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-md);
    padding: 12px 14px;
}
#view-workspace .home-field-textarea {
    width: 100%;
    min-height: 220px;
    padding: 12px 14px;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-sm);
    background: var(--ui-surface);
    color: var(--ui-text);
    font-size: 15px; line-height: 1.7; resize: vertical;
}
#view-workspace .home-field-input, #view-workspace .home-field-select {
    width: 100%;
    min-height: 42px;
    padding: 7px 11px;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-sm);
    background: var(--ui-surface);
    color: var(--ui-text);
    font-size: 14px;
}
#view-workspace .home-field-input:focus, #view-workspace .home-field-select:focus,
#view-workspace .home-field-textarea:focus { outline: none; border-color: var(--ui-brand); box-shadow: 0 0 0 3px var(--ui-brand-soft); }
#view-workspace .home-field-label { display: block; margin-bottom: 5px; color: var(--ui-text-secondary); font-size: 12.5px; font-weight: 700; }
#view-workspace .home-field-row { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; align-items: start; }
#view-workspace .home-stage-options-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; }
#view-workspace .home-checkbox-row { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ui-text-secondary); }
#view-workspace .home-option-chips { display: flex; flex-wrap: wrap; gap: 6px; }
#view-workspace .home-option-chip { padding: 6px 12px; border: 1px solid var(--ui-border); border-radius: 999px; background: var(--ui-surface); color: var(--ui-text-secondary); font-size: 12.5px; cursor: pointer; }
#view-workspace .home-option-chip.active { color: #fff; background: var(--ui-brand); border-color: var(--ui-brand); }
#view-workspace .home-option-chip b { font-weight: 700; font-size: 12px; }
#view-workspace .home-outline-row { display: flex; align-items: center; gap: 8px; }
#view-workspace .home-outline-manual { display: flex; align-items: center; gap: 4px; }
#view-workspace .home-outline-manual .label { color: var(--ui-text-muted); font-size: 11px; }
#view-workspace .home-outline-manual input { width: 60px; min-height: 32px; padding: 4px 8px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-sm); background: var(--ui-surface); color: var(--ui-text); font-size: 13px; }
#view-workspace .home-chapter-scale-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
#view-workspace .home-advanced-toggle { display: flex; align-items: center; justify-content: space-between; cursor: pointer; font-size: 13px; font-weight: 700; color: var(--ui-text); padding: 4px 0; }
#view-workspace .home-advanced-toggle .chev { transition: transform .2s; color: var(--ui-text-muted); }
#view-workspace .home-advanced-toggle.open .chev { transform: rotate(180deg); }
#view-workspace #homeAdvancedWrap { display: none; }
#view-workspace #homeAdvancedWrap.open { display: block; }
#view-workspace .home-cta-button {
    display: inline-flex; align-items: center; gap: 7px;
    min-height: 38px; padding: 0 22px;
    border: 0; border-radius: 9px;
    background: var(--ui-brand); color: #fff; font-size: 14px; font-weight: 700; cursor: pointer;
    box-shadow: 0 5px 14px rgba(66,99,235,.2);
}
#view-workspace .home-cta-button:hover { background: var(--ui-brand-hover); }
#view-workspace .home-cta-button[disabled] { opacity: .6; cursor: not-allowed; }
#view-workspace .home-submit-spinner { width: 14px; height: 14px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: homeSpin .7s linear infinite; }
@keyframes homeSpin { to { transform: rotate(360deg); } }
#view-workspace .home-idea-counter { margin-top: 4px; color: var(--ui-text-muted); font-size: 11.5px; }
#view-workspace .home-create-tip { color: var(--ui-text-muted); font-size: 11.5px; }

[data-theme="dark"] .workspace-body { background: var(--ui-surface); border-color: var(--ui-border); }
[data-theme="dark"] #view-workspace .home-field-card { background: var(--ui-surface-soft); border-color: var(--ui-border); }
[data-theme="dark"] #view-workspace .home-field-textarea,
[data-theme="dark"] #view-workspace .home-field-input,
[data-theme="dark"] #view-workspace .home-field-select {
    background: var(--ui-surface); border-color: var(--ui-border); color: var(--ui-text);
}
[data-theme="dark"] #view-workspace .home-option-chip { background: var(--ui-surface); border-color: var(--ui-border); color: var(--ui-text-secondary); }
[data-theme="dark"] #view-workspace .home-option-chip.active { background: var(--ui-brand); border-color: var(--ui-brand); color: #fff; }
[data-theme="dark"] #view-workspace .home-checkbox-row,
[data-theme="dark"] #view-workspace .home-field-label { color: var(--ui-text-secondary); }
[data-theme="dark"] #view-workspace .home-advanced-toggle { color: var(--ui-text); }

/* ============================================================
 * 工作台网站首页式落地页：Hero 大横幅 / 战绩条 / 双栏
 *   Hero：左文案+CTA / 右浮动徽章卡
 *   双栏：左快速开始表单 / 右最近作品
 * 全部复用 --ui-* 设计 token，深色模式自动适配
 * ============================================================ */

/* --- Hero 首屏（居中大标题落地页） --- */
.landing-hero {
    text-align: center;
    padding: clamp(40px, 6vw, 72px) clamp(24px, 4vw, 48px);
    border-radius: 16px;
    overflow: hidden;
}
.landing-hero::before {
    content: "";
    position: absolute;
    left: -80px;
    bottom: -100px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .06);
    pointer-events: none;
}
.landing-hero .home-tool-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 720px;
    margin: 0 auto;
    display: block;
}
.landing-hero h2 {
    margin: 12px 0 12px;
    font-size: clamp(26px, 3.6vw, 38px);
    line-height: 1.2;
    letter-spacing: -0.015em;
    font-weight: 800;
}
.landing-hero > .home-tool-hero-inner > p {
    max-width: 620px;
    margin: 0 auto 22px;
    font-size: 14.5px;
    line-height: 1.8;
}
.landing-hero .home-hero-actions {
    justify-content: center;
    margin-top: 0;
    gap: 12px;
}
.landing-hero .home-primary-action {
    min-height: 44px;
    padding: 0 28px;
    font-size: 14.5px;
    border-radius: 10px;
}
.landing-hero .home-secondary-action {
    min-height: 44px;
    padding: 0 22px;
    font-size: 14px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

/* Hero 信任徽章条 */
.landing-hero-trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 26px;
    margin-top: 26px;
}
.landing-hero-trust span {
    font-size: 12.5px;
    color: rgba(255, 255, 255, .82);
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
.landing-hero-trust span::before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .5);
}

/* --- 通用区块 --- */
.landing-section { margin-top: 40px; }
.landing-section-head { max-width: 640px; margin: 0 auto 24px; text-align: center; }
.landing-section-head .home-section-kicker { font-size: 12.5px; letter-spacing: .06em; }
.landing-section-head h2 {
    margin: 8px 0 10px;
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.01em;
    color: var(--ui-text);
}
.landing-section-head p { margin: 0; font-size: 13.5px; line-height: 1.7; color: var(--ui-text-secondary); }

/* --- 核心能力 + 创作流程：上下堆叠（能力卡 3×2 / 流程 4 步横排） --- */
.landing-two-col {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    margin-top: 28px;
    align-items: start;
}
.landing-two-col .landing-section { margin-top: 0; }
.landing-two-col .landing-section-head { margin-bottom: 16px; }
.landing-two-col .landing-section-head h2 { font-size: 20px; }
.landing-two-col .landing-feature-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.landing-two-col .landing-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* --- 核心能力 6 卡 --- */
.landing-feature-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
.landing-feature-card {
    padding: 20px;
    background: var(--ui-surface);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-md);
    box-shadow: var(--ui-shadow-sm);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.landing-feature-card:hover { transform: translateY(-3px); box-shadow: var(--ui-shadow-md); border-color: #b9c8ff; }
.landing-feature-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    margin-bottom: 12px;
}
.landing-feature-icon svg { width: 20px; height: 20px; }
.landing-feature-icon.tone-indigo { background: rgba(66, 99, 235, .12); color: #4263eb; }
.landing-feature-icon.tone-violet { background: rgba(139, 92, 246, .12); color: #8b5cf6; }
.landing-feature-icon.tone-emerald { background: rgba(16, 185, 129, .12); color: #10b981; }
.landing-feature-icon.tone-amber { background: rgba(245, 158, 11, .14); color: #d97706; }
.landing-feature-icon.tone-blue { background: rgba(59, 130, 246, .12); color: #3b82f6; }
.landing-feature-icon.tone-rose { background: rgba(244, 63, 94, .12); color: #f43f5e; }
.landing-feature-card h3 { margin: 0 0 7px; font-size: 15px; font-weight: 700; color: var(--ui-text); }
.landing-feature-card p { margin: 0; font-size: 12.5px; line-height: 1.7; color: var(--ui-text-secondary); }

/* --- 创作流程 4 步 --- */
.landing-steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
.landing-step {
    position: relative;
    padding: 20px 18px 18px;
    background: var(--ui-surface-soft);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-md);
}
.landing-step-num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin-bottom: 12px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--brand), var(--accent));
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    box-shadow: 0 5px 12px rgba(79, 70, 229, .28);
}
.landing-step h3 { margin: 0 0 7px; font-size: 14.5px; font-weight: 700; color: var(--ui-text); }
.landing-step p { margin: 0; font-size: 12.5px; line-height: 1.7; color: var(--ui-text-secondary); }
.landing-step:not(:last-child)::after {
    content: "→";
    position: absolute;
    right: -14px;
    top: 34px;
    z-index: 1;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--ui-surface);
    border: 1px solid var(--ui-border);
    color: var(--ui-text-muted);
    font-size: 12px;
    line-height: 1;
}

/* --- 数据战绩薄条 --- */
.landing-stats {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-top: 40px;
}
.landing-stat-cell {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 16px;
    background: var(--ui-surface);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-md);
    box-shadow: var(--ui-shadow-sm);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.landing-stat-cell:hover {
    transform: translateY(-2px);
    box-shadow: var(--ui-shadow-md);
    border-color: #b9c8ff;
}
.landing-stat-cell::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: var(--ui-brand);
}
.landing-stat-cell.is-running::before { background: #f59e0b; }
.landing-stat-cell.is-attention::before { background: #f43f5e; }
.landing-stat-cell.is-done::before { background: #10b981; }
.landing-stat-cell.is-total::before { background: linear-gradient(180deg, var(--brand), var(--accent)); }
.landing-stat-label {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--ui-text-muted);
}
.landing-stat-value {
    display: flex;
    align-items: baseline;
    gap: 4px;
    min-width: 0;
}
.landing-stat-value strong {
    font-size: 22px;
    font-weight: 800;
    line-height: 1.1;
    color: var(--ui-text);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.landing-stat-value em { font-style: normal; font-size: 11px; color: var(--ui-text-muted); white-space: nowrap; }
.landing-stat-value b { font-weight: 700; color: var(--ui-text-secondary); }

/* --- 双栏主体 --- */
.landing-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    margin-top: 16px;
}
.landing-panel { min-width: 0; }

/* 面板标题条 */
.landing-panel-head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin: 0 2px 10px;
}
.landing-panel-head h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    color: var(--ui-text);
    letter-spacing: -0.01em;
}
.landing-panel-head span { font-size: 12.5px; color: var(--ui-text-muted); }
.landing-panel-head-row { align-items: center; justify-content: space-between; }
.landing-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    min-height: 30px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid var(--ui-border);
    background: var(--ui-surface);
    color: var(--ui-text-secondary);
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.landing-more-btn:hover { color: #fff; background: var(--ui-brand); border-color: var(--ui-brand); }
.landing-more-btn svg { transition: transform .18s ease; }
.landing-more-btn:hover svg { transform: translateX(2px); }

/* --- 最近作品（紧凑小卡；!important 覆盖 .home-works-grid 同名规则） --- */
.landing-recent-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; padding: 0 !important; }
.landing-recent-grid .home-work-empty-state { grid-column: 1 / -1; }
.landing-recent-grid .home-work-card {
    min-height: 0 !important;
    margin: 0 !important;
    padding: 12px 13px !important;
}
.landing-recent-grid .home-work-card .card-header {
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 8px;
    margin-bottom: 8px;
}
.landing-recent-grid .work-cover-mark {
    width: 34px !important;
    height: 40px !important;
    font-size: 15px;
    border-radius: 4px 7px 7px 4px;
}
.landing-recent-grid .card-title { font-size: 13px !important; }
.landing-recent-grid .status-text { font-size: 11px !important; }
.landing-recent-grid .work-card-stage { margin: -2px 0 7px; gap: 6px; }
.landing-recent-grid .work-card-stage span,
.landing-recent-grid .work-card-stage b { font-size: 10px !important; padding: 2px 7px !important; }
.landing-recent-grid .work-progress-head { font-size: 11px; margin-bottom: 4px; }
.landing-recent-grid .home-work-card .progress-wrap { margin-bottom: 8px !important; }
.landing-recent-grid .home-work-card .info-list { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 4px !important; margin-bottom: 8px; }
.landing-recent-grid .home-work-card .info-item { padding: 4px 7px; font-size: 11px !important; }
.landing-recent-grid .home-work-card .info-item:nth-child(3) { display: none; }
.landing-recent-grid .home-work-card .card-operate {
    min-height: 30px;
    padding-top: 7px !important;
    margin-top: 7px;
}
.landing-recent-grid .home-work-card .operate-btn { width: 28px !important; height: 28px !important; }
.landing-recent-grid .work-card-open { font-size: 11px !important; min-height: 30px; padding: 0 10px !important; }

/* --- 新建作品草稿卡（「我的草稿」网格内，沿用作品卡视觉语言） --- */
.draft-card {
    grid-column: 1 / -1;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 13px 14px 13px 16px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--card);
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    transition: border-color .16s, box-shadow .16s, transform .16s;
}
.draft-card .work-card-accent { position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--brand); }
.draft-card:hover {
    border-color: color-mix(in srgb, var(--brand) 42%, var(--border));
    box-shadow: 0 8px 22px rgba(15, 23, 42, .09);
    transform: translateY(-2px);
}
[data-theme="dark"] .draft-card { box-shadow: 0 1px 2px rgba(0, 0, 0, .32); }
[data-theme="dark"] .draft-card:hover { box-shadow: 0 8px 22px rgba(0, 0, 0, .4); }
.draft-card .card-header { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 9px; align-items: center; margin: 0 0 10px; }
.draft-card .work-cover-mark { width: 36px; height: 42px; font-size: 15px; }
.draft-head-main { min-width: 0; }
.draft-card .card-title { min-width: 0; overflow: hidden; color: var(--text); font-size: 13px; font-weight: 750; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.draft-card .status-text { display: flex; align-items: center; gap: 5px; margin-top: 3px; color: var(--muted); font-size: 10.5px; font-weight: 600; }
.draft-card .status-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--brand); }
.draft-time { flex: 0 0 auto; color: var(--muted); font-size: 10.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.draft-idea { margin: 0 0 9px; color: var(--text-sub); font-size: 11.5px; line-height: 1.65; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.draft-idea.is-empty { color: var(--muted); }
.draft-meta { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 10px; }
.draft-meta span { padding: 3px 7px; border-radius: 5px; background: var(--card-2); color: var(--muted); font-size: 10px; white-space: nowrap; }
.draft-card .card-operate { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--border); }
.draft-card .work-card-open { padding: 0; border: 0; background: none; font: inherit; font-size: 10.5px; font-weight: 700; cursor: pointer; }
.draft-card .work-card-open svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.draft-card:hover .work-card-open svg { transform: translateX(2px); }
.draft-card .operate-btn {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--card);
    color: var(--muted);
    cursor: pointer;
    transition: color .15s, border-color .15s, background .15s;
}
.draft-card .operate-btn:hover { color: var(--st-err, #dc2626); border-color: var(--st-err, #dc2626); background: var(--st-err-soft, var(--card-2)); }
.draft-card .operate-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.draft-card .work-card-open:focus-visible, .draft-card .operate-btn:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.workbench-draft-btn { flex: 0 0 auto; margin-right: 8px; }
.workbench-draft-status { color: var(--muted); font-size: 10.5px; }
.workbench-draft-status:empty { display: none; }
@media (max-width: 720px) {
    .workbench-submit-action { flex-wrap: wrap; gap: 8px; }
    .workbench-draft-btn { margin-right: 0; }
    .draft-card { padding: 12px 12px; }
    .draft-card .card-header { grid-template-columns: 34px minmax(0, 1fr) auto; gap: 8px; }
    .draft-card .work-cover-mark { width: 34px; height: 40px; font-size: 14px; }
}

/* --- 快速开始表单 --- */
.landing-start-section .workspace-body { padding: 14px 16px; }
#view-workspace .landing-start-section .workspace-create-form .home-create-grid { gap: 14px; }
#view-workspace .landing-start-section .home-field-card { padding: 12px 14px; }
#view-workspace .landing-start-section .home-field-label { margin-bottom: 7px; font-size: 12.5px; }

#view-workspace .landing-start-section .home-idea-counter { font-size: 11px; margin-top: 4px; }
#view-workspace .landing-start-section .home-option-chip { padding: 6px 12px; font-size: 13px; }
#view-workspace .landing-start-section .home-option-chips { gap: 6px; }
#view-workspace .landing-start-section .home-stage-options-grid { gap: 6px; }
#view-workspace .landing-start-section .home-chapter-scale-grid { gap: 8px; }
#view-workspace .landing-start-section .home-outline-manual input { min-height: 32px; }
#view-workspace .landing-start-section .workspace-actions { margin-top: 12px; padding-top: 12px; }
#view-workspace .landing-start-section .home-cta-button { min-height: 38px; font-size: 14px; }
#view-workspace .landing-start-section .home-create-tip { font-size: 11.5px; }

/* --- 响应式 --- */
@media (max-width: 1180px) {
    .landing-main-grid { grid-template-columns: 1fr; }
    .landing-two-col { grid-template-columns: 1fr; }
    .landing-two-col .landing-feature-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .landing-two-col .landing-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
    .landing-two-col .landing-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .landing-two-col .landing-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .landing-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .landing-stat-cell.is-total { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    .landing-hero { padding: 30px 18px; }
    .landing-hero h2 { font-size: 22px; }
    .landing-hero .home-hero-actions { flex-direction: column; }
    .landing-hero .home-hero-actions .home-primary-action,
    .landing-hero .home-hero-actions .home-secondary-action { width: 100%; justify-content: center; }
    .landing-hero-trust { gap: 6px 14px; }
    .landing-two-col .landing-feature-grid { grid-template-columns: 1fr; }
    .landing-two-col .landing-steps { grid-template-columns: 1fr; }
    .landing-recent-grid { grid-template-columns: 1fr !important; }
    .landing-stat-value strong { font-size: 19px; }
    .landing-start-section .workspace-body { padding: 14px; }
}

@media (max-width: 900px) {
    .workspace-main { padding: 16px 14px 40px; }
    .workspace-body { padding: 16px; }
    .workspace-create-form .home-create-grid { grid-template-columns: 1fr; gap: 16px; }
    #view-workspace .home-stage-options-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    #view-workspace .home-field-row { grid-template-columns: 1fr; }
    #view-workspace .home-chapter-scale-grid { grid-template-columns: 1fr; }
    .workspace-actions { flex-direction: column; align-items: stretch; gap: 12px; }
    #view-workspace .home-cta-button { width: 100%; justify-content: center; }
}

/* 极窄屏：隐藏左侧导航的分组标签（避免横向滚动时被截断露出半字） */
@media (max-width: 480px) {
    .home-left-nav .home-nav-group-label { display: none !important; }
}

/* ============================================================
 * 桌面双栏：左侧导航固定不滚动，右侧页面允许独立滚动
 * 经典后台布局：.app-with-side-nav 固定为视口高减导航，左栏 sticky，右栏 overflow-y:auto
 * ============================================================ */
@media (min-width: 1181px) {
    /* 双栏壳固定高度 = 视口高 - 顶栏；overflow hidden 让子容器各自滚动 */
    .app-with-side-nav {
        height: calc(100vh - 60px) !important;
        overflow: hidden !important;
        align-items: stretch !important;
    }
    /* 右栏内容列：独立垂直滚动，左右不滚 */
    .app-with-side-nav-right {
        overflow-y: auto !important;
        overflow-x: hidden !important;
        min-height: 0 !important;
        height: 100% !important;
        display: flex !important;
        flex-direction: column !important;
    }
    /* 左导航：sticky 占满高、不滚（已是 sticky + overflow hidden） */
    .home-left-nav { height: 100% !important; max-height: 100% !important; }
    /* 使右侧滚动区内的内容不被固定 min-height 撑开视口高度 */
    .app-with-side-nav .view { min-height: 0 !important; }
    .app-with-side-nav-right .view { min-height: 0 !important; }
    #home-shell { min-height: 0 !important; height: auto !important; }
}

/* ============================================================
 * 作品详情页（writer 编辑器）：隐藏顶部全局导航，全屏沉浸创作
 * ============================================================ */
body.hide-global-nav .navbar.navbar-fixed { display: none !important; }
body.hide-global-nav .container { padding-top: 0 !important; }
body.hide-global-nav #view-status { min-height: 100vh !important; height: 100vh !important; overflow: hidden !important; }
/* 消除 shell 顶部 12px 外边距（margin 塌陷导致整页可滚动） */
body.hide-global-nav .writer-shell { margin-top: 0 !important; min-height: 100vh !important; height: 100vh !important; max-height: 100vh !important; overflow: hidden !important; }
body.hide-global-nav .writer-shell .writer-center { height: calc(100vh - 62px) !important; }
/* 桌面：正文区铺满全高，左侧章节栏补全高度偏差、空态垂直居中 */
@media (min-width: 1181px) {
  body.hide-global-nav .writer-body { height: calc(100vh - 62px) !important; min-height: 0 !important; max-height: none !important; }
  body.hide-global-nav .writer-sidebar-left { height: 100% !important; }
  body.hide-global-nav .writer-sl-list { flex: 1 1 auto !important; min-height: 0 !important; }
  body.hide-global-nav .writer-sl-list .writer-empty-tip { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; text-align: center; }
}
/* 主题切换已移入作品详情页顶部工具栏，隐藏原右下角悬浮主题按钮 */
#ng-fab-group #fab-theme-btn { display: none !important; }

/* 实时生成进度已迁移至右侧「生成」工具面板，去掉底部进度条容器样式 */
.writer-gen-panel { display: none !important; }
.writer-geninfo-live { margin-bottom: 2px; }
.writer-geninfo-live .writer-geninfo-row:last-of-type { margin-bottom: 4px; }
.writer-geninfo-live .wgp-timeline { margin-top: 6px; }
.writer-geninfo-live .wgp-live-label { font-size: 11px; font-weight: 700; color: #f97316; margin-bottom: 6px; }
.writer-geninfo-live .wgp-timeline-body { display: grid; gap: 7px; }




/* ===== 剧情可视化（人物关系 / 时间线 / 伏笔清单） ===== */
.writer-plot-tabs { display: flex; gap: 2px; padding: 0 6px; margin: -4px -6px 12px; border-bottom: 1px solid var(--border); background: var(--card-2); border-radius: 8px 8px 0 0; }
.writer-plot-tab { flex: 1; padding: 9px 6px; border: 0; background: transparent; color: var(--text-sub); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .15s, border-color .15s; }
.writer-plot-tab:hover { color: var(--text); }
.writer-plot-tab.active { color: var(--brand); border-bottom-color: var(--brand); }
.writer-plot-body { min-height: 220px; }
.writer-plot-graph { display: block; width: 100%; height: auto; margin: 0 auto 8px; }
.writer-plot-section { margin-top: 16px; }
.writer-plot-section h3 { margin: 0 0 9px; color: var(--text); font-size: 12px; }
.writer-plot-acts { display: flex; flex-direction: column; gap: 8px; }
.writer-plot-act { position: relative; padding: 11px 11px 11px 38px; background: var(--card-2); border: 1px solid var(--border); border-radius: 7px; }
.writer-plot-act-num { position: absolute; left: 11px; top: 12px; width: 19px; height: 19px; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--brand); border-radius: 50%; font-size: 10px; font-weight: 800; }
.writer-plot-act strong { display: block; color: var(--text); font-size: 12px; }
.writer-plot-act p { margin-top: 4px; color: var(--text-sub); font-size: 11.5px; line-height: 1.62; }
.writer-plot-foreshadow { display: flex; flex-direction: column; gap: 8px; }
.writer-plot-fs-item { padding: 10px 11px; background: var(--card-2); border: 1px solid var(--border); border-radius: 7px; }
.writer-plot-fs-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.writer-plot-fs-head strong { overflow: hidden; color: var(--text); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.writer-plot-fs-item > p { margin-top: 5px; color: var(--text-sub); font-size: 11px; line-height: 1.6; }
.writer-plot-fs-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 7px; }
.writer-plot-fs-meta span { color: var(--muted); font-size: 10.5px; }
.writer-plot-imp, .writer-plot-status { flex: 0 0 auto; padding: 2px 6px; border-radius: 4px; font-size: 9.5px; font-weight: 700; }
.writer-plot-imp.imp-high { color: #e5484d; background: rgba(229,72,77,.12); }
.writer-plot-imp.imp-medium { color: #d97a1a; background: rgba(217,122,26,.12); }
.writer-plot-imp.imp-low { color: var(--muted); background: var(--card-2); }
.writer-plot-status.st-gray { color: var(--muted); background: var(--card-2); }
.writer-plot-status.st-green { color: #2f9e63; background: rgba(47,158,99,.12); }
.writer-plot-status.st-amber { color: #d97a1a; background: rgba(217,122,26,.12); }
.writer-plot-status.st-blue { color: #2c7be5; background: rgba(44,123,229,.12); }

/* ===== AI 封面 ===== */
.writer-cover-wrap { display: flex; flex-direction: column; gap: 12px; }
.writer-cover-controls { display: flex; gap: 8px; }
.writer-cover-style { flex: 1; min-width: 0; padding: 9px 11px; border: 1px solid var(--border); border-radius: 7px; background: var(--card-2); color: var(--text); font: inherit; font-size: 12px; outline: none; }
.writer-cover-style:focus { border-color: var(--brand); }
.writer-cover-toolbar { display: flex; gap: 8px; }
.writer-cover-btn { flex: 1; padding: 9px 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--card-2); color: var(--text); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; transition: opacity .15s; }
.writer-cover-btn:hover { opacity: .9; }
.writer-cover-btn.primary { border-color: var(--brand); background: var(--brand); color: #fff; }
.writer-cover-stage { min-height: 320px; }
.writer-cover-preview { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 10px; background: var(--card-2); border: 1px solid var(--border); border-radius: 9px; }
.writer-cover-img { display: block; width: 100%; max-width: 300px; height: auto; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 6px; box-shadow: 0 8px 24px rgba(0,0,0,.22); background: var(--card-2); }
.writer-cover-by { display: inline-block; margin-top: 4px; color: var(--muted); font-size: 10.5px; }

/* ============ 多格式导出弹窗 ============ */
.export-mask { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.45); padding: 20px; animation: exportMaskIn .18s ease; }
.export-dialog { width: 100%; max-width: 460px; background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 18px 20px 20px; box-shadow: 0 18px 50px rgba(0,0,0,.28); animation: exportPopIn .22s cubic-bezier(.2,.8,.3,1.1); }
.export-head { display: flex; align-items: center; justify-content: space-between; }
.export-head strong { font-size: 16px; color: var(--text); }
.export-close { border: none; background: transparent; color: var(--muted); font-size: 22px; line-height: 1; cursor: pointer; padding: 0 4px; }
.export-close:hover { color: var(--text); }
.export-sub { margin: 6px 0 14px; font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.export-source-note { margin: 12px 0 0; font-size: 11.5px; color: var(--muted); }
.export-grid { display: flex; flex-direction: column; gap: 8px; }
.export-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 10px; background: var(--card-2); cursor: pointer; text-align: left; transition: border-color .15s, background .15s, transform .05s; }
.export-item:hover { border-color: var(--brand); background: var(--brand-soft); }
.export-item:active { transform: scale(.99); }
.export-item b { font-size: 14px; color: var(--text); }
.export-item span { font-size: 11.5px; color: var(--muted); }
@keyframes exportMaskIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes exportPopIn { from { opacity: 0; transform: translateY(14px) scale(.97); } to { opacity: 1; transform: none; } }

/* =========================================================
   灵感库（灵感收藏夹 + 金句/名场面）
   ========================================================= */
.library-main { padding: 28px 32px 48px; min-height: 100%; }
.library-shell { max-width: 880px; margin: 0 auto; }
.library-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.library-header-left h2 { margin: 0; font-size: 22px; color: var(--text); }
.library-header-sub { font-size: 13px; color: var(--muted); }
.library-add-btn {
    border: 1px solid var(--brand); background: var(--brand); color: #fff;
    padding: 8px 16px; border-radius: 9px; font-size: 13.5px; font-weight: 600;
    cursor: pointer; transition: filter .15s, transform .05s;
}
.library-add-btn:hover { filter: brightness(1.06); }
.library-add-btn:active { transform: scale(.98); }

.library-tabs { display: flex; gap: 6px; padding: 4px; background: var(--card-2); border: 1px solid var(--border); border-radius: 11px; width: fit-content; margin-bottom: 18px; }
.library-tab {
    border: none; background: transparent; color: var(--muted); font-size: 13.5px; font-weight: 600;
    padding: 7px 16px; border-radius: 8px; cursor: pointer; transition: background .15s, color .15s;
}
.library-tab.active { background: var(--card); color: var(--text); box-shadow: 0 1px 3px rgba(0,0,0,.08); }

.library-list { display: flex; flex-direction: column; gap: 12px; }
.library-card {
    background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 16px 18px;
    transition: border-color .15s, box-shadow .15s;
}
.library-card:hover { border-color: var(--brand); box-shadow: 0 6px 20px rgba(0,0,0,.06); }
.library-content { margin: 0; font-size: 14.5px; line-height: 1.7; color: var(--text); white-space: normal; word-break: break-word; }
.library-quote {
    margin: 0; padding: 4px 0 4px 14px; border-left: 3px solid var(--brand); color: var(--text);
    font-size: 15px; line-height: 1.75; font-style: normal;
}
.library-note { margin: 10px 0 0; font-size: 13px; line-height: 1.6; color: var(--muted); }
.library-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.library-tag { font-size: 11.5px; color: var(--brand); background: var(--brand-soft); padding: 2px 9px; border-radius: 999px; }
.library-source { margin-top: 10px; font-size: 12px; color: var(--muted); }
.library-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--border); }
.library-date { font-size: 12px; color: var(--muted); }
.library-actions { display: flex; gap: 8px; }
.library-mini {
    border: 1px solid var(--border); background: transparent; color: var(--text); font-size: 12.5px;
    padding: 4px 12px; border-radius: 7px; cursor: pointer; transition: border-color .15s, background .15s;
}
.library-mini:hover { border-color: var(--brand); background: var(--brand-soft); }
.library-mini.danger:hover { border-color: #ef4444; background: rgba(239,68,68,.08); color: #ef4444; }

.library-empty { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 56px 20px; color: var(--muted); text-align: center; }
.library-empty svg { width: 40px; height: 40px; stroke: currentColor; fill: none; stroke-width: 1.5; opacity: .6; }
.library-empty p { margin: 0; font-size: 14px; }

/* 灵感库弹窗 */
.library-modal-mask { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.45); padding: 20px; animation: exportMaskIn .18s ease; }
.library-modal { width: 100%; max-width: 520px; background: var(--card); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 18px 50px rgba(0,0,0,.28); animation: exportPopIn .22s cubic-bezier(.2,.8,.3,1.1); overflow: hidden; }
.library-modal-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px 0; }
.library-modal-head h3 { margin: 0; font-size: 17px; color: var(--text); }
.library-modal-close { border: none; background: transparent; color: var(--muted); font-size: 24px; line-height: 1; cursor: pointer; padding: 0 4px; }
.library-modal-close:hover { color: var(--text); }
.library-modal-body { padding: 16px 20px 4px; display: flex; flex-direction: column; gap: 14px; }
.library-field { display: flex; flex-direction: column; gap: 7px; }
.library-field > span { font-size: 13px; font-weight: 600; color: var(--text); }
.library-field-hint { font-weight: 400; color: var(--muted); font-size: 11.5px; margin-left: 6px; }
.library-field textarea, .library-field input, .library-field select {
    width: 100%; box-sizing: border-box; border: 1px solid var(--border); background: var(--card-2);
    color: var(--text); border-radius: 9px; padding: 10px 12px; font-size: 14px; font-family: inherit;
    transition: border-color .15s;
}
.library-field textarea { min-height: 110px; resize: vertical; }
.library-field textarea:focus, .library-field input:focus, .library-field select:focus { outline: none; border-color: var(--brand); }
.library-field-row { display: flex; gap: 12px; }
.library-field-grow { flex: 1 1 auto; }
.library-field-sm { flex: 0 0 110px; }
.library-modal-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 8px 20px 20px; }
.library-btn-ghost { border: 1px solid var(--border); background: transparent; color: var(--text); padding: 9px 18px; border-radius: 9px; font-size: 14px; cursor: pointer; }
.library-btn-ghost:hover { border-color: var(--muted); }
.library-btn-primary { border: 1px solid var(--brand); background: var(--brand); color: #fff; padding: 9px 22px; border-radius: 9px; font-size: 14px; font-weight: 600; cursor: pointer; }
.library-btn-primary:hover { filter: brightness(1.06); }

@media (max-width: 640px) {
    .library-main { padding: 20px 16px 40px; }
    .library-header { flex-direction: column; align-items: flex-start; }
    .library-field-row { flex-direction: column; gap: 14px; }
    .library-field-sm { flex: 1 1 auto; }
}

/* ============================================================
   Premium UI unification layer · 2026-09
   ============================================================ */
:root {
  --brand: #0f766e;
  --brand-dark: #115e59;
  --brand-hover: #0d9488;
  --brand-soft: #e7f5f2;
  --accent: #b45309;
  --bg: #f5f6f7;
  --bg-elevated: #ffffff;
  --card: #ffffff;
  --card-2: #f8f9fa;
  --text: #17202a;
  --text-sub: #4b5563;
  --muted: #7c8795;
  --border: #dfe3e8;
  --border-soft: #edf0f2;
  --input-bg: #ffffff;
  --shadow-soft: 0 1px 2px rgba(20,27,35,.05), 0 8px 24px rgba(20,27,35,.035);
  --shadow-md: 0 8px 24px rgba(20,27,35,.08);
  --shadow-hover: 0 14px 34px rgba(20,27,35,.11);
  --shadow-brand: 0 8px 20px rgba(15,118,110,.18);
  --r-sm: 5px;
  --r-btn: 6px;
  --r-card: 8px;
  --r-modal: 10px;
}
[data-theme="dark"] {
  --brand: #2dd4bf;
  --brand-dark: #14b8a6;
  --brand-hover: #5eead4;
  --brand-soft: rgba(45,212,191,.11);
  --accent: #f59e0b;
  --bg: #151719;
  --bg-elevated: #1d2023;
  --card: #1d2023;
  --card-2: #25292d;
  --text: #eef0f2;
  --text-sub: #bcc2c9;
  --muted: #858e98;
  --border: #353a40;
  --border-soft: #2a2f34;
  --input-bg: #22262a;
}
body { background:var(--bg); color:var(--text); letter-spacing:0; }
body,button,input,textarea,select { font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; }
.navbar { background:color-mix(in srgb,var(--card) 94%,transparent) !important; border-bottom:1px solid var(--border) !important; box-shadow:none !important; backdrop-filter:blur(14px); }
.navbar-item,.home-nav-item { border-radius:6px !important; }
.navbar-item.active,.home-nav-item.active { color:var(--brand) !important; background:var(--brand-soft) !important; box-shadow:none !important; }
.home-left-nav { background:var(--card) !important; border-color:var(--border) !important; }
.home-tool-hero { color:var(--text) !important; background:var(--card) !important; border:1px solid var(--border) !important; border-left:3px solid var(--brand) !important; border-radius:8px !important; box-shadow:var(--shadow-soft) !important; }
.home-tool-hero::after { display:none !important; }
.home-tool-hero .home-workspace-kicker { padding:0 !important; color:var(--brand) !important; background:transparent !important; border:0 !important; border-radius:0 !important; letter-spacing:0 !important; }
.home-tool-hero h2 { color:var(--text) !important; font-size:25px !important; letter-spacing:0 !important; }
.home-tool-hero > .home-tool-hero-inner > p,.home-hero-feature { color:var(--text-sub) !important; }
.home-tool-hero .home-primary-action { color:#fff !important; background:var(--brand) !important; box-shadow:none !important; }
.home-tool-hero .home-secondary-action,.home-tool-hero .home-workspace-total { color:var(--text-sub) !important; background:var(--card-2) !important; border-color:var(--border) !important; }
.home-tool-hero .home-workspace-total b,.home-tool-hero .home-workspace-total svg { color:var(--text) !important; }
.home-work-card,.account-page-card,.wallet-fund-card,.library-card,.writer-tool-section,.writer-tool-character-list article { border-color:var(--border) !important; border-radius:8px !important; box-shadow:var(--shadow-soft) !important; }
.home-work-card:hover,.library-card:hover { border-color:color-mix(in srgb,var(--brand) 45%,var(--border)) !important; box-shadow:var(--shadow-hover) !important; transform:translateY(-2px); }
button,.btn,.btn-mini,.account-action,.home-primary-action,.home-secondary-action,.library-add-btn,.library-mini { border-radius:6px !important; letter-spacing:0 !important; }
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[role="button"]:focus-visible { outline:2px solid color-mix(in srgb,var(--brand) 65%,transparent) !important; outline-offset:2px; }
input,textarea,select,.home-field-input,.home-field-select,.ab-input,.ab-select { border-color:var(--border) !important; border-radius:6px !important; background:var(--input-bg) !important; color:var(--text) !important; box-shadow:none !important; }
input:focus,textarea:focus,select:focus { border-color:var(--brand) !important; box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 13%,transparent) !important; }
.writer-shell { border:1px solid var(--border) !important; border-radius:8px !important; background:var(--card) !important; box-shadow:var(--shadow-soft) !important; }
.writer-unified-toolbar,.writer-live-progress,.writer-sidebar-left,.writer-sidebar-right,.writer-geninfo-panel { background:var(--card) !important; border-color:var(--border) !important; }
.writer-sr-item { border:1px solid transparent !important; border-radius:6px !important; }
.writer-sr-item .sr-icon { width:22px !important; height:22px !important; border:0 !important; border-radius:0 !important; }
.writer-sr-item .sr-icon svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.writer-sr-item.active { color:var(--brand) !important; background:var(--brand-soft) !important; border-color:color-mix(in srgb,var(--brand) 24%,var(--border)) !important; box-shadow:inset 2px 0 0 var(--brand) !important; }
.writer-geninfo-panel { box-shadow:-10px 0 28px rgba(20,27,35,.09) !important; }
.writer-geninfo-head { min-height:72px !important; }
.writer-panel-kicker,.writer-tool-center-head span { color:var(--brand) !important; }
.writer-panel-refresh,.writer-geninfo-close,.writer-panel-expand { border-radius:6px !important; background:var(--card-2) !important; }
.writer-tool-center.is-expanded { max-width:1060px; margin:0 auto; }
.writer-center.tool-expanded .writer-paper { background:var(--card-2) !important; }
.writer-tool-center .writer-tool-summary > div,.writer-tool-center .writer-tool-section,.writer-tool-center .writer-geninfo-live,.writer-tool-center .wgp-timeline,.writer-tool-center .wgp-log { border-radius:8px !important; box-shadow:none !important; }
.writer-tool-avatar,.writer-tool-step { background:var(--brand) !important; }
.writer-tool-tags span,.library-tag { color:var(--brand) !important; background:var(--brand-soft) !important; border-radius:5px !important; }
.writer-paper { border-radius:0 !important; box-shadow:none !important; }
.writer-chapter-copy-actions button { background:var(--card) !important; }
.writer-live-progress-track i { background:var(--brand) !important; }
.writer-modal,.library-modal,.export-dialog,.payment-modal,.fancy-dialog { border-radius:10px !important; border:1px solid var(--border) !important; box-shadow:0 24px 64px rgba(20,27,35,.22) !important; }
.export-item { border-radius:7px !important; }
.library-tabs { border-radius:7px !important; }
.library-tab { border-radius:5px !important; }
.status-badge,.writer-work-status,.account-badge,.bonus-badge { border-radius:5px !important; }
.section-icon { width:16px; height:16px; flex:0 0 16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.wgp-log-title,.writer-pop-title,.view-title { display:flex; align-items:center; gap:8px; }
.setting-detail-card { overflow:hidden; margin-bottom:8px; border:1px solid var(--border); border-radius:7px; background:var(--card); }
.setting-detail-card summary { display:grid; grid-template-columns:54px minmax(0,1fr) 18px; align-items:center; gap:10px; min-height:44px; padding:8px 12px; color:var(--text); cursor:pointer; list-style:none; font-size:12px; font-weight:650; }
.setting-detail-card summary::-webkit-details-marker { display:none; }
.setting-detail-card summary svg { width:16px; height:16px; fill:none; stroke:var(--muted); stroke-width:1.8; transition:transform .16s ease; }
.setting-detail-card[open] summary svg { transform:rotate(90deg); }
.setting-detail-code { color:var(--brand); font-size:8px; font-weight:800; letter-spacing:.04em; }
.setting-detail-content { padding:12px; border-top:1px solid var(--border); }
.setting-code-block { max-height:420px; overflow:auto; margin:0; padding:12px; border-radius:6px; color:var(--text-sub); background:var(--card-2); font:11px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace; white-space:pre-wrap; word-break:break-word; }
.setting-text-block { color:var(--text-sub); font-size:12px; line-height:1.7; white-space:pre-wrap; }
#outlineBox h3,#writerOutlineEditor h3 { color:var(--text) !important; }
#outlineBox details,#writerOutlineEditor details,.characters-grid .character-card { color:var(--text) !important; background:var(--card) !important; border-color:var(--border) !important; border-radius:7px !important; }
#outlineBox pre,#writerOutlineEditor pre,.character-card pre { color:var(--text-sub) !important; background:var(--card-2) !important; border-color:var(--border) !important; }
#outlineBox select,#outlineBox input,#outlineBox textarea,#writerOutlineEditor select,#writerOutlineEditor input,#writerOutlineEditor textarea { color:var(--text) !important; background:var(--input-bg) !important; border-color:var(--border) !important; }
[data-theme="dark"] .pay-success-icon,[data-theme="dark"] .fancy-icon { filter:saturate(.85); }

/* 展开工具继承原有阅读背景：只增加半透明内容层，不再覆盖米色/白色/绿色/深色纸张。 */
.writer-center.tool-expanded,
.writer-center.tool-expanded.reading-paper,
.writer-center.tool-expanded.reading-white,
.writer-center.tool-expanded.reading-green,
.writer-center.tool-expanded.reading-dark { background:inherit !important; }
.writer-center.tool-expanded .writer-center-scroll { justify-content:flex-start !important; background:transparent !important; }
.writer-center.tool-expanded .writer-paper,
.writer-center.tool-expanded.reading-paper .writer-paper,
.writer-center.tool-expanded.reading-white .writer-paper,
.writer-center.tool-expanded.reading-green .writer-paper,
.writer-center.tool-expanded.reading-dark .writer-paper { width:100% !important; max-width:none !important; min-height:100% !important; padding:28px clamp(28px,4vw,68px) 72px !important; color:inherit !important; background:transparent !important; }
.writer-center.tool-expanded .writer-tool-center { width:min(100%,1120px); max-width:1120px; margin:0 auto; }
.writer-center.tool-expanded .writer-tool-center-head { min-height:54px; margin-bottom:18px; background:transparent; }
.writer-center.tool-expanded .writer-outline-edit-btn { min-height:36px; padding:0 16px; font-size:12px; }
.writer-center.tool-expanded .writer-tool-character-list .writer-character-card { background:color-mix(in srgb,var(--card) 72%,transparent) !important; border-color:color-mix(in srgb,var(--border) 76%,transparent) !important; box-shadow:0 2px 8px rgba(20,27,35,.04) !important; }
.writer-center.tool-expanded .writer-character-editor input,
.writer-center.tool-expanded .writer-character-editor select { background:color-mix(in srgb,var(--card) 76%,transparent) !important; }
.writer-center.tool-expanded .writer-character-meta span { background:color-mix(in srgb,var(--card) 58%,transparent); }
.writer-center.tool-expanded .writer-tool-note { background:color-mix(in srgb,var(--brand-soft) 62%,transparent); }
.writer-center.tool-expanded .writer-tool-summary > div,
.writer-center.tool-expanded .writer-tool-section,
.writer-center.tool-expanded .writer-geninfo-live,
.writer-center.tool-expanded .wgp-timeline,
.writer-center.tool-expanded .wgp-log { background:color-mix(in srgb,var(--card) 66%,transparent) !important; }
.writer-center.tool-expanded .setting-code-block { background:color-mix(in srgb,var(--card-2) 60%,transparent) !important; }
.writer-center.tool-expanded .writer-center-footer { background:transparent !important; }
@media (max-width:700px) {
  .home-tool-hero { padding:18px !important; }
  .home-tool-hero h2 { font-size:21px !important; }
  .writer-shell { border-left:0 !important; border-right:0 !important; border-radius:0 !important; }
  .writer-tool-center.is-expanded { padding:0 0 36px; }
  .writer-tool-center-head strong { font-size:17px; }
}

/* =========================================================
   2026-09 首页导航与顶部布局最终覆盖
   顶部只承载品牌 / 当前页面 / 全局操作；左栏承载主功能导航。
   ========================================================= */
:root {
  --app-topbar-h: 64px;
  --app-sidebar-w: 216px;
  --home-left-nav-w: var(--app-sidebar-w);
  --compact-sidebar: var(--app-sidebar-w);
}

/* 顶部：品牌、当前页面上下文、全局操作、账户 */
.navbar.navbar-fixed {
  width: 100% !important;
  min-height: var(--app-topbar-h) !important;
  height: var(--app-topbar-h) !important;
  padding: 0 22px !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  background: color-mix(in srgb, var(--card) 96%, transparent) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: 0 1px 0 rgba(20, 27, 35, .02) !important;
  backdrop-filter: blur(16px);
}
.navbar-brand {
  width: calc(var(--app-sidebar-w) - 22px) !important;
  flex: 0 0 calc(var(--app-sidebar-w) - 22px) !important;
  min-width: 0;
  padding-right: 0;
  border-right: 0;
}
.navbar-brand .navbar-logo-full {
  max-width: 150px !important;
  height: 42px !important;
}
.navbar-context {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
.navbar-context-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--brand);
  background: var(--brand-soft);
  border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--border));
  border-radius: 7px;
}
.navbar-context-icon .ui-icon { width: 17px; height: 17px; }
.navbar-context-copy { min-width: 0; display: grid; gap: 2px; }
.navbar-context-copy strong {
  overflow: hidden;
  color: var(--text);
  font-size: 14px;
  font-weight: 750;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.navbar-context-copy small {
  overflow: hidden;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 首页/使用教程/联系客服：跟随品牌与页面上下文靠左排列（不再绝对居中）；
   右侧账户区由 .navbar-user 的 auto 外边距顶到最右。
   注：700px 及以下本组已被 display:none 隐藏。 */
.navbar-global-actions {
  position: static !important;
  margin: 0 0 0 4px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.navbar-global-actions .navbar-item {
  min-height: 36px;
  padding: 0 12px !important;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid transparent;
}
.navbar-global-actions .navbar-item .ui-icon { width: 16px; height: 16px; }
.navbar-user { margin-left: auto !important; gap: 8px !important; }
.navbar-user-btns { gap: 6px !important; }
.theme-toggle-btn,
.navbar-icon-btn { width: 36px !important; height: 36px !important; border-radius: 7px !important; }
.navbar-account {
  min-height: 38px;
  padding: 3px 9px 3px 4px !important;
  gap: 8px !important;
  border-radius: 7px !important;
}
.navbar-account-avatar { width: 30px !important; height: 30px !important; font-size: 12px !important; }
.navbar-account-copy strong { max-width: 104px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 桌面壳：安静、稳定、扫描效率优先 */
.app-with-side-nav {
  grid-template-columns: var(--app-sidebar-w) minmax(0, 1fr) !important;
  background: var(--bg) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.app-with-side-nav-right { background: var(--bg) !important; }
.home-left-nav {
  width: var(--app-sidebar-w) !important;
  flex: 0 0 var(--app-sidebar-w) !important;
  padding: 16px 12px 14px !important;
  gap: 3px !important;
  background: var(--card) !important;
  border-right: 1px solid var(--border) !important;
  overflow-x: hidden !important;
}
.home-nav-identity {
  min-height: 54px;
  margin: 0 2px 10px;
  padding: 8px 8px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--border);
}
.home-nav-identity-mark {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: var(--brand);
  border-radius: 7px;
}
.home-nav-identity-mark .ui-icon {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.home-nav-identity-copy { min-width: 0; display: grid; gap: 2px; }
.home-nav-identity-copy strong { color: var(--text); font-size: 13px; line-height: 1.2; }
.home-nav-identity-copy small { overflow: hidden; color: var(--muted); font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.home-left-nav .home-nav-group-label {
  margin: 14px 10px 5px !important;
  color: var(--muted) !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase;
}
.home-nav-identity + .home-nav-group-label { margin-top: 2px !important; }
.home-left-nav .home-nav-item {
  position: relative;
  min-height: 42px !important;
  height: 42px !important;
  padding: 0 10px 0 11px !important;
  gap: 10px !important;
  color: var(--text-sub) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  transition: color .15s ease, background .15s ease, border-color .15s ease !important;
}
.home-left-nav .home-nav-item::before {
  content: '';
  position: absolute;
  left: -1px;
  top: 11px;
  width: 3px;
  height: 20px;
  border-radius: 0 3px 3px 0;
  background: transparent;
}
.home-left-nav .home-nav-item:hover {
  color: var(--text) !important;
  background: var(--card-2) !important;
  border-color: color-mix(in srgb, var(--border) 78%, transparent) !important;
}
.home-left-nav .home-nav-item.active {
  color: var(--brand) !important;
  background: var(--brand-soft) !important;
  border-color: color-mix(in srgb, var(--brand) 20%, var(--border)) !important;
}
.home-left-nav .home-nav-item.active::before { background: var(--brand); }
.home-left-nav .home-nav-item-icon {
  width: 28px !important;
  height: 28px !important;
  flex: 0 0 28px;
  color: var(--muted) !important;
  background: transparent !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
.home-left-nav .home-nav-item-icon .ui-icon { width: 17px !important; height: 17px !important; }
.home-left-nav .home-nav-item:hover .home-nav-item-icon { color: var(--text) !important; background: transparent !important; box-shadow: none !important; transform: none !important; }
.home-left-nav .home-nav-item.active .home-nav-item-icon { color: var(--brand) !important; background: color-mix(in srgb, var(--brand) 9%, transparent) !important; box-shadow: none !important; }
.home-left-nav .home-nav-footer { padding: 12px 8px 2px !important; gap: 5px 12px !important; }
.home-left-nav .home-nav-footer a { font-size: 10.5px !important; }
.home-right-main { padding: 20px clamp(20px, 2.6vw, 38px) 52px !important; }

@media (min-width: 1181px) {
  .app-with-side-nav { height: calc(100vh - var(--app-topbar-h)) !important; }
  .home-left-nav { height: 100% !important; max-height: 100% !important; }
}

/* 平板：顶部仍是全局栏，主导航变为吸顶横向工具条 */
@media (max-width: 1180px) {
  :root { --app-topbar-h: 60px; }
  .navbar.navbar-fixed { padding: 0 14px !important; gap: 12px !important; }
  .navbar-brand { width: 140px !important; flex-basis: 140px !important; padding-right: 0; border-right: 0; }
  .navbar-brand .navbar-logo-full { max-width: 126px !important; height: 36px !important; }
  .navbar-context-copy small { display: none; }
  .app-with-side-nav { display: block !important; min-height: calc(100vh - var(--app-topbar-h)); }
  .app-with-side-nav-right { overflow: visible !important; height: auto !important; }
  .home-left-nav {
    position: sticky !important;
    top: var(--app-topbar-h) !important;
    z-index: 120 !important;
    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    padding: 6px 12px !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 5px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--border) !important;
    box-shadow: 0 2px 8px rgba(20, 27, 35, .04);
    scrollbar-width: none;
  }
  .home-left-nav::-webkit-scrollbar { display: none; }
  .home-nav-identity,
  .home-left-nav .home-nav-group-label,
  .home-left-nav .home-nav-footer { display: none !important; }
  .home-left-nav .home-nav-item {
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 13px !important;
    flex: 0 0 auto !important;
    gap: 7px !important;
    white-space: nowrap;
  }
  .home-left-nav .home-nav-item::before { display: none; }
  .home-left-nav .home-nav-item-icon { width: 22px !important; height: 22px !important; flex-basis: 22px; }
  .home-left-nav .home-nav-item-icon .ui-icon { width: 15px !important; height: 15px !important; }
  .home-right-main { padding: 18px 16px 40px !important; }
}

/* 701-900px：全局操作三点居中后，会与左侧「当前页面」标题挤在一起
   （760px 实测文字重叠 12px）。此区间隐藏标题图标（释放 44px，实测余量约 30px），保留标题文字。
   只作用于这一段：700px 及以下该组已隐藏、标题仍按手机版显示，不受影响。 */
@media (min-width: 701px) and (max-width: 900px) {
  .navbar-context-icon { display: none !important; }
}

/* 手机：压缩品牌和账户信息，保留当前页标题，避免顶栏溢出 */
@media (max-width: 700px) {
  :root { --app-topbar-h: 54px; }
  .navbar.navbar-fixed { padding: 0 10px !important; gap: 8px !important; }
  .navbar-brand { width: 104px !important; flex-basis: 104px !important; padding-right: 8px; }
  .navbar-brand .navbar-logo-full { max-width: 94px !important; height: 28px !important; }
  .navbar-context { flex: 1 1 auto; gap: 6px; }
  .navbar-context-icon { display: none; }
  .navbar-context-copy strong { max-width: 76px; font-size: 12px; }
  .navbar-global-actions { display: none !important; }
  .navbar-user { position: absolute !important; right: 8px; top: 10px; margin-left: 0 !important; display: flex !important; flex: 0 0 auto !important; gap: 4px !important; }
  .navbar-user-btns { display: flex !important; flex: 0 0 auto !important; gap: 3px !important; }
  .navbar-context { padding-right: 76px; }
  .theme-toggle-btn { display: none !important; }
  .navbar-user-btns .navbar-icon-btn { display: flex !important; width: 34px !important; height: 34px !important; }
  .navbar-account { min-height: 34px; display: flex !important; flex: 0 0 auto !important; padding: 2px !important; border: 0 !important; background: transparent !important; }
  .navbar-account-copy { display: none !important; }
  .navbar-account-avatar { width: 30px !important; height: 30px !important; }
  .home-left-nav { height: 48px !important; min-height: 48px !important; max-height: 48px !important; padding: 5px 8px !important; }
  .home-left-nav .home-nav-item { height: 36px !important; min-height: 36px !important; padding: 0 11px !important; font-size: 12px !important; }
  .home-summary-grid { grid-template-columns: 1fr !important; gap: 8px !important; }
  .home-summary-item { width: 100% !important; min-width: 0 !important; }
  .home-right-main { padding: 14px 10px 32px !important; }
}

@media (max-width: 420px) {
  .navbar-brand { width: 96px !important; flex-basis: 96px !important; }
  .navbar-brand .navbar-logo-full { max-width: 86px !important; height: 26px !important; }
  .navbar-context-copy strong { max-width: 58px; }
  .navbar-global-actions { display: none !important; }
}

/* 大纲生成完成后的人工确认提示：只引导打开大纲，不直接启动正文，避免误操作 */
.outline-confirm-mask {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(15, 23, 42, .48);
  backdrop-filter: blur(5px);
  animation: exportMaskIn .18s ease;
}
.outline-confirm-dialog {
  position: relative;
  width: min(460px, 100%);
  padding: 30px 30px 26px;
  text-align: center;
  color: var(--text);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 28px 70px rgba(15, 23, 42, .25);
  animation: exportPopIn .2s ease;
}
.outline-confirm-close {
  position: absolute;
  top: 11px;
  right: 12px;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  color: var(--muted);
  background: transparent;
  font-size: 23px;
  line-height: 1;
  cursor: pointer;
}
.outline-confirm-close:hover { color: var(--text); background: var(--card-2); }
.outline-confirm-icon {
  width: 54px;
  height: 54px;
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
  color: var(--brand);
  background: var(--brand-soft);
  border: 1px solid color-mix(in srgb, var(--brand) 22%, var(--border));
  border-radius: 10px;
}
.outline-confirm-icon svg,
.outline-confirm-primary svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.outline-confirm-icon svg { width: 27px; height: 27px; }
.outline-confirm-kicker {
  color: var(--brand);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
}
.outline-confirm-dialog h2 {
  margin: 7px 0 5px;
  color: var(--text);
  font-size: 21px;
  letter-spacing: 0;
}
.outline-confirm-dialog > p {
  margin: 12px 0 0;
  color: var(--text-sub);
  font-size: 13px;
  line-height: 1.7;
}
.outline-confirm-dialog .outline-confirm-work {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}
.outline-confirm-actions {
  margin-top: 22px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.outline-confirm-actions button {
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid var(--border);
  border-radius: 7px;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.outline-confirm-secondary { color: var(--text-sub); background: var(--card-2); }
.outline-confirm-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #fff;
  background: var(--brand);
  border-color: var(--brand) !important;
}
.outline-confirm-primary svg { width: 16px; height: 16px; }
.outline-confirm-secondary:hover { color: var(--text); border-color: color-mix(in srgb, var(--brand) 35%, var(--border)); }
.outline-confirm-primary:hover { filter: brightness(1.05); }
[data-theme="dark"] .outline-confirm-mask { background: rgba(0, 0, 0, .64); }
@media (max-width: 560px) {
  .outline-confirm-mask { padding: 14px; align-items: flex-end; }
  .outline-confirm-dialog { padding: 28px 20px 20px; border-radius: 10px 10px 0 0; }
  .outline-confirm-dialog h2 { font-size: 19px; }
  .outline-confirm-actions { grid-template-columns: 1fr; }
  .outline-confirm-primary { order: -1; }
}

/* ===== 通用人工确认面板（细纲预览 / 终审报告 / 伏笔账 / 批次预览 / 核心角色） ===== */
.int-dialog { width: min(680px, 100%); text-align: left; }
.int-dialog h2 { text-align: center; }
.int-dialog .outline-confirm-kicker { text-align: center; }
.int-dialog .outline-confirm-icon { margin-left: auto; margin-right: auto; }
.int-body {
  margin-top: 14px;
  max-height: 46vh;
  overflow-y: auto;
  padding: 6px 10px 6px 6px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--card-2);
}
.int-hint {
  padding: 9px 11px;
  margin-bottom: 8px;
  color: var(--text-sub);
  background: var(--brand-soft);
  border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--border));
  border-radius: 7px;
  font-size: 12.5px;
  line-height: 1.6;
}
.int-hint.int-danger {
  color: #b91c1c;
  background: #fef2f2;
  border-color: #fecaca;
}
.int-metrics {
  padding: 8px 11px;
  margin-bottom: 8px;
  color: var(--text);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 7px;
  font-size: 13px;
}
.int-metrics b { color: var(--brand); }
.int-item {
  display: flex;
  gap: 10px;
  padding: 9px 10px;
  margin-bottom: 6px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.int-no {
  flex: 0 0 auto;
  align-self: flex-start;
  padding: 2px 7px;
  color: var(--brand);
  background: var(--brand-soft);
  border-radius: 5px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.int-main { flex: 1; min-width: 0; }
.int-main strong { font-size: 13.5px; color: var(--text); }
.int-sub { margin-top: 3px; color: var(--text-sub); font-size: 12.5px; line-height: 1.55; word-break: break-word; }
.int-tag {
  display: inline-block;
  padding: 1px 7px;
  margin-left: 4px;
  color: var(--brand);
  background: var(--brand-soft);
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
}
.int-issue { border-left: 3px solid var(--border); }
.int-sev-high { border-left-color: #dc2626; }
.int-sev-medium { border-left-color: #f59e0b; }
.int-sev-low { border-left-color: #3b82f6; }
.int-overdue { border-left: 3px solid #dc2626; background: #fef2f2; }
.int-overdue .int-sub { color: #b91c1c; }
.int-actions { grid-template-columns: 1fr 1fr; }
.int-btn {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid var(--border);
  border-radius: 7px;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.int-btn:disabled { opacity: .55; cursor: not-allowed; }
.int-btn-primary { color: #fff; background: var(--brand); border-color: var(--brand) !important; }
.int-btn-primary:hover { filter: brightness(1.05); }
.int-btn-secondary { color: var(--text-sub); background: var(--card-2); }
.int-btn-secondary:hover { color: var(--text); border-color: color-mix(in srgb, var(--brand) 35%, var(--border)); }
@media (max-width: 560px) {
  .int-dialog { width: 100%; }
  .int-body { max-height: 52vh; }
  .int-actions { grid-template-columns: 1fr; }
}

/* Studio 重设计：本段统一负责首页、工作台和编辑器布局。 */
:root {
  --app-sidebar-w: 224px; --app-topbar-h: 64px;
  --brand: #3266dc; --brand-dark: #2453bd; --brand-soft: #edf3ff; --accent: #5787ed;
  --bg: #f4f7fc; --card: #fff; --card-2: #f7f9fd; --input-bg: #fff;
  --text: #192840; --text-sub: #596b83; --muted: #6c7c92; --border: #e1e8f2;
  --ui-brand: var(--brand); --ui-surface: var(--card); --ui-surface-warm: var(--card);
  --ui-bg: var(--bg); --ui-text: var(--text); --ui-text-muted: var(--text-sub); --ui-border: var(--border);
  --writer-chapter-fluid: 240px; --writer-tools-w: 0px; --writer-reading-max: 840px;
}
[data-theme="dark"] {
  --brand: #8cafff; --brand-dark: #b2c9ff; --brand-soft: #233454; --accent: #8cafff;
  --bg: #101827; --card: #182336; --card-2: #1d2b40; --input-bg: #152034;
  --text: #e7eefb; --text-sub: #adbed5; --muted: #9aacC5; --border: #30415a;
  --ui-brand: var(--brand); --ui-surface: var(--card); --ui-surface-warm: var(--card);
  --ui-bg: var(--bg); --ui-text: var(--text); --ui-text-muted: var(--text-sub); --ui-border: var(--border);
}
body { background: var(--bg); color: var(--text); }
.navbar.navbar-fixed { background: var(--card) !important; box-shadow: none !important; gap: 22px !important; }
.navbar.navbar-fixed .navbar-global-actions { margin-left: auto !important; gap: 0 !important; }
.navbar.navbar-fixed .navbar-user { margin-left: 0 !important; }
.navbar-global-actions .navbar-item:first-child { display: none !important; }
.navbar-back { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; padding: 6px 10px; border: 1px solid transparent; border-radius: 7px; color: var(--text-sub); font-size: 13px; font-weight: 600; text-decoration: none; cursor: pointer; }
.navbar-back:hover { color: var(--brand); background: var(--brand-soft); }
.navbar-back[hidden] { display: none !important; }
.navbar-back .ui-icon { width: 16px; height: 16px; }
@media (max-width: 700px) { .navbar-back span { display: none; } .navbar-back { padding: 6px; } }
.navbar-context-copy strong { font-size: 15px; }
.navbar-context-copy small { font-size: 11px; color: var(--muted); }
.studio-nav-intro { display: flex; align-items: center; gap: 11px; padding: 8px 10px 22px; }
.studio-brand-mark { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: var(--brand-soft); color: var(--brand); font-size: 22px; font-weight: 750; }
.studio-nav-intro > div { display: grid; gap: 5px; }
.studio-nav-intro strong { font-size: 15px; color: var(--text); }
.studio-nav-intro small { font-size: 9px; color: var(--muted); letter-spacing: .16em; }
.studio-new-work { display: flex; justify-content: center; align-items: center; gap: 10px; min-height: 44px; margin: 0 3px 15px; border: 0; border-radius: 10px; background: #3266dc; color: #fff; font-family: inherit; font-size: 14px; font-weight: 650; line-height: 1.5; cursor: pointer; box-shadow: 0 5px 12px #3266dc20; }
.studio-new-work > span { font-size: 22px; font-weight: 400; }
.home-left-nav .home-nav-item { height: 46px !important; min-height: 46px !important; border-radius: 10px !important; font-size: 14px !important; }
.home-left-nav .home-nav-item.active { border-color: transparent !important; }
.home-left-nav .home-nav-item::before { display: none; }
.home-left-nav .home-nav-group-label { font-size: 11px !important; margin: 18px 12px 8px !important; letter-spacing: .02em !important; }
.home-left-nav .home-nav-footer { margin-top: auto; padding-top: 24px !important; }
#view-home .workspace-main, #view-workspace .workspace-main { max-width: 1620px; margin: 0 auto; padding: 30px clamp(22px, 3vw, 48px) 48px; }
#view-home .home-tool-hero::after { display: none; }
#view-home .home-workspace-kicker { background: var(--brand-soft); color: var(--brand); border: 0; }
#view-home .home-tool-hero > .home-tool-hero-inner > p { color: var(--text-sub); font-size: 15px; line-height: 1.9; }
#view-home .home-tool-hero h2 { color: var(--text); letter-spacing: -.04em; }
#view-home .home-primary-action, #view-workspace .home-cta-button { background: #3266dc !important; color: #fff !important; border: 1px solid #3266dc; }
#view-home .home-secondary-action { color: var(--text) !important; background: var(--card) !important; border: 1px solid var(--border) !important; }
:where(button, [role="button"], input, textarea, select, summary, a):focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; }
@media (min-width: 1181px) {
  body:not(.no-side-nav) .home-left-nav { position: fixed !important; top: var(--app-topbar-h) !important; left: 0 !important; bottom: 0; height: calc(100dvh - var(--app-topbar-h)) !important; padding: 22px 14px !important; overflow-y: auto !important; }
  .app-with-side-nav-right { grid-column: 2; }
}
@media (max-width: 1180px) {
  .studio-nav-intro, .studio-new-work { display: none; }
  .home-left-nav .home-nav-item { min-height: 38px !important; height: 38px !important; }
}
@media (max-width: 900px) { .navbar-context-copy small { display: none; } .navbar.navbar-fixed { gap: 12px !important; } }
@media (max-width: 700px) {
  :root { --app-topbar-h: 56px; }
  .navbar.navbar-fixed .navbar-user { position: static !important; margin-left: auto !important; }
  .navbar.navbar-fixed .navbar-context { padding-right: 0; }
  .navbar.navbar-fixed .theme-toggle-btn { display: inline-flex !important; width: 30px !important; height: 30px !important; }
  .navbar-context-copy strong { max-width: 90px; }
  .navbar.navbar-fixed .navbar-brand { width: 95px !important; flex-basis: 95px !important; }
}
#view-home .landing-hero {
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr); align-items: center; gap: 32px;
  padding: 32px !important; text-align: left; border-radius: 18px !important;
  background: linear-gradient(115deg, var(--card) 30%, var(--brand-soft)) !important;
  border-left-width: 1px !important;
}
#view-home .landing-hero .home-tool-hero-inner { max-width: none; margin: 0; text-align: left; }
#view-home .landing-hero h2 { margin: 14px 0; font-size: clamp(25px, 2.6vw, 38px) !important; line-height: 1.3; }
#view-home .landing-hero .home-hero-actions { justify-content: flex-start; }
#view-home .landing-hero-trust { justify-content: flex-start; gap: 8px; margin-top: 20px; }
#view-home .landing-hero-trust span { padding: 5px 9px; border: 1px solid var(--border); border-radius: 6px; color: var(--text-sub); background: var(--card); font-size: 11px; }
#view-home .landing-hero-trust span::before { display: none; }
#view-home .home-flow-preview { position: relative; z-index: 1; padding: 20px; border: 1px solid var(--border); border-radius: 14px; background: var(--card); box-shadow: var(--shadow-soft); color: var(--text); }
#view-home .home-flow-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; }
#view-home .home-flow-preview-head > span { font-size: 10px; color: var(--brand); background: var(--brand-soft); padding: 4px 7px; border-radius: 4px; }
#view-home .home-flow-preview ol { list-style: none; padding: 0; margin: 14px 0; display: grid; gap: 12px; }
#view-home .home-flow-preview li { display: flex; gap: 12px; align-items: center; font-size: 13px; }
#view-home .home-flow-preview li > b { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 30px; background: var(--brand-soft); border-radius: 8px; color: var(--brand); font-size: 11px; }
#view-home .home-flow-preview small { display: block; color: var(--text-sub); font-size: 11px; margin-top: 3px; }
#view-home .home-flow-preview p { padding-top: 12px; border-top: 1px solid var(--border); color: var(--text-sub); font-size: 11px; line-height: 1.6; margin: 0; }
#view-home .landing-stats { margin: 18px 0 24px; border-radius: 12px; background: var(--card); border-color: var(--border); }
#view-home .landing-two-col { gap: 20px; }
#view-home .landing-section { border: 1px solid var(--border); border-radius: 14px; padding: 20px; background: var(--card); }
#view-home .landing-section-head { margin-bottom: 16px; }
#view-home .landing-section-head h2 { color: var(--text); font-size: 20px; }
#view-home .landing-section-head p, #view-home .landing-feature-card p, #view-home .landing-step p { color: var(--text-sub); font-size: 12px; line-height: 1.7; }
#view-home .landing-feature-grid { gap: 10px; }
#view-home .landing-feature-card { padding: 14px; background: var(--card-2); border: 1px solid var(--border); box-shadow: none; }
#view-home .landing-feature-card h3, #view-home .landing-step h3 { color: var(--text); font-size: 13px; }
#view-home .landing-feature-icon { width: 30px; height: 30px; margin-bottom: 10px; }
#view-home .landing-feature-icon svg { width: 17px; height: 17px; }

#view-workspace .workspace-page-head { display: flex; position: relative; overflow: hidden; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 28px; padding: 30px 34px; min-height: 184px; border: 1px solid var(--border); border-radius: 20px; background: linear-gradient(110deg, var(--card) 28%, var(--brand-soft)); }
#view-workspace .workspace-page-head h2 { margin: 12px 0; font-size: clamp(26px, 2.5vw, 38px); font-weight: 750; letter-spacing: -.04em; color: var(--text); line-height: 1.35; }
#view-workspace .workspace-page-head p { color: var(--text-sub); font-size: 14px; margin: 0; line-height: 1.85; }
#view-workspace .home-section-kicker { color: var(--brand); font-size: 11px; letter-spacing: .06em; }
.studio-hero-art { position: relative; width: 204px; height: 140px; flex: 0 0 204px; }
.studio-art-orbit { position: absolute; width: 136px; height: 136px; border: 1px solid color-mix(in srgb, var(--brand) 18%, transparent); border-radius: 50%; top: 0; left: 24px; }
.studio-art-orbit::after { content: ''; position: absolute; inset: 17px; border: inherit; border-radius: inherit; }
.studio-art-page { position: absolute; width: 104px; height: 128px; left: 64px; top: 9px; padding: 26px 16px; background: var(--card); border: 1px solid var(--border); border-radius: 9px; transform: rotate(10deg); box-shadow: -12px 10px 0 color-mix(in srgb, var(--brand) 10%, var(--card)), 0 12px 28px #23478514; }
.studio-art-page i { display: block; height: 4px; border-radius: 2px; margin-bottom: 11px; background: var(--brand-soft); }
.studio-art-page i:nth-child(2) { width: 74%; }
.studio-art-page span { display: block; margin-top: 18px; color: var(--brand); font-size: 8px; }
.studio-art-spark { position: absolute; top: 6px; right: 10px; color: var(--brand); font-size: 30px; }
#view-workspace .landing-main-grid { display: grid; grid-template-columns: minmax(0, 1fr) 292px; gap: 26px; align-items: start; }
.studio-card-kicker { display: block; font-size: 10px; letter-spacing: .1em; color: var(--muted); margin-bottom: 5px; }
#view-workspace .studio-form-badge { color: var(--muted); font-size: 11px; }
.studio-idea-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 10px; color: var(--muted); font-size: 11px; }
#view-workspace .home-idea-counter { position: static; margin: 0; flex: 0 0 auto; font-size: 11px; color: var(--muted); }
#view-workspace .studio-creation-options { display: grid; gap: 0; }
#view-workspace .studio-creation-options .home-checkbox-row { padding: 10px 0; gap: 10px; cursor: pointer; margin: 0; }
.studio-creation-options input { margin-top: 4px; width: 16px; height: 16px; }
.studio-creation-options b { color: var(--text); font-size: 13px; font-weight: 600; }
.studio-creation-options small { display: block; color: var(--muted); font-size: 11px; margin-top: 2px; }
/* 创作选项：终审/角色/自动暂停 */
#view-workspace .workspace-option-block { padding: 2px 0 12px; border-bottom: 1px solid var(--border); }
#view-workspace .workspace-option-range { margin-top: 4px; }
#view-workspace .workspace-option-range input[type="range"] { width: 100%; margin: 8px 0 2px; }
#view-workspace .home-range-scale { display: flex; justify-content: space-between; color: var(--text-sub); font-size: 11px; }
#view-workspace .workspace-option-row { margin-top: 14px; }
#view-workspace .workspace-option-row .home-field-label { white-space: nowrap; }
#view-workspace .workspace-option-check { padding: 14px 0 0 !important; }

/* 说法岗内联展开：仅自然档显示，紧贴文笔档位下方，不弹窗 */
#view-workspace .home-register-panel {
    margin-top: 12px;
    padding: 11px 13px 13px;
    border: 1px solid var(--ui-border);
    border-left: 3px solid var(--ui-brand);
    border-radius: var(--ui-radius-sm);
    background: var(--ui-brand-soft);
    animation: homeRegisterPanelIn .16s ease-out;
}
#view-workspace .home-register-panel[hidden] { display: none !important; }
#view-workspace .home-register-panel .home-checkbox-row { padding: 0; gap: 8px; cursor: pointer; align-items: flex-start; }
#view-workspace .home-register-panel .home-checkbox-row b { color: var(--ui-text); font-size: 13px; font-weight: 650; }
#view-workspace .home-register-panel .home-checkbox-row small { display: block; margin-top: 2px; color: var(--ui-text-secondary); font-size: 11px; }
#view-workspace .home-register-panel .workspace-option-range { margin-top: 8px; }
#view-workspace .home-register-panel .home-field-label { white-space: nowrap; color: var(--ui-text-secondary); }
#view-workspace .home-register-panel .home-range-scale { color: var(--ui-text-muted); }
@keyframes homeRegisterPanelIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    #view-workspace .home-register-panel { animation: none; }
}
.studio-flow-details { border-top: 1px solid var(--border); margin-top: 10px; padding-top: 12px; }
.studio-flow-details > summary { color: var(--text-sub); font-size: 12px; cursor: pointer; }
.studio-submit-copy { margin-right: auto; }
.studio-submit-copy strong { display: block; color: var(--text); font-size: 13px; margin-bottom: 4px; }
#view-workspace .studio-submit-copy .home-create-tip { font-size: 11px; }
.studio-recent-intro { color: var(--muted); font-size: 12px; padding: 14px 20px 0; margin: 0; }
.studio-recent-footer { margin: 4px 18px 18px; padding: 18px 4px 0; border-top: 1px solid var(--border); }
.studio-recent-footer strong { color: var(--text); font-size: 12px; font-weight: 600; }
.studio-recent-footer p { color: var(--muted); font-size: 12px; line-height: 1.8; margin: 8px 0; }
#view-workspace #homeAdvancedWrap[hidden] { display: none !important; }
#view-workspace .landing-panel { min-width: 0; background: var(--card); border: 1px solid var(--border); border-radius: 16px; box-shadow: 0 5px 24px #213c6410; overflow: hidden; }
#view-workspace .landing-start-section { border-top: 3px solid #3266dc; }
#view-workspace .landing-start-section .landing-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 22px 26px; }
#view-workspace .home-field-input, #view-workspace .home-field-select { min-height: 43px; border-radius: 8px; font-size: 14px; color: var(--text); background: var(--input-bg); border: 1px solid var(--border); }
#view-workspace .home-option-chip { flex: 1; min-height: 42px; display: flex; align-items: center; justify-content: center; border-radius: 8px; background: var(--card); color: var(--text-sub); border: 1px solid var(--border); }
#view-workspace .home-option-chip.active, [data-theme="dark"] #view-workspace .home-option-chip.active { color: var(--brand) !important; border-color: var(--brand) !important; background: var(--brand-soft) !important; box-shadow: none; }
#view-workspace .home-option-chip.active b { color: inherit !important; }
#view-workspace .home-chapter-scale-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
#view-workspace .home-chapter-scale-grid > div:first-child { grid-column: 1 / -1; }
#view-workspace .home-field-label, #view-workspace .home-scale-label { display: block; font-size: 12px; margin-bottom: 8px; }
#view-workspace .landing-panel-head { padding: 18px 20px; border-bottom: 1px solid var(--border); background: transparent; }
#view-workspace .landing-panel-head h3 { color: var(--text); font-size: 16px; }
#view-workspace .landing-panel-head > span { color: var(--text-sub); font-size: 12px; }
#view-workspace .workspace-body { padding: 26px; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
#view-workspace .workspace-create-form .home-create-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 16px; }
#view-workspace .home-field-card { padding: 16px; background: var(--card-2); border: 1px solid var(--border); border-radius: 10px; }
#view-workspace .landing-start-section .home-idea-card { padding: 0 0 18px; margin: 0 0 18px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; }
#view-workspace .workspace-section-heading { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 12px; }
#view-workspace .workspace-section-heading > span { display: grid; place-items: center; flex: 0 0 28px; height: 28px; border-radius: 7px; color: var(--brand); background: var(--brand-soft); font-size: 11px; font-weight: 800; }
#view-workspace .workspace-section-heading h3, #view-workspace .workspace-section-heading .home-field-label { margin: 0; font-size: 14px; line-height: 1.5; font-weight: 700; color: var(--text); }
#view-workspace .workspace-section-heading p { margin: 3px 0 0; color: var(--text-sub); font-size: 11.5px; line-height: 1.6; }
#view-workspace .home-field-textarea { display: block; width: 100%; min-height: 184px; max-height: 480px; padding: 18px 20px; font-size: 15px; line-height: 1.9; color: var(--text); background: var(--input-bg); border: 1px solid var(--border); border-radius: 12px; resize: vertical; }
#view-workspace .home-field-textarea::placeholder { color: var(--muted); opacity: .8; }
#view-workspace .home-field-textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); outline: none; }
#view-workspace .home-config-stack { gap: 10px; }
#view-workspace .home-config-stack > .workspace-section-heading { margin-bottom: 0; }
#view-workspace .home-field-label, #view-workspace .home-scale-label { color: var(--text-sub); }
#view-workspace .workspace-flow-card { padding: 18px; background: var(--card-2); border: 1px solid var(--border); border-radius: 10px; min-width: 0; }
#view-workspace .workspace-flow-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
#view-workspace .workspace-flow-list li { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 8px; padding: 10px 0; border-bottom: 1px solid var(--border); font-size: 12px; line-height: 1.65; }
#view-workspace .workspace-flow-list b { color: var(--text); font-weight: 650; }
#view-workspace .workspace-flow-list span { color: var(--text-sub); overflow-wrap: anywhere; }
#view-workspace .workspace-scale-summary { color: var(--brand); font-size: 12px; font-weight: 700; line-height: 1.7; margin-top: 12px; }
#view-workspace .home-create-tip { color: var(--text-sub); line-height: 1.65; }
#view-workspace .workspace-flow-card > p { margin: 8px 0 0; }
#view-workspace .landing-start-section .home-advanced-card { grid-column: 1 / -1; background: var(--card); padding: 0; overflow: hidden; }
#view-workspace .home-advanced-toggle { padding: 14px 16px; color: var(--text); min-height: 48px; }
#view-workspace .home-advanced-toggle small { margin-left: 10px; color: var(--text-sub); font-weight: 400; font-size: 11px; }
#view-workspace .home-advanced-body { margin: 0; padding: 16px; border-top: 1px solid var(--border); background: var(--card-2); gap: 14px; }
#view-workspace .home-stage-options-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
#view-workspace .home-checkbox-row { color: var(--text-sub); line-height: 1.6; align-items: flex-start; }
#view-workspace input[type="checkbox"], #view-workspace input[type="range"] { accent-color: var(--brand); }
#view-workspace .workspace-coverage-value { color: var(--brand); font-weight: 700; }
#view-workspace .workspace-actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--border); }
#view-workspace #homeUsageEstimate { font-size: 11px; }
#view-workspace .landing-start-section .home-cta-button { border-radius: 10px; padding: 0 26px; min-height: 48px; font-size: 15px; font-weight: 650; box-shadow: 0 5px 12px #3266dc20; }
#view-workspace .landing-recent-panel { position: sticky; top: 24px; }
#view-workspace .landing-recent-grid .home-work-card { box-shadow: none !important; border: 1px solid var(--border); border-radius: 10px; background: var(--card); }
#view-workspace .landing-recent-grid .home-work-card:hover { border-color: var(--brand); transform: translateY(-2px); }
#view-workspace .landing-recent-grid .home-work-cover { background: var(--brand-soft); }
#view-workspace .workspace-actions > .home-create-tip:first-child { margin-right: auto; }
#view-workspace .landing-start-section .home-cta-button { min-height: 44px; background: var(--brand); color: #fff; }
#view-workspace .landing-recent-grid { display: grid; grid-template-columns: 1fr !important; gap: 10px !important; padding: 14px !important; }
#view-workspace .landing-recent-grid .home-work-card { margin: 0; }

/* 两层编辑顶栏、240px 目录与按需工具抽屉，正文始终是主体。 */
body.hide-global-nav .container { padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: none !important; }
body.hide-global-nav #view-status .writer-shell { height: 100dvh !important; min-height: 0 !important; display: flex; flex-direction: column; border: 0 !important; border-radius: 0 !important; margin: 0 !important; background: var(--bg); }
#view-status .writer-unified-toolbar { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 66px 46px; height: 112px !important; min-height: 112px !important; padding: 0 24px !important; gap: 0 20px !important; flex: 0 0 112px; overflow: visible; background: var(--card) !important; border-bottom: 1px solid var(--border); }
#view-status .writer-toolbar-identity { position: static; width: auto; grid-column: 1; grid-row: 1; min-width: 0; padding-right: 0; }
#view-status .writer-toolbar-actions { display: flex; grid-column: 2; grid-row: 1; margin: 0; gap: 8px; }
#view-status .writer-work-title-row h1 { font-size: 17px; color: var(--text); }
#view-status .writer-work-meta { font-size: 11px; color: var(--muted); }
#view-status .writer-work-status { font-size: 10px; background: var(--brand-soft); color: var(--brand); }
#view-status .studio-editor-tools { grid-column: 1 / -1; grid-row: 2; display: flex; align-items: center; gap: 12px; min-width: 0; height: 46px; border-top: 1px solid var(--border); }
#view-status .studio-editor-tools .writer-tb-group { display: flex !important; align-items: center; gap: 4px; }
#view-status .studio-editor-tools .writer-task-control { margin-left: auto; }
#view-status .writer-tb-btn { height: 32px; min-height: 32px; border-radius: 7px; color: var(--text-sub); font-size: 12px; white-space: nowrap; }
#view-status .writer-tb-btn.primary { color: var(--brand); background: var(--brand-soft); }
#view-status #writerTopEditModeLabel, #view-status #writerTopPauseLabel { display: inline !important; }
#view-status .writer-toolbar-actions .writer-save-btn > span:last-child { display: inline !important; }
#view-status .writer-publish-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0; width: auto; min-width: 54px; min-height: 34px; padding: 0 20px; border-radius: 8px; background: #3266dc; color: #fff; }
#view-status .writer-publish-btn::before { display: none; content: none; }
#view-status .studio-editor-hint { color: var(--muted); font-size: 11px; white-space: nowrap; }
#view-status .writer-tb-divider { height: 18px; margin: 0 2px; }
#view-status #writerMobileChapterBtn { display: none; }
#view-status .writer-mobile-actions-btn { display: none; }
body.hide-global-nav #view-status .writer-body, #view-status .writer-body { display: flex; flex: 1 1 auto; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: hidden; position: relative; }
#view-status .writer-sidebar-left { position: relative; inset: auto; transform: none; width: 240px !important; min-width: 240px; flex: 0 0 240px !important; height: 100%; display: flex; flex-direction: column; background: var(--card) !important; border-right: 1px solid var(--border); box-shadow: none; }
#view-status .writer-workspace { display: flex; flex: 1 1 0; min-width: 0; min-height: 0; }
#view-status .writer-center { display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; min-height: 0; background: var(--bg) !important; }
#view-status .writer-center-scroll { display: block; flex: 1 1 0; min-height: 0; overflow: auto; padding: 28px 24px 36px; }
#view-status .writer-paper { box-sizing: border-box; width: min(100%, 840px) !important; max-width: 840px !important; min-height: 100%; margin: 0 auto; padding: 42px 48px 60px !important; border: 1px solid var(--border); border-radius: 12px !important; box-shadow: 0 4px 24px #233f6810 !important; background: var(--card) !important; }
#view-status .writer-prose { font-size: 20px; line-height: 2; letter-spacing: .035em; font-family: 'SimSun', 'Songti SC', serif; overflow-wrap: anywhere; color: var(--text); }
#view-status .writer-prose p { font-size: inherit !important; line-height: inherit !important; margin: 0 0 1.15em; }
#view-status .writer-chapter-title { font-size: 27px; line-height: 1.6; margin-bottom: 28px; color: var(--text); }
#view-status .writer-center.reading-paper .writer-paper { background: #fffdf9 !important; }
#view-status .writer-center.reading-white .writer-paper { background: #fff !important; }
#view-status .writer-center.reading-green .writer-paper { background: #e6f2e7 !important; }
#view-status .writer-center.reading-dark .writer-paper { background: #182336 !important; border-color: #30415a; }
#view-status .writer-center.reading-dark .writer-prose, #view-status .writer-center.reading-dark .writer-prose p, #view-status .writer-center.reading-dark .writer-chapter-title { color: #e1e8f5 !important; }
#view-status .writer-center.reading-paper .writer-prose, #view-status .writer-center.reading-paper .writer-prose p, #view-status .writer-center.reading-paper .writer-chapter-title,
#view-status .writer-center.reading-white .writer-prose, #view-status .writer-center.reading-white .writer-prose p, #view-status .writer-center.reading-white .writer-chapter-title,
#view-status .writer-center.reading-green .writer-prose, #view-status .writer-center.reading-green .writer-prose p, #view-status .writer-center.reading-green .writer-chapter-title { color: #263448 !important; }
#view-status .writer-center-footer { flex: 0 0 auto; padding: 10px 20px; min-height: 44px; background: var(--card); border-top: 1px solid var(--border); color: var(--text-sub); }
#view-status .writer-sl-list { flex: 1 1 0; min-height: 0; overflow-y: auto; }
#view-status .writer-sl-item { padding: 12px 10px; min-height: 60px; border-radius: 8px; }
#view-status .writer-sl-item .ch-title { font-size: 13px; line-height: 1.6; }
#view-status .writer-sl-item.active { background: var(--brand-soft); color: var(--brand); }
#view-status .writer-sidebar-right { position: absolute; z-index: 185; inset: 0 0 0 auto; display: flex; flex-direction: column; align-items: stretch; width: 276px !important; height: 100%; padding: 22px 18px !important; gap: 18px !important; background: var(--card) !important; border-left: 1px solid var(--border); transform: translateX(104%); visibility: hidden; overflow-y: auto; transition: transform .2s, visibility .2s; box-shadow: -12px 0 32px #14213a18; }
#view-status .tools-drawer-open .writer-sidebar-right { transform: translateX(0); visibility: visible; }
#view-status .studio-tools-head { display: grid; gap: 7px; }
.studio-tools-head strong { font-size: 16px; color: var(--text); }
.studio-tools-head small { font-size: 11px; color: var(--muted); }
.studio-tool-group > summary { cursor: pointer; font-size: 11px; color: var(--muted); padding: 4px 0 12px; }
.studio-tool-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
#view-status .writer-sidebar-right .writer-sr-item { display: flex !important; flex-direction: row !important; align-items: center; justify-content: flex-start; width: 100% !important; height: 44px !important; min-height: 44px; padding: 8px 10px !important; gap: 8px; border-radius: 8px; background: var(--card-2); border: 1px solid var(--border); color: var(--text-sub); }
#view-status .writer-sr-item .sr-icon { width: 18px; height: 18px; flex: 0 0 18px; }
#view-status .writer-sr-item .sr-label { font-size: 12px !important; writing-mode: horizontal-tb; }
#view-status .writer-sr-item.active { color: var(--brand); background: var(--brand-soft); box-shadow: none; }
#view-status .writer-tool-count { position: static; margin-left: auto; font-size: 9px; }
#view-status .writer-geninfo-panel { position: absolute; right: 0 !important; top: 0; bottom: 0; z-index: 190; width: min(440px, calc(100% - 32px)) !important; max-width: 440px !important; height: 100%; box-shadow: -12px 0 32px #14213a20; background: var(--card); }
#view-status .writer-pop-panel { top: 112px !important; max-height: calc(100dvh - 136px); overflow-y: auto; }
#view-status .writer-mobile-tools-btn { display: none !important; }
#view-status .writer-shell.tools-drawer-open .writer-mobile-scrim, #view-status .writer-shell.chapter-drawer-open .writer-mobile-scrim { display: block; position: absolute; inset: 0; z-index: 180; background: #15233b38; }
#view-status .writer-sidebar-close { display: none; }
#view-status .writer-sl-header { padding: 16px 14px 12px; }
#view-status .writer-sl-title-row strong { font-size: 14px; color: var(--text); }
#view-status .writer-sl-list { padding: 8px; }
#view-status .writer-sidebar-right { border-left: 1px solid var(--border); }
#view-status .writer-tools-caption { color: var(--text-sub); font-size: 10px; letter-spacing: .08em; }
#view-status .writer-workspace { flex-direction: column; background: var(--card-2); }
#view-status .writer-workspace > .writer-center { min-height: 0; }
#view-status .writer-live-progress { padding: 10px 16px; border-bottom: 1px solid var(--border); }
#view-status .writer-center-scroll { scrollbar-gutter: stable; }
#view-status .writer-model-output { flex: 0 0 auto; width: 100%; max-width: none; border-left: 0; border-top: 1px solid var(--border); }
#view-status .writer-model-output-head { min-height: 42px; padding: 8px 16px; color: var(--text-sub); }
#view-status .writer-model-output-head strong { color: var(--text); }
#view-status .writer-model-output.is-collapsed { flex: 0 0 auto; }
#view-status .writer-model-output.is-collapsed .writer-model-output-head { flex-direction: row; padding: 8px 16px; }
#view-status .writer-model-output.is-collapsed .writer-model-output-head strong { writing-mode: horizontal-tb; }
#view-status .writer-model-output.is-collapsed .writer-model-output-head > :not(strong):not(button) { display: inline-flex; }
#view-status .writer-model-output.is-collapsed .writer-model-output-head > label { display: none; }
#view-status #writerModelOutputToggle { margin-left: auto; padding: 5px 12px; min-height: 28px; }
#view-status .writer-model-output { height: min(180px, 24dvh); max-height: 180px; overflow: hidden; }
#view-status .writer-model-output.is-collapsed { height: 42px; max-height: 42px; }
#view-status .writer-model-output-body { flex: 1 1 0; height: auto; min-height: 0; max-height: 138px; overflow: auto; }
#view-status .studio-output-note { color: var(--muted); font-size: 10px; }
#view-status .writer-model-output.is-collapsed .writer-model-output-head > .studio-output-note { display: inline; }
#view-status .writer-model-output-head { flex-wrap: nowrap; height: 42px; min-height: 42px; box-sizing: border-box; }
#view-status .writer-model-output-head label { white-space: nowrap; }
#view-status .writer-model-output-body[hidden], #view-status [data-outline-review-only][hidden] { display: none !important; }
#view-status .writer-geninfo-panel { border-left: 1px solid var(--border); }
#view-status .writer-panel-subtitle { color: var(--text-sub); line-height: 1.6; }
#view-status .writer-task-config-list > div { gap: 12px; }
#view-status .writer-task-config-list strong { color: var(--text); }

@media (max-width: 1180px) {
  #view-workspace .landing-main-grid { grid-template-columns: minmax(0, 1fr); }
  #view-workspace .landing-recent-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #view-home .landing-hero { gap: 20px; padding: 24px !important; }
}
@media (max-width: 800px) {
  #view-home .landing-hero, #view-home .landing-two-col { grid-template-columns: 1fr; }
  #view-home .landing-hero { padding: 22px !important; }
  #view-home .home-flow-preview ol { grid-template-columns: 1fr 1fr; }
  #view-workspace .workspace-create-form .home-create-grid { grid-template-columns: 1fr; }
  #view-workspace .workspace-page-head { align-items: flex-start; }
  #view-workspace .workspace-page-head h2 { font-size: 23px; }
}
@media (max-width: 600px) {
  #view-home .workspace-main, #view-workspace .workspace-main { padding: 16px 12px 28px; }
  #view-home .landing-hero .home-hero-actions { flex-direction: row; }
  #view-home .landing-hero .home-hero-actions button { flex: 1; min-height: 42px; }
  #view-home .home-flow-preview { padding: 14px; }
  #view-home .home-flow-preview ol { grid-template-columns: 1fr; }
  #view-home .landing-feature-grid { grid-template-columns: 1fr 1fr; }
  #view-home .landing-feature-card { padding: 12px; }
  #view-home .landing-section { padding: 16px; }
  #view-workspace .workspace-page-head { flex-direction: column; gap: 12px; }
  #view-workspace .workspace-body { padding: 14px; }
  #view-workspace .landing-panel-head { padding: 14px; }
  #view-workspace .home-stage-options-grid, #view-workspace .home-field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #view-workspace .home-chapter-scale-grid { grid-template-columns: 1fr 1fr; }
  #view-workspace .home-chapter-scale-grid > div:first-child { grid-column: 1 / -1; }
  #view-workspace .home-advanced-toggle small { display: block; margin: 4px 0 0; }
  #view-workspace .workspace-actions { gap: 10px; }
  #view-workspace .workspace-actions > span { flex: 1 1 100%; margin: 0; }
  #view-workspace .home-cta-button { width: 100%; justify-content: center; }
  #view-workspace .landing-recent-grid { grid-template-columns: 1fr !important; }
  #view-status .writer-model-output-head, #view-status .writer-model-output.is-collapsed .writer-model-output-head { padding: 8px 10px; gap: 6px; }
  #view-status #writerModelOutputModel { max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #view-status .writer-model-output-body { height: auto; }
}
@media (min-width: 1500px) { #view-workspace .landing-main-grid { grid-template-columns: minmax(0, 1fr) 318px; } }
@media (min-width: 1181px) and (max-width: 1330px) {
  #view-workspace .workspace-body { padding: 20px; }
  #view-workspace .landing-main-grid { gap: 20px; grid-template-columns: minmax(0, 1fr) 260px; }
  #view-workspace .workspace-create-form .home-create-grid { gap: 12px; }
}
@media (max-width: 1180px) { #view-workspace .landing-recent-panel { position: static; } }
@media (max-width: 900px) {
  #view-status #writerMobileChapterBtn { display: inline-flex; }
  #view-status .writer-sidebar-left { position: absolute; z-index: 185; left: 0; top: 0; bottom: 0; transform: translateX(-104%); visibility: hidden; }
  #view-status .chapter-drawer-open .writer-sidebar-left { transform: translateX(0); visibility: visible; box-shadow: 12px 0 32px #14213a20; }
  #view-status .writer-sidebar-close { display: block; }
  #view-status .studio-editor-hint { display: none; }
  #view-status .writer-center-scroll { padding: 20px; }
}
@media (max-width: 700px) {
  #view-workspace .workspace-page-head { padding: 24px; min-height: 165px; }
  .studio-hero-art { display: none; }
  #view-workspace .workspace-page-head h2 { font-size: 28px; }
  #view-workspace .studio-form-badge { display: none; }
  #view-workspace .studio-idea-foot > span { max-width: 78%; line-height: 1.7; }
  #view-workspace .workspace-actions .studio-submit-copy { flex: 1 1 100%; }
  body.hide-global-nav #view-status .writer-shell { height: 100dvh !important; }
  #view-status .writer-unified-toolbar { padding: 0 12px !important; grid-template-rows: 62px 46px; height: 108px !important; min-height: 108px !important; flex-basis: 108px; column-gap: 8px !important; }
  #view-status .writer-work-title-row h1 { max-width: 40vw; font-size: 15px; }
  #view-status .writer-work-meta { gap: 7px; }
  #view-status .writer-work-meta #writerWorkQualityMeta { display: none; }
  #view-status .writer-toolbar-actions .writer-copy-btn, #view-status .writer-toolbar-actions #writerThemeBtn { display: none !important; }
  #view-status .writer-toolbar-actions { gap: 4px; }
  #view-status .writer-toolbar-actions .writer-tb-btn { padding: 0 7px; font-size: 11px; }
  #view-status .writer-toolbar-actions .writer-tb-icon { display: none; }
  #view-status .writer-publish-btn { min-height: 30px; padding: 0 10px; font-size: 11px; }
  #view-status .studio-editor-tools { gap: 3px; overflow: visible; }
  #view-status .studio-editor-tools .writer-tb-btn { padding: 0 7px; font-size: 11px; gap: 4px; }
  #view-status .writer-tb-btn span:last-child { display: inline; }
  #view-status .writer-toolbar-actions .writer-tb-btn > span:last-child { display: inline; }
  #view-status .writer-toolbar-actions .writer-tb-icon { display: none !important; }
  #view-status .studio-editor-tools .writer-tb-btn > :first-child:not(:last-child) { display: none; }
  #view-status .studio-editor-tools .writer-secondary-tools { display: none !important; }
  #view-status .writer-mobile-actions-btn { display: inline-flex !important; position: static; width: 30px; min-width: 30px; height: 30px; align-items: center; justify-content: center; margin: 0; }
  #view-status .writer-center-scroll { padding: 12px 8px 20px; }
  #view-status .writer-paper { padding: 28px 22px 44px !important; border-radius: 8px !important; }
  #view-status .writer-chapter-title { font-size: 23px; }
  #view-status .writer-prose { font-size: 19px; letter-spacing: .02em; }
  #view-status .writer-live-progress { padding: 8px 12px; gap: 8px; }
  #view-status .writer-live-progress-copy span { max-width: 40vw; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  #view-status .writer-center-footer { padding: 8px 10px; flex-wrap: wrap; gap: 6px; }
  #view-status .writer-footer-plan { display: none; }
  #view-status .writer-model-output-head > .studio-output-note, #view-status .writer-model-output.is-collapsed .writer-model-output-head > .studio-output-note { display: none; }
  #view-status .writer-pop-panel { top: 108px !important; left: 8px !important; width: min(360px, calc(100% - 16px)); }
  #view-status .writer-model-output-head label { font-size: 10px; }
  #view-status .writer-geninfo-panel { width: min(440px, 100%) !important; }
}
@media (prefers-reduced-motion: reduce) { .studio-hero-art *, #view-status .writer-sidebar-right { transition: none !important; } }


/* 退出编辑 / 返回作品列表前的未保存确认（dialog 三态：保存 / 不保存 / 取消） */
.writer-unsaved-dialog { width: min(460px, calc(100% - 24px)); }
.writer-unsaved-dialog .experience-dialog-head { margin-bottom: 14px; }
.writer-unsaved-text { margin: 0; font-size: 14px; line-height: 1.8; color: var(--text); }
.writer-unsaved-hint { margin: 10px 0 0; font-size: 12px; line-height: 1.7; color: var(--text-sub); }
.writer-unsaved-dialog .experience-dialog-actions { margin-top: 20px; }
.writer-unsaved-dialog .experience-dialog-actions [data-act="save"] { color: var(--on-brand, #fff); background: var(--brand); border-color: var(--brand); }
.writer-unsaved-dialog .experience-dialog-actions [data-act="save"]:hover { filter: brightness(1.05); }
.writer-unsaved-dialog .experience-dialog-actions [data-act="discard"] { color: var(--state-error, #b44642); }

/* 大纲待确认横幅：写作页顶部直接给「修改大纲 / 确认生成」入口 */
.writer-outline-ready { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 10px 14px 0; padding: 10px 14px; background: var(--card); border: 1px solid var(--border); border-left: 3px solid var(--brand); border-radius: 8px; color: var(--text); }
.writer-outline-ready[hidden] { display: none !important; }
.writer-outline-ready-copy { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; min-width: 0; }
.writer-outline-ready-copy strong { font-size: 13px; font-weight: 700; }
.writer-outline-ready-copy span { font-size: 12px; color: var(--text-sub); line-height: 1.6; }
.writer-outline-ready-actions { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 720px) {
  .writer-outline-ready { margin: 8px 8px 0; padding: 9px 10px; gap: 8px; }
  .writer-outline-ready-copy span { font-size: 11.5px; }
  .writer-outline-ready-actions { width: 100%; }
  .writer-outline-ready-actions .btn-mini { flex: 1; justify-content: center; }
}

/* 工具面板精简合并：大纲三视图与「记忆与伏笔」顶部切换 */
.writer-outline-view-tabs { margin: 0 0 12px; }
.writer-compare-entry .btn-mini { margin-top: 8px; }

/* 新建时的创作简报：先固定作品定位，再生成法典/角色/大纲 */
.workspace-publish-brief { margin-top: 14px; }
.workspace-publish-brief > h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin: 0; }
.workspace-publish-brief > h3 small, .workspace-brief-more summary small { color: var(--muted); font-size: 11px; font-weight: 400; }
.workspace-brief-more { margin-top: 14px; border-top: 1px solid var(--border); padding-top: 12px; }
.workspace-brief-more > summary { cursor: pointer; color: var(--text); font-size: 12px; font-weight: 600; }
.workspace-brief-more > .publish-brief-grid { margin-top: 12px; }
.publish-brief-grid > label[hidden] { display: none; }
.workspace-publish-brief > summary { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 8px; }
.workspace-publish-brief > summary::-webkit-details-marker { display: none; }
.workspace-publish-brief > summary::after { content: '＋'; margin-left: auto; color: var(--muted); font-weight: 400; }
.workspace-publish-brief[open] > summary::after { content: '−'; }
.workspace-publish-brief > summary small { color: var(--muted); font-weight: 400; font-size: 11px; }
.workspace-publish-brief-tip { margin: 8px 0 12px; color: var(--text-sub); font-size: 11.5px; line-height: 1.7; }
.publish-brief-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 10px; }
.publish-brief-grid > label { display: flex; flex-direction: column; gap: 5px; color: var(--text-sub); font-size: 11px; }
.publish-brief-grid .home-field-input, .publish-brief-grid .home-field-textarea { width: 100%; box-sizing: border-box; }
.publish-brief-wide { grid-column: 1 / -1; }
.workspace-publish-brief-foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 7px; color: var(--muted); font-size: 10.5px; }
@media (max-width: 720px) { .publish-brief-grid { grid-template-columns: 1fr; } .publish-brief-wide { grid-column: auto; } }

/* 发布参考：标签和字段固定分列，提示在字段内独占一行，避免挤压输入框。 */
.publish-ref { container-type: inline-size; min-width: 0; font-size: 13px; line-height: 1.6; letter-spacing: normal; }
.publish-ref-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.publish-ref-heading h3 { margin: 0; font-size: 16px; line-height: 1.5; }
.publish-ref-badge { padding: 2px 8px; border-radius: 5px; background: var(--card-2); color: var(--text-sub); font-size: 11px; white-space: nowrap; }
.publish-ref .writer-outline-section-note { margin: 8px 0 14px; font-size: 12px; line-height: 1.7; }
.publish-ref-row { display: grid; grid-template-columns: 88px minmax(0, 1fr); align-items: start; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--border); }
.publish-ref-row:last-child { border-bottom: 0; padding-bottom: 0; }
.publish-ref-row > label { padding-top: 8px; color: var(--text); font-size: 12px; font-weight: 600; white-space: nowrap; }
.publish-ref-row > label i { font-style: normal; color: #e5484d; margin-left: 2px; font-size: 10px; }
.publish-ref-field { min-width: 0; }
.publish-ref-ctrl { min-width: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.publish-ref .publish-ref-ctrl .input-mini { flex: 1 1 140px; width: 0; min-width: 0; max-width: 100%; min-height: 36px; margin: 0; padding: 8px 10px; box-sizing: border-box; font: inherit; line-height: 1.5; color: var(--text); background: var(--input-bg, var(--card)); border: 1px solid var(--border); border-radius: 6px; }
.publish-ref-ctrl .btn-mini { flex: 0 0 auto; min-height: 32px; padding: 6px 12px; margin: 0; white-space: nowrap; }
.publish-ref .publish-ref-ctrl textarea { flex: 1 0 100%; width: 100%; min-width: 0; min-height: 156px; max-width: 100%; box-sizing: border-box; margin: 0; padding: 10px 12px; font: inherit; line-height: 1.8; color: var(--text); background: var(--input-bg, var(--card)); border: 1px solid var(--border); border-radius: 6px; resize: vertical; }
.publish-ref .input-mini:focus-visible, .publish-ref textarea:focus-visible, .publish-chip:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.publish-ref-hint { display: block; margin-top: 6px; color: var(--muted); font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
.publish-static { display: inline-flex; align-items: center; min-height: 34px; color: var(--text-sub); font-size: 13px; white-space: nowrap; }
.publish-chip { flex: 0 0 auto; min-height: 32px; padding: 5px 12px; border: 1px solid var(--border); background: var(--card-2); color: var(--text-sub); border-radius: 6px; font-size: 12px; line-height: 1.5; white-space: nowrap; cursor: pointer; transition: color .15s, border-color .15s, background .15s; }
.publish-chip:hover { color: var(--text); border-color: var(--brand); }
.publish-chip.on { color: var(--brand); border-color: var(--brand); background: var(--brand-soft, var(--card-2)); font-weight: 600; }
.publish-chips { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 6px; }
.publish-chips:empty { display: none; }
.publish-ref-actions { flex-basis: 100%; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.publish-ref-actions span { margin-right: auto; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
@container (max-width: 480px) {
  .publish-ref-row { grid-template-columns: minmax(0, 1fr); gap: 7px; padding: 12px 0; }
  .publish-ref-row > label { padding-top: 0; }
}
@media (max-width: 720px) {
  .publish-ref-row { grid-template-columns: minmax(0, 1fr); gap: 7px; padding: 12px 0; }
  .publish-ref-row > label { padding-top: 0; }
}
