/* 知屿写作新版样式包；按入口原顺序合并。 */ /* source: ./styles/app/00-foundation.css?v=202607280442 */ /* 基础变量、夜间模式和全局主题修正 */ :root { --bg: #ebeef2; --bg-card: #fff; --bg-input: #fff; --text: #1e1e28; --text-muted: #6e6e7a; --border: #e2e5ea; --sidebar-bg: #1a1d2b; --sidebar-text: #e8e8ee; --accent: #1a1d2b; --btn-dark-bg: #1a1d2b; --btn-dark-text: #fff; --btn-outline-bg: #fff; --btn-outline-text: #3a3a44; --fs-xs: 10px; --fs-sm: 12px; --fs-md: 13px; --fs-base: 14px; --fs-lg: 16px; --fs-xl: 18px; --fs-2xl: 20px; --fs-3xl: 24px; } [data-theme="dark"] { --bg: #14161e; --bg-card: #1e202a; --bg-input: #262834; --text: #d8dae2; --text-muted: #8e909a; --border: #2e3040; --sidebar-bg: #0e0f16; --sidebar-text: #d8dae2; --accent: #2e3040; --btn-dark-bg: #d8dae2; --btn-dark-text: #14161e; --btn-outline-bg: #1e202a; --btn-outline-text: #d8dae2; } [data-theme="dark"] .write-body { color: var(--text); } [data-theme="dark"] .write-body::before { color: #6e707a; } [data-theme="dark"] .write-body:empty:before { color: #6e707a; } [data-theme="dark"] .write-plot { } [data-theme="dark"] .word-stats { color: var(--text); } [data-theme="dark"] .main-content { background-color: var(--bg-card); } [data-theme="dark"] .overview-card { background-color: #1e2430; } [data-theme="dark"] .book-card { background-color: #1e2430; } [data-theme="dark"] .chapter-item { color: var(--text); } [data-theme="dark"] .chapter-item:hover { background-color: #2e3040; } [data-theme="dark"] .chapter-item.selected { background-color: #3e4050; } [data-theme="dark"] .vol-item.selected { background-color: #3e4050; } [data-theme="dark"] .vol-item { color: var(--text); } [data-theme="dark"] .vol-item:hover { background-color: #2e3040; } [data-theme="dark"] .tab-item { color: var(--text-muted); } [data-theme="dark"] .tab-item.active { color: var(--text); border-bottom-color: var(--text); } [data-theme="dark"] .card { background-color: #1e2430; } [data-theme="dark"] .modal-box { background: var(--bg-card); color: var(--text); } [data-theme="dark"] .context-menu { background: var(--bg-card); color: var(--text); border-color: var(--border); } [data-theme="dark"] .outline-result { background: var(--bg-card); color: var(--text); border-color: var(--border); } [data-theme="dark"] .hotlist-box { background: var(--bg-card); border-color: var(--border); } [data-theme="dark"] .genre-tag { background: var(--bg-card); color: var(--text); border-color: var(--border); } [data-theme="dark"] .genre-tag.selected { background: var(--text); color: var(--bg); border-color: var(--text); } [data-theme="dark"] .wordcount-option { background: var(--bg-card); color: var(--text); border-color: var(--border); } [data-theme="dark"] .wordcount-option.selected { background: var(--text); color: var(--bg); border-color: var(--text); } [data-theme="dark"] .write-catalog { } [data-theme="dark"] .ref-top-bar { background: var(--bg-card); color: var(--text-muted); border-bottom-color: var(--border); } [data-theme="dark"] .btn-outline { background-color: var(--btn-outline-bg); color: var(--btn-outline-text); border-color: var(--border); } [data-theme="dark"] .btn-card-act { background: var(--bg-card); color: var(--text); border-color: var(--border); } [data-theme="dark"] .btn-card-act:hover { background: #2e3040; border-color: #4e5060; } [data-theme="dark"] .btn-card-act.danger { color: #e05555; border-color: #5e3030; } [data-theme="dark"] .btn-card-act.danger:hover { background: #3e2020; } [data-theme="dark"] .modal-overlay { background: rgba(0,0,0,0.6); } [data-theme="dark"] .comment-form textarea { background: var(--bg-input); color: var(--text); border-color: var(--border); } [data-theme="dark"] .write-plot textarea { color: var(--text); } [data-theme="dark"] #edPreview th { background: #2e3040; } [data-theme="dark"] #edPreview th, [data-theme="dark"] #edPreview td { border-color: var(--border); } [data-theme="dark"] .ref-chapter-row:hover { background: #2e3040; } [data-theme="dark"] .write-catalog .catalog-refs { border-top-color: var(--border); } [data-theme="dark"] .tree-folder { color: var(--text); } [data-theme="dark"] .tree-file { color: var(--text-muted); } [data-theme="dark"] .tree-file:hover { background: #2e3040; } /* source: ./styles/app/10-shared-ui.css?v=202607280442 */ /* 关联文件卡片、通用按钮、弹窗基础和文件树 */ /* 关联文件卡片 */ .link-file-card { background: #fff; border-color: #e8ecf1; } .link-file-card.checked { background: #e3f2fd; border-color: #90caf9; } .link-file-card:hover { background: #f5f7fa; } .link-file-card.checked:hover { background: #d6e9fa; } .modal-overlay.memory-link-modal { z-index: 10030; } .modal-box.memory-link-modal-box { width: 85%; max-width: 1000px; } .memory-link-modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; } .memory-link-modal-header h3 { margin: 0; } .memory-link-modal-actions { display: flex; gap: 6px; align-items: center; } .memory-link-modal-close { margin-left: 8px; border: 0; padding: 0; background: transparent; color: inherit; cursor: pointer; font-size: 22px; line-height: 1; } .memory-link-layout { display: flex; gap: 16px; height: 500px; min-height: 0; } .memory-link-folders { width: 25%; flex-shrink: 0; overflow-y: auto; border-right: 1px solid #e2e5ea; padding-right: 8px; } .memory-link-tree { flex: 1; min-width: 0; overflow: hidden; background: #fafbfc; border-radius: 8px; padding: 12px; display: flex; flex-direction: column; gap: 10px; } .memory-link-modal-footer { margin-top: 12px; display: flex; justify-content: space-between; gap: 10px; } .link-folder-item { display: flex; align-items: center; gap: 6px; padding: 8px 10px; cursor: pointer; border-radius: 6px; font-size: 13px; } .link-folder-item:hover { background: #f0f7ff; } .link-folder-item.active { background: #e3f2fd; font-weight: 600; } .link-folder-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .link-folder-count { margin-left: auto; color: #999; font-size: 11px; } .memory-link-section { display: flex; flex-direction: column; min-height: 0; padding-top: 10px; border-top: 1px dashed #d4d8de; } .memory-link-section:first-child { border-top: 0; padding-top: 0; } .memory-link-section-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; color: #5f6b7a; font-size: 12px; font-weight: 700; } .memory-link-section-body { min-height: 76px; overflow-y: auto; padding-right: 2px; } .memory-link-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; } .memory-link-empty { padding: 8px 2px; color: #8b8d98; font-size: 12px; } .memory-link-empty.selected { padding-top: 6px; padding-bottom: 6px; } .memory-link-selected-list { display: flex; flex-wrap: wrap; gap: 6px; } .memory-link-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 180px; padding: 5px 8px; border: 1px solid #dbe6f3; border-radius: 999px; background: #e3f2fd; color: #1f2937; font-size: 12px; } .memory-link-chip > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .memory-link-chip-remove { border: 0; padding: 0; background: transparent; color: #64748b; cursor: pointer; font-size: 14px; font-weight: 700; line-height: 1; } .memory-link-grid .link-file-card { position: relative; display: flex; flex-direction: column; align-items: center; min-width: 0; padding: 14px 6px 10px; border: 1.5px solid #e8ecf1; border-radius: 8px; cursor: pointer; } .memory-link-grid .link-file-cb { position: absolute; top: 6px; right: 6px; width: 16px; height: 16px; cursor: pointer; z-index: 1; } .memory-link-card-icon { line-height: 1.2; pointer-events: none; } .memory-link-card-name { margin-top: 4px; overflow: hidden; color: #555; font-size: 11px; line-height: 1.3; text-align: center; word-break: break-all; pointer-events: none; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } [data-theme="dark"] .link-file-card { background: #1e1f2b; border-color: #3a3d50; } [data-theme="dark"] .link-file-card.checked { background: #1a2740; border-color: #3b5998; } [data-theme="dark"] .link-file-card:hover { background: #282a36; } [data-theme="dark"] .link-file-card.checked:hover { background: #1e2f4a; } [data-theme="dark"] .memory-link-tree { background: #20232e; } [data-theme="dark"] .memory-link-folders { border-right-color: #3a4052; } [data-theme="dark"] .link-folder-item:hover { background: #292e3b; } [data-theme="dark"] .link-folder-item.active { background: #26354a; } [data-theme="dark"] .memory-link-section { border-top-color: #3a4052; } [data-theme="dark"] .memory-link-section-title { color: #aeb5c4; } [data-theme="dark"] .memory-link-chip { border-color: #3b5998; background: #1a2740; color: #eef2f8; } [data-theme="dark"] .memory-link-card-name { color: #d9deea; } @media (max-width: 760px) { .modal-box.memory-link-modal-box { width: 94vw; } .memory-link-layout { height: min(500px, 68vh); gap: 10px; } .memory-link-folders { width: 34%; } .memory-link-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .line-icon { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; flex-shrink:0; color:#111827; vertical-align:-4px; box-sizing:border-box; } .line-icon svg { width:100%; height:100%; display:block; stroke:currentColor; fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; } .chapter-item .line-icon { margin-right:6px; } .link-file-card .line-icon { width:30px; height:32px; margin-top:2px; color:#111827; } #memTree .line-icon { width:30px; height:32px; color:#111827; } [data-theme="dark"] .line-icon { color:#e5e7eb; } [data-theme="dark"] .comment-header { color: var(--text-muted); } [data-theme="dark"] .comment-content { color: var(--text); } [data-theme="dark"] #stepLog { color: var(--text-muted); } [data-theme="dark"] #plotInput::placeholder { color: var(--text-muted); opacity: 1; } [data-theme="dark"] .model-card-item { background: var(--bg-card); color: var(--text); } [data-theme="dark"] .model-card-item.selected { background: #1e3035; } [data-theme="dark"] .model-card-item .official-badge { background: #1e3035; color: #4caf50; } [data-theme="dark"] .modal-box h3 { color: var(--text); } [data-theme="dark"] .modal-box label { color: var(--text-muted); } .toggle-slider:before { content:''; position:absolute; width:18px; height:18px; left:3px; bottom:3px; background:#fff; border-radius:50%; transition:0.3s; } #darkModeToggle:checked + .toggle-slider { background:#32364a; } #darkModeToggle:checked + .toggle-slider:before { transform:translateX(20px); } .toggle-slider { position: relative; display: inline-block; width: 44px; height: 24px; border-radius: 24px; transition: 0.3s; cursor: pointer; } .toggle-slider:before { content: ''; position: absolute; width: 18px; height: 18px; left: 3px; bottom: 3px; background: #fff; border-radius: 50%; transition: 0.3s; } * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; height: 100vh; background-color: var(--bg); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; color: var(--text); } .sidebar { background-color: var(--sidebar-bg); color: var(--sidebar-text); } .sidebar { width: 180px; background-color: #1a1d2b; color: #fff; padding: 20px 15px; display: flex; flex-direction: column; border-radius: 0; margin: 15px 0; height: calc(100vh - 30px); position: relative; transition: width 0.3s; overflow: hidden; flex-shrink: 0; } .sidebar.collapsed { width: 60px; padding: 20px 10px; } .collapse-btn { position: absolute; top: 15px; right: 10px; cursor: pointer; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; background: transparent; font-size: 16px; color: #fff; z-index: 20; transition: all 0.3s; } .sidebar.collapsed .collapse-btn { right: auto; left: 50%; top: 15px; transform: translateX(-50%); z-index: 30; } .sidebar .logo { text-align: left; padding-left: 8px; font-weight: bold; font-size: 18px; margin-top: 30px; margin-bottom: 2px; white-space: nowrap; transition: opacity 0.3s; color: #FFC125; } .sidebar .logo-sub { text-align: left; padding-left: 8px; font-size: 11px; color: #FFC125; margin-bottom: 18px; letter-spacing: 1px; white-space: nowrap; } .sidebar.collapsed .logo { opacity: 0; height: 0; margin: 0; overflow: hidden; } .sidebar.collapsed .logo-sub { opacity: 0; height: 0; margin: 0; overflow: hidden; } .nav { display: flex; flex-direction: column; gap: 12px; flex: 1; margin-top: 8px; } .nav-item { padding: 10px 12px; border-radius: 10px; cursor: pointer; font-size: 15px; transition: none; color: #fff; display: flex; align-items: center; justify-content: center; gap: 8px; white-space: nowrap; } .nav-item.active { background-color: var(--bg-card); color: #000; font-weight: bold; border-radius: 18px 0 0 18px; margin-right: -15px; padding-right: 24px; position: relative; z-index: 2; overflow: visible; } .nav-item.active::before, .nav-item.active::after { content: ''; position: absolute; right: 0; width: 18px; height: 18px; pointer-events: none; background: transparent; } .nav-item.active::before { top: -18px; border-bottom-right-radius: 18px; box-shadow: 8px 8px 0 8px var(--bg-card); } .nav-item.active::after { bottom: -18px; border-top-right-radius: 18px; box-shadow: 8px -8px 0 8px var(--bg-card); } .nav-item svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; } .nav-item.active svg { stroke: #000; } .sidebar.collapsed .nav-item span { display: none; } .sidebar.collapsed .nav-item { justify-content: center; padding: 8px; margin: 0; } .sidebar.collapsed .nav-item.active { border-radius: 14px; margin-right: 0; padding-right: 8px; } .sidebar.collapsed .nav-item.active::before, .sidebar.collapsed .nav-item.active::after { display: none; } .sidebar.collapsed .nav { margin-top: 70px; gap: 8px; } .sidebar.collapsed #homeBtn { left: 50%; top: 48px; transform: translateX(-50%); } .sidebar-help-entry { display: grid; gap: 12px; margin-top: 0; padding: 0; } .sidebar-help-btn { width: 100%; min-height: 38px; border: none; border-radius: 10px; background: transparent; color: #fff; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 12px; font-size: 15px; font-weight: 400; line-height: 1.2; cursor: pointer; text-align: center; position: relative; } .sidebar-help-btn:hover { background: rgba(255,255,255,0.08); } .sidebar-help-btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; position: static; } .sidebar-help-btn span { display: block; width: auto; text-align: center; color: #fff; font-size: 15px; font-weight: 400; } .sidebar.collapsed .sidebar-help-btn span { display: none; } .sidebar.collapsed .sidebar-help-btn svg { position: static; } .sidebar.collapsed .sidebar-help-entry { display: none; } .version { text-align: center; font-size: 11px; color: #8b8d98; margin-top: 10px; } .main-container { flex: 1; display: flex; flex-direction: column; padding: 15px 15px 0 0; gap: 0; } .header { display: flex; justify-content: space-between; align-items: center; padding: 0 20px; font-size: 18px; } .header-left { display: flex; gap: 40px; } .header-right { display: flex; gap: 20px; align-items: center; } .tab-item { cursor: pointer; padding-bottom: 5px; border-bottom: 3px solid transparent; color: #6e6e7a; transition: 0.2s; user-select: none; } .tab-item.active { color: #000; font-weight: bold; border-bottom-color: #000; } .content-wrapper { display: flex; gap: 0; flex: 1; overflow: hidden; } .main-content { flex: 1; background-color: var(--bg-card); border-radius: 0; padding: 25px; display: flex; flex-direction: column; gap: 20px; overflow: hidden; } .card { background-color: #ebf5ff; border-radius: 20px; padding: 20px; transition: transform 0.2s, box-shadow 0.2s; } .card:hover { transform: translateY(-4px); box-shadow: 0 10px 28px rgba(0,0,0,0.10); } .btn { padding: 10px 18px; border-radius: 20px; cursor: pointer; font-size: 14px; border: none; outline: none; transition: all 0.2s; display: inline-flex; align-items: center; gap: 6px; } .btn-dark { background-color: var(--btn-dark-bg); color: var(--btn-dark-text); } .btn-dark:hover { opacity: 0.85; } .btn-outline { background-color: var(--btn-outline-bg); color: var(--btn-outline-text); border: 1px solid var(--border); } .btn-outline:hover { filter: brightness(0.95); } .btn-outline.active { background-color: var(--btn-dark-bg); color: var(--btn-dark-text); border-color: var(--btn-dark-bg); } .btn-sm { padding: 6px 14px; font-size: 13px; border-radius: 15px; } .btn-card-act { padding: 5px 12px; font-size: 12px; border-radius: 8px; cursor: pointer; border: 1px solid #d4d8de; background: #fff; color: #444; transition: all 0.15s; } .btn-card-act:hover { background: #e8ebf0; border-color: #bcc0c8; } .btn-card-act.danger { color: #c0392b; border-color: #e8d0d0; } .btn-card-act.danger:hover { background: #fdf2f2; } #edPreview table { border-collapse: collapse; width: auto; max-width: 100%; font-size: 12px; } #edPreview th, #edPreview td { border: 1px solid #d4d8de; padding: 6px 10px; text-align: left; vertical-align: top; } #edPreview th { background: #e8ebf0; font-weight: 600; white-space: nowrap; } #edPreview td { word-break: break-word; } input, textarea, select { width: 100%; padding: 10px 14px; border: 1px solid var(--border); border-radius: 12px; font-size: 14px; outline: none; background: var(--bg-input); color: var(--text); transition: border 0.2s; } input:focus, textarea:focus, select:focus { border-color: var(--border); outline: none; } #plotInput::placeholder { font-size:13px; font-family:inherit; color:#8b8d98; opacity:1; } [contenteditable="true"]:focus { outline: none; } textarea { resize: vertical; min-height: 60px; max-height: 200px; overflow-y: auto; } .page { display: none; flex-direction: column; gap: 20px; flex: 1; overflow-y: auto; } .page.active { display: flex; } #page-write { margin-left: 0; } .overview-cards { display: flex; gap: 20px; flex-wrap: wrap; align-content: flex-start; } .overview-card { width: 200px; min-height: 160px; background-color: #ebf5ff; border-radius: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s; } .overview-card:hover { transform: translateY(-4px); box-shadow: 0 10px 28px rgba(0,0,0,0.10); } .book-card { width: 320px; min-height: 210px; background-color: #ebf5ff; border-radius: 16px !important; padding: 14px; display: flex; flex-direction: column; gap: 6px; position: relative; transition: transform 0.2s, box-shadow 0.2s; overflow: hidden; } .book-card:hover { transform: translateY(-4px); box-shadow: 0 10px 28px rgba(0,0,0,0.12); border-color: #a0d8f0; } .book-card .cover-img { width: 100%; height: 100px; object-fit: cover; border-radius: 10px; margin-bottom: 6px; display: none; } .book-card .cover-img.show { display: block; } .batch-check { position: absolute; top: 10px; right: 10px; width: 22px; height: 22px; cursor: pointer; display: none; } .batch-mode .batch-check { display: block !important; } .batch-mode .book-card { padding-top: 36px; } .mem-tree-batch-mode #memTree .tree-checkbox { display: block !important; } .mem-tree-batch-mode .tree-folder > .tree-checkbox { display: inline-block !important; margin-right: 10px; } .mem-tree-batch-mode .tree-folder > .tree-checkbox:first-child { margin-right: 8px; } .write-layout { display: flex; gap: 2px; flex: 1; overflow: hidden; } .write-catalog { width: 220px; flex-shrink: 0; padding: 14px 4px 14px 7px; overflow: hidden; display: flex; flex-direction: column; } .write-catalog .catalog-refs { flex-shrink: 0; border-top: 1px dashed #d4d8de; padding-top: 6px; margin-top: 4px; } .write-right { flex: 1; display: flex; flex-direction: row; gap: 2px; overflow: hidden; } .write-plot { flex-shrink: 0; padding: 14px; display: flex; flex-direction: column; min-height: 0; overflow: visible; position: relative; } .plot-chat-shell { position: relative; flex: 1; min-height: 0; display: flex; overflow: visible; } .write-plot textarea { overflow-y: auto; font-size: 14px; border: none; background: transparent; flex: 1; resize: none; outline: none; color: var(--text); min-height: 0; max-height: none; padding: 10px 52px 42px 14px; box-sizing: border-box; line-height: 1.6; text-align: left; } .write-plot textarea::placeholder { font-size: 13px; color: #8b8d98; } .plot-tool-btn { position: absolute; bottom: -14px; width: 36px; height: 34px; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-outline-bg); color: var(--btn-outline-text); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: transform 0.15s, opacity 0.15s, background 0.15s, color 0.15s, box-shadow 0.15s; } .plot-tool-btn:hover { filter: brightness(0.96); transform: translateY(-1px); } .plot-upload-btn { left: 10px; font-size: 22px; font-weight: 300; line-height: 1; } .plot-upload-btn:hover { color: #111827; } .plot-send-btn { right: 10px; bottom: -14px; background: #1f232b; color: #fff; font-size: 19px; line-height: 1; box-shadow: 0 2px 8px rgba(0,0,0,0.12); } .plot-send-btn:disabled { opacity: 0.45; cursor: not-allowed; transform: none; } .plot-tool-btn.is-working, .og-send-btn.is-working { background: #111827; color: #fff; border-color: #111827; cursor: pointer; box-shadow: 0 4px 12px rgba(17,24,39,0.24); } .plot-file-chip { position: absolute; left: 54px; bottom: -11px; max-width: calc(100% - 116px); height: 28px; padding: 0 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-card); color: var(--text-muted); font-size: 12px; display: none; align-items: center; gap: 6px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .plot-file-chip.show { display: flex; } .plot-file-chip button { border: none; background: transparent; color: var(--text-muted); cursor: pointer; font-size: 14px; line-height: 1; padding: 0; } .plot-upload-menu { position: absolute; left: 10px; bottom: 25px; width: 150px; padding: 6px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-card); box-shadow: 0 8px 20px rgba(0,0,0,0.12); display: none; z-index: 120; } .plot-upload-menu.open { display: block; } .plot-upload-menu button { width: 100%; border: none; background: transparent; color: var(--text); border-radius: 6px; padding: 7px 8px; text-align: left; font-size: 12px; cursor: pointer; } .plot-upload-menu button:hover { background: var(--border); } .plot-feedback-btn { margin-left: auto; height: 32px; padding: 7px 18px !important; background: var(--btn-outline-bg); z-index: 3; } .write-body { flex: 1; padding: 12px 14px; margin-bottom: 15px; overflow-y: auto; white-space: pre-wrap; font-size: 16px; line-height: 1.8; outline: none; } .write-body p, .write-body div { margin: 0; padding: 0; } .write-body { overflow-wrap: break-word; word-break: break-word; } .write-body:focus { outline: none; } .write-body:empty::before { content: '点击左侧章节查看内容，或生成新章节...'; color: #8b8d98; font-size: 13px; user-select: none; pointer-events: none; } .btn-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 6px; padding: 0 16px 0 20px; } .btn-row .btn { padding: 7px 18px; font-size: 12px; font-weight: 600; border-radius: 8px; } .btn-row .btn.btn-sm { padding: 7px 18px; font-size: 12px; font-weight: 600; border-radius: 8px; } .member-feature-btn { position: relative; padding-right: 32px !important; } .member-feature-btn::after { content: ''; position: absolute; right: 8px; top: 50%; width: 15px; height: 14px; transform: translateY(-50%); background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAADwikbvAAACBklEQVR4nJWSO2hUURCGv/PI5myyBoJY2ljaCIoiMYiihY2NkDUQA6JFOhEkaLcGGws1iAFBRLC4WYnEQkSJzUaMRQxoWgUfjWBhJNG7ufu4946cu5slWzpw5gxn/v8w/8wggpI5jAgaQEBlbxVsVObEXCunIDtk2Aq2VGrhO+Y/8EkfhwFXZQkJAya3SHPt3Jap8An7XZ7r9T/c6B9nxYPCGju14YvLs1yrcTiN2VNwrKkiyUaZob4Clxp/mdYqZdg4Tvf1874aMOEBylIS+GHOcBLFd2WY8u/RLBcGHO9sL2cRDlhjWYh+8dsYHmjNrcYzjkmD0TThVFZuwqTSvGzOk4ubjNfq3Ek3Oa97eK1dkU8p/GzErMYJQ9pysBkzkx9jQUrYwjleIdxWliNJzKE4ZRmouxG+ZsKrszwMZ3nb1byt7rY63bFqwIsw4L6PrXdxwnNreCQVHJ9JGESxi1QWgUWQuxgcKbvJRxscFaHYIQ/0slRL6Fv/xt7BCT50zW8q87F364/Zl8uRS5qsZKPyo/GdDAPeOAdRxDwKiyLdpkEjxM4xUq+jCmMMe5592tZVLXNZYMYYLmYbtk2rUog2iFKsobjSzklXhf9rqlLCHp8i3gwY7e3nZrRJinSvYQtJ4vKYKOTajnHKnmcXaWnTsCrCvWzbdfd42rqzMns0H/3tef8AUq3cyEvaLxMAAAAASUVORK5CYII=") center/contain no-repeat; pointer-events: none; } .member-feature-title { display: inline-flex; align-items: center; justify-content: center; gap: 6px; } .member-feature-title::after { content: ''; width: 15px; height: 14px; flex: 0 0 15px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAADwikbvAAACBklEQVR4nJWSO2hUURCGv/PI5myyBoJY2ljaCIoiMYiihY2NkDUQA6JFOhEkaLcGGws1iAFBRLC4WYnEQkSJzUaMRQxoWgUfjWBhJNG7ufu4946cu5slWzpw5gxn/v8w/8wggpI5jAgaQEBlbxVsVObEXCunIDtk2Aq2VGrhO+Y/8EkfhwFXZQkJAya3SHPt3Jap8An7XZ7r9T/c6B9nxYPCGju14YvLs1yrcTiN2VNwrKkiyUaZob4Clxp/mdYqZdg4Tvf1874aMOEBylIS+GHOcBLFd2WY8u/RLBcGHO9sL2cRDlhjWYh+8dsYHmjNrcYzjkmD0TThVFZuwqTSvGzOk4ubjNfq3Ek3Oa97eK1dkU8p/GzErMYJQ9pysBkzkx9jQUrYwjleIdxWliNJzKE4ZRmouxG+ZsKrszwMZ3nb1byt7rY63bFqwIsw4L6PrXdxwnNreCQVHJ9JGESxi1QWgUWQuxgcKbvJRxscFaHYIQ/0slRL6Fv/xt7BCT50zW8q87F364/Zl8uRS5qsZKPyo/GdDAPeOAdRxDwKiyLdpkEjxM4xUq+jCmMMe5592tZVLXNZYMYYLmYbtk2rUog2iFKsobjSzklXhf9rqlLCHp8i3gwY7e3nZrRJinSvYQtJ4vKYKOTajnHKnmcXaWnTsCrCvWzbdfd42rqzMns0H/3tef8AUq3cyEvaLxMAAAAASUVORK5CYII=") center/contain no-repeat; } .format-split-btn { display: inline-flex; height: 32px; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: var(--btn-outline-bg); color: var(--btn-outline-text); flex-shrink: 0; } .format-split-btn button { border: none; background: transparent; color: inherit; padding: 0 12px; font-size: 12px; font-weight: 600; cursor: pointer; min-width: 46px; } .format-split-btn button + button { border-left: 1px solid var(--border); min-width: 74px; } .format-split-btn button:hover { background: rgba(0,0,0,0.05); } .manual-format-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; } .manual-format-field label { display: block; font-size: 12px; font-weight: 600; margin-bottom: 6px; color: var(--text); } .manual-format-field input, .manual-format-field select { width: 100%; padding: 8px 10px; border-radius: 8px; font-size: 13px; } .manual-format-check { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text); margin-top: 12px; } .manual-format-check input { width: auto; } .manual-format-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; } #btnConfirm.confirm-use-busy { opacity: 0.72; cursor: wait; background: #eef4ff; border-color: #93c5fd; color: #1d4ed8; } #btnConfirm.confirm-use-success { background: #f0fff4; border-color: #86efac; color: #15803d; } #btnConfirm.confirm-use-error { background: #fff7ed; border-color: #fdba74; color: #b45309; } .book-card .btn-row .btn.btn-sm { padding: 6px 10px; } .word-stats { display: flex; gap: 20px; font-size: 13px; color: #1e1e28; align-items: center; background: var(--bg-card); padding: 8px 12px; border-radius: 10px; border: 1px solid var(--border); margin: 8px 0; } .chapter-item { padding: 6px 12px 6px 6px; border-radius: 8px; cursor: pointer; font-size: 12px; color: #1e1e28; transition: background 0.15s; display: flex; align-items: center; justify-content: space-between; margin-right: 8px; } .chapter-item:hover { background-color: #e2e5ea; } .chapter-item.selected { background-color: #e8e8e8; font-weight: 600; } .chapter-item.selected .ch-status-dot { color: #27ae60; } .chapter-item.dragging { opacity: 0.5; } .vol-item.selected { background-color: #e8e8e8; font-weight: 600; } .vol-item { font-weight: 600; padding: 8px 12px; cursor: pointer; user-select: none; display: flex; align-items: center; gap: 8px; border-radius: 8px; font-size: 13px; } .vol-item:hover { background-color: #d4d8de; } .vol-children { margin-left: 15px; } .vol-children:not(.open) { display: none; } .modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); backdrop-filter: blur(3px); z-index: 200; display: none; align-items: center; justify-content: center; } #templateSelectModal { z-index: 500 !important; } #tplDetailModal { z-index: 600 !important; } #manageTemplatesModal { z-index: 550 !important; } .modal-box { background: #fff; border-radius: 20px; padding: 24px; width: 650px; max-height: 80vh; overflow-y: auto; box-shadow: 0 20px 40px rgba(0,0,0,0.2); } #loginNoticeModal { z-index: 760 !important; } .login-notice-box { width: 720px; max-width: calc(100vw - 48px); max-height: 82vh; background: var(--bg-card); color: var(--text); border-radius: 10px; box-shadow: 0 20px 44px rgba(0,0,0,0.24); padding: 24px; display: flex; flex-direction: column; overflow: hidden; } .login-notice-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--border); flex-shrink: 0; } .login-notice-head h3 { margin: 0; font-size: 20px; color: var(--text); } .login-notice-close { border: none; background: transparent; color: var(--text-muted); font-size: 24px; line-height: 1; cursor: pointer; padding: 0 2px; } .login-notice-tabs { margin: 16px 0 14px; background: #f1f1f3; border-radius: 8px; padding: 3px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 3px; flex-shrink: 0; } .login-notice-tab { border: none; border-radius: 7px; background: transparent; color: var(--text-muted); font-size: 14px; font-weight: 600; padding: 8px 12px; cursor: pointer; } .login-notice-tab.active { background: var(--bg-card); color: var(--text); box-shadow: 0 1px 4px rgba(0,0,0,0.08); } .login-notice-body { min-height: 260px; overflow-y: auto; padding-right: 4px; display: flex; flex-direction: column; gap: 8px; } #loginNoticeSystemList { display: flex; flex-direction: column; gap: 8px; } .login-notice-card { border: 1px solid var(--border); border-radius: 8px; padding: 16px; background: var(--bg-card); color: var(--text); } .login-notice-title { font-size: 15px; font-weight: 700; margin-bottom: 8px; color: var(--text); } .login-notice-content { font-size: 14px; line-height: 1.75; color: var(--text-muted); white-space: pre-wrap; } .login-notice-time { margin-top: 12px; font-size: 12px; color: var(--text-muted); } .login-notice-empty { border: 1px dashed var(--border); border-radius: 8px; padding: 44px 16px; text-align: center; color: var(--text-muted); font-size: 14px; } [data-theme="dark"] .login-notice-tabs { background: #262834; } [data-theme="dark"] .login-notice-card { background: #20232e; } /* source: ./styles/app/15-online-parity-shared.css?v=202607280442 */ .app-update-prompt{position:fixed;right:20px;bottom:20px;z-index:100000;width:min(340px,calc(100vw - 32px));box-sizing:border-box;padding:16px;background:#fff;border:1px solid #d7dce5;border-radius:8px;box-shadow:0 12px 32px rgba(17,24,39,.18);color:#111827} .app-update-prompt-title{font-size:15px;font-weight:700;line-height:1.4} .app-update-prompt-message{margin-top:6px;font-size:13px;line-height:1.6;color:#5f6673} .app-update-prompt-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px} .app-update-prompt-actions button{height:34px;padding:0 14px;border:1px solid #d7dce5;border-radius:6px;background:#fff;color:#374151;cursor:pointer;font:inherit;font-size:13px} .app-update-prompt-actions button.primary{border-color:#171a27;background:#171a27;color:#fff;font-weight:600} .model-provider-icon{width:24px;height:24px;object-fit:contain;border-radius:6px} .model-provider-icon-fallback{display:inline-grid;width:24px;height:24px;place-items:center;border-radius:6px;background:#eef1f6;color:#4b5563;font-weight:700} .flow-help-title-row{display:inline-flex;align-items:center;gap:7px;min-width:0} .flow-help-title-row h3{margin:0} .flow-help-trigger{width:28px;height:28px;min-width:28px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:var(--text-muted);cursor:help} .flow-help-trigger svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round} .flow-help-trigger:hover,.flow-help-trigger[aria-expanded="true"]{color:#2563eb} .flow-help-trigger:focus-visible{outline:3px solid rgba(37,99,235,.22);outline-offset:2px} .flow-help-popover{position:fixed;z-index:12000;width:min(320px,calc(100vw - 24px));padding:14px 15px;border:1px solid var(--border);border-radius:12px;background:var(--bg-card);color:var(--text);box-shadow:0 14px 38px rgba(15,23,42,.18);font-size:12px;line-height:1.65} .flow-help-popover[hidden]{display:none!important} .flow-help-popover-title{display:block;margin-bottom:4px;font-size:14px} .flow-help-popover-summary{margin:0 0 7px;color:var(--text-muted)} .flow-help-popover-steps{margin:0;padding-left:20px} .flow-help-popover-note{margin:8px 0 0;padding-top:8px;border-top:1px dashed var(--border);color:var(--text-muted)} .flow-help-popover.flow-help-popover-compact{width:auto;max-width:calc(100vw - 24px);padding:13px 16px;border-radius:10px;white-space:nowrap} .flow-help-popover.flow-help-popover-compact .flow-help-popover-summary{margin:0;color:var(--text-muted)} #templateSelectModal{z-index:10060!important} #tplDetailModal{z-index:10070!important} #manageTemplatesModal{z-index:10065!important} #ogOutlineFileModal{z-index:10050!important} #memoryLinkModal.memory-link-modal{z-index:10050!important} @media(max-width:640px){.flow-help-trigger{width:44px;height:44px;min-width:44px}} .ref-files-tool-btn{min-height:28px;padding:3px 8px;border:1px solid var(--border);border-radius:6px;background:var(--bg-card);color:var(--text-muted);font-size:11px;cursor:pointer} .ref-files-tool-btn:hover{border-color:#94a3b8;color:var(--text)} .ref-files-settings-panel{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:12020;width:min(380px,calc(100vw - 28px));max-height:min(560px,82vh);grid-template-rows:auto minmax(0,1fr) auto;border:1px solid #dce2ea;border-radius:12px;background:var(--bg-card);box-shadow:0 20px 48px rgba(15,23,42,.25);overflow:hidden} .ref-files-settings-header{display:grid;gap:3px;padding:14px 16px;border-bottom:1px solid var(--border)} .ref-files-settings-header strong{font-size:14px}.ref-files-settings-header span{color:var(--text-muted);font-size:11px} .ref-files-settings-list{overflow:auto;padding:6px 10px} .ref-files-settings-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:40px;border-bottom:1px solid rgba(148,163,184,.16)} .ref-files-settings-row label{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px} .ref-files-settings-row>span{display:flex;gap:4px}.ref-files-settings-row button{width:30px;height:28px;border:1px solid var(--border);border-radius:5px;background:var(--bg-card);cursor:pointer}.ref-files-settings-row button:disabled{opacity:.35;cursor:not-allowed} .ref-files-settings-footer{display:flex;justify-content:flex-end;padding:10px 14px;border-top:1px solid var(--border);background:rgba(148,163,184,.08)} .ref-files-settings-footer button{min-height:34px;padding:0 16px;border:0;border-radius:7px;background:#171a27;color:#fff;cursor:pointer} /* source: ./styles/app/20-dialogs-tools.css?v=202607280442 */ /* 模型选择、浮动工具栏、评论和模板弹窗 */ /* ===== 模型选择弹窗 ===== */ #modelSelectModal { z-index: 800 !important; } #addModelModal { z-index: 810 !important; } .model-picker-box { background: #fff; border-radius: 20px; width: 90vw; max-width: 920px; height: 72vh; max-height: 640px; overflow: hidden; box-shadow: 0 20px 40px rgba(0,0,0,0.2); display: flex; } .model-picker-sidebar { width: 160px; flex-shrink: 0; background: #efefef; border-radius: 20px 0 0 20px; padding: 20px 0; display: flex; flex-direction: column; gap: 2px; overflow: hidden; } .model-picker-cat { margin: 0 8px 16px; padding: 8px 12px; font-size: 13px; cursor: pointer; color: #333; background: transparent; border-radius: 10px; display: flex; align-items: center; gap: 6px; font-weight: 500; } .model-picker-cat.active { background: #fff; color: #111827; font-weight: 700; } .model-picker-cat.advanced { background: transparent; color: #999; margin-bottom: 0; font-weight: 400; } .model-picker-cat.advanced.active { background: #fff; color: #111827; font-weight: 700; } .model-picker-cat .cat-check { width: 14px; height: 14px; border-radius: 3px; background: #2e7d32; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 10px; } .model-picker-main { flex: 1; display: flex; flex-direction: column; min-width: 0; } .model-picker-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px 14px; font-size: 16px; flex-shrink: 0; } .model-picker-header .close-btn { font-size: 22px; cursor: pointer; color: #aaa; line-height: 1; } .model-picker-header .close-btn:hover { color: #333; } .model-picker-list { flex: 1; overflow-y: auto; padding: 0 24px 16px; display: flex; flex-direction: column; gap: 10px; } .model-picker-card { background: #f7f8f9; border: 1.5px solid transparent; border-radius: 14px; padding: 16px 18px; cursor: pointer; transition: all 0.2s; } .model-picker-card:hover { border-color: #c0d0e0; background: #f0f3f7; } .model-picker-card.selected { border-color: #2e7d32; background: #f0f9f1; } .model-picker-card.disabled { opacity: 0.55; cursor: not-allowed; } .model-picker-card.disabled:hover { border-color: transparent; background: #f7f8f9; } .model-picker-card-top { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; min-width: 0; } .model-logo-wrap { width: 30px; height: 30px; border-radius: 9px; background: #fff; border: 1px solid #e2e7ee; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 30px; overflow: hidden; box-shadow: 0 1px 3px rgba(15,23,42,0.06); } .model-logo-img { width: 22px; height: 22px; object-fit: contain; display: block; } .model-logo-fallback { font-size: 12px; font-weight: 900; color: #4b5563; } .model-picker-card-title { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1 1 auto; } .model-picker-card-name { font-size: 16px; font-weight: 700; color: #1a1d2b; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .model-del-btn { margin-left: auto; width: 26px; height: 26px; line-height: 24px; text-align: center; border: 1px solid #d0d5dd; border-radius: 50%; color: #999; cursor: pointer; font-size: 13px; flex-shrink: 0; transition: all 0.15s; } .model-del-btn:hover { color: #e74c3c; border-color: #e74c3c; background: #fef0f0; transform: scale(1.1); } .model-picker-card-tag { font-size: 10px; padding: 2px 8px; border-radius: 99px; font-weight: 500; } .model-picker-card-tag.free { background: #e8f5e9; color: #2e7d32; } .model-picker-card-tag.premium { background: #fff4d6; color: #9b6a00; } .model-picker-card-tag.frozen { background: #eef0f3; color: #6b7280; } .model-picker-card-desc { font-size: 12px; color: #8b8d98; line-height: 1.5; margin-bottom: 8px; } .model-picker-card-bar-wrap { height: 5px; width: 100%; background: #e5e7eb; border-radius: 99px; overflow: hidden; } .model-picker-card-bar-inner { height: 100%; background: #28a745; border-radius: 99px; transition: width 0.3s; } .user-level-text { font-size: 11px; color: rgba(255,255,255,0.58); font-weight: 600; } .user-level-text.member { color: #b8862e; } .user-panel-box { width: 360px; max-height: 86vh; overflow-y: auto; padding: 0; border-radius: 8px; background: #fff; border: 1px solid #e5e7eb; } .user-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px 18px 12px; border-bottom: 1px solid #edf0f4; } .user-panel-identity { display: flex; gap: 12px; align-items: center; min-width: 0; } .user-panel-avatar { width: 48px; height: 48px; border-radius: 50%; background: #e8ebf2; color: #111827; display: inline-flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 800; cursor: pointer; background-size: cover; background-position: center; flex-shrink: 0; } .user-panel-name { font-size: 16px; font-weight: 800; color: #111827; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .user-panel-id { margin-top: 3px; font-size: 12px; color: #8b8d98; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .user-panel-close { border: none; background: transparent; color: #2f3440; font-size: 22px; line-height: 1; cursor: pointer; padding: 0; } .user-panel-body { padding: 10px 18px 14px; display: grid; gap: 8px; } .user-plan-strip { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: #f1f5ff; border-radius: 8px; padding: 10px 12px; } .user-plan-level { color: #2563eb; font-size: 13px; font-weight: 800; } .user-plan-level.member { color: #8a5a12; } .user-plan-btn { border: none; background: #2563eb; color: #fff; border-radius: 6px; padding: 6px 13px; font-size: 13px; font-weight: 800; cursor: pointer; } .user-panel-card { border-radius: 8px; padding: 10px 12px; } .user-panel-card.green { background: #e9fbf0; } .user-panel-card.blue { background: #eef4ff; } .user-panel-card.orange { background: #fff4e9; } .user-panel-card-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .user-panel-card-label { font-size: 14px; font-weight: 800; color: #2563eb; } .user-panel-card.green .user-panel-card-label { color: #009b73; } .user-panel-card.orange .user-panel-card-label { color: #d45a14; } .user-panel-card-value { margin-top: 7px; font-size: 22px; color: #059669; font-weight: 900; } .user-panel-card.blue .user-panel-card-value { color: #2563eb; } .user-checkin-btn { border: 1px solid #d7dee8; background: #fff; color: #24624b; border-radius: 6px; padding: 5px 13px; font-size: 12px; font-weight: 800; cursor: pointer; box-shadow: 0 2px 6px rgba(17,24,39,0.08); } .user-redeem-row { display: flex; gap: 8px; margin-top: 10px; } .user-redeem-row input { flex: 1; height: 36px; border-radius: 6px; border: 1px solid #d9dee8; padding: 0 12px; background: rgba(255,255,255,0.74); } .user-redeem-row button { border: none; border-radius: 6px; background: #f5a16f; color: #fff; padding: 0 14px; font-weight: 800; cursor: pointer; } #redeemSuccessModal { z-index: 780 !important; } .redeem-success-box { width: min(420px, calc(100vw - 48px)); padding: 0 !important; border-radius: 12px !important; overflow: hidden; background: #fff; } .redeem-success-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px 12px; border-bottom: 1px solid #edf0f4; } .redeem-success-head h3 { margin: 0; font-size: 20px; font-weight: 900; color: #111827; } .redeem-success-close { border: none; background: transparent; color: #2f3440; font-size: 24px; line-height: 1; cursor: pointer; padding: 0; } .redeem-success-body { padding: 22px; } .redeem-success-message { background: #eef4ff; color: #1d4ed8; border-radius: 10px; padding: 18px 16px; font-size: 16px; font-weight: 800; line-height: 1.65; text-align: center; } .redeem-success-actions { display: flex; justify-content: flex-end; padding: 0 22px 20px; } .redeem-success-ok { border: none; border-radius: 8px; background: #111827; color: #fff; padding: 10px 20px; font-weight: 800; cursor: pointer; } .user-menu-list { border-top: 1px solid #edf0f4; margin: 0 -18px -14px; padding: 4px 0; } .user-menu-item { width: 100%; min-height: 36px; border: none; background: #fff; padding: 0 18px; display: flex; align-items: center; gap: 10px; color: #111827; font-size: 14px; font-weight: 700; cursor: pointer; text-align: left; } .user-menu-item:hover { background: #f7f8fb; } .user-menu-icon { width: 18px; height: 18px; color: #2563eb; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 18px; } .user-menu-icon svg { width: 17px; height: 17px; stroke: currentColor; stroke-width: 1.8; fill: none; stroke-linecap: round; stroke-linejoin: round; } .user-menu-item.danger { color: #e3342f; border-top: 1px solid #edf0f4; justify-content: center; text-align: center; } .user-menu-item.danger .user-menu-icon { color: #e3342f; } .profile-edit-box { width: 400px; border-radius: 8px; padding: 0; overflow: hidden; } .profile-edit-head { display: flex; justify-content: space-between; align-items: center; padding: 18px 20px 12px; border-bottom: 1px solid #edf0f4; } .profile-edit-head h3 { margin: 0; font-size: 18px; color: #111827; } .profile-edit-body { padding: 18px 20px 20px; display: grid; gap: 14px; } .profile-avatar-wrap { text-align: center; } .profile-avatar-tip { margin-top: 7px; font-size: 12px; color: #6b7280; cursor: pointer; } .profile-avatar-tip:hover { color: #2563eb; } .model-picker-footer { display: flex; gap: 8px; justify-content: flex-end; padding: 14px 24px; border-top: 1px solid #e8eaed; flex-shrink: 0; } .model-picker-footer button { padding: 8px 20px; border-radius: 10px; font-size: 13px; cursor: pointer; border: 1px solid #d4d8de; background: #fff; color: #374151; transition: background 0.15s, border-color 0.15s, color 0.15s; } .model-picker-footer button:hover { background: #f7f7f8; border-color: #c4c9d1; color: #111827; } .model-picker-footer .btn-cancel { } .model-picker-footer .btn-add { } .model-picker-footer .btn-confirm { } .action-model-btn { position: absolute; bottom: 0; right: 52px; height: 34px; min-width: 128px; max-width: 184px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--btn-outline-bg); color: var(--btn-outline-text); font-size: 12px; font-weight: 600; cursor: pointer; z-index: 5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .action-model-btn:hover { filter: brightness(0.96); border-color: #1976d2; color: #1976d2; } .ai-feedback-header { display: flex; align-items: center; gap: 8px; } .ai-feedback-header .log-close { margin-left: 0; } .context-menu { position: fixed; background: #fff; border-radius: 12px; box-shadow: 0 6px 16px rgba(0,0,0,0.12); padding: 4px 0; display: none; z-index: 300; min-width: 130px; border: 1px solid #e2e5ea; } .context-menu div { padding: 8px 16px; cursor: pointer; font-size: 13px; } .context-menu div:hover { background: #eef0f3; } ::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-thumb { background: #aaa; border-radius: 4px; min-height: 40px; } ::-webkit-scrollbar-thumb:hover { background: #777; } ::-webkit-scrollbar-track { background: transparent; } .genre-tag { display:inline-block; padding:6px 14px; border-radius:16px; cursor:pointer; font-size:13px; border:1.5px solid #d4d8de; background:#fff; color:#555; transition:all 0.2s; user-select:none; margin:3px 4px; } .genre-tag:hover { border-color:#1a1d2b; color:#1a1d2b; } .genre-tag.selected { background:#1a1d2b; color:#fff; border-color:#1a1d2b; } .outline-result { background:#fff; border-radius:14px; padding:18px; max-height:50vh; overflow-y:auto; white-space:pre-wrap; font-size:14px; line-height:1.8; border:1px solid #e2e5ea; margin-top:12px; display:none; } .wordcount-option { display:inline-block; padding:8px 18px; border-radius:16px; cursor:pointer; font-size:13px; border:1.5px solid #d4d8de; background:#fff; color:#555; transition:all 0.2s; margin:3px 6px; } .wordcount-option:hover { border-color:#1a1d2b; color:#1a1d2b; } .wordcount-option.selected { background:#1a1d2b; color:#fff; border-color:#1a1d2b; } .hotlist-box { background:#fff; border:1px solid #c8cdd6; border-radius:12px; padding:14px; margin-top:10px; max-height:200px; overflow-y:auto; font-size:13px; line-height:1.8; } .hotlist-book-card:hover { background:#f0f4ff !important; border-color:#90caf9 !important; transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,0.08); } #page-template { overflow: hidden; gap: 10px; } #templateGrid { flex: 1; min-height: 0; overflow: hidden; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); column-gap: 20px; row-gap: 12px; align-content: start; } .template-card { box-sizing: border-box; background: #fcfdff; border-radius: 8px; padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; cursor: pointer; border: 1px solid #e3e8ef; transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s; min-width: 240px; height: 174px; overflow: hidden; } .template-card { box-sizing: border-box; background: #fcfdff; border-radius: 8px; padding: 12px 16px; display: flex; flex-direction: column; gap: 6px; cursor: pointer; border: 1px solid #e3e8ef; transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s; min-width: 240px; height: var(--template-card-height, 164px); overflow: hidden; } .template-card:hover { border-color: #9fcce8; box-shadow: 0 4px 12px rgba(35,57,78,0.08); transform: translateY(-1px); } .template-card.published { border-color: #4caf50; background: #f0faf0; } .template-card-head { display: flex; align-items: flex-start; gap: 10px; min-width: 0; } .template-card-head .t-title { flex: 1; } .template-card .t-title { font-weight: 700; font-size: 16px; line-height: 1.42; color: #1a1d2b; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .template-card .t-desc { font-size: 13px; color: #6e6e7a; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .template-card .t-meta { font-size: 12px; color: #8b8d98; display: flex; justify-content: space-between; gap: 10px; margin-top: auto; } .template-card-author { display: inline-flex; align-items: center; gap: 6px; min-width: 0; } .template-card-author-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .template-author-avatar { width: 32px; height: 32px; border-radius: 50%; overflow: hidden; flex: 0 0 32px; display: inline-flex; align-items: center; justify-content: center; background: #eef2f7; border: 1px solid #d9e0ea; color: #64748b; font-size: 12px; font-weight: 700; line-height: 1; } .template-author-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; } .template-author-avatar.is-placeholder { background: #eef2f7; color: #64748b; } .template-selector-avatar { width: 44px; height: 44px; flex-basis: 44px; font-size: 18px; } .template-outline-avatar { width: 28px; height: 28px; flex-basis: 28px; } .template-selection-button-avatar { flex: 0 0 22px; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; } .template-selection-button-avatar[hidden] { display: none; } .template-selection-button-avatar .template-author-avatar, .template-selection-avatar { width: 22px; height: 22px; flex-basis: 22px; font-size: 10px; } .template-selection-button-label { min-width: 0; flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } button.is-template-selected { display: inline-flex; align-items: center; gap: 7px; min-height: 32px; height: auto; overflow: hidden; } .template-detail-author { display: inline-flex; align-items: center; gap: 6px; } .template-detail-author .template-author-avatar { width: 26px; height: 26px; flex-basis: 26px; font-size: 11px; } .template-empty { grid-column: 1 / -1; min-height: 180px; display: flex; align-items: center; justify-content: center; color: #8b8d98; border: 1px dashed #d6dce5; border-radius: 8px; background: #fafcff; } .template-pagination { flex-shrink: 0; display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 38px; padding: 2px 0 4px; color: #6e6e7a; font-size: 13px; } .template-ai-fill-btn { white-space: nowrap; } #manageTemplatesModal .template-ai-fill-btn { align-self: stretch; padding: 0; border: 0; outline: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; } .template-ai-fill-note { align-self: center; color: #7b8491; font-size: 12px; line-height: 1.35; } #manageTemplatesModal > .modal-box { max-height: 94vh; overflow: hidden; } .template-create-panel { position: relative; flex-shrink: 0; margin-bottom: 14px; padding: 18px; border: 1px solid #d4d8de; border-radius: 14px; background: #f9f9f9; } .template-create-grid { display: grid; grid-template-columns: minmax(340px, 0.9fr) minmax(400px, 1.1fr); gap: 20px; height: clamp(453px, calc(94vh - 250px), 520px); min-height: 0; align-items: stretch; } .template-create-column { min-width: 0; min-height: 0; } .template-create-editor { display: flex; flex-direction: column; gap: 8px; padding-right: 2px; overflow: visible; } .template-create-field { min-width: 0; } .template-create-field label, .template-preview-label { display: block; margin-bottom: 4px; color: #1e1e28; font-size: 13px; font-weight: 600; } .template-create-field input, .template-create-field select, .template-create-field textarea { width: 100%; } .template-create-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .template-create-row .template-create-field { min-width: 0; } .template-tag-entry { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; } .template-tag-entry .btn { min-height: 38px; padding-inline: 14px; } .template-create-panel .tag-input-group { margin-top: 6px; } .template-create-panel .tag-input-group:empty { display: none; } .template-create-panel .tag-item { cursor: default; } .template-create-panel .tag-item-remove { padding: 0; border: 0; background: transparent; color: inherit; font: inherit; line-height: 1; cursor: pointer; } .template-create-panel #newTemplateDesc { min-height: 58px; resize: vertical; } .template-prompt-field { display: flex; flex: 1 1 120px; min-height: 108px; flex-direction: column; } .template-prompt-field #newTemplatePrompt { flex: 1; min-height: 96px; resize: vertical; } .template-source-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; } .template-action-with-help { display: inline-flex; align-items: stretch; padding: 0 6px 0 18px; } #manageTemplatesModal .template-ai-fill-help { position: static; align-self: stretch; width: 28px; min-width: 28px; height: auto; margin: 0; padding: 0; border: 0; background: transparent; color: currentColor; font: inherit; opacity: .78; cursor: help; box-sizing: border-box; } #manageTemplatesModal .template-ai-fill-help-icon { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; border: 1px solid currentColor; border-radius: 50%; font-size: 10px; font-weight: 700; line-height: 1; box-sizing: border-box; } #manageTemplatesModal .template-ai-fill-help:hover, #manageTemplatesModal .template-ai-fill-help[aria-expanded="true"] { color: currentColor; opacity: 1; } #manageTemplatesModal .template-ai-fill-help:hover .template-ai-fill-help-icon, #manageTemplatesModal .template-ai-fill-help[aria-expanded="true"] .template-ai-fill-help-icon { background: rgba(148, 163, 184, .12); } .flow-help-popover.flow-help-popover-compact.flow-help-popover-wrap { width: min(420px, calc(100vw - 24px)); white-space: normal; overflow-wrap: anywhere; } .template-create-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #d4d8de; } .template-create-footer-left { display: flex; align-items: center; min-width: 0; } .template-create-submit-actions { display: flex; align-items: center; flex: 0 0 auto; gap: 10px; } #manageTemplatesModal .template-create-footer .btn { min-height: 42px; box-sizing: border-box; } .template-create-preview-column { display: flex; flex-direction: column; } .template-preview.template-prompt-preview { flex: 1; min-height: 0; max-height: none; overflow: auto; overflow-wrap: anywhere; border: 1px solid #d9dee6; background: #fff; } .template-prompt-preview:empty::before { color: #9a9ca6; content: "尚未输入提示词，输入或导入后将在这里实时预览。"; } .template-tag-picker-overlay { position: fixed; inset: 0; z-index: 10090; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(10, 12, 18, 0.52); } .template-tag-picker-overlay[hidden] { display: none; } .template-tag-picker-dialog { width: min(720px, calc(100vw - 48px)); max-height: min(76vh, 640px); overflow: hidden; border: 1px solid #d4d8de; border-radius: 16px; background: #fff; box-shadow: 0 24px 70px rgba(0, 0, 0, 0.22); color: #1e1e28; } .template-tag-picker-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 20px 14px; border-bottom: 1px solid #e2e5ea; } .template-tag-picker-head h4, .template-tag-picker-head p { margin: 0; } .template-tag-picker-head h4 { font-size: 17px; } .template-tag-picker-head p { margin-top: 5px; color: #7b8491; font-size: 12px; } .template-tag-picker-close { width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #596273; font-size: 24px; line-height: 1; cursor: pointer; } .template-tag-picker-close:hover { background: #eef0f3; } .template-tag-picker-groups { max-height: min(54vh, 460px); padding: 8px 20px 16px; overflow-y: auto; } .template-tag-picker-group { padding-top: 12px; } .template-tag-picker-group-title { margin-bottom: 8px; color: #596273; font-size: 12px; font-weight: 700; } .template-tag-picker-options { display: flex; flex-wrap: wrap; gap: 8px; } .template-tag-option { min-height: 32px; padding: 5px 12px; border: 1px solid #d4d8de; border-radius: 16px; background: #fff; color: #4f5868; font-size: 13px; cursor: pointer; } .template-tag-option:hover { border-color: #5c9fc4; color: #27789d; } .template-tag-option.is-selected { border-color: #3f93b6; background: #e8f5fb; color: #1f6e91; font-weight: 600; } .template-tag-picker-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px 16px; border-top: 1px solid #e2e5ea; } @media (max-width: 900px) { .template-create-panel { max-height: calc(94vh - 130px); overflow-y: auto; } .template-create-grid { grid-template-columns: 1fr; height: auto; min-height: 0; } .template-create-editor { overflow: visible; } .template-create-preview-column { min-height: 260px; } .template-prompt-preview { min-height: 220px; } } @media (max-width: 560px) { .template-create-row { grid-template-columns: 1fr; } .template-tag-entry { grid-template-columns: 1fr; } .template-tag-entry .btn { justify-self: flex-start; } .template-tag-picker-overlay { padding: 12px; } .template-tag-picker-dialog { width: calc(100vw - 24px); } .template-create-footer { align-items: stretch; flex-direction: column; } .template-create-submit-actions { justify-content: flex-end; } #manageTemplatesModal .template-create-footer .btn { min-height: 46px; } #manageTemplatesModal .template-ai-fill-help { width: 44px; min-width: 44px; height: 44px; align-self: center; } } [data-theme="dark"] .template-card { background: #242836; border-color: #353b4c; } [data-theme="dark"] .template-card:hover { border-color: #5f9cc7; box-shadow: 0 4px 12px rgba(0,0,0,0.26); } [data-theme="dark"] .template-card .t-title { color: #f5f7fb; } [data-theme="dark"] .template-card .t-desc { color: #c7cfdd; } [data-theme="dark"] .template-card .t-meta { color: #aeb7c8; } [data-theme="dark"] .template-create-panel, [data-theme="dark"] .template-tag-picker-dialog { border-color: #3c4352; background: #242836; color: #f5f7fb; } [data-theme="dark"] .template-create-field label, [data-theme="dark"] .template-preview-label, [data-theme="dark"] .template-tag-picker-head h4 { color: #f5f7fb; } [data-theme="dark"] .template-prompt-preview, [data-theme="dark"] .template-tag-option { border-color: #434b5d; background: #1f2330; color: #d7deea; } [data-theme="dark"] .template-tag-picker-head, [data-theme="dark"] .template-tag-picker-actions { border-color: #3c4352; } [data-theme="dark"] .template-tag-picker-close:hover { background: #353b4c; } [data-theme="dark"] .template-tag-option.is-selected { border-color: #67b7db; background: #16384a; color: #bceaff; } [data-theme="dark"] #tplDetailDesc { background: var(--bg-input) !important; color: var(--text) !important; border-color: var(--border) !important; } [data-theme="dark"] .template-manage-card { background: #242836 !important; border-color: #3a4052 !important; color: #f5f7fb !important; } [data-theme="dark"] .template-manage-card.is-public { border-color: #4caf50 !important; } [data-theme="dark"] .template-manage-description { color: #c7cfdd !important; } [data-theme="dark"] .template-manage-tags > span { background: #343948 !important; color: #c8cfdd !important; } [data-theme="dark"] .template-manage-prompt > summary { color: #78b7e8 !important; } [data-theme="dark"] .template-manage-prompt > div { background: var(--bg-input) !important; color: var(--text) !important; border-color: var(--border) !important; } .template-page-btn { width: auto; min-width: 78px; height: 34px; border-radius: 17px; border: 1px solid #d4d8de; background: #fff; color: #1a1d2b; font-size: 13px; cursor: pointer; } .template-page-btn:hover:not(:disabled) { border-color: #1a1d2b; background: #f7f8fb; } .template-page-btn:disabled { color: #b5b8c2; background: #f5f6f8; cursor: not-allowed; } .template-page-info { white-space: nowrap; } .tpl-stats { display:inline-flex; align-items:center; gap:12px; white-space:nowrap; } .tpl-metric { display:inline-flex; align-items:center; gap:3px; } .tpl-metric-hot { color: #ea580c; } .tpl-metric-like { color: #2563eb; } .gen-option { background: #ebf5ff; border-radius: 12px; padding: 14px; margin-bottom: 10px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; } .gen-option:hover { background: #e2e5ea; } #rwDirectionGroup .gen-option.is-selected { background: #4f46e5; color: #fff; } .outline-modal-box { width: 92vw; max-width: 1100px; max-height: 88vh; display: flex; flex-direction: column; padding: 24px; } .outline-modal-header { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 0; flex-shrink: 0; min-height: 0; } .outline-modal-header h3 { margin: 0; font-size: 20px; color: var(--text); } .outline-modal-close { width: 30px; height: 30px; border: none; background: transparent; color: var(--text); border-radius: 8px; font-size: 24px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; } .outline-modal-close:hover { background: var(--border); } .outline-mode-tabs { display: flex; align-items: center; gap: 28px; width: 100%; min-height: 40px; margin: 0 0 12px; padding-left: 6px; padding-right: 42px; border-bottom: 1px solid var(--border); flex-shrink: 0; } .outline-mode-tab { position: relative; min-width: 0; height: 40px; padding: 0 4px; border: 0; border-radius: 0; background: transparent; color: var(--text-muted); font-size: 14px; font-weight: 700; cursor: pointer; } .outline-mode-tab:hover { color: var(--text); } .outline-mode-tab.active { color: #1976d2; } .outline-mode-tab.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; border-radius: 2px; background: #1976d2; } .outline-modal-layout { display: grid; grid-template-columns: minmax(300px, 380px) minmax(0, 1fr); gap: 20px; flex: 1; min-height: 0; min-width: 0; overflow: hidden; } .outline-config-panel { min-width: 0; display: flex; flex-direction: column; gap: 14px; overflow-y: auto; padding-right: 2px; } .outline-config-section { display: flex; flex-direction: column; gap: 8px; } .outline-section-label { font-size: 13px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .outline-gender-toggle { display: inline-flex; border-radius: 8px; overflow: hidden; border: 1px solid var(--border); cursor: pointer; background: var(--btn-outline-bg); } .outline-gender-toggle .gender-opt { padding: 4px 12px; font-size: 12px; font-weight: 700; color: var(--text-muted); background: var(--btn-outline-bg); transition: all 0.15s; } .outline-gender-toggle .gender-opt.active { background: var(--btn-dark-bg); color: var(--btn-dark-text); } #outlineModal[data-mode="outline"] .outline-functional-section { display: none !important; } #outlineModal[data-mode="function"] .outline-only-section { display: none !important; } .outline-field-input { width: 100%; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-input); color: var(--text); padding: 9px 12px; font-size: 13px; outline: none; } .outline-field-input:focus { border-color: var(--btn-dark-bg); } #outlineModal #genreTags, #outlineModal #functionalGenreTags { display: flex; flex-wrap: wrap; gap: 6px; } #outlineModal .genre-tag { margin: 0; padding: 7px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--btn-outline-bg); color: var(--btn-outline-text); font-size: 13px; font-weight: 500; } #outlineModal .genre-tag:hover { filter: brightness(0.95); border-color: var(--btn-dark-bg); color: var(--text); } #outlineModal .genre-tag.selected { background: var(--btn-dark-bg); color: var(--btn-dark-text); border-color: var(--btn-dark-bg); } .outline-functional-genre-title { margin-top: 2px; font-size: 13px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 10px; } #outlineModal .outline-template-option { margin: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-outline-bg); color: var(--btn-outline-text); padding: 9px 12px; font-size: 14px; min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 10px; overflow: hidden; } #outlineModal .outline-template-option:hover { filter: brightness(0.96); } #outlineModal .outline-template-option span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #outlineModal .outline-template-option span:last-child { color: var(--text); font-weight: 700; margin-left: 0; text-align: left; } #outlineModal .outline-template-avatar-slot { display: none; flex: 0 0 28px; width: 28px; height: 28px; overflow: visible; } #outlineModal .outline-template-option.is-selected .outline-template-avatar-slot { display: inline-flex; } #outlineModal .outline-template-avatar-slot .template-author-avatar { width: 28px; height: 28px; flex-basis: 28px; } #outlineModal .outline-template-option:not(.is-selected) #outlineSelectedTemplate { display: none; } #outlineModal .outline-template-option.is-selected #outlineTemplateLabel { display: none; } #outlineModal .outline-template-option.is-selected #outlineSelectedTemplate { display: block; width: 100%; } #outlineModal .outline-template-option.is-selected #outlineSelectedTemplate { flex: 1 1 auto; width: auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .outline-wordcount-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } #outlineModal .wordcount-option { position: relative; margin: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 8px 10px; min-height: 38px; border-radius: 8px; border: 1px solid var(--border); background: var(--btn-outline-bg); color: var(--btn-outline-text); font-size: 13px; font-weight: 600; } #outlineModal .wordcount-option:hover { filter: brightness(0.95); border-color: var(--btn-dark-bg); color: var(--text); } #outlineModal .wordcount-option.selected { background: var(--btn-dark-bg); color: var(--btn-dark-text); border-color: var(--btn-dark-bg); } #outlineModal #outlineCoreSummary { min-height: 80px; border-radius: 8px; resize: vertical; } .outline-summary-heading { justify-content: space-between; flex-wrap: nowrap; width: 100%; } .outline-summary-heading .outline-section-title { flex-shrink: 0; } .outline-reference-status { margin-left: auto; min-width: 0; max-width: 210px; font-size: 13px; font-weight: 500; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: right; } .outline-reference-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; } .outline-reference-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; min-width: 0; } .outline-reference-row .btn { border-radius: 8px; padding: 7px 14px; font-size: 12px; font-weight: 600; } .outline-result-panel { min-width: 0; min-height: 0; display: flex; flex-direction: column; } .outline-result-label { font-size: 13px; font-weight: 700; color: var(--text-muted); margin-bottom: 8px; } #outlineModal .outline-result { margin-top: 0; max-height: none; flex: 1; min-height: 320px; display: block !important; background: var(--bg-input); border: 1px solid var(--border); border-radius: 8px; padding: 16px; overflow-y: auto; font-size: 14px; line-height: 1.8; white-space: pre-wrap; color: var(--text); } .outline-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); flex-shrink: 0; flex-wrap: wrap; } .outline-actions .btn { border-radius: 8px; padding: 7px 18px; font-size: 12px; font-weight: 600; } .outline-actions #btnStartOutline { background: var(--btn-dark-bg); color: var(--btn-dark-text); border-color: var(--btn-dark-bg); } @media (max-width: 860px) { .outline-modal-box { width: 94vw; max-height: 90vh; padding: 18px; } .outline-modal-layout { grid-template-columns: 1fr; overflow-y: auto; min-height: 0; } .outline-config-panel { overflow: visible; } .outline-result-panel { min-height: 320px; } .outline-actions { justify-content: flex-start; } } .tree-container { padding: 12px; background: #fff; border-radius: 12px; border: 1px solid #e8eaed; } .tree-folder, .tree-file { display: flex; align-items: center; padding: 10px 14px; cursor: pointer; border-radius: 10px; transition: all 0.2s ease; flex-shrink: 0; margin-bottom: 4px; background: #fff; border: 1px solid transparent; } .tree-folder:hover, .tree-file:hover { background: linear-gradient(135deg, #e3f2fd 0%, #e8f5e9 100%); border-color: #90caf9; transform: translateX(4px); box-shadow: 0 2px 8px rgba(33, 150, 243, 0.15); } .tree-folder.selected, .tree-file.selected { background: linear-gradient(135deg, #2196f3 0%, #1976d2 100%); color: #fff; box-shadow: 0 4px 12px rgba(33, 150, 243, 0.35); } .tree-folder.selected .folder-name, .tree-file.selected .file-name, .tree-folder.selected .folder-icon, .tree-file.selected .file-icon, .tree-folder.selected .folder-name ~ *, .tree-file.selected .file-name ~ * { color: #fff !important; } .tree-folder .folder-icon, .tree-file .file-icon { margin-right: 10px; font-size: 20px; flex-shrink: 0; filter: drop-shadow(0 1px 2px rgba(0,0,0,0.1)); } .tree-folder .folder-name, .tree-file .file-name { font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 280px; color: #1e1e28; } .tree-checkbox { margin-right: 12px; width: 18px; height: 18px; cursor: pointer; flex-shrink: 0; accent-color: #2196f3; transform: scale(1.1); } .tree-children { margin-left: 24px; display: none; overflow: hidden; transition: max-height 0.3s ease-out, opacity 0.2s ease; padding-left: 8px; border-left: 2px solid #d4d8de; margin-top: 4px; } .tree-children.open { display: block; } .tree-folder .folder-toggle { color: #9a9ca6; transition: transform 0.2s ease; margin-left: auto; padding: 4px; font-size: 10px; } .tree-folder.open > .folder-toggle { transform: rotate(90deg); } .tree-file { margin-left: 0; } .tree-file .file-name { flex: 1; } .ref-top-bar { position: sticky; top: 0; background: #fff; padding: 8px 12px; border-bottom: 1px solid #e2e5ea; z-index: 5; font-size: 13px; color: #6e6e7a; display: flex; justify-content: space-between; align-items: center; } .ref-top-bar .count.limit { color: #e74c3c; } .full-select-bar { display: flex; gap: 8px; margin-bottom: 8px; } /* ===== 悬浮工具栏样式 ===== */ .selection-toolbar { position: fixed; background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.15); padding: 8px 12px; display: flex; align-items: center; gap: 8px; z-index: 400; border: 1px solid #e2e5ea; opacity: 0; pointer-events: none; transition: opacity 0.15s; } .selection-toolbar.visible { opacity: 1; pointer-events: auto; } .selection-toolbar .word-count { font-size: 12px; color: #6e6e7a; padding-right: 8px; border-right: 1px solid #e2e5ea; } .selection-toolbar .toolbar-btn { width: 32px; height: 32px; border: none; background: #eef0f3; border-radius: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: bold; transition: background 0.15s; } .selection-toolbar .toolbar-btn:hover { background: #e2e5ea; } .selection-toolbar .color-picker { width: 32px; height: 32px; border: none; background: #eef0f3; border-radius: 8px; cursor: pointer; padding: 2px; } .selection-toolbar .polish-btn { background: #1a1d2b; color: #fff; padding: 6px 12px; font-size: 12px; border-radius: 8px; cursor: pointer; border: none; transition: background 0.2s; } .selection-toolbar .polish-btn:hover { background: #333; } /* ===== 评分星星样式 ===== */ .rating-stars { display: flex; gap: 4px; cursor: pointer; } .rating-stars .star { font-size: 24px; color: #d4d8de; transition: color 0.15s; position: relative; } .rating-stars .star.active { color: #ffc107; } .rating-stars .star.half::after { content: '★'; color: #ffc107; position: absolute; left: 0; width: 50%; overflow: hidden; } /* ===== 评论区样式 ===== */ .comment-list { max-height: 200px; overflow-y: auto; margin-bottom: 15px; padding-right: 10px; } .comment-item { padding: 12px; background: #fff; border-radius: 10px; margin-bottom: 10px; } .comment-header { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 12px; color: #6e6e7a; } .comment-author { font-weight: 600; color: #1e1e28; } .comment-content { font-size: 13px; line-height: 1.5; } .comment-form { display: flex; gap: 10px; align-items: flex-end; } .comment-form textarea { flex: 1; min-height: 60px; resize: none; } .comment-form .btn { padding: 8px 16px; } .comment-form .anonymous-label { font-size: 12px; color: #6e6e7a; } /* ===== 创建模板对话框样式 ===== */ .modal-box-large { width: 80%; max-width: 900px; max-height: 90vh; } .template-form-section { margin-bottom: 20px; } .template-form-section label { display: block; font-size: 13px; font-weight: 600; color: #1e1e28; margin-bottom: 8px; } .template-form-section input, .template-form-section textarea, .template-form-section select { width: 100%; } .template-form-section textarea { min-height: 150px; } .tag-input-group { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; } .tag-item { padding: 4px 10px; background: #e8ebf0; border-radius: 15px; font-size: 12px; display: flex; align-items: center; gap: 4px; cursor: pointer; } .tag-item:hover { background: #d4d8de; } .tag-item .remove-tag { font-size: 10px; } .template-preview { background: #fff; border-radius: 12px; padding: 15px; font-size: 13px; line-height: 1.6; white-space: pre-wrap; max-height: 300px; overflow-y: auto; } /* 大纲弹窗里的提示词模版沿用统一的单一组合按钮。 */ #outlineModal .template-modal-picker .outline-template-option { border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none; } .ref-chapter-row { display: flex; align-items: center; padding: 6px 10px; border-radius: 6px; cursor: pointer; } .ref-chapter-row:hover { background: #eef0f3; } .ref-chapter-row input { width: auto; margin-right: 8px; } .chapter-sync-conflict-overlay { position: fixed; inset: 0; z-index: 18000; display: none; align-items: center; justify-content: center; padding: 24px; background: rgba(10, 12, 18, 0.66); } .chapter-sync-conflict-overlay.show { display: flex; } .chapter-sync-conflict-dialog { width: min(980px, calc(100vw - 48px)); max-height: calc(100vh - 48px); overflow: auto; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-card); color: var(--text); box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32); padding: 20px; } .chapter-sync-conflict-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--border); padding-bottom: 12px; } .chapter-sync-conflict-head h3, .chapter-sync-conflict-head p, .chapter-sync-conflict-dialog h4 { margin: 0; } .chapter-sync-conflict-head p { margin-top: 6px; color: var(--text-muted); font-size: 13px; } .chapter-sync-conflict-head > button { border: 0; background: transparent; color: var(--text-muted); font-size: 24px; cursor: pointer; } .chapter-sync-conflict-meta { padding: 12px 0; color: var(--text-muted); font-size: 13px; } .chapter-sync-conflict-versions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .chapter-sync-conflict-versions section, .chapter-sync-conflict-merge { min-width: 0; } .chapter-sync-conflict-versions textarea { height: 180px; margin-top: 8px; resize: vertical; background: var(--bg-input); color: var(--text); } .chapter-sync-conflict-merge { margin-top: 14px; } #chapterConflictMergeEditor { min-height: 150px; max-height: 280px; overflow: auto; margin-top: 8px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-input); color: var(--text); padding: 12px; line-height: 1.7; outline: none; } .chapter-sync-conflict-status { min-height: 20px; padding: 10px 0 4px; color: var(--text-muted); font-size: 13px; } .chapter-sync-conflict-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; border-top: 1px solid var(--border); padding-top: 12px; } .chapter-sync-conflict-actions button:disabled { opacity: 0.55; cursor: not-allowed; } #chapterPersistenceStatus { align-items: center; max-width: min(420px, 42vw); padding: 5px 9px; border: 1px solid transparent; border-radius: 8px; font-size: 12px; line-height: 1.35; white-space: normal; } #chapterPersistenceStatus[data-state="error"] { border-color: color-mix(in srgb, var(--danger, #dc2626) 42%, transparent); background: color-mix(in srgb, var(--danger, #dc2626) 12%, var(--bg-card)); color: var(--danger, #dc2626); } #chapterPersistenceStatus[data-state="warning"] { border-color: color-mix(in srgb, #d97706 42%, transparent); background: color-mix(in srgb, #d97706 12%, var(--bg-card)); color: #b45309; } @media (max-width: 760px) { .chapter-sync-conflict-versions { grid-template-columns: 1fr; } .chapter-sync-conflict-dialog { width: calc(100vw - 24px); padding: 14px; } } /* source: ./styles/app/21-cloud-center.css?v=202607310840 */ /* PC / tablet cloud center. Reuses the existing product palette and sidebar. */ #syncBar .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } #syncBar[data-cloud-center-ready="true"] { padding: 8px 10px !important; } .cloud-sidebar-actions { display: grid; grid-template-columns: 1fr; gap: 6px; width: 100%; } .cloud-sidebar-btn { width: 100%; min-height: 44px; padding: 9px 10px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: rgba(255, 255, 255, 0.78); display: flex; align-items: center; justify-content: center; gap: 8px; font: inherit; font-size: 15px; font-weight: 600; line-height: 1.2; cursor: pointer; } .cloud-sidebar-btn:hover { color: #fff; background: transparent; } .cloud-sidebar-btn:focus-visible, .cloud-center-close:focus-visible, .cloud-center-scope input:focus-visible, .cloud-center-scope select:focus-visible, .cloud-restore-source-row select:focus-visible, .cloud-light-version-row select:focus-visible, .cloud-light-version-row button:focus-visible, .cloud-center-primary:focus-visible { outline: 3px solid rgba(38, 132, 255, 0.48); outline-offset: 2px; } .cloud-sidebar-btn:disabled { cursor: wait; opacity: 0.82; } .cloud-sidebar-icon { width: 22px; height: 22px; flex: 0 0 22px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; } .cloud-sidebar-btn[data-sync-state="syncing"] { color: rgba(255, 255, 255, 0.78); background: transparent; border-color: transparent; } .cloud-sidebar-btn[data-sync-state="syncing"] .cloud-sync-icon { animation: zhiyu-cloud-sync-spin 1s linear infinite; transform-origin: 50% 50%; } .cloud-sidebar-btn[data-sync-state="success"] { color: #34d399; background: transparent; border-color: transparent; } .cloud-sidebar-btn[data-sync-state="error"] { color: #f87171; background: transparent; border-color: transparent; } .cloud-sync-result-icon { width: 16px; height: 16px; display: none; flex: 0 0 16px; } .cloud-sync-result-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } .cloud-sidebar-btn[data-sync-state="success"] .cloud-sync-result-icon, .cloud-sidebar-btn[data-sync-state="error"] .cloud-sync-result-icon { display: inline-flex; } .cloud-sync-result-success, .cloud-sync-result-error { display: none; } .cloud-sidebar-btn[data-sync-state="success"] .cloud-sync-result-success, .cloud-sidebar-btn[data-sync-state="error"] .cloud-sync-result-error { display: block; } .cloud-sidebar-legacy-status { display: none !important; } .cloud-center-modal { z-index: 565; } .cloud-center-box { width: min(920px, calc(100vw - 40px)); max-height: min(84vh, 760px); padding: 24px; overflow: auto; } .cloud-center-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 18px; } .cloud-center-header h3 { margin: 0; color: var(--text); font-size: 22px; } .cloud-center-header p { margin: 6px 0 0; color: var(--text-muted); font-size: 13px; word-break: break-all; } .cloud-center-close { width: 44px; height: 44px; flex: 0 0 44px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-input); color: var(--text); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; } .cloud-center-close:hover { background: var(--bg); } .cloud-center-close svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; } .cloud-center-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 18px; } .cloud-center-overview > div { min-width: 0; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg); } .cloud-center-overview span, .cloud-center-overview strong { display: block; } .cloud-center-status-reason { display: block; margin-top: 4px; color: #b45309; font-size: 11px; line-height: 1.45; } .cloud-center-status-reason[hidden] { display: none; } .cloud-center-overview span { color: var(--text-muted); font-size: 11px; } .cloud-center-overview strong { margin-top: 6px; color: var(--text); font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; } .cloud-center-directions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .cloud-center-card { min-width: 0; padding: 18px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-card); display: flex; flex-direction: column; } .cloud-center-card-heading { display: flex; align-items: flex-start; gap: 12px; } .cloud-center-card-heading > .cloud-sidebar-icon { width: 28px; height: 28px; flex-basis: 28px; color: #2684ff; } .cloud-center-card-heading h4 { margin: 0; color: var(--text); font-size: 17px; } .cloud-center-card-heading p { margin: 5px 0 0; color: var(--text-muted); font-size: 12px; line-height: 1.55; } .cloud-center-scope { margin: 18px 0 10px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, 1.2fr); align-items: center; gap: 12px; } .cloud-center-scope legend { padding: 0 5px; color: var(--text-muted); font-size: 11px; } .cloud-center-scope-options { display: flex; flex-wrap: wrap; gap: 12px; } .cloud-center-scope-choice { min-height: 32px; color: var(--text); display: inline-flex; align-items: center; gap: 7px; cursor: pointer; } .cloud-center-scope-choice input { width: 18px; height: 18px; accent-color: #2684ff; } .cloud-center-book-picker-label { min-width: 0; } .cloud-center-book-picker-label select { width: 100%; min-height: 38px; padding: 7px 34px 7px 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-input); color: var(--text); font: inherit; font-size: 12px; cursor: pointer; } .cloud-center-book-picker-label select:disabled { color: var(--text-muted); cursor: not-allowed; opacity: 0.72; } .cloud-center-summary, .cloud-center-restore-promise { padding: 12px; border-radius: 12px; background: rgba(38, 132, 255, 0.08); color: var(--text); font-size: 13px; line-height: 1.55; } .cloud-center-summary[data-ready="false"] { background: rgba(180, 83, 9, 0.1); color: #9a6700; } .cloud-backup-progress { padding: 12px; border: 1px solid rgba(38, 132, 255, 0.24); border-radius: 12px; background: rgba(38, 132, 255, 0.07); } .cloud-backup-progress[hidden] { display: none; } .cloud-backup-progress-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--text); font-size: 12px; } .cloud-backup-progress-track { height: 6px; margin-top: 9px; overflow: hidden; border-radius: 999px; background: rgba(38, 132, 255, 0.14); } .cloud-backup-progress-track > span { display: block; width: 0; height: 100%; border-radius: inherit; background: #2684ff; transition: width 180ms ease; } .cloud-backup-progress p { margin: 8px 0 0; color: var(--text-muted); font-size: 11px; line-height: 1.5; } .cloud-backup-progress[data-phase="committed"] { border-color: rgba(16, 185, 129, 0.26); background: rgba(16, 185, 129, 0.08); } .cloud-backup-progress[data-phase="committed"] .cloud-backup-progress-track > span { background: #10b981; } .cloud-backup-progress[data-phase="failed"] { border-color: rgba(239, 68, 68, 0.26); background: rgba(239, 68, 68, 0.08); } .cloud-backup-progress[data-phase="failed"] .cloud-backup-progress-track > span { background: #ef4444; } .cloud-center-note { margin: 10px 0 16px; color: var(--text-muted); font-size: 11px; line-height: 1.55; } .cloud-center-restore-promise { margin: 18px 0 16px; background: rgba(39, 174, 96, 0.09); } .cloud-center-restore-promise strong, .cloud-center-restore-promise span { display: block; } .cloud-center-restore-promise strong { color: #168a49; } .cloud-center-restore-promise span { margin-top: 5px; color: var(--text-muted); font-size: 12px; } .cloud-restore-source-row, .cloud-light-version-row { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 10px; } .cloud-restore-source-row { margin-bottom: 12px; } .cloud-restore-source-row label, .cloud-light-version-row label { color: var(--text-muted); font-size: 12px; } .cloud-restore-source-row select, .cloud-light-version-row select { width: 100%; min-width: 0; min-height: 40px; padding: 7px 34px 7px 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-input); color: var(--text); font: inherit; font-size: 12px; } .cloud-light-restore-panel { margin-bottom: 14px; } .cloud-light-restore-panel[hidden] { display: none; } .cloud-light-version-row { grid-template-columns: auto minmax(0, 1fr) auto; } .cloud-light-version-row button { min-width: 58px; min-height: 40px; padding: 0 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-input); color: var(--text); font: inherit; font-size: 12px; cursor: pointer; } .cloud-light-version-row button:disabled, .cloud-light-version-row select:disabled { cursor: not-allowed; opacity: 0.65; } .cloud-restore-progress { margin-top: 10px; padding: 11px; border: 1px solid rgba(38, 132, 255, 0.24); border-radius: 10px; background: rgba(38, 132, 255, 0.07); } .cloud-restore-progress[hidden] { display: none; } .cloud-restore-progress > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--text); font-size: 12px; } .cloud-restore-progress p { margin: 7px 0 0; color: var(--text-muted); font-size: 11px; line-height: 1.5; } .cloud-restore-progress[data-phase="committed"] { border-color: rgba(16, 185, 129, 0.26); background: rgba(16, 185, 129, 0.08); } .cloud-restore-progress[data-phase="failed"] { border-color: rgba(239, 68, 68, 0.26); background: rgba(239, 68, 68, 0.08); } .cloud-center-primary { width: 100%; min-height: 44px; margin-top: auto; } .cloud-center-footer { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border); color: var(--text-muted); font-size: 11px; } html[data-theme="dark"] .cloud-center-summary[data-ready="false"] { color: #f1b55e; } @media (prefers-reduced-motion: reduce) { .cloud-backup-progress-track > span { transition: none; } } html[data-theme="dark"] .cloud-center-restore-promise strong { color: #6ee7a0; } .sidebar.collapsed #syncBar[data-cloud-center-ready="true"], html[data-zhiyu-device="tablet"] #syncBar[data-cloud-center-ready="true"] { padding-inline: 4px !important; } .sidebar.collapsed .cloud-sidebar-btn, html[data-zhiyu-device="tablet"] .sidebar .cloud-sidebar-btn { width: 44px; min-width: 44px; padding-inline: 0; margin-inline: auto; } .sidebar.collapsed .cloud-sidebar-btn > span, html[data-zhiyu-device="tablet"] .sidebar .cloud-sidebar-btn > span { display: none; } .sidebar.collapsed .cloud-sync-result-icon, html[data-zhiyu-device="tablet"] .sidebar .cloud-sync-result-icon { display: none !important; } html[data-zhiyu-device="tablet"] .cloud-center-directions { grid-template-columns: minmax(0, 1fr); } @media (max-width: 900px) { .cloud-center-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cloud-center-directions { grid-template-columns: 1fr; } } @media (max-width: 620px) { .cloud-center-box { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); padding: 18px; } .cloud-center-overview { grid-template-columns: 1fr; } .cloud-center-scope { grid-template-columns: 1fr; } .cloud-restore-source-row, .cloud-light-version-row { grid-template-columns: 1fr; } } @media (prefers-reduced-motion: reduce) { .cloud-sidebar-btn[data-sync-state="syncing"] .cloud-sync-icon { animation: none; } } @keyframes zhiyu-cloud-sync-spin { to { transform: rotate(360deg); } } /* source: ./styles/app/22-account-dialogs.css?v=202607280442 */ .legacy-cache-import-box{max-width:560px} .legacy-cache-import-header{display:flex;align-items:center;justify-content:space-between;gap:12px} .legacy-cache-import-header h3{margin:0} .legacy-cache-import-header button{border:0;background:transparent;font-size:24px;cursor:pointer} .legacy-cache-import-box>p{color:#667085;font-size:13px;line-height:1.6} .legacy-cache-import-list{max-height:360px;overflow:auto;border:1px solid #e6e9ef;border-radius:8px} .legacy-cache-import-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid #eef0f3;cursor:pointer} .legacy-cache-import-row:last-child{border-bottom:0} .legacy-cache-import-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .legacy-cache-import-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px} /* source: ./styles/app/25-outline-advanced.css?v=202607280442 */ /* 大纲弹窗与线上测试版保持同一视觉合同，逻辑仍由拆分模块负责。 */ .outline-advanced-section { display: none; } .outline-modal-box { position: relative; width: 92vw; max-width: 1100px; height: 88vh; max-height: 88vh; display: flex; flex-direction: column; padding: 18px 24px 24px; overflow: hidden; } .outline-modal-header { position: absolute; top: 14px; right: 16px; z-index: 2; display: flex; justify-content: flex-end; align-items: center; margin: 0; flex-shrink: 0; } .outline-mode-tabs { display: flex; align-items: center; gap: 28px; width: 100%; min-height: 40px; margin: 0 0 12px; padding-left: 6px; padding-right: 42px; border-bottom: 1px solid var(--border); flex-shrink: 0; } .outline-mode-tab { position: relative; min-width: 0; height: 40px; padding: 0 4px; border: 0; border-radius: 0; background: transparent; color: var(--text-muted); font-size: 14px; font-weight: 700; cursor: pointer; } .outline-mode-tab:hover { color: var(--text); } .outline-mode-tab.active { color: #1976d2; } .outline-mode-tab.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; border-radius: 2px; background: #1976d2; } .outline-modal-layout { display: grid; grid-template-columns: minmax(300px, 380px) minmax(0, 1fr); gap: 20px; flex: 1; min-height: 0; min-width: 0; overflow: hidden; } .outline-config-panel { position: relative; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 10px; overflow-y: auto; padding-right: 4px; } .outline-config-section { display: flex; flex-direction: column; gap: 6px; } .outline-advanced-group-title { display: flex; padding-top: 10px; margin-top: 2px; border-top: 1px dashed var(--border); color: var(--text); font-size: 13px; font-weight: 800; line-height: 1.4; flex-direction: row; align-items: center; justify-content: space-between; } .outline-advanced-group-note { margin-left: 6px; color: var(--text-muted); font-size: 11px; font-weight: 500; } .outline-advanced-group-toggle { width: 28px; height: 24px; padding: 0; border: 1px solid var(--border); border-radius: 12px; background: var(--btn-outline-bg); color: var(--text-muted); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; } .outline-advanced-group-toggle:hover { color: var(--text); background: var(--border); } .outline-advanced-group-toggle-icon { width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid currentColor; transform: rotate(180deg); transition: transform 0.15s ease; } .outline-advanced-group-toggle.is-collapsed .outline-advanced-group-toggle-icon { transform: rotate(0deg); } #outlineModal[data-outline-submode="advanced"] .outline-advanced-fold-hidden { display: none !important; } #outlineModal[data-outline-submode="advanced"] #outlineAdvancedGroupMaster { order: 1; } #outlineModal[data-outline-submode="advanced"] #outlineGenreSection { order: 2; } #outlineModal[data-outline-submode="advanced"] #outlineWordCountSection { order: 3; } #outlineModal[data-outline-submode="advanced"] #outlineAdvancedGroupStages { order: 4; } #outlineModal[data-outline-submode="advanced"] #outlineAdvancedSourceSection { order: 5; } #outlineModal[data-outline-submode="advanced"] #outlineAdvancedStageSection { order: 6; } #outlineModal[data-outline-submode="advanced"] #outlineAdvancedLinkSection { order: 7; } #outlineModal[data-outline-submode="advanced"] #outlineAdvancedGroupSummary { order: 8; } #outlineModal[data-outline-submode="advanced"] #outlineAdvancedSummarySection { order: 9; } #outlineModal[data-outline-submode="advanced"] #btnStartAdvancedStageOutlineBottom { display: inline-flex; } .outline-summary-section { flex: 1; min-height: 0; } .outline-section-label { font-size: 13px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } #outlineModal[data-outline-submode="normal"] .outline-advanced-section { display: none !important; } #outlineModal[data-outline-submode="advanced"] .outline-normal-section { display: none !important; } .outline-field-input { width: 100%; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-input); color: var(--text); padding: 9px 12px; font-size: 13px; outline: none; } .outline-field-input:focus { border-color: var(--btn-dark-bg); } .outline-submode-tabs { display: flex; gap: 8px; padding: 2px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-input); } .outline-submode-tab { flex: 1; height: 32px; border: 0; border-radius: 7px; background: transparent; color: var(--text-muted); font-size: 13px; font-weight: 700; cursor: pointer; } .outline-submode-tab.active { background: var(--btn-dark-bg); color: var(--btn-dark-text); } .outline-genre-input-row { display: flex; align-items: center; gap: 8px; min-width: 0; } .outline-genre-input-row .outline-genre-input-combo { flex: 1 1 auto; min-width: 0; } .outline-genre-fold-btn { margin-left: 0; flex: 0 0 auto; padding: 4px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-outline-bg); color: var(--btn-outline-text); font-size: 12px; font-weight: 700; white-space: nowrap; cursor: pointer; } .outline-genre-limit { color: var(--text-muted); font-size: 12px; font-weight: 700; } .outline-genre-popup { display: none; position: absolute; left: 24px; top: 128px; width: min(720px, calc(100vw - 64px)); max-height: min(620px, calc(100vh - 180px)); z-index: 30; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: #fff; box-shadow: 0 18px 48px rgba(15,23,42,0.18); overflow: hidden; } #outlineModal[data-genre-expanded="true"] .outline-genre-popup { display: flex; flex-direction: column; } .outline-genre-popup-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; color: var(--text); font-size: 14px; font-weight: 800; } .outline-genre-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; min-height: 0; overflow: hidden; } .outline-genre-column { min-width: 0; display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1px solid var(--border); border-radius: 10px; background: #fafbfc; } .outline-genre-column-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--text); font-size: 13px; font-weight: 800; } .outline-genre-column-body { display: flex; flex-wrap: wrap; gap: 6px; overflow-y: auto; max-height: 260px; padding-right: 2px; } .outline-genre-popup-selected { margin-top: 12px; padding-top: 10px; border-top: 1px dashed #d4d8de; } .outline-genre-popup-selected-label { margin-bottom: 8px; color: var(--text-muted); font-size: 12px; font-weight: 700; } .outline-genre-popup-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; } .outline-genre-input-combo { min-height: 40px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-input); cursor: text; } .outline-genre-popup-input-combo { min-height: 72px; align-items: flex-start; align-content: flex-start; background: #fff; } .outline-genre-input-combo:focus-within { border-color: var(--btn-dark-bg); } .outline-genre-input-combo .outline-field-input { flex: 1 1 140px; min-width: 120px; width: auto; border: 0; border-radius: 0; background: transparent; padding: 3px 2px; } .outline-genre-input-combo .outline-field-input:focus { border-color: transparent; } .outline-selected-genres { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; } .outline-selected-genre { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 4px 8px; border-radius: 999px; background: #2563eb; color: #fff; font-size: 12px; font-weight: 700; } .outline-selected-genre button { width: 16px; height: 16px; border: 0; border-radius: 999px; background: rgba(255,255,255,.18); color: inherit; line-height: 16px; cursor: pointer; } .outline-wordcount-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .outline-wordcount-help { position: absolute; right: 10px; top: 50%; width: 15px; min-width: 15px; max-width: 15px; height: 15px; margin: 0; padding: 0; transform: translateY(-50%); border: 1px solid currentColor; border-radius: 50%; background: transparent; color: currentColor; font: inherit; font-size: 10px; font-weight: 700; line-height: 13px; text-align: center; opacity: .78; cursor: help; box-sizing: border-box; } #outlineModal .wordcount-option .outline-wordcount-help:hover, #outlineModal .wordcount-option .outline-wordcount-help[aria-expanded="true"] { color: currentColor; background: rgba(148, 163, 184, .12); opacity: 1; } #outlineModal .wordcount-option.selected .outline-wordcount-help:hover, #outlineModal .wordcount-option.selected .outline-wordcount-help[aria-expanded="true"] { background: rgba(255, 255, 255, .16); } .outline-summary-heading { justify-content: space-between; flex-wrap: nowrap; width: 100%; } .outline-summary-heading .outline-section-title { flex-shrink: 0; } .outline-reference-status { margin-left: auto; min-width: 0; max-width: 210px; font-size: 13px; font-weight: 500; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: right; } .outline-result-panel { min-width: 0; min-height: 0; display: flex; flex-direction: column; } .outline-result-label { font-size: 13px; font-weight: 700; color: var(--text-muted); margin-bottom: 8px; } #outlineModal .outline-result { margin-top: 0; max-height: none; flex: 1; min-height: 320px; display: block !important; background: var(--bg-input); border: 1px solid var(--border); border-radius: 8px; padding: 16px; overflow-y: auto; font-size: 14px; line-height: 1.8; white-space: pre-wrap; color: var(--text); } .outline-advanced-summary-panel { flex: 1; min-height: 0; display: flex; } #outlineModal #outlineCoreSummary { resize: none; } #outlineModal #outlineAdvancedCoreSummary { width: 100%; flex: 1; min-height: 120px; max-height: none; border-radius: 8px; resize: none; } .genre-summary-input-wrap { position: relative; display: flex; flex: 1; min-height: 0; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-input); } .genre-summary-input-wrap:focus-within { border-color: var(--btn-dark-bg); } .genre-summary-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; } .genre-summary-input-wrap textarea { display: block; width: 100%; min-height: 120px; height: 120px; padding: 8px 10px 12px; border: 0 !important; border-radius: 0 !important; outline: 0; overflow: hidden; background: transparent; resize: none; } .genre-summary-selected-tags { display: flex; flex-wrap: wrap; gap: 7px; padding: 9px 10px 0; } .genre-summary-selected-tags:empty { display: none; } .genre-summary-selected-tag { position: relative; max-width: 100%; min-height: 28px; display: inline-flex; align-items: center; gap: 5px; padding: 4px 5px 4px 11px; border-radius: 999px; background: #2563eb; color: #fff; font-size: 12px; font-weight: 700; white-space: nowrap; } .genre-summary-tag-remove { width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 18px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.18); color: inherit; font-size: 14px; line-height: 1; cursor: pointer; } .genre-summary-tag-remove:hover { background: rgba(255,255,255,.32); } .genre-summary-actions { flex: 0 0 auto; display: flex; justify-content: flex-end; padding: 5px 8px 8px; background: var(--bg-input); } .genre-preference-add-btn { min-height: 28px; padding: 4px 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--btn-outline-bg); color: var(--btn-outline-text); font-size: 12px; font-weight: 700; cursor: pointer; } .genre-preference-add-btn:hover { border-color: var(--btn-dark-bg); color: var(--text); } #outlineContinueModal .flow-help-trigger { width: 17px; min-width: 17px; height: 17px; margin-left: 1px; border: 1px solid currentColor; border-radius: 50%; font-size: 11px; font-weight: 800; line-height: 15px; } .genre-preference-modal-box { width: min(900px, 92vw); max-height: 84vh; display: flex; flex-direction: column; overflow: hidden; } .genre-preference-modal-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; } .genre-preference-modal-header h3 { margin: 0; font-size: 18px; } .genre-preference-selected-fixed { flex: 0 0 auto; padding: 0 0 12px; border-bottom: 1px dashed var(--border); background: var(--bg-card); } .genre-preference-modal-scroll { min-height: 0; overflow-y: auto; padding-right: 4px; } .genre-preference-section { padding: 12px 0; border-top: 1px dashed var(--border); } .genre-preference-section:first-child { padding-top: 0; border-top: 0; } .genre-preference-section-title { margin-bottom: 8px; color: var(--text); font-size: 13px; font-weight: 800; } .genre-preference-selected-list, .genre-preference-tag-list { display: flex; flex-wrap: wrap; gap: 7px; } .genre-preference-genre-chip, .genre-preference-tag { min-height: 28px; display: inline-flex; align-items: center; padding: 4px 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--btn-outline-bg); color: var(--btn-outline-text); font-size: 12px; } button.genre-preference-tag { cursor: pointer; } button.genre-preference-tag:hover { border-color: var(--btn-dark-bg); color: var(--text); } button.genre-preference-tag.selected { background: #2563eb; border-color: #2563eb; color: #fff; } button.genre-preference-tag.selected::after { content: '×'; margin-left: 6px; font-size: 13px; line-height: 1; } .genre-preference-genre-chip { font-weight: 800; } .genre-preference-empty { color: var(--text-muted); font-size: 12px; } .genre-preference-profile-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } .genre-preference-profile-column { min-width: 0; padding: 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-input); } .genre-preference-profile-column h4, .genre-preference-common-group h4 { margin: 0 0 8px; color: var(--text); font-size: 12px; } .genre-preference-common-pool { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; } .genre-preference-modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); } .outline-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); flex-shrink: 0; flex-wrap: wrap; } .outline-actions .btn { border-radius: 8px; padding: 7px 18px; font-size: 12px; font-weight: 600; } .outline-actions #btnStartOutline { background: var(--btn-dark-bg); color: var(--btn-dark-text); border-color: var(--btn-dark-bg); } @media (max-width: 860px) { .outline-modal-box { width: 94vw; max-height: 90vh; padding: 18px; } .outline-modal-layout { grid-template-columns: 1fr; overflow-y: auto; min-height: 0; } .outline-config-panel { overflow: visible; } .outline-genre-popup { bottom: 18px; max-height: none; } .outline-result-panel { min-height: 320px; } .outline-actions { justify-content: flex-start; } .genre-preference-profile-grid, .genre-preference-common-pool { grid-template-columns: 1fr; } } .outline-rebuild-confirm-overlay{position:fixed;inset:0;z-index:5000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.48);backdrop-filter:blur(3px)} .outline-rebuild-confirm{width:min(560px,94vw);padding:24px;border:1px solid var(--border);border-radius:18px;background:var(--bg-card);color:var(--text);box-shadow:0 24px 70px rgba(15,23,42,.24)} .outline-rebuild-confirm-head{display:flex;gap:14px;align-items:flex-start} .outline-rebuild-confirm-head h3{margin:0 0 6px;font-size:18px} .outline-rebuild-confirm-desc{margin:0;color:var(--text-muted);line-height:1.65} .outline-rebuild-confirm-icon{display:grid;flex:0 0 34px;height:34px;place-items:center;border-radius:50%;background:#fff1d6;color:#a65800;font-weight:800} .outline-rebuild-confirm-subject{margin:18px 0 12px;padding:10px 12px;border-radius:10px;background:var(--bg-input)} .outline-rebuild-confirm-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px} .outline-rebuild-confirm-grid section{padding:12px 14px;border:1px solid #f2c6c6;border-radius:12px;background:#fff8f8} .outline-rebuild-confirm-grid section.is-safe{border-color:#bfe1ca;background:#f5fcf7} .outline-rebuild-confirm-grid h4{margin:0 0 8px;font-size:13px} .outline-rebuild-confirm-grid ul{margin:0;padding-left:18px;color:var(--text-muted);font-size:12px;line-height:1.7} .outline-rebuild-confirm-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px} .outline-advanced-stage-preview-row{display:flex;flex-direction:column;gap:3px;padding:9px 10px;border-bottom:1px solid var(--border);border-radius:6px} .outline-advanced-stage-preview-row strong{font-size:13px;color:var(--text)} .outline-advanced-stage-preview-row span{overflow:hidden;color:var(--text-muted);font-size:11px;text-overflow:ellipsis;white-space:nowrap} @media(max-width:560px){.outline-rebuild-confirm-grid{grid-template-columns:1fr}} /* source: ./styles/app/30-writing-page.css?v=202607280442 */ /* 写作页主体、右侧面板、分割线和执行日志 */ .writing-book-picker-bar { min-width: 0; display: flex; align-items: center; gap: 8px; margin-bottom: 4px; } .writing-book-current-name { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--text); font-size: 14px; } .writing-book-picker-bar .btn { flex: 0 0 auto; } .writing-book-select-dialog { width: min(860px, calc(100vw - 40px)); max-height: min(760px, calc(100vh - 48px)); display: flex; flex-direction: column; overflow: hidden; } .writing-book-select-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--border); } .writing-book-select-header h3 { margin: 0; color: var(--text); font-size: 18px; } .writing-book-select-header p { margin: 5px 0 0; color: var(--text-muted); font-size: 12px; } .writing-book-select-grid { min-height: 160px; margin-top: 14px; padding: 2px; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; } .writing-book-select-card { min-width: 0; min-height: 166px; display: grid; grid-template-columns: 66px minmax(0, 1fr); grid-template-rows: 1fr auto; gap: 12px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); color: var(--text); } .writing-book-select-cover { width: 66px; height: 92px; grid-row: 1; display: flex; align-items: center; justify-content: center; overflow: hidden; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-input); color: var(--text-muted); font-size: 28px; } .writing-book-select-cover img { width: 100%; height: 100%; object-fit: cover; } .writing-book-select-info { min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 5px; } .writing-book-select-info strong { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 15px; } .writing-book-select-info span { color: var(--text-muted); font-size: 12px; } .writing-book-select-button { grid-column: 1 / -1; width: 100%; justify-content: center; } .writing-book-select-empty { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; min-height: 150px; color: var(--text-muted); font-size: 13px; text-align: center; } /* ===== 测试版新增：写作页布局重构 ===== */ .write-main-row { display: flex; gap: 0; flex: 1; overflow: hidden; } .write-main-left { flex: 1; display: flex; flex-direction: column; gap: 0; overflow: hidden; min-width: 0; } .write-action-panel { width: 380px; flex-shrink: 0; padding: 12px 6px 10px; display: flex; flex-direction: column; gap: 8px; overflow: hidden; position: relative; } .write-action-panel .action-dashed-divider { border-top: 1px dashed var(--border); margin: 0 -4px; flex-shrink: 0; } .write-action-panel .action-content-box { flex: 1; overflow-y: auto; font-size: 16px; line-height: 1.8; padding: 8px 10px 28px 6px; border: none; outline: none; white-space: pre-wrap; align-self: stretch; box-sizing: border-box; scroll-padding-bottom: 28px; scrollbar-gutter: stable; } .write-action-panel .action-content-box:empty::before { color: #8b8d98; font-size: 13px; user-select: none; pointer-events: none; } .ai-detect-mark { border-radius: 3px; padding: 0 2px; box-decoration-break: clone; -webkit-box-decoration-break: clone; } .ai-detect-critical { background: #ffd6d6; color: #7f1d1d; } .ai-detect-warning { background: #fff1b8; color: #713f12; } .ai-detect-info { background: #dbeafe; color: #1e3a8a; } [data-theme="dark"] .ai-detect-critical { background: rgba(248, 113, 113, 0.32); color: #fecaca; } [data-theme="dark"] .ai-detect-warning { background: rgba(250, 204, 21, 0.28); color: #fef08a; } [data-theme="dark"] .ai-detect-info { background: rgba(96, 165, 250, 0.28); color: #bfdbfe; } #ogContentBox:empty::before { content: '点击发送，在此处生成细纲预览'; } #dcContentBox:empty::before { content: '粘贴正文点击发送，在此处生成拆书分析'; } #apContentBox:empty::before { content: '点击发送，在此处生成AI消痕结果'; } .write-action-panel .action-btns-bottom { display: flex; gap: 6px; justify-content: flex-end; flex-shrink: 0; } /* 内容框包装器（用于定位停止按钮） */ .og-content-wrap { position: relative; flex: 1; overflow: hidden; display: flex; flex-direction: column; min-height: 0; min-width: 0; margin: 0; } .og-content-wrap .action-content-box { flex: 1; width: 100%; } .og-content-wrap:has(.action-content-box.generating) { background: #e3f2fd; } [data-theme="dark"] .og-content-wrap:has(.action-content-box.generating) { background: rgba(25,118,210,0.15); } /* 生成停止按钮 */ .gen-stop-btn { display: none; position: absolute; top: 8px; right: 8px; width: 22px; height: 22px; border-radius: 0; border: none; background: transparent; color: #111827; font-size: 18px; font-weight: 700; line-height: 22px; cursor: pointer; z-index: 5; padding: 0; text-align: center; transition: transform 0.15s, color 0.15s; } .gen-stop-btn:hover { background: transparent; color: #000; border-color: transparent; transform: scale(1.08); } .action-content-box.generating ~ .gen-stop-btn { display: block; } [data-theme="dark"] .gen-stop-btn { background: transparent; border-color: transparent; color: #f3f4f6; } .write-action-panel .action-btns-bottom button { padding: 5px 12px; font-size: 12px; border-radius: 8px; cursor: pointer; border: 1px solid var(--border); background: var(--btn-outline-bg); color: var(--btn-outline-text); transition: all 0.15s; } .write-action-panel .action-btns-bottom button:hover { filter: brightness(0.95); } [data-theme="dark"] .write-action-panel { } [data-theme="dark"] .write-action-panel .action-content-box:empty::before { color: #6e707a; } /* ===== 测试版：3Tab 操作面板 ===== */ .action-tab-bar { display: flex; gap: 0; margin: -12px -6px 0 -6px; border-bottom: 1px solid var(--border); } .action-tab-btn { flex: 1; text-align: center; padding: 10px 0; font-size: 13px; font-weight: 600; cursor: pointer; border: none; border-bottom: 3px solid transparent; background: none; color: var(--text-muted, #8b8d98); transition: all 0.2s; } .action-tab-btn.active { color: #1976d2; border-bottom-color: #1976d2; } .action-tab-btn:hover { color: var(--text, #333); } [data-theme="dark"] .action-tab-btn.active { color: #64b5f6; border-bottom-color: #64b5f6; } [data-theme="dark"] .action-tab-btn:hover { color: #e0e0e0; } /* ===== 测试版：细纲操作栏新布局 ===== */ /* 按钮行 */ .og-btn-row { display: flex; flex-wrap: wrap; gap: 6px; flex-shrink: 0; } .btn-og-action { flex: 1 1 auto; min-width: fit-content; padding: 7px 10px; font-size: 12px; font-weight: 600; border-radius: 8px; cursor: pointer; border: 1px solid var(--border); background: var(--btn-outline-bg); color: var(--btn-outline-text); transition: all 0.15s; white-space: nowrap; } .btn-og-action:hover { filter: brightness(0.95); border-color: #1976d2; color: #1976d2; } [data-theme="dark"] .btn-og-action:hover { color: #64b5f6; border-color: #64b5f6; } /* 描述输入区 */ .og-input-area { flex: 1 1 0%; display: flex; flex-direction: column; min-height: 0; } .og-input-area textarea { flex: 1; width: 100%; min-height: 0; max-height: none; padding: 8px 10px; font-size: 12px; border: none; border-radius: 8px; background: var(--bg-input); color: var(--text); resize: none; line-height: 1.6; font-family: inherit; } .og-input-area textarea::placeholder { color: #8b8d98; font-size: 12px; } /* 文件堆行 — 流式布局在分割线上方，自适应间距 */ .og-tool-panel { display: flex; gap: 8px; padding: 6px 8px; flex-shrink: 0; align-items: stretch; min-height: 78px; } .og-tool-panel .og-stacks-wrap { flex: 0 0 auto; display: flex; gap: 6px; align-items: stretch; max-width: 108px; overflow: hidden; } .og-tool-panel .og-stacks-wrap[style*="display: none"] { display: none !important; } .og-tool-panel .og-file-stack { width: 48px; min-height: 72px; flex-shrink: 0; overflow: visible; justify-content: center; } .og-tool-actions { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; align-items: flex-end; } .og-tool-main-row, .og-tool-template-row { display: flex; gap: 8px; min-width: 0; width: min(100%, 520px); } .og-tool-main-row .btn-og-action, .og-tool-template-row .btn-og-action { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; } .og-tool-template-row .btn-og-action { width: 100%; } /* 提示词模版：文字区与箭头区共用同一个外框，避免出现两个拼接按钮。 */ .action-template-picker, .ap-template-picker, .template-modal-picker { display: inline-flex; align-items: stretch; min-width: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-outline-bg); overflow: hidden; box-sizing: border-box; } .action-template-picker { width: 100%; } .action-template-picker .btn-og-action { flex: 1 1 auto; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none; } .action-template-picker .btn-og-action:hover, .ap-template-picker .ap-template-select:hover, .template-modal-picker .gen-option:hover { background: transparent !important; } .action-template-picker:hover, .ap-template-picker:hover, .template-modal-picker:hover { border-color: #9dbde0; } .action-template-arrow { flex: 0 0 34px; width: 34px; min-height: 0; margin: 0; padding: 0; border: 0; border-left: 1px solid var(--border); border-radius: 0 !important; background: transparent !important; color: var(--text-muted); font-size: 0; font-weight: 500; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; box-shadow: none; } .action-template-arrow::before { content: ''; width: 10px; height: 10px; border-right: 1.7px solid currentColor; border-bottom: 1.7px solid currentColor; transform: rotate(45deg) translate(-2px, -2px); box-sizing: border-box; } .action-template-arrow:hover { color: #1976d2; } .ap-template-picker { width: 100%; } .ap-template-picker .ap-template-select { flex: 1 1 auto; min-width: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none; } .template-modal-picker { width: 100%; margin-bottom: 8px; } .template-modal-picker .gen-option { flex: 1 1 auto; min-width: 0; margin: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; text-align: left; box-shadow: none; } .outline-template-picker { margin-bottom: 0; } .og-tool-panel.no-file-stack { min-height: 34px; padding-top: 0; padding-bottom: 0; } .og-tool-panel.no-file-stack .og-tool-actions { gap: 0; justify-content: flex-end; } .og-tool-panel.no-file-stack .og-tool-main-row { align-items: center; min-height: 32px; } .og-tool-panel.no-file-stack .btn-og-action { min-height: 32px; padding: 5px 8px; } .og-file-stacks-row { display: flex; gap: 8px; flex-wrap: wrap; padding: 6px 8px; flex-shrink: 0; min-height: 36px; align-items: flex-end; } .og-file-stacks-row .og-file-stack { flex-shrink: 1; overflow: hidden; max-width: 60%; } /* 保留旧类名兼容，防止 JS 报错 */ .og-file-stacks { display: flex; gap: 8px; flex-wrap: wrap; } .og-file-stack { display: flex; flex-direction: column; align-items: center; gap: 2px; } .og-stack-label { font-size: 10px; color: #8b8d98; white-space: nowrap; } /* 文件图标容器 */ .og-stack-icons { display: flex; flex-wrap: wrap; gap: 0; position: relative; min-width: 36px; min-height: 44px; justify-content: flex-start; align-items: flex-start; } .og-stack-icons:not(.fanned) { width: auto; } /* 文件图标 */ .og-stack-icon { width: 42px; height: 50px; display: flex; align-items: center; justify-content: center; font-size: 22px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); cursor: pointer; position: relative; flex-shrink: 0; color:#111827; } .og-stack-icon .line-icon { width:30px; height:32px; color:currentColor; } .og-stack-icon:hover { transform: scale(1.15); } /* 叠加态：图标层层相叠，边缘错落 */ .og-stack-icons:not(.fanned) .og-stack-icon { position: absolute; top: 0; left: 0; } .og-stack-icons:not(.fanned) .og-stack-icon:nth-child(1) { z-index: 3; transform: translate(0, 0); } .og-stack-icons:not(.fanned) .og-stack-icon:nth-child(2) { z-index: 2; transform: translate(-3px, -3px); } .og-stack-icons:not(.fanned) .og-stack-icon:nth-child(3) { z-index: 1; transform: translate(-6px, -6px); } .og-stack-icons:not(.fanned) .og-stack-icon:nth-child(n+4) { display: none; } /* 单入口图标：用于右侧“章节/关联”，点击后仍打开完整文件列表 */ .og-stack-icons.single { width: 42px; min-width: 42px; min-height: 42px; display: flex; align-items: center; justify-content: center; } .og-stack-icons.single .og-stack-icon { position: relative !important; top: auto !important; left: auto !important; width: 42px; height: 42px; transform: none !important; } .og-stack-icons.single .og-stack-icon .line-icon { width: 31px; height: 31px; } .og-stack-icons.single .og-stack-icon:nth-child(n+2) { display: none; } .og-stack-icons.single:hover { animation: none; } /* 散开态：绝对定位，右下锚点往左上发散（4列2行） */ .og-stack-icons.fanned { display: block; position: relative; width: 192px; height: 108px; } .og-stack-icons.fanned .og-stack-icon { position: absolute !important; transform: none !important; left: auto !important; top: auto !important; } .og-stack-icons.fanned .og-stack-icon:nth-child(n+4) { display: flex; } /* 下行（底行）：从右往左排 */ .og-stack-icons.fanned .og-stack-icon:nth-child(1) { right: 0; bottom: 0; } .og-stack-icons.fanned .og-stack-icon:nth-child(2) { right: 48px; bottom: 0; } .og-stack-icons.fanned .og-stack-icon:nth-child(3) { right: 96px; bottom: 0; } .og-stack-icons.fanned .og-stack-icon:nth-child(4) { right: 144px; bottom: 0; } /* 上行：从右往左排 */ .og-stack-icons.fanned .og-stack-icon:nth-child(5) { right: 0; bottom: 54px; } .og-stack-icons.fanned .og-stack-icon:nth-child(6) { right: 48px; bottom: 54px; } .og-stack-icons.fanned .og-stack-icon:nth-child(7) { right: 96px; bottom: 54px; } .og-stack-icons.fanned .og-stack-icon:nth-child(8) { right: 144px; bottom: 54px; } /* 散开后图标下方文件名 */ .og-stack-icon .og-icon-label { position: absolute; bottom: -16px; left: 50%; transform: translateX(-50%); font-size: 13px; color: #6e707a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 64px; display: none; } .og-stack-icons.fanned .og-stack-icon .og-icon-label { display: block; } /* 发送按钮 — 右下角线框图标 */ .og-send-btn { position: absolute; bottom: 0; right: 8px; width: 36px; height: 34px; border-radius: 8px; border: 1px solid var(--border); background: var(--btn-dark-bg); color: var(--btn-dark-text); font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; z-index: 5; line-height: 1; box-shadow: 0 2px 8px rgba(0,0,0,0.12); } .og-send-btn:hover { filter: brightness(0.9); transform: translateY(-1px); } /* 水平拖动分割线 */ .og-drag-divider { width: 100%; flex-shrink: 0; cursor: row-resize; } .og-drag-divider .drag-handle { width: 64px; height: 4px; background: #c0bdb8; border-radius: 2px; z-index: 1; opacity: 0.45; transition: opacity 0.2s; } .og-drag-divider:hover .drag-handle, .og-drag-divider.dragging .drag-handle { opacity: 1; } .og-drag-divider::before { left: -12px; right: -12px; } /* 大纲文件列表（复用于选择大纲弹窗） */ .og-outline-file-list { max-height: 160px; overflow-y: auto; border: 1px solid var(--border); border-radius: 8px; padding: 6px; margin-top: 4px; } .og-outline-file-item { display: flex; align-items: center; gap: 8px; padding: 5px 8px; font-size: 13px; border-radius: 4px; cursor: pointer; } .og-outline-file-item:hover { background: var(--border); } .og-outline-file-item input[type="checkbox"] { width: auto; margin: 0; } .og-outline-file-item .og-file-status { font-size: 14px; flex-shrink: 0; } .og-status { font-size: 12px; color: var(--text-muted, #888); min-height: 18px; margin-top: 4px; } .action-content-box.generating { background: #e3f2fd !important; } .action-content-box.generating:empty::before { content: none; } [data-theme="dark"] .action-content-box.generating { background: rgba(25,118,210,0.15) !important; } .btn-og-split { padding: 6px 16px; font-size: 13px; border-radius: 8px; cursor: pointer; border: 1px solid var(--border); background: var(--btn-outline-bg); color: var(--btn-outline-text); transition: all 0.15s; } .btn-og-split:hover:not(:disabled) { filter: brightness(0.95); } .btn-og-split:disabled { opacity: 0.45; cursor: not-allowed; } /* ===== 分割线系统 ===== */ .divider-v { width: 12px; flex-shrink: 0; cursor: col-resize; position: relative; display: flex; align-items: center; justify-content: center; } .divider-v::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); width: 1px; background: #d4d0c8; } .divider-v .drag-handle { width: 6px; height: 48px; background: #c0bdb8; border-radius: 3px; z-index: 1; opacity: 0.45; transition: opacity 0.2s; } .divider-v:hover .drag-handle, .divider-v.dragging .drag-handle { opacity: 1; } .divider-v.dragging { cursor: col-resize; } .divider-v .divider-toggle { position: absolute; z-index: 10; top: 4px; border: none; background: transparent; cursor: pointer; font-size: 12px; color: #999; line-height: 1; padding: 0; } .divider-v .divider-toggle:hover { color: #555; } [data-drag="catalog-main"] .divider-toggle { right: -8px; } [data-drag="main-action"] .divider-toggle { left: -8px; } #writeCatalog { position: relative; } #writeCatalog.collapsed { width: 0 !important; min-width: 0; overflow: hidden; padding: 0; } .write-action-panel.collapsed { width: 0 !important; min-width: 0; overflow: hidden; padding: 0; } .divider-h { height: 8px; flex-shrink: 0; cursor: row-resize; position: relative; display: flex; align-items: center; justify-content: center; } .divider-h::before { content: ''; position: absolute; left: 12px; right: 12px; top: 50%; transform: translateY(-50%); height: 1px; background: #d4d0c8; } .divider-h .drag-handle { height: 4px; width: 40px; background: #c0bdb8; border-radius: 2px; z-index: 1; opacity: 0.45; transition: opacity 0.2s; } .divider-h.og-drag-divider .drag-handle { width: 64px; } .divider-h:hover .drag-handle, .divider-h.dragging .drag-handle { opacity: 1; } .divider-h.dragging { cursor: row-resize; } .divider-static { height: 1px; background: #d4d0c8; flex-shrink: 0; margin: 4px 0; } [data-theme="dark"] .divider-v::before { background: #3e4050; } [data-theme="dark"] .divider-h::before { background: #3e4050; } [data-theme="dark"] .divider-v .drag-handle { background: #5e6070; } [data-theme="dark"] .divider-h .drag-handle { background: #5e6070; } [data-theme="dark"] .divider-static { background: #3e4050; } [data-theme="dark"] .divider-v .divider-toggle { color: #aaa; } [data-theme="dark"] .divider-v .divider-toggle:hover { color: #ddd; } .divider-v, .divider-h { touch-action: none; } /* ===== 浮动执行日志 ===== */ .step-log-float { position: fixed; top: 80px; right: 30px; width: 340px; max-height: 420px; min-width: 280px; min-height: 200px; max-width: 90vw; background: var(--bg-card); border-radius: 16px; box-shadow: 0 8px 30px rgba(0,0,0,0.18); border: 1px solid var(--border); z-index: 9999; display: none; flex-direction: column; overflow: hidden; resize: both; } #stepLogFloat { z-index: 2147483000; } .step-log-float.open { display: flex; } .step-log-float .log-header { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; font-size: 13px; font-weight: 600; color: var(--text); border-bottom: 1px solid var(--border); flex-shrink: 0; cursor: move; user-select: none; } .step-log-float .log-close { cursor: pointer; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 6px; font-size: 14px; color: var(--text-muted); transition: background 0.15s; } .step-log-float .log-close:hover { background: var(--border); } .step-log-float .log-header.ai-feedback-header { justify-content: flex-start; gap: 8px; } .ai-feedback-header .ai-feedback-count { margin-left: auto; } .ai-feedback-clear { border: 1px solid var(--border); border-radius: 7px; background: transparent; color: var(--text-muted); padding: 4px 8px; font-size: 11px; cursor: pointer; } .ai-feedback-clear:hover { border-color: #1976d2; background: #f4f8ff; color: #1976d2; } .step-log-float .log-body { flex: 1; overflow-y: auto; padding: 10px 14px; font-size: 12px; color: var(--text-muted); line-height: 1.7; } .step-log-float .log-body .log-current { background: rgba(39,174,96,0.18); border-left: 3px solid #27ae60; padding-left: 7px; margin-left: -10px; border-radius: 0 4px 4px 0; } .log-running-dots { display: inline-flex; align-items: baseline; gap: 0.08em; min-width: 1.75em; margin-left: 0.32em; color: #168a49; vertical-align: baseline; } .log-running-dot { display: inline-block; line-height: 1; font-size: 1.15em; font-weight: 800; opacity: 0.35; transform: scale(0.65); transform-origin: center; animation: executionLogDotFocus 1.08s infinite ease-in-out; } .log-running-dot:nth-child(2) { animation-delay: 0.36s; } .log-running-dot:nth-child(3) { animation-delay: 0.72s; } @keyframes executionLogDotFocus { 0%, 33%, 100% { opacity: 0.35; transform: scale(0.65); } 16% { opacity: 1; transform: scale(1.45); } } [data-theme="dark"] .log-running-dots { color: #6ee7a8; } @media (prefers-reduced-motion: reduce) { .log-running-dot { animation: none; opacity: 0.75; transform: none; } } [data-theme="dark"] .step-log-float { background: var(--bg-card); border-color: var(--border); } .ai-feedback-toggle { position: relative; } .ai-feedback-badge { position: absolute; left: -3px; bottom: -3px; min-width: 9px; height: 9px; border-radius: 999px; background: #e74c3c; border: 2px solid var(--bg-card); display: none; box-sizing: content-box; } .ai-feedback-toggle.has-unread .ai-feedback-badge { display: block; } .ai-feedback-float { top: 92px; right: 390px; width: 380px; max-height: 480px; } .ai-feedback-float .log-body { color: var(--text); } .ai-feedback-float { right: clamp(16px, 22vw, 390px); width: min(760px, calc(100vw - 32px - clamp(16px, 22vw, 390px))); height: min(480px, calc(100vh - 120px)); min-height: 360px; max-height: min(960px, calc(100vh - 120px)); } .ai-feedback-float .log-body { color: var(--text); background: #f5f7fa; } .ai-feedback-empty { color: var(--text-muted); font-size: 12px; } .ai-feedback-item { border-bottom: 1px solid var(--border); padding: 9px 0 10px; } .ai-feedback-item:last-child { border-bottom: none; } .ai-feedback-item { display: flex; align-items: flex-start; gap: 8px; padding: 7px 0; } .ai-feedback-item.is-user { flex-direction: row-reverse; } .ai-feedback-avatar { flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #fff; border: 1px solid var(--border); } .ai-feedback-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; } .ai-feedback-avatar.is-placeholder { position: relative; background: #eef0f3; color: #8a929f; } .ai-feedback-avatar.is-placeholder::before { content: ''; position: absolute; top: 6px; left: 10px; width: 10px; height: 10px; border-radius: 50%; background: #a8afb9; } .ai-feedback-avatar.is-placeholder::after { content: ''; position: absolute; left: 6px; bottom: 4px; width: 18px; height: 10px; border-radius: 10px 10px 5px 5px; background: #a8afb9; } .ai-feedback-bubble { max-width: min(78%, 560px); border: 1px solid var(--border); border-radius: 10px; background: #fff; padding: 8px 10px; box-shadow: 0 1px 2px rgba(15,23,42,.04); } .ai-feedback-item.is-user .ai-feedback-bubble { background: #95ec69; border-color: #83d85e; } .ai-feedback-title { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 6px; font-size: 12px; font-weight: 600; color: var(--text); } .ai-feedback-time { flex-shrink: 0; color: var(--text-muted); font-weight: 400; } .ai-feedback-content { white-space: pre-wrap; color: var(--text); font-size: 13px; line-height: 1.75; } .ai-feedback-content.thinking::after { content: ''; display: inline-block; width: 6px; height: 6px; margin-left: 4px; border-radius: 50%; background: currentColor; opacity: 0.5; vertical-align: middle; animation: aiThinkingPulse 1s infinite ease-in-out; } @keyframes aiThinkingPulse { 0%, 100% { opacity: 0.25; transform: scale(0.8); } 50% { opacity: 0.75; transform: scale(1); } } .write-plot { padding-top: 7px; } .chapter-compose-shell { flex-direction: column; min-height: 150px; border: 0; border-radius: 0; background: transparent; box-shadow: none; padding: 0 6px; } .chapter-compose-top, .chapter-compose-bottom { display: flex; align-items: center; gap: 8px; flex-shrink: 0; } .chapter-compose-top { justify-content: flex-start; flex-wrap: wrap; } .chapter-compose-bottom { justify-content: flex-end; } .chapter-compose-bottom #btnModelSelect { margin-left: auto; font-weight: 600; } .chapter-compose-btn, .chapter-compose-generate { height: 32px; min-height: 32px; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-outline-bg); color: var(--btn-outline-text); padding: 0 12px; font-size: 12px; font-weight: 700; cursor: pointer; } .chapter-compose-btn:hover, .chapter-compose-template:hover { border-color: #1976d2; background: #f4f8ff; color: #1976d2; filter: none; } .chapter-compose-btn span { margin-left: 4px; color: var(--text-muted); font-weight: 600; } .chapter-compose-btn span:empty { display: none; } .chapter-compose-icon { width: 14px; height: 14px; margin: 0 5px 0 0 !important; color: inherit !important; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -2px; } .chapter-compose-template-wrap { position: relative; max-width: min(360px, 46%); flex: 0 1 auto; } .chapter-compose-template { height: 32px; min-height: 32px; max-width: 100%; display: inline-flex; align-items: stretch; overflow: hidden; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-outline-bg); color: var(--btn-outline-text); } .chapter-compose-template-main, .chapter-compose-template-arrow { height: 30px; border: 0; background: transparent; color: inherit; font-size: 12px; font-weight: 700; cursor: pointer; } .chapter-compose-template-main { min-width: 0; display: inline-flex; align-items: center; padding: 0 10px; overflow: hidden; } .chapter-compose-template #composerTemplateName { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .chapter-compose-template-arrow { flex: 0 0 34px; width: 34px; display: inline-flex; align-items: center; justify-content: center; border-left: 1px solid var(--border); color: var(--text-muted); line-height: 1; } .chapter-compose-template-arrow-icon { flex: 0 0 auto; width: 1em; height: 1em; display: block; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; } .chapter-compose-template-main:hover, .chapter-compose-template-arrow:hover { background: rgba(15, 23, 42, 0.04); } .template-quick-menu { position: fixed; z-index: 900; display: flex; flex-direction: column; overflow: hidden; padding: 8px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card); color: var(--text); box-shadow: 0 12px 28px rgba(15,23,42,0.18); box-sizing: border-box; } .template-quick-menu-scroll { min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 5px; padding-right: 2px; } .template-quick-menu-title { padding: 4px 6px 6px; color: var(--text-muted); font-size: 11px; font-weight: 700; } .template-quick-menu-empty { padding: 7px 6px; color: var(--text-muted); font-size: 12px; } .template-quick-menu-item { width: 100%; min-height: 40px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--border); border-radius: 7px; background: var(--bg-input); color: var(--text); padding: 7px 8px; text-align: left; font-size: 12px; cursor: pointer; box-sizing: border-box; } button.template-quick-menu-item:hover { border-color: #93c5fd; background: #eff6ff; color: #1d4ed8; } .template-quick-menu-name { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .template-quick-menu-metrics { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; font-size: 11px; } .template-quick-menu-avatar { flex: 0 0 26px; width: 26px; height: 26px; } .template-quick-menu-current { flex: 0 0 auto; margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--border); } .template-quick-menu-current .template-quick-menu-title { padding-bottom: 5px; } .template-quick-menu-clear { flex: 0 0 22px; width: 22px; height: 22px; border: 0; border-radius: 6px; background: transparent; color: var(--text-muted); cursor: pointer; font-size: 18px; line-height: 1; } .template-quick-menu-clear:hover { background: rgba(15,23,42,0.08); color: var(--text); } .chapter-compose-generate { margin-left: auto; background: var(--btn-dark-bg); color: var(--btn-dark-text); border-color: var(--btn-dark-bg); } .chapter-compose-bottom .chapter-compose-generate { margin-left: 0; } .chapter-compose-generate:disabled { opacity: 0.45; cursor: not-allowed; filter: none; } #page-write .btn.btn-outline:not(:disabled):hover, #page-write .btn-og-action:not(:disabled):hover, #page-write .chapter-card-actions button:not(:disabled):hover { border-color: #1976d2; background: #f4f8ff; color: #1976d2; } .ref-section-title { margin: 10px 0 6px; padding: 6px 2px; color: #556070; font-size: 12px; font-weight: 700; border-bottom: 1px dashed #dbe1ea; } .ref-summary-row { background: #f8fbff; } .ref-summary-empty { padding: 10px 12px; color: #8b95a5; font-size: 12px; border: 1px dashed #dbe1ea; border-radius: 10px; background: #fafbfd; } .ref-key-event-row { align-items: center; gap: 8px; } .ref-key-event-row span { flex: 1; min-width: 0; } .ref-key-event-row.is-missing-summary { opacity: .92; } .ref-generate-summary-btn { border: 1px solid #d7dde7; background: #fff; color: #1d2433; border-radius: 8px; padding: 4px 8px; font-size: 12px; cursor: pointer; white-space: nowrap; } .ref-generate-summary-btn:hover { border-color: #9fb3d5; background: #f4f7ff; } .write-plot .chapter-compose-shell textarea { flex: 1; padding: 10px 8px; border: 0; background: transparent; resize: none; min-height: 72px; max-height: none; } .ai-feedback-input-shell { position: relative; flex-shrink: 0; min-height: 92px; margin: 8px 10px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-input); padding: 8px 46px 34px 42px; } .ai-feedback-input-shell textarea { width: 100%; height: 100%; min-height: 48px; max-height: 120px; padding: 0; border: 0; border-radius: 0; background: transparent; resize: none; font-size: 13px; line-height: 1.6; } .ai-feedback-input-shell { min-height: 124px; padding: 10px 46px 36px 12px; } .ai-feedback-input-shell textarea { display: block; min-height: 80px; max-height: 170px; box-sizing: border-box; text-align: left; vertical-align: top; } .ai-feedback-tool-btn { position: absolute; bottom: 6px; width: 30px; height: 28px; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-outline-bg); color: var(--btn-outline-text); display: flex; align-items: center; justify-content: center; cursor: pointer; } .ai-feedback-upload-btn { left: 8px; font-size: 20px; line-height: 1; } .ai-feedback-send-btn { right: 8px; background: var(--btn-dark-bg); color: var(--btn-dark-text); border-color: var(--btn-dark-bg); font-size: 17px; } .ai-feedback-upload-menu { left: 8px; bottom: 38px; } .ai-feedback-file-chip { left: 44px; bottom: 6px; max-width: calc(100% - 88px); } /* ===== 文件堆浮动窗（细纲模块）===== */ .og-file-float { position: fixed; top: 120px; right: 360px; width: 400px; max-height: 520px; min-width: 300px; min-height: 240px; max-width: 90vw; background: var(--bg-card); border-radius: 16px; box-shadow: 0 8px 30px rgba(0,0,0,0.18); border: 1px solid var(--border); z-index: 9998; display: none; flex-direction: column; overflow: hidden; resize: both; } .og-file-float.open { display: flex; } .og-file-float .og-file-float-header { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; font-size: 13px; font-weight: 600; color: var(--text); border-bottom: 1px solid var(--border); flex-shrink: 0; cursor: move; user-select: none; } .og-file-float .og-file-float-close { cursor: pointer; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 6px; font-size: 14px; color: var(--text-muted); transition: background 0.15s; } .og-file-float .og-file-float-close:hover { background: var(--border); } .og-file-float .og-file-float-body { flex: 1; overflow-y: auto; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; } .og-file-list { display: flex; flex-wrap: wrap; gap: 6px; } .og-file-chip { padding: 6px 12px; background: #ebf5ff; border: 1px solid #c8e4f8; border-radius: 8px; cursor: pointer; font-size: 12px; font-weight: 500; color: #1976d2; transition: all 0.15s; white-space: nowrap; } .og-file-chip:hover { background: #d6eaff; border-color: #1976d2; } .og-file-chip.active { background: #1976d2; color: #fff; border-color: #1976d2; } [data-theme="dark"] .og-file-float { background: var(--bg-card); border-color: var(--border); } /* 文件堆悬停动画（不再扇开） */ @keyframes ogStackPulse { 0%, 100% { filter: brightness(1); transform: scale(1); } 50% { filter: brightness(1.15); transform: scale(1.03); } } .og-stack-icons:hover { animation: ogStackPulse 0.6s ease-in-out; } /* ===== 章节标题栏 ===== */ .chapter-title-bar { padding: 6px 12px; font-size: 18px; font-weight: 700; color: var(--text); user-select: none; line-height: 1.5; flex-shrink: 0; } .chapter-title-bar:empty { display: none; } .chapter-item.has-card-actions { display: flex; flex-direction: column; align-items: stretch; gap: 6px; padding: 8px 10px; } .chapter-item.selected { background-color: #e8e8e8; font-weight: 600; } .chapter-item.generation-target { background-color: #fff; } .chapter-item.generation-target { border: 1px solid #788190; border-left: 3px solid #1976d2; border-radius: 8px; box-sizing: border-box; } [data-theme="dark"] .chapter-item.selected { background-color: #3e4050; } [data-theme="dark"] .chapter-item.generation-target { background-color: var(--bg-card); } #treeRefs .ref-file-item.active { background: rgba(25, 118, 210, 0.12); font-weight: 600; } [data-theme="dark"] #treeRefs .ref-file-item.active { background: rgba(100, 167, 215, 0.22); } .write-body.ref-file-preview { box-sizing: border-box; padding: clamp(18px, 3vw, 42px); white-space: normal; cursor: default; } .write-body.ref-file-preview > .professional-editor-raw-layer { padding: 0; white-space: normal; } .write-body.ref-file-preview .ref-file-preview-card { box-sizing: border-box; width: min(100%, 920px); margin: 0 auto 20px; padding: clamp(22px, 3vw, 44px); border: 1px solid var(--border); border-radius: 12px; background: rgba(255, 255, 255, 0.88); box-shadow: 0 8px 24px rgba(24, 31, 48, 0.08); color: var(--text); } .write-body.ref-file-preview .ref-file-preview-title { margin: 0 0 22px; padding: 0 0 14px; border-bottom: 1px solid var(--border); font-size: 22px; line-height: 1.45; font-weight: 700; color: var(--text); } .write-body.ref-file-preview .ref-file-preview-content { min-width: 0; overflow-x: auto; line-height: 1.8; } .write-body.ref-file-preview .ref-file-preview-content table { width: 100%; max-width: 100%; } [data-theme="dark"] .write-body.ref-file-preview .ref-file-preview-card { background: rgba(32, 35, 46, 0.94); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22); } .chapter-item > .chapter-item-main { width: 100%; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 6px; } .chapter-title-content { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .chapter-word-meta { margin-left: auto; display: flex; align-items: center; gap: 4px; flex: 0 0 auto; white-space: nowrap; } .chapter-word-count { color: #888; font-size: 12px; font-weight: 400; } .chapter-card-actions { display: flex; width: 100%; gap: 6px; padding: 0; justify-content: center; } .chapter-card-actions button { flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: 7px; background: var(--btn-outline-bg); color: var(--btn-outline-text); padding: 5px 6px; font-size: 11px; font-weight: 700; cursor: pointer; } .chapter-card-actions button:hover { border-color: #1976d2; color: #1976d2; } .chapter-summary-modal-box, .quick-title-modal-box { width: min(720px, 92vw); max-height: 86vh; display: flex; flex-direction: column; gap: 12px; overflow: hidden; } .chapter-summary-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; } .chapter-summary-modal-header h3 { margin: 0 0 4px; } .chapter-summary-modal-header p { margin: 0; color: var(--text-muted); font-size: 12px; line-height: 1.6; } #chapterSummaryText { min-height: 320px; max-height: none; resize: none; line-height: 1.7; } #chapterSummaryText.is-generating { background: #e3f2fd; } .chapter-summary-actions { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding-top: 10px; border-top: 1px solid var(--border); } .quick-title-grid { min-height: 220px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-content: start; } .quick-title-option { min-height: 44px; border: 1px solid var(--border); border-radius: 10px; background: var(--btn-outline-bg); color: var(--text); padding: 10px 12px; text-align: left; font-size: 14px; font-weight: 700; cursor: pointer; } .quick-title-option:hover { border-color: #1976d2; } .quick-title-option.selected { background: #e3f2fd; border-color: #1976d2; box-shadow: 0 0 0 2px rgba(25,118,210,.12); } .quick-title-empty { grid-column: 1 / -1; color: var(--text-muted); font-size: 13px; padding: 20px; text-align: center; } .quick-title-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 32px; color: var(--text-muted); font-size: 12px; } .quick-title-pagination[hidden] { display: none; } .quick-title-pagination .btn { min-width: 72px; justify-content: center; } .info-card-raw-details { min-width: 0; max-width: 100%; margin-top: 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-card); overflow: hidden; box-sizing: border-box; } .info-card-raw-details > summary { cursor: pointer; padding: 8px 10px; color: var(--text-muted); font-size: 12px; font-weight: 700; user-select: none; } .info-card-raw-details[open] > summary { border-bottom: 1px solid var(--border); color: #1976d2; } .info-card-raw-content { min-width: 0; max-width: 100%; margin: 0; padding: 10px 12px; overflow: auto; overflow-wrap: anywhere; word-break: break-word; box-sizing: border-box; background: var(--bg-input); color: var(--text); font-size: 12px; line-height: 1.7; white-space: pre-wrap; } [data-theme="dark"] .ai-feedback-float .log-body { background: var(--bg-main); } [data-theme="dark"] .ai-feedback-bubble { background: var(--bg-card); } [data-theme="dark"] .ai-feedback-item.is-user .ai-feedback-bubble { background: #245b38; border-color: #2f7a49; } /* ===== 章节历史版本：单章快照查看、固定与安全恢复 ===== */ .history-versions-modal { z-index: 520; } .history-versions-box { width: min(980px, calc(100vw - 48px)); max-width: 980px; height: min(720px, calc(100vh - 56px)); max-height: 88vh; padding: 0; overflow: hidden; display: flex; flex-direction: column; color: var(--text); } .history-versions-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 24px 14px; border-bottom: 1px solid var(--border); } .history-versions-header h3 { margin: 0; font-size: 20px; } .history-versions-header p { margin: 5px 0 0; color: var(--text-muted); font-size: 13px; } .history-versions-close { border: 0; background: transparent; color: var(--text-muted); cursor: pointer; font-size: 24px; line-height: 1; padding: 0 2px; } .history-versions-note { margin: 14px 24px 0; padding: 9px 12px; border: 1px solid #dbe5f2; border-radius: 8px; background: #f6f9fd; color: #526174; font-size: 12px; line-height: 1.55; } .history-versions-layout { flex: 1; min-height: 0; display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 14px; padding: 14px 24px; } .history-versions-list-pane, .history-versions-preview-pane { min-height: 0; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card); overflow: hidden; display: flex; flex-direction: column; } .history-versions-pane-title, .history-versions-preview-head { min-height: 48px; padding: 10px 12px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-shrink: 0; } .history-versions-pane-title span:first-child, .history-versions-preview-head strong { font-size: 13px; } .history-versions-pane-title span:last-child, .history-versions-preview-head span { color: var(--text-muted); font-size: 11px; } .history-versions-list { flex: 1; min-height: 0; overflow-y: auto; padding: 6px; } .history-versions-loading { padding: 28px 12px; color: var(--text-muted); text-align: center; font-size: 13px; } .history-version-item { width: 100%; min-height: 62px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--text); display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; text-align: left; cursor: pointer; } .history-version-item:hover { background: rgba(70, 104, 170, 0.07); } .history-version-item.is-selected { background: #eef4ff; border-color: #bfd2f5; } .history-version-item.is-current { background: rgba(35, 129, 88, 0.06); } .history-version-item-main { min-width: 0; display: flex; flex-direction: column; gap: 4px; } .history-version-item-title { font-size: 13px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .history-version-item-meta { color: var(--text-muted); font-size: 11px; } .history-version-item-badge { display: inline-flex; align-items: center; width: fit-content; padding: 2px 6px; border-radius: 999px; background: #e9f6ef; color: #237453; font-size: 10px; } .history-version-pin { flex: 0 0 auto; border: 1px solid var(--border); border-radius: 7px; background: var(--bg-card); color: var(--text-muted); cursor: pointer; padding: 5px 7px; font-size: 11px; } .history-version-pin.is-pinned { border-color: #e2bc68; color: #926216; background: #fff9e9; } .history-version-pin:disabled { opacity: 0.55; cursor: wait; } .history-version-preview { flex: 1; min-height: 0; overflow-y: auto; padding: 16px 18px; font-size: 14px; line-height: 1.85; white-space: pre-wrap; overflow-wrap: break-word; } .history-version-preview p, .history-version-preview div { margin: 0 0 0.8em; } .history-versions-empty { color: var(--text-muted); text-align: center; padding: 42px 16px; font-size: 13px; line-height: 1.7; } .history-versions-empty button { margin-top: 12px; } .history-versions-footer { min-height: 64px; padding: 12px 24px; border-top: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-shrink: 0; } .history-versions-footer-primary { min-width: 0; display: flex; align-items: center; gap: 10px; } .history-versions-footer-primary > span { color: var(--text-muted); font-size: 12px; } .history-versions-footer > div { display: flex; gap: 8px; } [data-theme="dark"] .history-versions-note { background: #202a38; border-color: #334155; color: #b7c2d0; } [data-theme="dark"] .history-version-item.is-selected { background: #233552; border-color: #405d88; } [data-theme="dark"] .history-version-item.is-current { background: #1d332b; } [data-theme="dark"] .history-version-item-badge { background: #1d3d31; color: #8ed0af; } [data-theme="dark"] .history-version-pin.is-pinned { background: #3a311d; border-color: #765f2d; color: #e3c172; } @media (max-width: 1180px), (any-pointer: coarse) and (max-width: 1440px) { body { min-width: 0; overflow: hidden; } .sidebar { width: 58px; min-width: 58px; margin: 0; padding: 12px 8px; height: 100vh; border-radius: 0; } .sidebar .logo, .sidebar .logo-sub, .sidebar .nav-item span, .sidebar-help-entry { display: none; } .sidebar .nav { margin-top: 64px; gap: 8px; } .sidebar .nav-item { min-height: 44px; padding: 8px; } .sidebar #homeBtn, .sidebar .collapse-btn { left: 50%; right: auto; transform: translateX(-50%); } .main-container { min-width: 0; padding: 0 !important; } .main-content { min-width: 0; padding: 8px 0 0 8px !important; } #page-write, .write-layout, .write-right, .write-main-row, .write-main-left { min-width: 0; } .write-layout { position: relative; overflow: hidden; } .write-catalog:not(.collapsed) { position: absolute; left: 0; top: 0; bottom: 0; z-index: 140; width: min(78vw, 300px) !important; padding: 12px 8px; background: var(--bg-card) !important; box-shadow: 12px 0 28px rgba(15, 23, 42, .18); } #writeCatalog + .divider-v[data-drag="catalog-main"] { position: absolute; left: 0; top: 0; bottom: 0; height: 100vh; z-index: 142; background: var(--bg-card); } #writeCatalog:not(.collapsed) + .divider-v[data-drag="catalog-main"] { left: min(78vw, 300px); } .write-action-panel:not(.collapsed) { position: absolute; right: 0; top: 0; bottom: 0; z-index: 140; width: min(86vw, 420px) !important; padding: 12px 8px 8px; background: var(--bg-card) !important; box-shadow: -12px 0 28px rgba(15, 23, 42, .18); } .divider-v[data-drag="main-action"] { position: absolute; right: 0; top: 0; bottom: 0; height: 100vh; z-index: 142; background: var(--bg-card); } .divider-v[data-drag="main-action"]:has(+ .write-action-panel:not(.collapsed)) { right: min(86vw, 420px); } .write-right > div:first-child, .write-main-left { width: 100%; } .btn-row, .word-stats { overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; } .btn-row { min-height: 44px; flex-wrap: nowrap; } .btn-row .btn, .chapter-compose-btn, .chapter-compose-generate, .chapter-compose-bottom #btnModelSelect, .btn-og-action, .divider-toggle { min-height: 40px; } .write-body { min-height: 180px; } .write-body.ref-file-preview { padding: 12px; } .write-body.ref-file-preview .ref-file-preview-card { padding: 18px 16px; border-radius: 10px; } .write-body.ref-file-preview .ref-file-preview-title { margin-bottom: 16px; padding-bottom: 10px; font-size: 19px; } .step-log-float, .ai-feedback-float, .og-file-float { max-width: calc(100vw - 78px); max-height: calc(100vh - 24px); resize: none !important; } .log-header, .og-file-float-header { touch-action: none; } } @media (max-width: 760px) { .history-versions-box { width: calc(100vw - 24px); height: calc(100vh - 24px); max-height: calc(100vh - 24px); } .history-versions-layout { grid-template-columns: 1fr; grid-template-rows: minmax(190px, 42%) minmax(0, 1fr); padding: 12px; } .history-versions-header { padding: 18px 16px 12px; } .history-versions-note { margin: 12px 16px 0; } .history-versions-footer { padding: 10px 16px; align-items: flex-start; } .history-versions-footer-primary { max-width: 58%; align-items: flex-start; flex-direction: column; } } /* source: ./styles/app/32-professional-editor.css?v=202607280442 */ /* TipTap/ProseMirror professional long-form editor surfaces. */ .professional-editor-host { position: relative; display: block; padding: 0; } .professional-editor-host > .zhiyu-tiptap-surface, .professional-editor-host > .professional-editor-raw-layer, .professional-editor-host > .professional-editor-legacy-layer { width: 100%; min-height: inherit; box-sizing: border-box; } .professional-editor-host > .zhiyu-tiptap-surface { min-height: 100%; padding: 14px 18px; outline: none; white-space: pre-wrap; overflow-wrap: anywhere; caret-color: #1976d2; } .professional-editor-host > .zhiyu-tiptap-surface p { margin: 0 0 0.9em; line-height: 1.8; } .professional-editor-host > .zhiyu-tiptap-surface p:last-child { margin-bottom: 0; } .professional-editor-host > .professional-editor-raw-layer, .professional-editor-host > .professional-editor-legacy-layer { padding: 14px 18px; white-space: pre-wrap; overflow-wrap: anywhere; } .professional-editor-host > [hidden] { display: none !important; } #outlineResultBox.professional-editor-host > .zhiyu-tiptap-surface, #ogContentBox.professional-editor-host > .zhiyu-tiptap-surface, #dcContentBox.professional-editor-host > .zhiyu-tiptap-surface { padding: 12px; } #edText.professional-editor-host, #ogFileEditor.professional-editor-host { border: 1px solid #d4d8de; border-radius: 8px; background: #fff; overflow: auto; } #edText.professional-editor-host, #ogFileEditor.professional-editor-host { border-color: var(--border); background: var(--bg-input); color: var(--text); } #edText.professional-editor-host > .zhiyu-tiptap-surface, #ogFileEditor.professional-editor-host > .zhiyu-tiptap-surface { min-height: inherit; padding: 10px; font: inherit; } html[data-professional-editor="fallback"] .professional-editor-host { white-space: pre-wrap; } [data-theme="dark"] .professional-editor-host > .zhiyu-tiptap-surface { caret-color: #64b5f6; } /* source: ./styles/app/35-generation-status.css?v=202607280442 */ :root{--chapter-generation-highlight:#e3f2fd;--chapter-generation-highlight-border:#90caf9} html[data-theme="dark"]{--chapter-generation-highlight:#17233a;--chapter-generation-highlight-border:#315b8f} .ai-step-strip{display:none;align-items:center;min-height:26px;padding:4px 10px;border-radius:999px;background:#eef5ff;color:#1769aa;font-size:12px;font-weight:700} .ai-step-strip.active{display:inline-flex} .ai-step-strip.active::before{content:"";width:7px;height:7px;margin-right:7px;border-radius:50%;background:#1976d2;animation:ai-step-pulse 1.1s ease-in-out infinite} .ai-step-strip-inline{margin:0;flex:1;min-height:18px;padding:5px 8px;border-radius:6px} .outline-result-heading{display:flex;align-items:center;gap:10px;margin-bottom:8px;min-height:24px} .outline-result-heading .outline-result-label{margin-bottom:0;flex:0 0 auto} .chapter-generation-preflight{background:var(--chapter-generation-highlight)!important;box-shadow:inset 0 0 0 1px var(--chapter-generation-highlight-border)} html[data-theme="dark"] .ai-step-strip{background:#17233a;color:#93c5fd} html[data-theme="dark"] #chapterSummaryText.is-generating{background:var(--chapter-generation-highlight)} @keyframes ai-step-pulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1)}} /* source: ./styles/app/40-workbench-overview-payment.css?v=202607280442 */ /* ===== 工业工具台：总览 / 记忆 / 设置 ===== */ .workbench-page { height: 100%; overflow: auto; color: var(--text); } .workbench-shell { display: flex; flex-direction: column; gap: 14px; min-height: 100%; } #page-overview .workbench-shell { height: 100%; min-height: 720px; gap: 8px; } #page-overview .workbench-head { align-items: center; padding-bottom: 6px; border-bottom: none; } #page-overview .workbench-kicker, #page-overview .workbench-subtitle { display: none; } #page-overview .workbench-title { margin: 0; } .workbench-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--border); } .workbench-kicker { font-size: 11px; letter-spacing: 0; color: #8d939d; font-weight: 700; text-transform: uppercase; } .workbench-title { margin: 4px 0 0; font-size: 22px; line-height: 1.25; font-weight: 800; color: var(--text); } .workbench-subtitle { margin-top: 6px; color: var(--text-muted); font-size: 13px; line-height: 1.6; } .workbench-tabs { display: inline-flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-card); } .workbench-tabs .tab-item { min-width: 70px; height: 30px; padding: 0 12px; border: 0; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; color: var(--text-muted); font-size: 13px; font-weight: 700; } .workbench-tabs .tab-item.active { background: #12151c; color: #fff; border-bottom-color: transparent; } .workbench-tabs .tab-item-secondary { min-width: 58px; color: #8b8f98; } .overview-head-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; } .overview-recharge-entry { height: 30px; padding: 0 12px; border: 1px solid #24282C; border-radius: 7px; background: #fff; color: #24282C; font-size: 13px; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; box-shadow: 0 6px 16px rgba(36,40,44,.10); } .overview-recharge-entry:hover { background: #fff; border-color: #24282C; } .overview-recharge-entry::before { content: ''; width: 8px; height: 8px; border-radius: 999px; background: #ff7a1a; box-shadow: 0 0 0 4px rgba(255,122,26,.14); } .workbench-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--border); border-radius: 10px; background: #fff; } .workbench-search { width: 260px; max-width: 100%; height: 34px; border-radius: 8px !important; } .workbench-metrics { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)); gap: 10px; } .workbench-metric { padding: 12px; border: 1px solid var(--border); border-radius: 10px; background: #fff; } .workbench-metric span { display: block; font-size: 12px; color: var(--text-muted); } .workbench-metric strong { display: block; margin-top: 5px; font-size: 22px; line-height: 1; color: #12151c; font-family: Consolas, "SFMono-Regular", monospace; } .overview-board { display: block; } .overview-top-grid { grid-column: 1 / -1; display: grid; grid-template-columns: 230px minmax(520px, 1fr); gap: 12px; align-items: stretch; background: transparent; border: none; border-radius: 0; overflow: visible; } .overview-quick-panel, .overview-stat-panel, .overview-list-panel, .overview-bottom-card { border: 1px solid var(--border); border-radius: 10px; background: #fff; padding: 12px; } .overview-block-title { font-size: 13px; font-weight: 800; color: var(--text); margin-bottom: 10px; } .overview-quick-panel { padding: 12px 16px; overflow: hidden; border: 1px solid var(--border); border-radius: 10px; background: #fff; } .overview-stat-panel { border: none; background: transparent; padding: 0; } .overview-action-row { position: relative; display: grid; grid-template-columns: 1fr; grid-template-rows: repeat(2, minmax(0, 1fr)); min-height: 112px; } .overview-action-row::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: var(--border); } .overview-action-tile { min-height: 56px; border: none; border-radius: 8px; background: transparent; display: flex; align-items: center; justify-content: flex-start; gap: 12px; padding: 8px 0; cursor: pointer; color: var(--text); text-align: left; } .overview-action-tile:hover { background: #f8fafc; } .overview-action-icon, .overview-stat-icon { width: 34px; height: 34px; border: 1px solid var(--border); border-radius: 8px; background: #fff; color: currentColor; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .overview-action-icon svg, .overview-stat-icon svg { width: 19px; height: 19px; display: block; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } .overview-stat-icon-text { font-size: 17px; font-weight: 800; font-family: Arial, "HarmonyOS Sans SC", sans-serif; letter-spacing: 0; color: currentColor; } .overview-action-title { display: block; font-weight: 900; font-size: 15px; line-height: 1.35; } .overview-action-desc { display: block; margin-top: 3px; font-size: 12px; color: var(--text-muted); line-height: 1.35; } .overview-stat-panel { display: block; } .overview-stat-grid { width: 100%; height: 100%; display: grid; grid-template-columns: repeat(5, minmax(108px, 1fr)); gap: 12px; } .overview-stat-item { min-height: 0; height: 100%; border: 1px solid var(--border); border-radius: 10px; background: #fff; padding: 16px; display: flex; flex-direction: column; justify-content: space-between; } .overview-stat-item:last-child { border-right: 1px solid var(--border); } .overview-stat-head { display: flex; align-items: center; gap: 11px; color: var(--text-muted); font-size: 15px; line-height: 1.4; font-weight: 800; } .overview-stat-item strong { display: block; margin-top: 18px; color: #12151c; font-size: 24px; line-height: 1; font-family: Consolas, "SFMono-Regular", monospace; } #panel-works { flex: 1; min-height: 0; grid-template-columns: minmax(0, 1fr) 360px; grid-template-rows: auto minmax(540px, 1fr); gap: 12px; border: 0; border-radius: 0; background: transparent; overflow: visible; } .overview-list-panel { position: relative; grid-column: 1; grid-row: 2; margin-top: 0; min-height: 0; padding: 10px 12px 16px; overflow: visible; display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 10px; background: #fff; } .overview-list-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; } .overview-side-grid { grid-column: 2; grid-row: 2; display: grid; grid-template-columns: 1fr; grid-template-rows: minmax(360px,1fr); gap: 12px; margin-top: 0; align-self: stretch; background: transparent; min-height: 0; } .overview-bottom-card { min-height: 0; padding: 14px 16px; border: 1px solid var(--border); border-radius: 10px; background: #fff; overflow: hidden; } .overview-edit-card { display: flex; flex-direction: column; min-height: 220px; padding-top: 18px; } .overview-edit-toolbar { flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 10px; flex-wrap: nowrap; margin-bottom: 10px; } .overview-edit-toolbar .overview-table-title { align-self: flex-start; margin-bottom: 0; white-space: nowrap; line-height: 1.4; min-height: 30px; overflow: visible; } .overview-edit-toolbar .overview-table-select { display: block; width: 100%; flex: 0 0 auto; min-width: 0; height: 36px; line-height: 36px; } .overview-help-card { display: flex; flex-direction: column; gap: 10px; } .overview-help-list { display: grid; gap: 10px; } .overview-help-item { min-height: 56px; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; background: #fff; color: var(--text); text-align: left; cursor: pointer; } .overview-help-item:hover { border-color: #b9c1ce; background: #f7f9fc; } .overview-help-icon { width: 34px; height: 34px; border-radius: 8px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); color: #12151c; background: #f8fafc; flex: 0 0 auto; } .overview-help-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .overview-help-text strong { display:block; font-size:14px; line-height:1.35; } .overview-help-text span { display:block; margin-top:3px; font-size:12px; color:var(--muted); } .overview-group-modal { width: 360px; max-width: calc(100vw - 40px); } .overview-group-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; } .overview-group-head h3 { margin:0; font-size:18px; } .overview-group-close { border:0; background:transparent; font-size:22px; cursor:pointer; line-height:1; color:var(--text); } .overview-group-qr-box { width: fit-content; max-width: 100%; min-height: 0; margin: 0 auto; border: 1px dashed var(--border); border-radius: 10px; display:flex; align-items:center; justify-content:center; background:#f8fafc; overflow:hidden; } .overview-group-qr-box img { display:block; width: min(240px, calc(100vw - 92px)); height: auto; object-fit: contain; } .overview-group-empty { color: var(--muted); font-size: 13px; } .overview-group-note { margin-top: 10px; color: var(--muted); font-size: 12px; line-height: 1.6; text-align:center; } .overview-tutorial-modal { width: min(980px, calc(100vw - 48px)); } .overview-tutorial-intro { margin: -2px 0 12px; color: var(--muted); font-size: 13px; line-height: 1.6; } .overview-tutorial-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-bottom: 12px; } .overview-tutorial-card { border: 1px solid var(--border); border-radius: 10px; background: #fff; overflow: hidden; cursor: pointer; text-align: left; color: var(--text); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; } .overview-tutorial-card:hover { border-color: #9fb5d8; box-shadow: 0 10px 26px rgba(18,21,28,.10); transform: translateY(-1px); } .overview-tutorial-card.active { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.10); } .overview-tutorial-cover { position: relative; width: 100%; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #dbeafe, #f8fafc); overflow: hidden; } .overview-tutorial-cover img { width: 100%; height: 100%; object-fit: cover; display: block; } .overview-tutorial-cover.is-fallback::after { content: "B站教程"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #1f2937; font-size: 18px; font-weight: 900; } .overview-tutorial-badge { position: absolute; left: 10px; top: 10px; height: 24px; padding: 0 8px; display: inline-flex; align-items: center; border-radius: 999px; background: rgba(18,21,28,.84); color: #fff; font-size: 12px; font-weight: 800; } .overview-tutorial-card-body { padding: 12px 13px 13px; } .overview-tutorial-card-title { margin: 0; font-size: 15px; font-weight: 900; line-height: 1.45; color: var(--text); } .overview-tutorial-card-desc { margin: 6px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; } .overview-tutorial-empty { padding: 28px 12px; border: 1px dashed var(--border); border-radius: 10px; color: var(--muted); text-align: center; font-size: 13px; } .overview-tutorial-video { width: 100%; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: #0b1020; border: 1px solid var(--border); display: none; margin-top: 10px; } .overview-tutorial-video.active { display: block; } .overview-tutorial-video iframe { width: 100%; height: 100%; display: block; border: 0; } .overview-tutorial-actions { margin-top: 12px; display: flex; justify-content: space-between; align-items: center; gap: 12px; color: var(--muted); font-size: 12px; } .overview-tutorial-actions a { color: #2563eb; font-weight: 800; text-decoration: none; } .overview-tutorial-actions a:hover { text-decoration: underline; } .overview-table-title { display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px; border: 1px solid var(--border); border-radius: 6px; background: #fff; font-size: 14px; font-weight: 900; color: var(--text); margin-bottom: 10px; } .overview-table-toolbar { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 10px; } .overview-table-select { min-width: 128px; max-width: 100%; height: 30px; margin-bottom: 0; padding-right: 28px; cursor: pointer; outline: none; } #overviewEditList { flex: 1; min-height: 126px; overflow: hidden; } #overviewEditList .overview-empty-cell { height: 78px !important; vertical-align: middle; } .overview-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 12px; } .overview-table th { background: #f7f9fb; color: #667085; font-weight: 800; padding: 8px 6px; text-align: left; } .overview-table td { padding: 8px 6px; border-bottom: 1px solid #eef1f4; color: #303746; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .overview-status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 999px; margin-right: 5px; background: #2BA36B; vertical-align: 1px; } .overview-quick-card { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card); min-height: 0 !important; width: auto !important; cursor: default; } .overview-quick-action { min-height: 82px; border: 1px dashed #cfd4dc; border-radius: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; cursor: pointer; font-weight: 700; color: #171b24; } .overview-quick-action:hover { border-color: #12151c; background: #fff; } .overview-quick-action .quick-icon { font-size: 22px; line-height: 1; } .overview-snapshot-row { display: grid; grid-template-columns: minmax(280px, 1.1fr) minmax(220px, .9fr); gap: 12px; margin-bottom: 14px; } .overview-snapshot-card { border: 1px solid var(--border); border-radius: 10px; background: #fff; padding: 14px; min-height: 86px; display: flex; flex-direction: column; justify-content: center; } .overview-snapshot-label { font-size: 12px; color: var(--text-muted); margin-bottom: 6px; } .overview-snapshot-title { font-size: 16px; font-weight: 800; color: var(--text); line-height: 1.4; } .overview-snapshot-meta { margin-top: 5px; font-size: 12px; color: #667085; line-height: 1.5; } .overview-snapshot-actions { margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; } .overview-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 0 0 4px; color: var(--text); font-weight: 900; } #page-overview .overview-cards { gap: 12px; } #page-overview .book-card { width: auto !important; height: 190px; min-height: 190px; border-radius: 10px !important; background: #edf7ff; border: 1px solid #cfe3f7; box-shadow: none; overflow: visible; } #page-overview .book-card:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(18,21,28,.08); border-color: #b9c0ca; } #page-overview .btn { background: #fff !important; color: #12151c !important; border: 1px solid var(--border) !important; border-radius: 6px !important; box-shadow: none !important; } #page-overview .btn:hover { background: #f8fafc !important; border-color: #b9c0ca !important; } .overview-book-list { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); grid-auto-rows: 190px; gap: 12px !important; width: 100%; overflow: visible; align-content: start; flex: 1; padding-bottom: 16px; } .overview-billing-trigger { cursor: pointer; border-radius: 10px; } .overview-billing-trigger:hover { background: rgba(18,21,28,.04); } .billing-modal-box { width: min(760px, 92vw); max-height: 82vh; padding: 0 !important; overflow: hidden; border-radius: 10px !important; background: #fff; } .billing-ledger-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 20px 22px 12px; border-bottom: 1px solid var(--border); } .billing-ledger-title { margin: 0; font-size: 20px; font-weight: 900; color: #111827; } .billing-ledger-subtitle { margin-top: 5px; font-size: 13px; color: #667085; line-height: 1.6; } .billing-ledger-close { border: none; background: transparent; font-size: 24px; color: #667085; cursor: pointer; } .billing-ledger-list { padding: 14px 22px 22px; overflow: auto; max-height: calc(82vh - 92px); display: grid; gap: 10px; } .billing-ledger-item { border: 1px solid var(--border); border-radius: 8px; background: #f8fafc; padding: 12px 14px; } .billing-ledger-row { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; } .billing-ledger-name { font-size: 14px; font-weight: 900; color: #111827; } .billing-ledger-time { font-size: 12px; color: #667085; white-space: nowrap; } .billing-ledger-meta { margin-top: 8px; display: grid; gap: 5px; color: #475467; font-size: 12px; line-height: 1.55; } .billing-ledger-empty { padding: 42px 18px; text-align: center; color: #98a2b3; border: 1px dashed var(--border); border-radius: 8px; background: #fff; } .book-menu { z-index: 500 !important; } .overview-empty { grid-column: 1 / -1; color: var(--text-muted); text-align: center; padding: 48px 20px; border: 1px dashed var(--border); border-radius: 10px; background: #fff; } .overview-book-list.is-empty { display: block !important; min-height: 100%; } .overview-book-list.is-empty .overview-empty { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); border: none; border-radius: 0; background: transparent; padding: 0; width: 100%; pointer-events: none; } .archive-panel .overview-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; } /* 总览页新版排版：只覆盖右侧内容区，左侧导航栏保持测试版原样 */ body:has(#page-overview.active) { --overview-bg: #fff; background: var(--overview-bg); } body:has(#page-overview.active) .main-container { padding: 15px 0 0 0; background: var(--overview-bg); } body:has(#page-overview.active) .content-wrapper { background: var(--overview-bg); } body:has(#page-overview.active) .main-content { padding: 14px 14px 16px; background: var(--overview-bg); border: 0; box-shadow: none; } body:has(#page-overview.active) ::-webkit-scrollbar-thumb { background: #24282C; border-radius: 999px; } body:has(#page-overview.active) ::-webkit-scrollbar-thumb:hover { background: #24282C; } #page-overview.workbench-page { --overview-nav-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; --overview-surface: linear-gradient(145deg, #fff 0%, #fff 100%); --overview-surface-strong: linear-gradient(145deg, #fff 0%, #fff 100%); --overview-border-soft: rgba(178,201,218,.72); --overview-shadow-control: inset 1px 1px 0 rgba(255,255,255,.74), inset -1px -1px 0 rgba(164,188,205,.22), 0 5px 10px rgba(98,126,152,.055); --overview-shadow-panel: inset 1px 1px 0 rgba(255,255,255,.78), inset -1px -1px 0 rgba(164,188,205,.26), 0 6px 12px rgba(98,126,152,.065); --overview-shadow-accent: 0 10px 22px rgba(36,40,44,.18), 0 3px 8px rgba(98,126,152,.06); --overview-accent-gradient: #24282C; --overview-accent-gradient-vertical: #24282C; --overview-accent-gradient: var(--client-accent, #4a91aa); --overview-accent-gradient-vertical: var(--client-accent, #4a91aa); --overview-sixday-gradient: linear-gradient(180deg, #70d4e0 0%, #998dea 100%); --overview-placeholder-text: #9aa8bb; --overview-announcement-duration: 28s; overflow: hidden; background: var(--overview-bg); font-family: var(--overview-nav-font); } #page-overview, #page-overview * { font-family: var(--overview-nav-font) !important; font-weight: 400 !important; } #page-overview input::placeholder, #page-overview textarea::placeholder { color: var(--overview-placeholder-text) !important; opacity: 1; font-weight: 400 !important; } #page-overview .workbench-shell { height: 100%; min-height: 720px; gap: 12px; padding: 0; } #page-overview .workbench-head { flex: 0 0 44px; display: grid; grid-template-columns: minmax(420px, 1fr) auto; align-items: center; gap: 14px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; } .overview-announcement-bar { height: 44px; min-width: 0; display: flex; align-items: center; gap: 20px; padding: 0 22px; border: 2px solid var(--overview-accent-gradient); border-radius: 22px; background: #fff; color: #24282C; font-size: 13px; font-weight: 800; box-sizing: border-box; overflow: hidden; } .overview-announcement-bar::before { content: ''; width: 8px; height: 8px; border-radius: 999px; background: #ff7a1a; box-shadow: 0 0 0 4px rgba(255,122,26,.14); flex: 0 0 auto; } .overview-announcement-viewport { min-width: 0; flex: 1; overflow: hidden; white-space: nowrap; } .overview-announcement-text { display: inline-block; min-width: max-content; padding-left: 100%; animation: overviewAnnouncementScroll var(--overview-announcement-duration) linear infinite; } .overview-announcement-bar:hover .overview-announcement-text { animation-play-state: paused; } .overview-announcement-progress { position: relative; width: 118px; height: 5px; margin-left: auto; border-radius: 999px; background: rgba(36,40,44,.16); overflow: hidden; } .overview-announcement-progress::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: var(--overview-accent-gradient); transform: scaleX(0); transform-origin: left center; animation: var(--overview-announcement-progress-animation, overviewAnnouncementProgress var(--overview-announcement-duration) linear infinite); } .overview-announcement-bar:hover .overview-announcement-progress::before { animation-play-state: paused; } @keyframes overviewAnnouncementScroll { 0% { transform: translateX(0); } 100% { transform: translateX(calc(-100% - 100px)); } } @keyframes overviewAnnouncementProgress { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } #page-overview .overview-head-actions { flex-wrap: nowrap; align-items: center; gap: 12px; } #page-overview .overview-recharge-entry { height: 44px; padding: 0 16px; border: 1px solid #2563eb; border-radius: 12px; background: #eff6ff; color: #1d4ed8; box-shadow: none; font-weight: 900; transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease; } #page-overview .overview-recharge-entry:hover { background: #dbeafe; border-color: #1d4ed8; transform: translateY(-1px); box-shadow: 0 8px 18px rgba(37,99,235,.12); } #page-overview .workbench-tabs { width: 305px; height: 44px; display: grid; grid-template-columns: repeat(3, 1fr); align-items: stretch; gap: 0; padding: 0; border: 0; border-radius: 16px; background: #fff; overflow: hidden; box-shadow: none; } #page-overview .workbench-tabs .tab-item { min-width: 0; height: 44px; padding: 0; border-radius: 0; background: transparent; color: #142036; font-size: 13px; font-weight: 900; } #page-overview .workbench-tabs .tab-item.active { margin: 0; height: 44px; border-radius: 0; background: var(--overview-accent-gradient); color: #fff; } #page-overview .workbench-tabs .tab-item[data-tab="works"].active { border-radius: 16px 0 0 16px; } #page-overview .workbench-tabs .tab-item[data-tab="trash"].active { border-radius: 0 16px 16px 0; } #page-overview #panel-works { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) 424px; grid-template-rows: 96px minmax(0, 1fr); gap: 14px 16px; padding: 0 !important; box-sizing: border-box; border: 0; border-radius: 0; background: transparent; overflow: visible; } #page-overview .overview-top-grid { grid-column: 1; grid-row: 1; display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 16px; align-items: stretch; background: transparent; border: 0; border-radius: 0; overflow: visible; } #page-overview .overview-quick-panel { height: 96px; min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: visible; transition: none; } #page-overview .overview-quick-panel:hover { border-color: transparent; background: transparent; box-shadow: none; } #page-overview .overview-action-row { height: 100%; min-height: 0; display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 10px; } #page-overview .overview-action-row::before { display: none; } #page-overview .overview-action-tile { position: relative; min-height: 0; justify-content: center; padding: 0 16px; color: #fff; font-size: 16px; font-weight: 800; background: var(--overview-accent-gradient); border: 0; border-radius: 999px; box-shadow: none !important; appearance: none; -webkit-appearance: none; outline: none; overflow: hidden; text-shadow: none !important; -webkit-font-smoothing: antialiased; text-rendering: geometricPrecision; transition: transform .18s ease, background .18s ease, color .18s ease, filter .18s ease; } #page-overview .overview-action-tile::after { content: ''; position: absolute; top: -45%; bottom: -45%; left: -38%; width: 34%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.26), transparent); transform: translateX(-120%) rotate(12deg); transition: transform .42s ease; pointer-events: none; } #page-overview .overview-action-tile:hover { transform: translateY(-2px) scale(1.018); background: var(--overview-accent-gradient); color: #fff; filter: brightness(1.08); box-shadow: none !important; } #page-overview .overview-action-tile:hover::after { transform: translateX(470%) rotate(12deg); } #page-overview .overview-action-tile:focus-visible { outline: 2px solid rgba(36,40,44,.24); outline-offset: 2px; box-shadow: none !important; } #page-overview .overview-action-icon, #page-overview .overview-action-desc { display: none; } #page-overview .overview-action-title { position: relative; z-index: 1; font-size: 16px; line-height: 1; font-weight: 800; text-shadow: none !important; } #page-overview .overview-stat-panel { padding: 0; border: 0; border-radius: 0; background: transparent; } #page-overview .overview-stat-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; height: 96px; } #page-overview .overview-stat-item { min-height: 0; height: 96px; align-items: center; justify-content: flex-start; padding: 18px 12px 14px; border: 1px solid var(--overview-border-soft); border-radius: 18px; background: var(--overview-surface-strong); box-shadow: var(--overview-shadow-panel); text-align: center; background-clip: padding-box; } #page-overview .overview-stat-head { width: 100%; justify-content: center; color: #58708f; font-size: 13px; font-weight: 900; } #page-overview .overview-stat-icon { display: none; } #page-overview .overview-stat-item strong { width: 100%; margin-top: 14px; color: #000; font-size: clamp(18px, 1.5vw, 25px); font-weight: 400; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: none; } #page-overview .overview-billing-trigger { cursor: pointer; background: var(--overview-surface-strong); border-color: var(--overview-border-soft); color: #000; box-shadow: var(--overview-shadow-panel); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease; will-change: transform; } #page-overview .overview-billing-trigger:hover { transform: translateY(-2px) scale(1.006); background: #fff; border-color: var(--overview-accent-gradient); box-shadow: inset 1px 1px 0 rgba(255,255,255,1), 0 18px 34px rgba(98,126,152,.18), 0 5px 12px rgba(98,126,152,.10); } #page-overview .overview-billing-trigger:active { transform: translateY(-1px) scale(1.003); } #page-overview .overview-billing-trigger .overview-stat-head { min-height: 60px; align-items: center; color: #58708f; } #page-overview .overview-billing-trigger strong { display: none; } #page-overview .overview-list-panel { grid-column: 1; grid-row: 2; min-height: 0; display: flex; flex-direction: column; margin-bottom: 0; padding: 20px 30px 22px; border: 1px solid var(--overview-border-soft); border-radius: 22px; background: var(--overview-surface-strong); box-shadow: var(--overview-shadow-panel); overflow: hidden; background-clip: padding-box; } #page-overview .overview-section-head { align-items: center; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #e3ecf4; } #page-overview .overview-list-tools { margin-left: auto; } #page-overview .workbench-search { width: 310px; height: 34px; border: 1.6px solid var(--overview-accent-gradient) !important; border-radius: 17px !important; background: #fff !important; } #page-overview .workbench-search:focus { outline: none; border-color: var(--overview-accent-gradient) !important; box-shadow: 0 0 0 2px rgba(36,40,44,.14); } #page-overview .workbench-search svg { width: 20px; height: 20px; } #page-overview .overview-book-list { flex: 1; min-height: 0; display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: none; grid-auto-rows: minmax(190px, auto); gap: 18px !important; padding: 6px 10px 16px 2px; margin: -6px -10px 0 -2px; overflow-y: auto; overflow-x: hidden; align-content: start; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--overview-accent-gradient-vertical) transparent; } #page-overview .overview-book-list::-webkit-scrollbar { width: 8px; } #page-overview .overview-book-list::-webkit-scrollbar-thumb { background: var(--overview-accent-gradient-vertical); border-radius: 999px; } #page-overview .overview-book-list::-webkit-scrollbar-track { background: transparent; } #page-overview .overview-book-list.is-overflowing { overflow-y: auto; overflow-x: hidden; padding-right: 10px; margin-right: -10px; scrollbar-width: thin; scrollbar-color: var(--overview-accent-gradient-vertical) transparent; } #page-overview .overview-book-list.is-overflowing::-webkit-scrollbar { width: 8px; } #page-overview .overview-book-list.is-overflowing::-webkit-scrollbar-thumb { background: var(--overview-accent-gradient-vertical); border-radius: 999px; } #page-overview .overview-book-list.is-overflowing::-webkit-scrollbar-track { background: transparent; } #page-overview .overview-book-placeholder { min-height: 0; border: 1.2px dashed rgba(178,201,218,.56); border-radius: 22px; display: flex; align-items: center; justify-content: center; padding: 18px; color: var(--overview-placeholder-text); font-size: 16px; font-weight: 900; letter-spacing: .04em; text-align: center; background: linear-gradient(135deg, rgba(255,255,255,.30), rgba(236,246,251,.22)); user-select: none; pointer-events: none; } #page-overview .book-card { position: relative; z-index: 0; width: auto !important; height: auto; min-height: 0; padding: clamp(12px, 1.1vw, 20px) clamp(14px, 1.2vw, 22px); border: 1.2px solid #d8eef6; border-radius: 22px !important; background: #fff; box-shadow: inset 1px 1px 0 rgba(255,255,255,.96), 0 12px 24px rgba(98,126,152,.14), 0 3px 8px rgba(98,126,152,.08); transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease; will-change: transform; } #page-overview .book-card:hover { z-index: 2; transform: translateY(-2px) scale(1.006); border-color: var(--overview-accent-gradient); background: #fff; box-shadow: inset 1px 1px 0 rgba(255,255,255,1), 0 18px 34px rgba(98,126,152,.18), 0 5px 12px rgba(98,126,152,.10); } #page-overview .book-cover { width: 68px; height: 92px; border-radius: 12px; } #page-overview .book-card .btn-row { justify-content: flex-start !important; gap: 8px !important; padding: 10px 0 0 !important; margin-top: auto; } #page-overview .book-card .btn-row .btn { min-width: 84px; height: 28px; display: inline-flex !important; align-items: center; justify-content: center; box-sizing: border-box; padding: 0 12px !important; border: 1px solid #d8eef6 !important; border-radius: 9px !important; background: #fff !important; color: var(--overview-accent-gradient) !important; font-size: 13px !important; font-weight: 900; line-height: 1; letter-spacing: 0; white-space: nowrap; text-shadow: none !important; -webkit-font-smoothing: auto; box-shadow: none !important; vertical-align: middle; opacity: 1 !important; filter: none !important; transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease; } #page-overview .book-card .overview-book-card-actions { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, .88fr) minmax(0, 1.24fr); flex-wrap: nowrap !important; min-width: 0; } #page-overview .book-card .overview-book-card-actions > .btn { min-width: 0; } #page-overview .book-card .overview-book-card-actions > .overview-book-menu-wrap { min-width: 0; width: 100%; } #page-overview .book-card .overview-book-card-actions > .btn, #page-overview .book-card .overview-book-menu-wrap > .btn { width: 100% !important; min-width: 0 !important; padding-inline: 6px !important; font-size: clamp(11px, .72vw, 13px) !important; overflow: hidden; text-overflow: ellipsis; } #page-overview .book-card .btn-row .btn:hover, #page-overview .book-card .btn-row .btn[data-action="continue-write"]:hover, #page-overview .book-card .btn-row .btn[data-action="book-menu"]:hover { transform: translateY(-1px); background: #f8fbfd !important; border-color: var(--overview-accent-gradient) !important; box-shadow: 0 7px 14px rgba(36,40,44,.12) !important; opacity: 1 !important; filter: none !important; } #page-overview .book-card .btn-row .btn[data-action="edit-book-info"]:hover { transform: translateY(-1px); background: #f8fbfd !important; border-color: var(--overview-accent-gradient) !important; box-shadow: 0 7px 14px rgba(36,40,44,.12) !important; opacity: 1 !important; filter: none !important; } #page-overview .overview-side-grid { grid-column: 2; grid-row: 1 / span 2; display: grid; grid-template-columns: 1fr; grid-template-rows: minmax(0, 1fr) minmax(230px, .84fr); gap: 14px; min-width: 0; min-height: 0; margin-bottom: 0; align-self: stretch; } #page-overview .overview-bottom-card { min-height: 0; padding: 24px 27px; border: 1px solid var(--overview-border-soft); border-radius: 22px; background: var(--overview-surface-strong); box-shadow: var(--overview-shadow-panel); overflow: hidden; background-clip: padding-box; } #page-overview .overview-edit-card { min-height: 0; padding-top: 20px; } #page-overview .overview-edit-toolbar { display: grid; grid-template-columns: auto minmax(160px, 1fr); align-items: center; gap: 10px; } #page-overview .overview-edit-toolbar .overview-table-title { padding: 0; border: 0; background: transparent; font-size: 20px; font-weight: 900; } #page-overview .overview-table-select { justify-self: end; width: min(100%, 230px); height: 30px; padding: 0 30px 0 16px; margin-right: -3px; border: 1.6px solid var(--overview-accent-gradient) !important; border-radius: 15px !important; background-size: 12px 12px; font-size: 13px; } #page-overview .overview-table-select:focus { border-color: var(--overview-accent-gradient) !important; box-shadow: 0 0 0 2px rgba(36,40,44,.14); } #page-overview #overviewEditList { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; padding-right: 8px; scrollbar-width: thin; scrollbar-color: var(--overview-accent-gradient-vertical) transparent; } #page-overview #overviewEditList::-webkit-scrollbar { width: 8px; } #page-overview #overviewEditList::-webkit-scrollbar-thumb { background: var(--overview-accent-gradient-vertical); border-radius: 999px; } #page-overview #overviewEditList::-webkit-scrollbar-track { background: transparent; } #page-overview .overview-sixday-card { display: flex; flex-direction: column; } #page-overview .overview-sixday-title { margin: 0; color: #061a37; font-size: 20px; font-weight: 900; } #page-overview .overview-sixday-chart { position: relative; flex: 1; min-height: 0; margin-top: 22px; } #page-overview .overview-sixday-axis { position: absolute; left: 0; top: 24px; bottom: 68px; width: 46px; display: flex; flex-direction: column; justify-content: space-between; padding-right: 8px; color: #7a8aa4; font-size: 11px; font-weight: 800; line-height: 1; text-align: right; pointer-events: none; } #page-overview .overview-sixday-lines { position: absolute; inset: 24px 0 68px 52px; display: grid; grid-template-rows: repeat(3, 1fr); pointer-events: none; } #page-overview .overview-sixday-lines span { border-top: 1px solid #e3ecf4; } #page-overview .overview-empty, #page-overview .overview-empty-cell, #page-overview .overview-sixday-empty { color: var(--overview-placeholder-text) !important; } #page-overview .overview-sixday-empty { position: absolute; left: 52px; right: 0; top: 50%; transform: translateY(-50%); color: var(--overview-placeholder-text); font-size: 13px; text-align: center; pointer-events: none; } #page-overview .overview-sixday-bars { position: absolute; left: 58px; right: 20px; top: 50px; bottom: 24px; display: grid; grid-template-columns: repeat(6, 1fr); align-items: end; gap: 14px; } #page-overview .overview-sixday-bar-wrap { position: relative; min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 10px; cursor: default; } #page-overview .overview-sixday-tooltip { position: absolute; top: 0; left: 50%; z-index: 3; transform: translate(-50%, 4px); padding: 6px 9px; border-radius: 8px; background: rgba(36,40,44,.96); color: #fff; font-size: 12px; font-weight: 800; line-height: 1; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .16s ease, transform .16s ease; box-shadow: 0 8px 18px rgba(36,40,44,.22); } #page-overview .overview-sixday-bar-wrap:hover .overview-sixday-tooltip { opacity: 1; transform: translate(-50%, -2px); } #page-overview .overview-sixday-bar-wrap:first-child .overview-sixday-tooltip { left: 0; transform: translate(0, 4px); } #page-overview .overview-sixday-bar-wrap:first-child:hover .overview-sixday-tooltip { transform: translate(0, -2px); } #page-overview .overview-sixday-bar-wrap:last-child .overview-sixday-tooltip { left: auto; right: 0; transform: translate(0, 4px); } #page-overview .overview-sixday-bar-wrap:last-child:hover .overview-sixday-tooltip { transform: translate(0, -2px); } #page-overview .overview-sixday-bar { width: 28px; min-height: 20px; border-radius: 9px 9px 0 0; background: var(--overview-sixday-gradient); } #page-overview .overview-sixday-label { color: #60728f; font-size: 12px; } .payment-modal-box { width: min(1180px, 94vw) !important; max-height: 90vh; padding: 0 !important; overflow: hidden; border-radius: 12px !important; background: #fff; color: #0f172a; } .payment-modal-box.is-checkout { width: min(640px, 94vw) !important; max-height: calc(100vh - 28px); } .payment-shell { display: flex; flex-direction: column; max-height: 90vh; } .payment-modal-box.is-checkout .payment-shell { max-height: calc(100vh - 28px); } .payment-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 26px 14px; border-bottom: 1px solid #e5e7eb; } .payment-title { margin: 0; font-size: 24px; line-height: 1.2; font-weight: 900; color: #0f172a; } .payment-subtitle { margin-top: 6px; color: #64748b; font-size: 13px; line-height: 1.6; } .payment-close { width: 32px; height: 32px; border: none; border-radius: 8px; background: transparent; color: #64748b; font-size: 24px; line-height: 1; cursor: pointer; } .payment-close:hover { background: #f1f5f9; color: #0f172a; } .payment-account-strip { margin: 14px 26px 0; padding: 12px 14px; border: 1px solid #e5e7eb; border-radius: 10px; background: #f8fafc; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } .payment-account-item span { display: block; color: #64748b; font-size: 12px; } .payment-account-item strong { display: block; margin-top: 4px; color: #0f172a; font-size: 15px; } .payment-tabs { margin: 16px auto 8px; padding: 4px; border: 1px solid #dbe1ea; border-radius: 999px; background: #f8fafc; display: inline-flex; gap: 4px; } .payment-modal-box.is-checkout .payment-tabs { display: none; } .payment-tab-btn { min-width: 104px; height: 34px; border: none; border-radius: 999px; background: transparent; color: #64748b; font-size: 13px; font-weight: 800; cursor: pointer; } .payment-tab-btn.active { background: #0f172a; color: #fff; } .payment-body { min-height: 0; padding: 14px 26px 18px; display: grid; grid-template-columns: 1fr; gap: 16px; overflow: auto; } .payment-body.is-checkout { grid-template-columns: 1fr; justify-content: stretch; overflow-y: auto; padding-top: 22px; padding-bottom: 30px; } .payment-body:not(.is-checkout) .payment-order-panel { display: none; } .payment-body.is-checkout .payment-plan-grid { display: none; } .payment-plan-grid { display: grid; grid-template-columns: repeat(4, minmax(190px, 1fr)); gap: 14px; align-content: start; } .payment-plan-grid.points-mode { grid-template-columns: repeat(3, minmax(210px, 1fr)); } .payment-plan-card { min-height: 342px; padding: 18px; border: 1px solid #e5e7eb; border-radius: 8px; background: #f8fafc; cursor: pointer; display: flex; flex-direction: column; gap: 12px; position: relative; transition: border-color .15s, box-shadow .15s, transform .15s, background .15s; } .payment-plan-card:hover { transform: translateY(-1px); border-color: #93c5fd; box-shadow: 0 10px 24px rgba(15,23,42,.08); } .payment-plan-card.active { border-color: #2563eb; background: #eff6ff; box-shadow: inset 0 0 0 1px #2563eb, 0 12px 26px rgba(37,99,235,.12); } .payment-plan-badge { align-self: flex-start; height: 24px; padding: 0 8px; border-radius: 999px; background: #ff7a1a; color: #fff; display: inline-flex; align-items: center; font-size: 12px; font-weight: 900; } .payment-discount-badge { position: absolute; top: 14px; right: 14px; height: 26px; padding: 0 10px; border-radius: 999px; background: #ef4444; color: #fff; display: inline-flex; align-items: center; font-size: 12px; font-weight: 900; box-shadow: 0 8px 16px rgba(239,68,68,.18); } .payment-plan-name { font-size: 21px; font-weight: 900; color: #0f172a; } .payment-plan-desc { min-height: 42px; color: #64748b; font-size: 13px; line-height: 1.6; } .payment-plan-price { margin-top: 2px; display: flex; align-items: baseline; gap: 6px; color: #0f172a; flex-wrap: wrap; } .payment-plan-price strong { font-size: 28px; line-height: 1; } .payment-plan-price span { font-size: 14px; color: #64748b; } .payment-original-price { color: #94a3b8; font-size: 13px; text-decoration: line-through; } .payment-save-text { width: 100%; color: #ef4444; font-size: 12px; font-weight: 900; } .payment-gift-highlight { padding: 10px 12px; border-radius: 8px; background: #fff7ed; color: #9a3412; border: 1px solid #fed7aa; font-size: 13px; font-weight: 900; } .payment-plan-benefits { display: grid; gap: 8px; margin-top: auto; } .payment-benefit { padding: 9px 10px; border: 1px solid #dbeafe; border-radius: 8px; background: rgba(255,255,255,.72); color: #0f172a; font-size: 13px; font-weight: 700; } .payment-subscribe-btn { width: 100%; height: 38px; border: none; border-radius: 8px; background: #0f172a; color: #fff; font-weight: 900; cursor: pointer; margin-top: 2px; } .payment-subscribe-btn:hover { background: #2563eb; } .payment-order-panel { border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; padding: 16px; align-self: start; position: static; } .payment-body.is-checkout .payment-order-panel { width: 100%; max-width: 520px; margin: 0 auto; } .payment-back-btn { border: none; background: transparent; color: #2563eb; font-size: 13px; font-weight: 800; cursor: pointer; padding: 0 0 10px; } .payment-order-title { font-size: 15px; font-weight: 900; color: #0f172a; margin-bottom: 10px; } .payment-summary-line { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px dashed #e5e7eb; font-size: 13px; color: #64748b; } .payment-summary-line strong { color: #0f172a; font-size: 16px; } .payment-methods { display: grid; grid-template-columns: 1fr; gap: 8px; margin: 14px 0 12px; } .payment-method-btn { height: 34px; border: 1px solid #dbe1ea; border-radius: 8px; background: #f8fafc; color: #334155; font-size: 13px; font-weight: 800; cursor: pointer; } .payment-method-btn.active { border-color: #2563eb; background: #eff6ff; color: #1d4ed8; } .payment-method-btn[data-pay-method="alipay"] { display: none; } .payment-qr-box { width: min(100%, 220px); aspect-ratio: 1 / 1; min-height: 0; margin: 10px auto 0; border: 1px dashed #cbd5e1; border-radius: 10px; background: #f8fafc; display: flex; align-items: center; justify-content: center; text-align: center; padding: 12px; color: #64748b; font-size: 13px; line-height: 1.7; } .payment-qr-box img { width: 100%; height: 100%; object-fit: contain; border-radius: 8px; background: #fff; } .payment-qr-expire { min-height: 20px; margin-top: 8px; text-align: center; color: #64748b; font-size: 12px; line-height: 1.6; } .payment-order-result { display: none; margin-top: 12px; padding: 10px; border-radius: 8px; background: #f0fdf4; color: #166534; font-size: 12px; line-height: 1.7; border: 1px solid #bbf7d0; word-break: break-all; } .payment-rule-note { margin-top: 12px; color: #64748b; font-size: 12px; line-height: 1.7; } .payment-footer { padding: 0 26px 18px; display: flex; justify-content: flex-start; } .payment-modal-box.is-checkout .payment-footer { padding-bottom: 12px; } .payment-agreement-link { border: none; background: transparent; color: #2563eb; font-size: 13px; font-weight: 800; cursor: pointer; padding: 0; } .payment-agreement-box { width: min(560px, 92vw); background: #fff; border-radius: 8px; padding: 22px 24px 24px; box-shadow: 0 18px 60px rgba(15,23,42,.2); } .payment-agreement-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; } .payment-agreement-head h3 { margin: 0; font-size: 20px; color: #0f172a; } .payment-agreement-head p { margin: 6px 0 0; font-size: 13px; color: #64748b; } .payment-agreement-close { border: none; background: transparent; color: #64748b; font-size: 24px; cursor: pointer; line-height: 1; } .payment-agreement-content { border: 1px solid #e5e7eb; border-radius: 6px; padding: 16px; color: #475569; font-size: 14px; line-height: 1.9; background: #fafafa; } .payment-agreement-actions { display: flex; justify-content: flex-end; margin-top: 16px; } .payment-agreement-ok { min-width: 88px; height: 36px; border: 1px solid #dbe1ea; border-radius: 8px; background: #fff; color: #0f172a; font-size: 14px; font-weight: 800; cursor: pointer; } .sidebar-theme-quick { width: 100%; min-height: 44px; padding: 5px 0; border: 0; border-radius: 8px; background: transparent; color: rgba(255,255,255,.72); display: flex; align-items: center; justify-content: center; cursor: pointer; } .sidebar-theme-quick:hover { background: transparent; color: #fff; } .sidebar-theme-quick:focus-visible { outline: 3px solid rgba(38,132,255,.48); outline-offset: 2px; } .sidebar-theme-quick-track { position: relative; width: 68px; height: 34px; flex: 0 0 68px; padding: 0; border-radius: 999px; background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); display: grid; grid-template-columns: 1fr 1fr; align-items: center; justify-items: center; } .sidebar-theme-quick-track::before { content: ''; position: absolute; top: 3px; left: 3px; width: 28px; height: 28px; border-radius: 50%; background: #4e5569; box-shadow: 0 2px 7px rgba(0,0,0,.28); transition: transform .18s ease; } .sidebar-theme-icon { position: relative; z-index: 1; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .sidebar-theme-icon-sun { color: #f8c45c; } .sidebar-theme-icon-moon { color: rgba(255,255,255,.5); } .sidebar-theme-quick[aria-pressed="true"] .sidebar-theme-quick-track::before { transform: translateX(34px); } .sidebar-theme-quick[aria-pressed="true"] .sidebar-theme-icon-sun { color: rgba(255,255,255,.45); } .sidebar-theme-quick[aria-pressed="true"] .sidebar-theme-icon-moon { color: #f4f1ff; } .sidebar.collapsed .sidebar-theme-quick { display: flex; width: 44px; min-width: 44px; margin-inline: auto; } .sidebar.collapsed .sidebar-theme-quick-track { width: 44px; flex-basis: 44px; padding-inline: 3px; } .sidebar.collapsed .sidebar-theme-quick-track::before { width: 19px; height: 28px; border-radius: 12px; } .sidebar.collapsed .sidebar-theme-quick[aria-pressed="true"] .sidebar-theme-quick-track::before { transform: translateX(19px); } .sidebar.collapsed .sidebar-theme-icon { width: 15px; height: 15px; } [data-theme="dark"] .sidebar { background: #0e0f16; color: #d8dae2; } [data-theme="dark"] .sidebar .collapse-btn, [data-theme="dark"] .nav-item { color: #d8dae2; } [data-theme="dark"] #homeBtn svg { stroke: #d8dae2; } [data-theme="dark"] .nav-item svg { stroke: #d8dae2; } [data-theme="dark"] .nav-item.active { background-color: var(--bg-card); color: #fff; } [data-theme="dark"] .nav-item.active svg { stroke: #fff; } [data-theme="dark"] .overview-quick-panel, [data-theme="dark"] .overview-stat-panel, [data-theme="dark"] .overview-stat-item, [data-theme="dark"] .overview-list-panel, [data-theme="dark"] .overview-bottom-card, [data-theme="dark"] .overview-action-tile, [data-theme="dark"] .overview-snapshot-card, [data-theme="dark"] .overview-empty { background: var(--bg-card); border-color: var(--border); } [data-theme="dark"] .overview-action-tile:hover { background: #252936; border-color: #414657; } [data-theme="dark"] .overview-stat-panel { background: transparent; border-color: transparent; } [data-theme="dark"] .overview-action-icon, [data-theme="dark"] .overview-stat-icon { background: #20232e; border-color: var(--border); color: currentColor; } [data-theme="dark"] #panel-works { background: var(--bg-card); border-color: var(--border); } [data-theme="dark"] .overview-top-grid, [data-theme="dark"] .overview-list-panel { border-color: var(--border); } [data-theme="dark"] .overview-top-grid, [data-theme="dark"] .overview-side-grid { background: transparent; } [data-theme="dark"] .overview-table-title { background: #20232e; border-color: var(--border); color: var(--text); } [data-theme="dark"] .overview-help-item { background: #20232e; border-color: var(--border); color: var(--text); } [data-theme="dark"] .overview-help-item:hover { background: #252938; border-color: #3a4052; } [data-theme="dark"] .overview-help-icon, [data-theme="dark"] .overview-group-qr-box { background: #20232e; border-color: var(--border); color: var(--text); } [data-theme="dark"] .overview-tutorial-card { background: #20232e; border-color: var(--border); color: var(--text); } [data-theme="dark"] .overview-tutorial-card:hover { background: #252938; border-color: #3a4052; } [data-theme="dark"] .overview-tutorial-card.active { border-color: #7aa2ff; box-shadow: 0 0 0 3px rgba(122,162,255,.14); } [data-theme="dark"] .overview-tutorial-cover { background: linear-gradient(135deg, #20232e, #111827); } [data-theme="dark"] .overview-tutorial-cover.is-fallback::after, [data-theme="dark"] .overview-tutorial-card-title { color: var(--text); } [data-theme="dark"] .overview-tutorial-empty { background: #20232e; border-color: var(--border); color: var(--muted); } [data-theme="dark"] .billing-modal-box, [data-theme="dark"] .billing-ledger-item, [data-theme="dark"] .billing-ledger-empty { background: var(--bg-card); color: var(--text); border-color: var(--border); } [data-theme="dark"] .billing-ledger-title, [data-theme="dark"] .billing-ledger-name { color: var(--text); } [data-theme="dark"] .billing-ledger-subtitle, [data-theme="dark"] .billing-ledger-time, [data-theme="dark"] .billing-ledger-meta { color: var(--text-muted); } [data-theme="dark"] .overview-stat-item strong, [data-theme="dark"] .workbench-metric strong { color: var(--text); } [data-theme="dark"] #page-overview .book-card { background: #1f2c3a; border-color: #314458; } [data-theme="dark"] .overview-table th { background: #252936; color: var(--text-muted); } [data-theme="dark"] .overview-table td { color: var(--text); border-bottom-color: var(--border); } [data-theme="dark"] .overview-recharge-entry { background: #172554; border-color: #3b82f6; color: #bfdbfe; box-shadow: none; } [data-theme="dark"] .overview-announcement-bar { background: #20232e; color: #f5f7fb; border-color: #4f6f92; } [data-theme="dark"] .overview-announcement-text { color: #f5f7fb; } [data-theme="dark"] .overview-announcement-progress { background: rgba(255,255,255,.18); } [data-theme="dark"] .payment-modal-box, [data-theme="dark"] .payment-order-panel { background: #20232e; color: #f5f7fb; border-color: #343848; } [data-theme="dark"] .payment-head, [data-theme="dark"] .payment-account-strip, [data-theme="dark"] .payment-plan-card, [data-theme="dark"] .payment-qr-box { background: #262a36; border-color: #3a4052; } [data-theme="dark"] .payment-title, [data-theme="dark"] .payment-account-item strong, [data-theme="dark"] .payment-plan-name, [data-theme="dark"] .payment-plan-price, [data-theme="dark"] .payment-summary-line strong, [data-theme="dark"] .payment-benefit { color: #f5f7fb; } [data-theme="dark"] .payment-subtitle, [data-theme="dark"] .payment-account-item span, [data-theme="dark"] .payment-plan-desc, [data-theme="dark"] .payment-summary-line, [data-theme="dark"] .payment-rule-note { color: #aeb5c4; } [data-theme="dark"] .payment-plan-card.active { background: #172554; border-color: #3b82f6; box-shadow: inset 0 0 0 1px #3b82f6; } [data-theme="dark"] .payment-benefit { background: #20232e; border-color: #3a4052; } [data-theme="dark"] .payment-subscribe-btn { background: #3b82f6; color: #fff; } [data-theme="dark"] .payment-agreement-box { background: #20232e; color: #f5f7fb; } [data-theme="dark"] .payment-agreement-head h3 { color: #f5f7fb; } [data-theme="dark"] .payment-agreement-content { background: #262a36; border-color: #3a4052; color: #d8dae2; } /* source: ./styles/app/42-create-book.css?v=202607281900 */ /* New-work dialog: cover generation, mixed genre selection and synopsis generation. */ .create-book-dialog { width: min(900px, 94vw); height: min(720px, 90vh); max-height: 90vh; padding: 0 !important; overflow: hidden; display: flex; flex-direction: column; } .create-book-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 24px 16px; border-bottom: 1px solid var(--border); } .create-book-head h3 { margin: 0; font-size: 20px; color: var(--text); } .create-book-head p { margin: 7px 0 0; color: var(--text-muted); font-size: 13px; line-height: 1.6; } .create-book-close { border: 0; background: transparent; color: var(--text-muted); font-size: 24px; line-height: 1; cursor: pointer; } .create-book-layout { min-height: 0; flex: 1; display: grid; grid-template-columns: 240px minmax(0, 1fr); overflow: hidden; } .create-book-cover-panel { padding: 24px; border-right: 1px solid var(--border); background: #fff; } .create-book-cover-preview { position: relative; width: 176px; aspect-ratio: 3 / 4; margin: 0 auto 16px; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: var(--bg-input); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: border-color .16s ease, box-shadow .16s ease, opacity .16s ease; } .create-book-cover-preview:hover { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); } .create-book-cover-preview:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; } .create-book-cover-preview.is-loading { opacity: .58; pointer-events: none; } .create-book-cover-preview img { width: 100%; height: 100%; object-fit: cover; } .create-book-cover-preview img.is-placeholder { object-fit: contain; padding: 34px; opacity: .18; filter: grayscale(1); } .create-book-cover-preview span { position: absolute; inset: auto 12px 22px; color: var(--text-muted); font-size: 13px; font-weight: 800; text-align: center; } .create-book-cover-actions { display: flex; flex-direction: column; gap: 8px; } .create-book-cover-action { width: 100%; justify-content: center; } .create-book-cover-action[hidden] { display: none !important; } .create-book-cover-panel > p { margin: 12px 0 0; color: var(--text-muted); font-size: 12px; line-height: 1.65; text-align: center; } .create-book-form { min-width: 0; min-height: 0; padding: 20px 24px 24px; display: flex; flex-direction: column; gap: 14px; overflow: hidden; } .create-book-field { position: relative; display: flex; flex-direction: column; gap: 8px; color: var(--text); } .create-book-field > span, .create-book-field-head > span { font-size: 13px; font-weight: 800; color: var(--text); } .create-book-field em { color: #dc2626; font-style: normal; } .create-book-field input, .create-book-field textarea { width: 100%; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-input); color: var(--text); font: inherit; box-sizing: border-box; } .create-book-field input { height: 42px; padding: 0 12px; } .create-book-field input[readonly] { cursor: not-allowed; color: var(--text-muted); background: color-mix(in srgb, var(--bg-input) 82%, var(--border)); } .create-book-field textarea { min-height: 116px; padding: 12px; line-height: 1.7; resize: vertical; } .create-book-field input:focus, .create-book-field textarea:focus { outline: 2px solid color-mix(in srgb, var(--accent) 36%, transparent); border-color: var(--accent); } .create-book-field-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .create-book-field-head small { color: var(--text-muted); font-size: 12px; } .create-book-genre-field { min-height: 0; flex: 1 1 auto; } .create-book-genre-combined { min-height: 0; flex: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; overflow: hidden; } .create-book-genre-column { min-width: 0; min-height: 0; display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-input); overflow: hidden; } .create-book-channel-option { min-height: 44px; padding: 8px 11px; border: 0; border-bottom: 1px solid var(--border); background: var(--bg-card); color: var(--text); display: flex; align-items: center; justify-content: space-between; gap: 8px; text-align: left; cursor: pointer; } .create-book-channel-option strong { font-size: 14px; } .create-book-channel-option small { color: var(--text-muted); font-size: 11px; } .create-book-channel-option.active { background: color-mix(in srgb, var(--accent) 14%, var(--bg-card)); color: var(--accent); box-shadow: inset 0 -2px 0 var(--accent); } .create-book-genre-tags { min-height: 0; padding: 9px; display: flex; flex-wrap: wrap; align-content: flex-start; gap: 7px; overflow-y: auto; overscroll-behavior: contain; } .create-book-genre-tag { min-height: 32px; padding: 6px 11px; border: 1px solid var(--border); border-radius: 999px; background: var(--bg-card); color: var(--text); font-size: 12px; cursor: pointer; } .create-book-genre-tag:hover { border-color: var(--accent); } .create-book-genre-tag.active { background: var(--accent); border-color: var(--accent); color: #fff; } .create-book-synopsis-action { position: absolute; right: 10px; bottom: 10px; } .create-book-synopsis-field { flex: 0 0 118px; min-height: 0; } .create-book-form .create-book-synopsis-field textarea { min-height: 0; height: 96px; padding-right: 108px; resize: none; overflow-y: auto; } .create-book-actions { flex: 0 0 auto; display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px 20px; border-top: 1px solid var(--border); } .create-book-synopsis-dialog { width: min(620px, 92vw); max-height: 88vh; padding: 0 !important; overflow: auto; } .create-book-synopsis-dialog > .create-book-field { margin: 18px 24px 0; } .create-book-synopsis-generate-row { margin: 14px 24px 0; padding: 11px 12px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-input); display: flex; align-items: center; justify-content: space-between; gap: 12px; } .create-book-synopsis-generate-row span { min-width: 0; color: var(--text-muted); font-size: 12px; line-height: 1.55; } .create-book-synopsis-dialog #createBookSynopsisPreviewText.is-generating { background: var(--chapter-generation-highlight, #e3f2fd); border-color: var(--chapter-generation-highlight-border, #90caf9); } .create-book-synopsis-dialog .create-book-actions { margin-top: 20px; } [data-theme="dark"] .create-book-cover-panel { background: var(--bg-card); } [data-theme="dark"] .create-book-channel-option.active { background: #1d3854; } [data-theme="dark"] .create-book-cover-preview img.is-placeholder { opacity: .32; filter: grayscale(1) brightness(1.6); } @media (max-width: 720px) { .create-book-layout { grid-template-columns: 1fr; overflow-y: auto; } .create-book-cover-panel { border-right: 0; border-bottom: 1px solid var(--border); } .create-book-cover-preview { width: 140px; } .create-book-form { overflow: visible; } .create-book-genre-combined { min-height: 320px; grid-template-columns: 1fr; overflow: visible; } } /* source: ./styles/app/50-memory-settings.css?v=202607280442 */ /* 记忆库和设置页 */ .memory-main-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px !important; } .memory-book-card { min-height: 126px !important; width: auto !important; border-radius: 10px !important; border: 1px solid var(--border); background: var(--bg-card); box-shadow: none; cursor: pointer; } .memory-book-card:hover { transform: translateY(-1px); border-color: #b9c0ca; box-shadow: 0 8px 20px rgba(18,21,28,.08); } .memory-book-top { display: flex; align-items: center; gap: 12px; } .memory-book-icon { width: 42px; height: 42px; border: 1px solid var(--border); border-radius: 8px; display: flex; align-items: center; justify-content: center; background: #f6f7f8; color: #12151c; flex-shrink: 0; } .memory-book-name { font-size: 15px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .memory-book-meta { margin-top: 2px; font-size: 12px; color: var(--text-muted); } .memory-folder-stats { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; } .memory-chip { padding: 3px 7px; border-radius: 999px; background: #f1f3f5; border: 1px solid #e3e6eb; color: #5f6672; font-size: 11px; } .memory-sub-browser { flex: 1; display: flex; overflow: hidden; padding: 0; gap: 12px; min-height: 0; } .memory-folder-sidebar { width: 220px !important; border-radius: 10px !important; background: #fff !important; border: 1px solid var(--border) !important; padding: 10px !important; } .mem-folder-item { border: 1px solid transparent; } .mem-folder-item.active { background: #fff !important; border-color: var(--border) !important; border-left-color: #2BA36B !important; } .memory-folder-sidebar { background: var(--bg-input) !important; --memory-folder-hover: #f0f7ff; } .mem-folder-item.active { background: var(--bg-input) !important; } .memory-folder-tag { font-size: 10px; font-weight: 800; color: #7a808a; background: #edf0f4; border-radius: 999px; padding: 2px 6px; white-space: nowrap; } .memory-file-grid { border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card); padding: 12px; } .memory-file-section + .memory-file-section { margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--border); } .memory-file-section-title { margin-bottom: 10px; color: #5f6672; font-size: 12px; font-weight: 800; } .memory-file-card-grid, .memory-volume-grid { display: flex; flex-wrap: wrap; gap: 12px; align-content: flex-start; } .memory-section-empty { min-height: 52px; display: flex; align-items: center; color: #9aa0aa; font-size: 12px; } .memory-volume-toolbar { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px dashed var(--border); } .memory-volume-back { width: auto; padding: 6px 11px; border: 1px solid var(--border); border-radius: 7px; background: var(--btn-outline-bg); color: var(--btn-outline-text); cursor: pointer; font-size: 12px; } .memory-volume-card { width: 220px; min-height: 112px; padding: 14px; border: 1px solid var(--border); border-radius: 10px; background: #fff; cursor: pointer; display: flex; flex-direction: column; justify-content: space-between; transition: transform 0.15s, border-color 0.15s, box-shadow 0.15s; } .memory-volume-card:hover { transform: translateY(-1px); border-color: #b9c0ca; box-shadow: 0 8px 20px rgba(18,21,28,.08); } .memory-volume-card-name { color: #171b24; font-size: 14px; font-weight: 800; } .memory-volume-card-meta { color: #8b8f98; font-size: 11px; } .memory-file-card { width: 220px !important; min-height: 132px; padding: 14px !important; border: 1px solid var(--border) !important; border-radius: 10px !important; background: #fff !important; box-shadow: none !important; } .memory-file-card.selected { border-color: #90caf9 !important; background: #f3f9ff !important; } .memory-file-card:hover { transform: translateY(-1px) !important; border-color: #b9c0ca !important; box-shadow: 0 8px 20px rgba(18,21,28,.08) !important; } .memory-file-name { font-size: 13px; font-weight: 800; color: #171b24; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .settings-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: stretch; } .settings-menu { position: sticky; top: 0; border: 1px solid var(--border); border-radius: 10px; background: #fff; padding: 8px; display: flex; flex-direction: column; gap: 4px; } #page-setting .settings-menu { display: none; } .settings-menu-item { width: 100%; height: 34px; border: none; border-radius: 8px; background: transparent; color: var(--text); font-size: 13px; font-weight: 700; text-align: left; padding: 0 10px; cursor: pointer; display: flex; align-items: center; gap: 8px; } .settings-menu-item:hover { background: #f6f7f8; } .settings-menu-item.active { background: #12151c; color: #fff; } .settings-content-grid { display: grid; grid-template-columns: minmax(360px, 1.1fr) minmax(320px, .9fr); gap: 14px; align-items: stretch; } .settings-stack { display: flex; flex-direction: column; gap: 14px; height: 100%; } #settingPanelBackup { flex: 1; } .settings-panel { border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card); padding: 16px; } .settings-panel h3 { margin: 0 0 12px; font-size: 15px; color: var(--text); } .settings-panel-desc { margin: -4px 0 12px; color: var(--text-muted); font-size: 12px; line-height: 1.6; } .settings-field { margin-bottom: 12px; } .settings-field label { font-size: 13px; font-weight: 700; color: var(--text); display: block; margin-bottom: 5px; } .settings-field input, .settings-field select { border-radius: 8px !important; } .settings-secret-toggle { position: absolute; right: 7px; top: 50%; transform: translateY(-50%); height: 26px; border: 0; border-radius: 7px; background: transparent; color: var(--text-muted); font-size: 11px; cursor: pointer; } .settings-secret-toggle:hover { background: rgba(148, 163, 184, .14); color: var(--text); } .settings-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; } .settings-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .settings-stat { background: #fff; border: 1px solid var(--border); padding: 12px; border-radius: 8px; text-align: center; } .settings-stat strong { display: block; font-size: 20px; font-family: Consolas, "SFMono-Regular", monospace; } .settings-stat span { display: block; margin-top: 4px; font-size: 12px; color: var(--text-muted); } .settings-status-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .settings-status-item { padding: 10px; border: 1px solid var(--border); border-radius: 8px; background: #fff; } .settings-status-item span { display: block; font-size: 12px; color: var(--text-muted); } .settings-status-item strong { display: block; margin-top: 3px; font-size: 14px; } .settings-preference-row { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 10px 0; border-top: 1px solid var(--border); } .settings-preference-row > div:first-child { min-width: 0; } .settings-preference-row strong { display: block; color: var(--text); font-size: 14px; } .settings-preference-row span { display: block; margin-top: 4px; color: var(--text-muted); font-size: 12px; line-height: 1.5; } .settings-segmented { display: inline-flex; flex: 0 0 auto; padding: 3px; border: 1px solid var(--border); border-radius: 12px; background: rgba(255, 255, 255, .72); } .settings-segmented button { min-width: 46px; height: 31px; border: 0; border-radius: 9px; background: transparent; color: var(--text); cursor: pointer; } .settings-segmented button.active { background: var(--accent); color: #fff; } .settings-switch { position: relative; display: inline-block; width: 44px; height: 24px; flex: 0 0 auto; } .settings-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; } .settings-switch .toggle-slider { position: absolute; cursor: pointer; inset: 0; border-radius: 24px; background: #9ca7ad; transition: background .2s ease; } .settings-switch .toggle-slider::after { content: ''; position: absolute; width: 18px; height: 18px; left: 3px; top: 3px; border-radius: 50%; background: #fff; transition: transform .2s ease; box-shadow: 0 1px 3px rgba(15, 23, 42, .2); } .settings-switch input:checked + .toggle-slider { background: var(--accent); } .settings-switch input:checked + .toggle-slider::after { transform: translateX(20px); } .settings-section-heading, .settings-subsection-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; } .settings-section-heading p, .settings-subsection-heading p { margin: -5px 0 0; color: var(--text-muted); font-size: 12px; line-height: 1.55; } .settings-save-hint { flex: 0 0 auto; padding: 6px 10px; border-radius: 999px; background: rgba(255, 255, 255, .7); color: var(--text-muted); font-size: 11px; } .settings-theme-grid { display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 10px; margin-top: 16px; } .settings-theme-card { height: 100px; min-height: 0; overflow: hidden; box-sizing: border-box; border: 1px solid var(--border); border-radius: 14px; background: rgba(255, 255, 255, .52); padding: 10px; text-align: left; color: var(--text); cursor: pointer; } .settings-theme-card:hover, .settings-theme-card.active { border-color: var(--accent); } .settings-theme-card.active { box-shadow: inset 0 0 0 1px var(--accent); } .settings-theme-card-swatches { display: flex; gap: 7px; margin-bottom: 7px; } .settings-theme-card-swatches span { width: 23px; height: 23px; border: 1px solid rgba(15, 23, 42, .08); border-radius: 7px; } .settings-theme-card strong { display: block; font-size: 13px; } .settings-theme-card small { display: -webkit-box; margin-top: 3px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: var(--text-muted); font-size: 11px; line-height: 1.25; } .settings-theme-card-current { float: right; color: var(--accent); font-size: 10px; font-weight: 800; } .settings-subsection-heading { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); } .settings-wallpaper-grid { display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 12px; margin-top: 16px; } .settings-wallpaper-card { position: relative; min-width: 0; border: 1px solid var(--border); border-radius: 14px; background: rgba(255, 255, 255, .58); padding: 9px; color: var(--text); text-align: left; overflow: hidden; } .settings-wallpaper-card:hover, .settings-wallpaper-card.active { border-color: var(--accent); } .settings-wallpaper-card.active { box-shadow: inset 0 0 0 1px var(--accent); } .settings-wallpaper-select { display: block; width: 100%; margin: 0; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: inherit; cursor: pointer; } .settings-wallpaper-select:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 10px; } .settings-wallpaper-preview { width: 100%; aspect-ratio: 2 / 1; display: flex; align-items: center; justify-content: center; border-radius: 10px; background: #eef4f5; color: #65737a; overflow: hidden; } .settings-wallpaper-preview img { width: 100%; height: 100%; object-fit: cover; } .settings-wallpaper-card-meta { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin-top: 9px; } .settings-wallpaper-card-meta strong { min-width: 0; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .settings-wallpaper-card-meta small { flex: 0 0 auto; color: var(--accent); font-size: 10px; font-weight: 800; } .settings-wallpaper-delete { position: absolute; top: 14px; right: 14px; z-index: 2; height: 25px; padding: 0 9px; border: 1px solid #ef4444; border-radius: 8px; background: rgba(255, 255, 255, .94); color: #dc2626; font-size: 11px; cursor: pointer; } .settings-opacity-control { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border); } .settings-opacity-control > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .settings-opacity-control label { color: var(--text); font-size: 13px; font-weight: 800; } .settings-opacity-control output { color: var(--text-muted); font-size: 12px; } .settings-opacity-control input[type='range'] { width: 100%; margin: 12px 0 4px; accent-color: var(--accent); } .settings-opacity-control p, .settings-local-note { margin: 4px 0 0; color: var(--text-muted); font-size: 11px; line-height: 1.55; } .settings-local-note { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: rgba(255, 255, 255, .55); } .settings-version { flex: 0 0 auto; color: var(--accent) !important; font-size: 16px !important; font-weight: 800; } .wallpaper-replace-overlay { position: fixed; inset: 0; z-index: 5200; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(15, 23, 42, .56); } .wallpaper-replace-dialog { width: min(560px, calc(100vw - 48px)); border: 1px solid var(--border); border-radius: 16px; background: var(--bg-card); color: var(--text); padding: 20px; box-shadow: 0 18px 54px rgba(15, 23, 42, .24); } .wallpaper-replace-dialog h3 { margin: 0; font-size: 17px; } .wallpaper-replace-dialog > p { margin: 7px 0 16px; color: var(--text-muted); font-size: 12px; line-height: 1.6; } .wallpaper-replace-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; } .wallpaper-replace-options button { min-width: 0; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-input); color: var(--text); padding: 8px; cursor: pointer; text-align: left; } .wallpaper-replace-options button:hover { border-color: var(--accent); } .wallpaper-replace-options img { display: block; width: 100%; aspect-ratio: 2 / 1; object-fit: cover; border-radius: 8px; } .wallpaper-replace-options span { display: block; margin-top: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 700; } [data-theme="dark"] #page-setting .settings-panel { background: #20232e; border-color: #343848; color: #eef2f8; } [data-theme="dark"] #page-setting .settings-panel h3, [data-theme="dark"] #page-setting .settings-field label, [data-theme="dark"] #page-setting .settings-status-item strong, [data-theme="dark"] #page-setting .settings-stat strong { color: #f5f7fb; } [data-theme="dark"] #page-setting .settings-panel-desc, [data-theme="dark"] #page-setting .settings-status-item span, [data-theme="dark"] #page-setting .settings-stat span { color: #aeb5c4; } [data-theme="dark"] #page-setting .settings-status-item, [data-theme="dark"] #page-setting .settings-stat { background: #262a36; border-color: #3a4052; color: #f5f7fb; } [data-theme="dark"] #page-setting input, [data-theme="dark"] #page-setting select { background: #262a36; border-color: #3a4052; color: #f5f7fb; } [data-theme="dark"] #page-setting input::placeholder { color: #7f8798; } [data-theme="dark"] #page-setting .btn-outline { background: #20232e; color: #f5f7fb; border-color: #3a4052; } [data-theme="dark"] #page-setting .btn-dark { background: #343a4b; color: #f5f7fb; border-color: #4a5164; } [data-theme="dark"] #page-setting .settings-menu-item, [data-theme="dark"] #page-setting .settings-theme-card, [data-theme="dark"] #page-setting .settings-wallpaper-card, [data-theme="dark"] #page-setting .settings-local-note, [data-theme="dark"] #page-setting .settings-save-hint, [data-theme="dark"] #page-setting .settings-segmented { background: rgba(32, 35, 46, .94); border-color: #3a4052; } [data-theme="dark"] #page-setting .settings-menu-item.active { box-shadow: inset 3px 0 0 var(--accent); } [data-theme="dark"] #page-setting .settings-wallpaper-preview { background: #171a23; color: #aeb5c4; } [data-theme="dark"] .memory-file-card { background: #242836 !important; border-color: #3a4052 !important; } [data-theme="dark"] .memory-folder-sidebar { background: #20232e !important; border-color: #3a4052 !important; --memory-folder-hover: #2d3140; } [data-theme="dark"] .mem-folder-item.active { background: #2a2e3a !important; border-color: #3a4052 !important; border-left-color: #2BA36B !important; } [data-theme="dark"] .memory-folder-tag { background: #343948 !important; color: #c8cfdd !important; } [data-theme="dark"] .memory-file-card.selected { background: #1f2f45 !important; border-color: #64a7d7 !important; } [data-theme="dark"] .memory-file-card .memory-file-name { color: #f5f7fb; } [data-theme="dark"] .memory-file-card .memory-file-card-icon { background: #10141c !important; border: 1px solid #4a5262; border-radius: 7px; color: #fff !important; } [data-theme="dark"] .memory-file-card .memory-file-card-icon .line-icon { color: #fff !important; } [data-theme="dark"] #page-memory .memory-book-card { background: #242836 !important; border-color: #3a4052 !important; } [data-theme="dark"] #page-memory .memory-book-card:hover { border-color: #56617a !important; box-shadow: 0 8px 20px rgba(0,0,0,.24); } [data-theme="dark"] #page-memory .memory-book-icon { background: #10141c; border-color: #4a5262; color: #f3f6fa; } [data-theme="dark"] #page-memory .memory-book-icon .line-icon, [data-theme="dark"] #page-memory .memory-book-icon svg { color: #f3f6fa; stroke: currentColor; } [data-theme="dark"] #page-memory .memory-book-name { color: #f5f7fb; } [data-theme="dark"] #page-memory .memory-chip { background: #20232e; border-color: #3a4052; color: #d8dae2; } @media (max-width: 980px) { .overview-head-actions { justify-content: flex-start; width: 100%; } .overview-recharge-entry { width: 100%; } .payment-body { grid-template-columns: 1fr; } .payment-plan-grid { grid-template-columns: 1fr; } .payment-plan-grid.points-mode { grid-template-columns: 1fr; } .payment-order-panel { position: static; } .payment-account-strip { grid-template-columns: 1fr; } .overview-board, .settings-layout, .settings-content-grid, .overview-top-grid, .overview-bottom-grid { grid-template-columns: 1fr; } .overview-snapshot-row, .overview-stat-grid { grid-template-columns: 1fr; } .overview-stat-item { border-right: none; border-bottom: 1px solid var(--border); } .overview-stat-item:last-child { border-bottom: none; } .settings-menu { position: static; } .settings-menu-item { min-height: 64px; } .settings-theme-grid, .settings-wallpaper-grid { grid-template-columns: repeat(2, minmax(160px, 1fr)); } .workbench-metrics { grid-template-columns: repeat(2, minmax(120px, 1fr)); } .memory-sub-browser { flex-direction: column; } .memory-folder-sidebar { width: 100% !important; max-height: 190px; } } @media (max-width: 640px) { .settings-menu { grid-template-columns: 1fr; } .settings-theme-grid, .settings-wallpaper-grid { grid-template-columns: 1fr; } .settings-preference-row, .settings-section-heading, .settings-subsection-heading { align-items: flex-start; flex-direction: column; } } /* 设置中心新版布局：保留上方拆分基线规则，通过末尾覆盖切换为三类设置页。 */ #page-setting .settings-layout { grid-template-columns: 198px minmax(0, 1fr); gap: 16px; align-items: start; } #page-setting .settings-menu { display: flex; position: sticky; top: 0; border: 0; border-radius: 0; background: transparent; padding: 0; gap: 10px; } #page-setting .settings-menu-item { width: 100%; height: auto; min-height: 74px; border: 1px solid rgba(143, 190, 210, .44); border-radius: 14px; background: rgba(255, 255, 255, .66); color: var(--text); text-align: left; padding: 14px 15px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 5px; transition: border-color .16s ease, background .16s ease, transform .16s ease; } #page-setting .settings-menu-item:hover { border-color: var(--accent); background: rgba(255, 255, 255, .84); transform: translateY(-1px); } #page-setting .settings-menu-item.active { border-color: var(--accent); background: rgba(255, 255, 255, .92); color: var(--text); box-shadow: inset 3px 0 0 var(--accent); } #page-setting .settings-menu-item strong { font-size: 14px; font-weight: 800; } #page-setting .settings-menu-item span { color: var(--text-muted); font-size: 11px; line-height: 1.45; } #page-setting .settings-content-grid { display: block; min-width: 0; } #page-setting .settings-section { display: flex; flex-direction: column; gap: 14px; } #page-setting .settings-section[hidden] { display: none; } #page-setting .settings-panel { border-color: rgba(143, 190, 210, .42); border-radius: 16px; padding: 18px; } #page-setting .settings-feature-panel { min-height: 180px; } #page-setting .settings-panel h3 { font-size: 16px; } @media (max-width: 980px) { #page-setting .settings-layout { grid-template-columns: 1fr; } #page-setting .settings-menu { position: static; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 640px) { #page-setting .settings-menu { grid-template-columns: 1fr; } } /* source: ./styles/app/55-memory-role-list.css?v=202607280442 */ .memory-role-list{display:grid;gap:10px} .memory-role-list table{width:100%;border-collapse:collapse} .memory-role-list th,.memory-role-list td{padding:8px;border:1px solid #e5e7eb;text-align:left} .role-relation-card{position:relative;min-height:240px;border:1px solid #e5e7eb;border-radius:10px;background:#fafbfc} /* source: ./styles/app/57-full-text-analysis.css?v=202607280442 */ /* 导入作品全文分析：独立样式，避免把任务界面塞回页面大文件。 */ .full-analysis-dialog { width:min(860px,calc(100vw - 32px)); height:min(880px,calc(100vh - 24px)); max-height:calc(100vh - 24px); display:flex; flex-direction:column; gap:12px; overflow:hidden; } .full-analysis-head { position:sticky; top:0; z-index:2; display:flex; flex:0 0 auto; align-items:center; justify-content:space-between; gap:16px; background:var(--surface,#fff); } .full-analysis-head h3 { min-width:0; margin:0; font-size:20px; color:var(--text); } .full-analysis-head-controls { display:flex; flex:0 1 auto; align-items:center; justify-content:flex-end; gap:8px; min-width:0; } .full-analysis-head-controls label { flex:0 0 auto; color:var(--text-muted); font-size:12px; font-weight:700; } .full-analysis-model-picker { position:relative; width:min(220px,30vw); min-width:150px; } .full-analysis-model-native { position:absolute!important; width:1px!important; height:1px!important; margin:-1px!important; padding:0!important; overflow:hidden!important; clip:rect(0 0 0 0)!important; clip-path:inset(50%)!important; white-space:nowrap!important; border:0!important; } .full-analysis-model-trigger { display:flex; width:100%; min-height:44px; align-items:center; gap:8px; margin:0; padding:7px 10px; border:1px solid #cbd5e1; border-radius:9px; background:var(--surface,#fff); color:var(--text); cursor:pointer; } .full-analysis-model-trigger:hover:not(:disabled),.full-analysis-model-trigger[aria-expanded="true"] { border-color:#8fb5e8; background:#f8fbff; } .full-analysis-model-trigger:focus-visible { outline:2px solid var(--primary,#1976d2); outline-offset:2px; } .full-analysis-model-trigger:disabled { cursor:not-allowed; opacity:.55; } .full-analysis-model-logo { display:inline-flex; flex:0 0 22px; width:22px; height:22px; align-items:center; justify-content:center; overflow:hidden; border:1px solid #e2e8f0; border-radius:6px; background:#fff; } .full-analysis-model-logo-image { display:block; width:100%; height:100%; object-fit:contain; } .full-analysis-model-logo-fallback { display:inline-flex; width:100%; height:100%; align-items:center; justify-content:center; background:#f1f5f9; color:#475569; font-size:11px; font-weight:800; } .full-analysis-model-trigger-label,.full-analysis-model-option-label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:600; } .full-analysis-model-trigger-label { flex:1; text-align:left; } .full-analysis-model-arrow { flex:0 0 7px; width:7px; height:7px; border-right:1.5px solid #64748b; border-bottom:1.5px solid #64748b; transform:rotate(45deg) translateY(-2px); transition:transform .15s ease; } .full-analysis-model-trigger[aria-expanded="true"] .full-analysis-model-arrow { transform:rotate(225deg) translate(-1px,-1px); } .full-analysis-model-menu { position:absolute; top:calc(100% + 6px); right:0; z-index:8; width:max(100%,220px); padding:5px; border:1px solid #cbd5e1; border-radius:10px; background:var(--surface,#fff); box-shadow:0 12px 30px rgba(15,23,42,.18); } .full-analysis-model-menu[hidden] { display:none; } .full-analysis-model-option { display:flex; width:100%; min-height:44px; align-items:center; gap:9px; padding:8px 9px; border:0; border-radius:7px; background:transparent; color:var(--text); text-align:left; cursor:pointer; } .full-analysis-model-option:hover,.full-analysis-model-option.is-selected { background:#eef6ff; color:#185ea8; } .full-analysis-model-option.is-selected::after { content:'✓'; margin-left:auto; color:#1976d2; font-weight:800; } .full-analysis-close { width:32px; height:32px; border:0; background:transparent; border-radius:8px; color:var(--text-muted); font-size:22px; cursor:pointer; } .full-analysis-close:hover:not(:disabled) { background:var(--surface-hover,#f3f4f6); color:var(--text); } .full-analysis-close:disabled { cursor:not-allowed; opacity:.35; } .full-analysis-notice { padding:11px 13px; border:1px solid #cfe1f7; border-radius:12px; background:#f4f9ff; color:#35516f; font-size:13px; line-height:1.6; } .full-analysis-setup-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; flex:0 0 auto; } .full-analysis-mode { min-width:0; margin:0; padding:10px 12px; border:1px solid var(--border); border-radius:12px; } .full-analysis-mode legend { padding:0 5px; color:var(--text); font-size:13px; font-weight:700; } .full-analysis-mode p { margin:6px 0 0; color:var(--text-muted); font-size:12px; line-height:1.45; } .full-analysis-scope { min-width:0; margin:0; padding:10px 12px; border:1px solid var(--border); border-radius:12px; } .full-analysis-scope legend { padding:0 5px; color:var(--text); font-size:13px; font-weight:700; } .full-analysis-scope label { display:inline-flex; align-items:center; gap:6px; color:var(--text); font-size:13px; cursor:pointer; } .full-analysis-menu-select { width:100%; min-height:44px; margin:0; padding:8px 12px; border-color:#cbdbea; border-radius:10px; background:var(--surface,#fff); color:var(--text); font-size:14px; cursor:pointer; } .full-analysis-menu-select:hover:not(:disabled) { border-color:#8fb5e8; } .full-analysis-menu-select:focus-visible { outline:2px solid var(--primary,#2f6fea); outline-offset:2px; } .full-analysis-scope-range { display:flex; align-items:center; gap:6px; margin-top:7px; padding:7px 8px; border-radius:10px; background:#f5f8fc; } .full-analysis-scope-range[hidden] { display:none; } .full-analysis-scope-range input { width:64px; } .full-analysis-scope-range select { min-width:150px; max-width:240px; } .full-analysis-scope p { margin:6px 0 0; color:var(--text-muted); font-size:12px; line-height:1.45; } .full-analysis-storage-notice { display:none; padding:9px 12px; border:1px solid #f0d8a8; border-radius:10px; background:#fff9ec; color:#805b18; font-size:12px; line-height:1.55; } .full-analysis-storage-notice:not(:empty) { display:block; } .full-analysis-progress-card,.full-analysis-save-card { padding:14px; border:1px solid var(--border); border-radius:14px; background:#fff; } .full-analysis-progress-title { font-size:15px; font-weight:700; color:var(--text); line-height:1.5; } .full-analysis-usage { margin-top:5px; color:var(--text-muted); font-size:12px; } .full-analysis-progress-track { height:7px; margin-top:12px; border-radius:999px; background:#e8eef6; overflow:hidden; } .full-analysis-progress-bar { width:0; height:100%; border-radius:inherit; background:#2f6fea; transition:width .25s ease; } .full-analysis-section-label { margin:0 0 8px; font-size:13px; font-weight:700; color:var(--text); } .full-analysis-log-section { display:flex; flex:1 1 150px; min-height:90px; flex-direction:column; overflow:hidden; } .full-analysis-log { flex:1 1 auto; min-height:0; overflow-y:auto; padding:10px; border:1px solid #dbe6f2; border-radius:12px; background:#f5f8fc; scroll-behavior:smooth; overscroll-behavior:contain; } .full-analysis-log-item { display:grid; grid-template-columns:22px minmax(0,1fr); gap:7px; align-items:start; padding:8px; border-radius:9px; color:#526276; font-size:13px; line-height:1.55; } .full-analysis-log-item + .full-analysis-log-item { margin-top:4px; } .full-analysis-log-item > span { display:inline-flex; align-items:center; justify-content:center; width:19px; height:19px; border-radius:50%; background:#e4f5eb; color:#198754; font-weight:800; font-size:11px; } .full-analysis-log-item.is-current { background:#eaf3ff; color:#245392; } .full-analysis-log-item.is-current > span { background:#d7e8ff; color:#2f6fea; } .full-analysis-log-item.is-error { background:#fff4ee; color:#9a4b20; } .full-analysis-log-item.is-error > span { background:#ffe3d2; color:#d05a19; } .full-analysis-save-card { display:none; } .full-analysis-review-card { display:none; padding:14px; border:1px solid #d7e6ff; border-radius:14px; background:#f7faff; color:var(--text); font-size:13px; line-height:1.6; } .full-analysis-review-card.is-visible { display:block; } .full-analysis-review-item { display:flex; align-items:flex-start; gap:8px; margin-top:8px; padding:8px 10px; border:1px solid var(--border); border-radius:9px; background:#fff; } .full-analysis-review-item input { margin-top:4px; } .full-analysis-review-conflict { color:#9a4b20; } .full-analysis-review-card > .btn { margin-top:10px; } .full-analysis-save-card select,.full-analysis-save-card input { width:100%; margin-top:6px; } .full-analysis-save-card label { display:block; margin-top:10px; color:var(--text); font-size:13px; font-weight:600; } .full-analysis-actions { display:flex; flex:0 0 auto; justify-content:flex-end; gap:10px; flex-wrap:wrap; } .full-analysis-actions .btn { padding:7px 18px; border-radius:8px; font-size:12px; font-weight:600; } .full-analysis-actions .btn.is-processing,.full-analysis-taskbar .btn.is-processing { cursor:wait; } .full-analysis-actions .full-analysis-button-dots,.full-analysis-taskbar .full-analysis-button-dots { min-width:1.55em; margin-left:.2em; color:currentColor; } .full-analysis-actions .full-analysis-back { margin-right:auto; } .full-analysis-actions.has-skip-segment .full-analysis-back { margin-right:0; } .full-analysis-actions.has-skip-segment #btnFullAnalysisSkipSegment { margin-right:auto; } .full-analysis-stop { color:#a13c2a; } .full-analysis-danger-zone { display:none; align-items:center; justify-content:space-between; gap:12px; padding-top:12px; border-top:1px dashed #e6b9ad; color:#8b4a3c; font-size:12px; line-height:1.5; } .full-analysis-danger-zone.is-visible { display:flex; } .full-analysis-danger-zone .btn { flex:0 0 auto; color:#a13c2a; border-color:#d8a399; } .full-analysis-taskbar { position:fixed; right:22px; bottom:22px; z-index:5150; display:none; align-items:center; gap:8px; min-width:min(430px,calc(100vw - 32px)); padding:10px; border:1px solid #cfdcec; border-radius:14px; background:#fff; box-shadow:0 12px 34px rgba(23,42,68,.18); } .full-analysis-taskbar.is-visible { display:flex; } .full-analysis-taskbar-main { display:flex; flex:1; min-width:0; flex-direction:column; align-items:flex-start; gap:2px; padding:4px 6px; border:0; background:transparent; color:var(--text); text-align:left; cursor:grab; touch-action:none; } .full-analysis-taskbar.is-dragging,.full-analysis-taskbar.is-dragging .full-analysis-taskbar-main { cursor:grabbing; user-select:none; } .full-analysis-taskbar-main strong,.full-analysis-taskbar-main span { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .full-analysis-taskbar-main span { color:var(--text-muted); font-size:12px; } #importParseModal .modal-box.import-parse-dialog { width:min(700px,calc(100vw - 32px)); max-height:min(760px,calc(100vh - 32px)); display:flex; flex-direction:column; gap:12px; overflow:hidden; } .import-parse-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:0; } .import-parse-head h3 { margin:0; line-height:1.4; } .import-chapter-scroll { flex:1 1 auto; min-height:180px; overflow-y:auto; margin-bottom:0; padding-right:6px; overscroll-behavior:contain; } .import-chapter-row { display:flex; align-items:flex-start; gap:8px; padding:8px 10px; border-bottom:1px solid var(--border); border-radius:8px; cursor:pointer; } .import-chapter-row:hover { background:var(--surface-hover,#f4f7fb); } .import-chapter-row.is-selected { background:var(--primary-soft,#eef6ff); } .import-chapter-row:focus-visible { outline:2px solid var(--primary,#2f6fea); outline-offset:-2px; } .import-parse-book-row { margin-bottom:0; } .import-parse-book-row label { font-size:13px; font-weight:600; color:var(--text); } .import-parse-book-row input { width:100%; margin-top:4px; } #importAnalysisEstimate { margin:0; padding:10px 12px; border-radius:10px; background:#f4f7fb; color:var(--text-muted); font-size:12px; line-height:1.65; } .import-parse-actions { display:flex; justify-content:flex-end; align-items:center; gap:10px; flex-wrap:wrap; } .import-parse-actions .import-action { min-width:132px; justify-content:center; } @media (max-width:640px) { .full-analysis-dialog { width:calc(100vw - 12px); height:calc(100vh - 12px); max-height:calc(100vh - 12px); padding:14px; gap:10px; } .full-analysis-head { align-items:center; flex-direction:row; gap:8px; } .full-analysis-head h3 { flex:1 1 auto; font-size:17px; } .full-analysis-head-controls { flex:0 1 60%; width:auto; justify-content:flex-end; } .full-analysis-head-controls > label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); } .full-analysis-model-picker { flex:1 1 auto; width:min(190px,42vw); min-width:120px; } .full-analysis-model-menu { right:0; width:max(100%,200px); } .full-analysis-head-controls .full-analysis-close { flex:0 0 32px; } .full-analysis-notice { padding:8px 10px; } .full-analysis-setup-grid { grid-template-columns:1fr; gap:10px; min-height:0; overflow-y:auto; } .full-analysis-mode,.full-analysis-scope { padding:9px 11px; } .full-analysis-log-section { min-height:100px; } .full-analysis-scope-range { align-items:stretch; flex-direction:column; } .full-analysis-scope-range input,.full-analysis-scope-range select { width:100%; max-width:none; } .full-analysis-actions .btn { flex:1 1 130px; justify-content:center; } .full-analysis-danger-zone { align-items:stretch; flex-direction:column; } .full-analysis-taskbar { right:10px; bottom:10px; min-width:0; width:calc(100vw - 20px); } .import-parse-actions { justify-content:stretch; } .import-parse-actions .import-action { flex:1 1 auto; } } /* source: ./styles/app/58-version-switch.css?v=202607280442 */ .sidebar-version-switch { padding: 10px 12px 4px; border-top: 1px solid color-mix(in srgb, var(--sidebar-text) 16%, transparent); margin-top: 8px; } .sidebar-version-switch-group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px; padding: 3px; border: 1px solid color-mix(in srgb, var(--sidebar-text) 22%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--sidebar-bg) 88%, var(--bg-card)); } .sidebar-version-switch-button { min-width: 0; height: 28px; padding: 0 8px; border: 0; border-radius: 999px; background: transparent; color: var(--sidebar-text); font: inherit; font-size: 12px; font-weight: 600; line-height: 28px; cursor: pointer; transition: background-color 0.16s ease, color 0.16s ease, opacity 0.16s ease; } .sidebar-version-switch-button:hover:not(.is-active):not(:disabled) { background: color-mix(in srgb, var(--bg-card) 16%, transparent); } .sidebar-version-switch-button.is-active { background: var(--bg-card); color: var(--text); cursor: default; } .sidebar-version-switch.is-switching .sidebar-version-switch-button, .sidebar-version-switch-button:disabled { cursor: wait; opacity: 0.64; } .sidebar.collapsed .sidebar-version-switch { visibility: hidden; pointer-events: none; } .legacy-version-announcement { width: 100%; min-height: 38px; display: flex; align-items: center; gap: 10px; overflow: hidden; border: 1px solid var(--border); border-radius: 999px; background: var(--bg-card); color: var(--text); margin-bottom: 12px; padding: 0 16px; cursor: pointer; } .legacy-version-announcement-dot { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--accent); } .legacy-version-announcement-track { min-width: max-content; white-space: nowrap; animation: legacy-version-announcement-scroll 12s linear infinite; } @keyframes legacy-version-announcement-scroll { from { transform: translateX(40%); } to { transform: translateX(-100%); } } @media (prefers-reduced-motion: reduce) { .sidebar-version-switch-button { transition: none; } .legacy-version-announcement-track { animation: none; } } /* source: ./styles/app/60-auth-page.css?v=202607280442 */ /* 登录页 */ .single-auth-screen { position: fixed; inset: 0; z-index: 10000; display: none; min-height: 100vh; background: #f6f7f8; color: #12151c; } .single-auth-screen.active { display: grid; grid-template-columns: minmax(0, 1fr) 480px; } body.auth-gate-active { overflow: hidden; } body.auth-boot-pending { overflow: hidden; } body.auth-boot-pending .sidebar, body.auth-boot-pending .main-container { visibility: hidden; } body.auth-boot-pending .single-auth-screen { display: grid; grid-template-columns: minmax(0, 1fr) 480px; } .single-auth-boot-status { display: none; } body.auth-boot-pending .single-auth-left, body.auth-boot-pending .single-auth-right { display: none; } body.auth-boot-pending .single-auth-boot-status { display: flex; min-width: min(360px, calc(100vw - 40px)); padding: 34px 40px; border: 1px solid var(--border, rgba(120, 137, 160, .22)); border-radius: 18px; background: var(--bg-card, #fff); color: var(--text, #12151c); box-shadow: 0 18px 54px rgba(15, 23, 42, .14); flex-direction: column; align-items: center; gap: 10px; text-align: center; } body.auth-boot-pending .single-auth-screen { display: flex; align-items: center; justify-content: center; background: var(--bg, #f6f7f8); } .single-auth-boot-status strong { font-size: 18px; } .single-auth-boot-status small { color: var(--text-muted, #6e6e7a); font-size: 13px; } .single-auth-boot-spinner { width: 32px; height: 32px; margin-bottom: 4px; border: 3px solid color-mix(in srgb, var(--client-accent, #4f9fbd) 24%, transparent); border-top-color: var(--client-accent, #4f9fbd); border-radius: 50%; animation: singleAuthBootSpin .8s linear infinite; } @keyframes singleAuthBootSpin { to { transform: rotate(360deg); } } @media (prefers-reduced-motion: reduce) { .single-auth-boot-spinner { animation: none; } } .single-auth-left { position: relative; min-height: 100vh; padding: 80px 60px; display: flex; align-items: center; background: linear-gradient(90deg, rgba(18,21,28,.08), rgba(18,21,28,.28)), url('../../UI背景-optimized.jpg') center center / cover no-repeat; color: #fff; overflow: hidden; } .single-auth-left::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18,21,28,.02), rgba(18,21,28,.22)); pointer-events: none; } .single-auth-brand { position: relative; z-index: 1; max-width: 560px; } .single-auth-brand h1 { margin: 0 0 10px; font-size: clamp(38px, 4vw, 56px); line-height: 1.1; letter-spacing: 0; color: #f5c94f; text-shadow: 0 3px 18px rgba(0,0,0,.48); } .single-auth-brand .single-auth-en { margin: 0 0 28px; font-size: 16px; color: rgba(255,255,255,.94); text-shadow: 0 2px 12px rgba(0,0,0,.42); } .single-auth-brand .single-auth-value { margin: 0 0 20px; font-size: 22px; font-weight: 700; color: #fff; text-shadow: 0 3px 18px rgba(0,0,0,.46); } .single-auth-points { display: grid; gap: 10px; color: rgba(255,255,255,.94); font-size: 14px; line-height: 1.7; text-shadow: 0 2px 12px rgba(0,0,0,.48); } .single-auth-right { width: 480px; min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 60px; background: #fff; box-shadow: -2px 0 20px rgba(0,0,0,.05); } .single-auth-card { width: min(360px, 100%); padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; } .single-auth-logo-wrap { text-align: center; margin-bottom: 0; } .single-auth-logo-wrap img { width: 200px; height: 200px; border-radius: 32px; object-fit: contain; margin-bottom: 24px; } .single-auth-logo-title { display: none; } .single-auth-logo-title strong { font-size: 26px; color: #12151c; } .single-auth-logo-title span { font-size: 13px; color: #7d8798; } .single-auth-card h2 { font-size: 28px; color: #1a1a1a; margin: 0 0 8px; font-weight: 600; line-height: 1.25; text-align: center; } .single-auth-card p { font-size: 14px; color: #666; margin: 0 0 48px; text-align: center; } .single-auth-form { display: block; } .single-auth-form-group { margin-bottom: 20px; } .single-auth-form-group label { display: block; font-size: 14px; font-weight: 500; color: #333; margin-bottom: 8px; } .single-auth-input { width: 100%; padding: 12px 16px; border: 1.5px solid #e0e0e0; border-radius: 8px; font-size: 15px; transition: all 0.2s; background: #fafafa; outline: none; } .single-auth-input:focus { border-color: #667eea; background: #ffffff; box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1); } .single-auth-password-wrap { position: relative; } .single-auth-password-wrap .single-auth-input { padding-right: 48px; } .single-auth-password-toggle { position: absolute; right: 10px; top: 50%; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: #7d8798; cursor: pointer; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; transition: background 0.2s, color 0.2s; } .single-auth-password-toggle:hover { background: rgba(102, 126, 234, 0.08); color: #1a1a1a; } .single-auth-password-toggle svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .single-auth-confirm-group { display: none; } .single-auth-confirm-group.active { display: block; } .auth-password-wrap { position: relative; } .auth-password-wrap input { width: 100%; padding-right: 44px !important; } .auth-password-toggle { position: absolute; right: 8px; top: 50%; width: 30px; height: 30px; border: 0; border-radius: 6px; background: transparent; color: #7d8798; cursor: pointer; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; } .auth-password-toggle:hover { background: rgba(18, 21, 28, 0.06); color: #12151c; } .auth-password-toggle svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .auth-confirm-row { display: none; } .auth-confirm-row.active { display: block; } .single-auth-error { display: none; color: #e74c3c; font-size: 13px; margin-top: 12px; padding: 10px 12px; background: #fee; border-radius: 6px; } .single-auth-submit { width: 100%; padding: 14px; border: 0; border-radius: 8px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: #fff; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s; margin-top: 24px; } .single-auth-submit:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(102, 126, 234, 0.3); } .single-auth-submit:active { transform: translateY(0); } .single-auth-submit:disabled { opacity: 0.6; cursor: not-allowed; transform: none; } .single-auth-switch { text-align: center; margin-top: 24px; font-size: 14px; color: #666; } .single-auth-switch button { border: 0; background: transparent; color: #667eea; font-weight: 600; margin-left: 4px; cursor: pointer; } .single-auth-switch button:hover { text-decoration: underline; } .single-auth-account-container { display: none; } .single-auth-account-container.show { display: block; animation: singleAuthFadeIn 0.4s ease-out; } @keyframes singleAuthFadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .single-auth-user-card { background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%); border-radius: 16px; padding: 32px; cursor: pointer; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); position: relative; overflow: hidden; } .single-auth-user-card::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%); opacity: 0; transition: opacity 0.3s; } .single-auth-account-container.is-enterable .single-auth-user-card { cursor: pointer; } .single-auth-account-container.is-enterable .single-auth-user-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15); } .single-auth-account-container.is-enterable .single-auth-user-card:hover::before { opacity: 1; } .single-auth-account-row { display: flex; align-items: center; gap: 16px; position: relative; z-index: 1; } .single-auth-account-avatar { width: 64px; height: 64px; border-radius: 50%; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); display: flex; align-items: center; justify-content: center; color: white; font-size: 28px; font-weight: 600; flex-shrink: 0; box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3); } .single-auth-account-main strong { display: block; font-size: 20px; font-weight: 600; color: #1a1a1a; margin-bottom: 4px; } .single-auth-account-main span { display: block; font-size: 14px; color: #666; } .single-auth-account-actions { display: flex; gap: 12px; margin-top: 24px; } .single-auth-account-actions button { flex: 1; padding: 12px; background: white; color: #667eea; border: 1.5px solid #667eea; border-radius: 8px; font-size: 14px; font-weight: 600; cursor: pointer; transition: all 0.2s; } .single-auth-account-actions button:hover { background: #667eea; color: white; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3); } .single-auth-account-actions button:active { transform: translateY(0); } .single-auth-secondary, .single-auth-danger { background: white; color: #667eea; border: 1.5px solid #667eea; } @media (max-width: 900px) { body.auth-boot-pending .single-auth-screen, .single-auth-screen.active { grid-template-columns: 1fr; } .single-auth-left { min-height: 34vh; padding: 32px; align-items: center; } .single-auth-brand h1 { font-size: 34px; } .single-auth-right { width: 100%; min-height: 66vh; padding: 24px; } } /* source: ./styles/app/70-action-panel-ai-polish.css?v=202607280442 */ @charset "UTF-8"; /* Action panel AI polish parity additions */ .action-tab-btn { display: flex; align-items: center; justify-content: center; gap: 8px; min-width: 0; color: var(--text, #1e1e28); } .action-tab-btn:not(.active) { color: var(--text, #1e1e28); } .action-tab-label { pointer-events: none; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: inherit; } .action-tab-label.member-feature-title { overflow: visible; flex: 0 0 auto; max-width: none; } .action-tab-clear { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 18px; border: 1px solid var(--border); border-radius: 999px; background: var(--bg-card); color: #8b95a5; padding: 0 6px; font-size: 11px; font-weight: 700; line-height: 1; opacity: .86; } .action-tab-clear:hover { color: #1976d2; border-color: #9cc7f3; background: #eef6ff; opacity: 1; } .action-tab-btn.active .action-tab-clear { color: #1976d2; border-color: #cfe5fb; } [data-theme="dark"] .action-tab-clear { background: rgba(255,255,255,0.08); color: #b8c0cc; border-color: rgba(255,255,255,0.16); } [data-theme="dark"] .action-tab-clear:hover, [data-theme="dark"] .action-tab-btn.active .action-tab-clear { color: #bfdbfe; border-color: rgba(96,165,250,0.45); background: rgba(59,130,246,0.16); } .payment-qr-expire { min-height: 18px; margin-top: 8px; color: #64748b; font-size: 12px; line-height: 1.5; text-align: center; } #modelSelectModal.model-picker-frontmost { z-index: 10030 !important; } #addModelModal.model-picker-frontmost { z-index: 10040 !important; } .ai-feedback-count { margin-left: auto; color: #6b7280; font-size: 12px; font-weight: 500; white-space: nowrap; } #apContentBox:empty::before { content: '选择正文章节后点击 AI消痕，完成结果将在此处显示'; } .og-tool-main-row { display: flex; width: 100%; gap: 8px; align-items: center; justify-content: flex-start; flex-wrap: wrap; } .og-tool-main-row .btn-og-action { flex: 1 1 auto; } #ogFileStacksRow .og-tool-actions, #dcFileStacksRow .og-tool-actions { align-items: flex-start; } #ogFileStacksRow .og-tool-main-row, #ogFileStacksRow .og-tool-template-row, #dcFileStacksRow .og-tool-main-row, #dcFileStacksRow .og-tool-template-row { width: 100%; } .ap-status-strip { margin: 6px 8px 0; padding: 8px 10px; border-radius: 8px; background: #e7f1ff; border: 1px solid #b8d7ff; color: #1558a8; font-size: 12px; font-weight: 700; align-items: center; justify-content: space-between; gap: 8px; cursor: default; flex-shrink: 0; } .ap-status-strip.active { display: flex !important; } .ap-report { display: grid; gap: 10px; color: var(--text); } .ap-report-card { border: 1px solid var(--border); border-radius: 8px; background: var(--bg-card); padding: 10px 12px; } .ap-report-title { font-weight: 800; font-size: 13px; color: var(--text); margin-bottom: 6px; } .ap-report-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-bottom: 8px; } .ap-report-stat { border-radius: 8px; background: #f6f8fb; padding: 8px; min-width: 0; } .ap-report-stat strong { display: block; font-size: 17px; color: #111827; line-height: 1.2; } .ap-report-stat span { display: block; font-size: 11px; color: #6b7280; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ap-chip-list { display: flex; flex-wrap: wrap; gap: 6px; } .ap-chip { border-radius: 999px; padding: 3px 8px; font-size: 11px; background: #f3f4f6; color: #374151; } .ap-chip.critical { background: #fee2e2; color: #991b1b; } .ap-chip.warning { background: #fef3c7; color: #92400e; } .ap-chip.info { background: #dbeafe; color: #1d4ed8; } .ap-detect-panel, .ap-lock-panel { display: block; border: 1px solid #b8d7ff; border-radius: 8px; background: #f8fbff; overflow: hidden; white-space: normal; margin-bottom: 8px; } .ap-detect-header, .ap-lock-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; cursor: pointer; user-select: none; } .ap-detect-header .ap-report-title, .ap-lock-header .ap-report-title { margin-bottom: 0; } .ap-detect-toggle, .ap-lock-toggle { border: 1px solid #bfdbfe; background: #fff; color: #1d4ed8; border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 800; cursor: pointer; } .ap-detect-body, .ap-lock-body { display: none; padding: 0 12px 10px; } .ap-lock-body { white-space: pre-wrap; } .ap-detect-panel.active .ap-detect-body, .ap-lock-panel.active .ap-lock-body { display: block; } .ap-final-text { white-space: pre-wrap; line-height: 1.8; color: var(--text); } .ap-sticky-stack { position: sticky; top: -8px; z-index: 8; display: grid; gap: 0; margin: -8px -10px 0 -6px; padding: 0 10px 8px 6px; background: var(--bg-card, #fff); } .ap-sticky-stack .ap-detect-header, .ap-sticky-stack .ap-lock-header { min-height: 44px; box-sizing: border-box; background: var(--bg-card, #fff); border-bottom: 1px solid #b8d7ff; } .ap-sticky-stack .ap-detect-header:first-child { border-top: 1px solid var(--border); } .ap-sticky-stack .ap-lock-header:last-child { border-bottom-color: #b8d7ff; } .ap-sticky-stack { top: -10px; margin: -10px -10px 0 -10px; padding: 0 10px 0; } .ap-detect-panel.ap-panel-body-shell, .ap-lock-panel.ap-panel-body-shell { margin: 0; border: 0; border-radius: 0; background: transparent; overflow: visible; } .ap-detect-panel.ap-panel-body-shell:not(.active), .ap-lock-panel.ap-panel-body-shell:not(.active) { display: none; } .ap-detect-panel.ap-panel-body-shell.active, .ap-lock-panel.ap-panel-body-shell.active { border-right: 1px solid #b8d7ff; border-bottom: 1px solid #b8d7ff; border-left: 1px solid #b8d7ff; border-radius: 0 0 8px 8px; } .ap-detect-panel.ap-panel-body-shell .ap-detect-body, .ap-lock-panel.ap-panel-body-shell .ap-lock-body { padding-top: 10px; } .ap-change { border-radius: 3px; padding: 0 2px; box-decoration-break: clone; -webkit-box-decoration-break: clone; } .ap-change-replace { background: #fff1b8; color: #713f12; } .ap-change-add { background: #dcfce7; color: #166534; } #btnAPSave:disabled { opacity: 0.45; cursor: not-allowed; } #btnAPLock.ap-lock-done { color: #16a34a; border-color: #bbf7d0; background: #f0fdf4; } .ai-polish-config-box { width: min(720px, 92vw); max-height: 86vh; overflow: hidden; display: flex; flex-direction: column; border-radius: 12px !important; padding: 0 !important; } .ai-polish-config-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px 12px; border-bottom: 1px solid var(--border); } .ai-polish-config-head h3 { margin: 0; font-size: 18px; color: var(--text); } .ai-polish-config-body { padding: 16px 22px 18px; overflow-y: auto; display: grid; gap: 16px; } .ap-config-section { display: grid; gap: 8px; } .ap-config-label { font-size: 13px; font-weight: 800; color: var(--text); } .ap-template-select { width: 100%; height: 38px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg-input); color: var(--text); padding: 0 12px; font-size: 13px; } .ap-template-btn { display: flex; align-items: center; gap: 7px; text-align: left; cursor: pointer; font-weight: 500; } .ap-template-btn.is-placeholder { color: #8b95a5; font-weight: 400; } .ap-config-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .ap-option-card { border: 1px solid var(--border); border-radius: 8px; background: var(--btn-outline-bg); color: var(--btn-outline-text); padding: 8px 9px; cursor: pointer; min-height: 68px; display: flex; flex-direction: column; gap: 4px; transition: all .15s; } .ap-option-card:hover { filter: brightness(.97); border-color: #1a1d2b; } .ap-option-card.selected { background: var(--btn-dark-bg); border-color: var(--btn-dark-bg); color: var(--btn-dark-text); } .ap-option-card[data-intensity="light"].selected { background: #eaf8ef; border-color: #22c55e; color: #166534; } .ap-option-card[data-intensity="medium"].selected { background: #fff7d6; border-color: #f59e0b; color: #7c4a03; } .ap-option-card[data-intensity="heavy"].selected { background: #fee2e2; border-color: #ef4444; color: #991b1b; } .ap-option-card strong { font-size: 13px; } .ap-option-card span { font-size: 11px; line-height: 1.35; opacity: .86; } .ap-focus-grid { display: flex; flex-wrap: wrap; gap: 8px; } .ap-focus-chip { border: 1px solid var(--border); border-radius: 999px; padding: 7px 12px; background: var(--btn-outline-bg); color: var(--btn-outline-text); font-size: 12px; font-weight: 700; cursor: pointer; } .ap-focus-chip.selected { background: var(--btn-dark-bg); border-color: var(--btn-dark-bg); color: var(--btn-dark-text); } .ap-focus-select-list { display: grid; gap: 8px; } .ap-focus-row { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 8px; } .ap-focus-row span { font-size: 13px; font-weight: 700; color: var(--text); white-space: nowrap; } .ap-focus-select { width: 100%; height: 34px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg-input); color: var(--text); padding: 0 10px; font-size: 13px; } .ai-polish-config-footer { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 22px; border-top: 1px solid var(--border); } [data-theme="dark"] .ap-report-stat { background: rgba(255,255,255,0.06); } [data-theme="dark"] .ap-report-stat strong { color: var(--text); } [data-theme="dark"] .ap-report-stat span { color: var(--text-muted); } [data-theme="dark"] .ap-detect-panel, [data-theme="dark"] .ap-lock-panel { background: rgba(59,130,246,0.08); border-color: rgba(96,165,250,0.35); } [data-theme="dark"] .ap-detect-toggle, [data-theme="dark"] .ap-lock-toggle { background: rgba(255,255,255,0.08); color: #bfdbfe; border-color: rgba(96,165,250,0.45); } [data-theme="dark"] .ap-sticky-stack { background: var(--bg-card, #111827); } [data-theme="dark"] .ap-sticky-stack .ap-detect-header, [data-theme="dark"] .ap-sticky-stack .ap-lock-header { background: var(--bg-card, #111827); border-color: rgba(96,165,250,0.35); } .naturalize-result-header { flex:0 0 auto; min-height:37px; height:37px; display:flex; align-items:center; flex-wrap:nowrap; gap:14px; box-sizing:border-box; margin:-4px 0 8px; padding:8px 12px; overflow:hidden; border:1px solid var(--border); border-radius:10px; background:var(--bg-card); color:#1e1e28; font-size:13px; font-weight:400; line-height:1.5; } .naturalize-result-header > span, .naturalize-result-header > .naturalize-replace-status { white-space:nowrap; } .naturalize-result-header strong { color:inherit; font-weight:700; } .naturalize-replace-status.is-applied { color:#16a34a; } .naturalize-replace-status.is-unapplied { color:#dc2626; } .naturalize-status-row { display:flex; align-items:center; justify-content:flex-start; gap:8px; box-sizing:border-box; width:100%; min-height:24px; margin-bottom:6px; padding-right:12px; } .naturalize-server-status { display:inline-flex; align-items:center; gap:4px; color:var(--text-muted); font-size:12px; font-weight:700; white-space:nowrap; } .naturalize-server-status.is-online { color:#15803d; } .naturalize-server-status.is-offline { color:#dc2626; } .naturalize-task-status { min-width:0; overflow:hidden; text-overflow:ellipsis; color:var(--text-muted); font-size:12px; font-weight:800; white-space:nowrap; } .naturalize-task-status.is-queued { color:#dc2626; } .naturalize-task-status.is-running { color:#16a34a; } .naturalize-task-status.is-running::after { content:'···'; display:inline-block; width:1.8em; overflow:hidden; vertical-align:bottom; animation:naturalize-wait-dots 1.08s steps(4,end) infinite; } @keyframes naturalize-wait-dots { 0% { width:0; } 100% { width:1.8em; } } .naturalize-split-action { position:relative; display:flex; flex:2 1 0; min-width:132px; border:1px solid var(--border); border-radius:8px; background:var(--btn-outline-bg); } .naturalize-split-action .naturalize-start-btn { flex:1 1 auto; min-width:0; border:0; border-radius:0; } .naturalize-level-arrow { align-self:stretch; flex:0 0 38px; min-height:34px; border:0; border-left:1px solid var(--border); border-radius:0 7px 7px 0; background:transparent; color:var(--btn-outline-text); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; line-height:1; } .naturalize-level-arrow-icon { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2.15; stroke-linecap:round; stroke-linejoin:round; } .naturalize-level-arrow:disabled { cursor:not-allowed; opacity:.45; } .naturalize-split-action .naturalize-billing-help { align-self:stretch; flex:0 0 34px; width:34px; height:auto; min-width:34px; padding:0; border:0; border-radius:7px 0 0 7px; font-size:0; } .naturalize-split-action .naturalize-billing-help::before { content:'?'; width:16px; height:16px; display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; border:1px solid currentColor; border-radius:50%; font-size:11px; font-weight:800; line-height:1; } .naturalize-level-menu { position:absolute; right:0; bottom:calc(100% + 6px); z-index:80; display:none; min-width:92px; padding:5px; border:1px solid var(--border); border-radius:9px; background:var(--bg-card); box-shadow:0 12px 32px rgba(15,23,42,.18); } .naturalize-level-menu.open { display:grid; } .naturalize-level-menu button { border:0; border-radius:6px; background:transparent; color:var(--text); padding:7px 12px; text-align:left; cursor:pointer; } .naturalize-level-menu button:hover, .naturalize-level-menu button.selected { background:var(--bg-hover); color:var(--primary); } #apContentBox { white-space:pre-wrap; caret-color:var(--text); } #apContentBox[contenteditable="true"] { cursor:text; } .naturalize-compare-paragraph { min-height:1.75em; cursor:pointer; overflow-wrap:anywhere; } #apContentBox[contenteditable="true"] .naturalize-compare-paragraph { cursor:text; } .naturalize-compare-paragraph:hover { background:color-mix(in srgb, var(--primary) 7%, transparent); } .naturalize-diff-added { color:#16a34a; font-weight:600; } [data-theme="dark"] .naturalize-diff-added { color:#4ade80; } #apContentBox[data-naturalize-status="pending_settlement"] { border-color:#f59e0b; } #apContentBox[data-naturalize-status="settled"] { border-color:#60a5fa; } #apContentBox[data-naturalize-applied="true"] { border-color:#22c55e; } [data-theme="dark"] .naturalize-split-action, [data-theme="dark"] .naturalize-level-menu { background:var(--bg-card); } [data-theme="dark"] .naturalize-result-header { background:var(--bg-card); color:var(--text); } .workflow-segmented-toggle { display:inline-flex; align-items:center; padding:3px; border:1px solid var(--border); border-radius:999px; background:var(--btn-dark-bg); box-shadow:inset 0 0 0 1px rgba(255,255,255,.04); } .workflow-segmented-toggle button { min-width:58px; height:28px; padding:0 14px; border:0; border-radius:999px; background:transparent; color:var(--btn-dark-text); font-size:12px; font-weight:700; cursor:pointer; } .workflow-segmented-toggle button.active { background:var(--bg-card); color:var(--text); box-shadow:0 1px 4px rgba(15,23,42,.18); } .workflow-segmented-toggle button:disabled { cursor:not-allowed; opacity:.55; } [data-theme="dark"] .workflow-segmented-toggle button.active { background:rgba(255,255,255,.86); color:#111827; } .outline-generation-mode-toggle { margin-right:auto; } .outline-inquiry-interaction { flex:0 0 auto; display:grid; grid-template-columns:auto minmax(0,1fr) 36px; align-items:center; gap:8px; margin-top:8px; padding:9px; border:1px solid var(--border); border-radius:10px; background:var(--bg-card); } .outline-inquiry-interaction[hidden] { display:none !important; } .outline-inquiry-feedback-toggle button { min-width:52px; padding:0 12px; } #outlineInquiryFeedbackInput { min-width:0; height:36px; padding:0 11px; border:1px solid var(--border); border-radius:8px; outline:0; background:var(--bg-input); color:var(--text); font-size:12px; } #outlineInquiryFeedbackInput:focus { border-color:var(--primary); box-shadow:0 0 0 2px color-mix(in srgb, var(--primary) 18%, transparent); } .outline-inquiry-send { width:36px; height:36px; border:0; border-radius:9px; background:var(--btn-dark-bg); color:var(--btn-dark-text); font-size:17px; cursor:pointer; } .outline-inquiry-send:disabled { cursor:not-allowed; opacity:.45; } .outline-inquiry-interaction.is-running .outline-inquiry-send { background:#dc2626; color:#fff; } #outlineModal .outline-result[data-inquiry-readonly="true"] { cursor:default; user-select:text; } #outlineModal.outline-inquiry-locked .outline-config-panel { pointer-events:none; opacity:.72; } @media (max-width:760px) { .outline-inquiry-interaction { grid-template-columns:1fr 36px; } .outline-inquiry-feedback-toggle { grid-column:1 / -1; justify-self:start; } } /* 该弹窗后加载，确保 AI 优化的提示词模版也保持单一组合按钮。 */ .ap-template-picker .ap-template-select { height: 38px; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none; } .template-quick-menu { z-index: 10080; } /* source: ./styles/app/75-global-writing-backdrop.css?v=202607280442 */ /* 全站写作背景：只负责页面底层氛围，不改变各业务模块的阅读层。 */ :root { --writing-backdrop-color: #ffffff; --writing-backdrop-image: url('../../assets/wallpapers/shanshui-sunrise-optimized.jpg'); --wallpaper-overlay-opacity: .5; --wallpaper-overlay-color: #ffffff; --writing-backdrop-panel: rgba(255, 255, 255, 0.48); --writing-backdrop-card: rgba(255, 255, 255, 0.7); --client-accent: #4a91aa; } html { min-height: 100%; background: #fff; background: var(--wallpaper-overlay-color); } html[data-theme="dark"] { background: #14161e; } body { isolation: isolate; background: transparent; } .app-wallpaper-layer { position: fixed; inset: 0; z-index: -1; pointer-events: none; background-color: var(--writing-backdrop-color); background-image: var(--writing-backdrop-image); background-position: center bottom; background-repeat: no-repeat; background-size: cover; } .app-wallpaper-layer::after { content: ''; position: absolute; inset: 0; background: var(--wallpaper-overlay-color); opacity: var(--wallpaper-overlay-opacity); } /* 总览页原有的纯白页面底色也需要回到统一背景，卡片本身不受影响。 */ body:has(#page-overview.active) { background: transparent; } /* 正文、卡片和弹窗保持独立阅读面，背景仅透出为轻微氛围。 */ .main-content { background-color: transparent; background-image: none; backdrop-filter: none; } /* 右侧栏已移除：外层不再保留原栏位的右侧空白；各页面内容仍保留自身内边距。 */ .main-container { padding-top: 0; padding-right: 0; padding-bottom: 0; } .content-wrapper { position: relative; border-bottom-left-radius: 22px; overflow: hidden; } /* 顶部空白来自导航栏自身外边距；移除后客户端主体完整占用视口高度。 */ .sidebar { margin: 0; height: 100vh; } /* 总览原先给外层铺了纯白色；改为透明后，卡片本身仍保持原有白色。 */ body:has(#page-overview.active) .main-container, body:has(#page-overview.active) .content-wrapper, body:has(#page-overview.active) .main-content { background-color: transparent; } html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview.workbench-page { --overview-bg: transparent; --overview-surface: rgba(255, 255, 255, 0.26); --overview-surface-strong: rgba(255, 255, 255, 0.34); --overview-control-surface: rgba(255, 255, 255, 0.46); } html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-stat-item, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-list-panel, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-bottom-card, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-edit-card, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-help-card, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-help-item, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .book-card, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-book-placeholder, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .workbench-metric, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-empty { background: var(--overview-surface) !important; backdrop-filter: none; } html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-announcement-bar, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-recharge-entry, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .workbench-tabs, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .workbench-search, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .workbench-toolbar { background: var(--overview-control-surface) !important; backdrop-filter: none; } html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-action-icon, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-stat-icon, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .overview-group-qr-box, html:not([data-theme="dark"]) body:has(#page-overview.active) #page-overview .billing-ledger-empty { background: var(--overview-surface-strong) !important; } /* 设置页原本沿用不透明卡片；改为可读的半透明纸面，让底图仍能透出。 */ body:has(#page-setting.active) .main-container, body:has(#page-setting.active) .content-wrapper, body:has(#page-setting.active) .main-content, body:has(#page-setting.active) #page-setting, body:has(#page-setting.active) #page-setting .workbench-shell { background-color: transparent; } body:has(#page-setting.active) #page-setting .settings-panel { background: var(--writing-backdrop-panel); backdrop-filter: blur(1px); } body:has(#page-setting.active) #page-setting .settings-status-item, body:has(#page-setting.active) #page-setting .settings-stat { background: var(--writing-backdrop-card); backdrop-filter: blur(1px); } /* A single body-level image runs through the full three-column writing canvas. */ body:has(#page-write.active) .main-container, body:has(#page-write.active) .content-wrapper, body:has(#page-write.active) .main-content, body:has(#page-write.active) #page-write, body:has(#page-write.active) .write-layout, body:has(#page-write.active) .write-catalog, body:has(#page-write.active) .write-right, body:has(#page-write.active) .write-main-row, body:has(#page-write.active) .write-main-left, body:has(#page-write.active) .write-action-panel { background-color: transparent; } /* 写作页专用：把原本右侧的两层结构空白交给细纲面板使用。 */ body:has(#page-write.active) .main-container { padding-right: 0; } body:has(#page-write.active) .main-content { padding-right: 0; } body:has(#page-write.active) .write-action-panel { width: 420px; } /* 正文与剧情描述直接使用连续工作区底图，避免额外白色纸面把背景冲淡。 */ body:has(#page-write.active) .write-body, body:has(#page-write.active) .write-plot { background-color: transparent; backdrop-filter: none; box-shadow: none; } body:has(#page-write.active) .write-action-panel .action-content-box { background-color: transparent; backdrop-filter: none; } body:has(#page-write.active) .write-action-panel .og-input-area textarea { background-color: transparent; } /* 总览的卡片维持其本身不透明的阅读层，背景图只从模块间隙透出。 */ body:has(#page-overview.active) #page-overview .overview-stat-item, body:has(#page-overview.active) #page-overview .overview-list-panel, body:has(#page-overview.active) #page-overview .overview-bottom-card { backdrop-filter: none; } body:has(#page-overview.active) #page-overview .book-card, body:has(#page-overview.active) #page-overview .workbench-tabs, body:has(#page-overview.active) #page-overview .workbench-search { backdrop-filter: none; } /* 登录页保留已有的专属引导图；其余业务页面使用统一写作背景。 */ .single-auth-screen { background-color: rgba(246, 247, 248, 0.9); } /* 十套客户端主题只调整配色变量；壁纸和透明度由独立底层负责。 */ html[data-client-theme="forest-mint"] { --client-accent: #1a1d2b; --accent: #1a1d2b; --bg: #f7f7f8; --bg-card: #f7f7f8; --bg-input: #fff; --text: #1a1d2b; --text-muted: #6b7280; --border: #e5e7eb; --sidebar-bg: #11131d; --btn-dark-bg: #1a1d2b; } html[data-client-theme="moon-celadon"] { --client-accent: #6d9f96; --accent: #6d9f96; --bg: #eef6f4; --bg-card: #fbfdfc; --bg-input: #f4f9f8; --text: #263836; --text-muted: #6b7d79; --border: #d9e7e3; --sidebar-bg: #416d67; --btn-dark-bg: #608e86; } html[data-client-theme="pine-ink"] { --client-accent: #3f6f5e; --accent: #3f6f5e; --bg: #eef4f1; --bg-card: #fbfdfc; --bg-input: #f4f8f6; --text: #21332c; --text-muted: #66756f; --border: #d6e2dc; --sidebar-bg: #294b40; --btn-dark-bg: #3f6f5e; } html[data-client-theme="mist-blue"] { --client-accent: #5f80a8; --accent: #5f80a8; --bg: #eff4fa; --bg-card: #fbfcfe; --bg-input: #f5f8fc; --text: #253247; --text-muted: #6a7484; --border: #d9e2ee; --sidebar-bg: #3f5878; --btn-dark-bg: #5f80a8; } html[data-client-theme="warm-orange"] { --client-accent: #e98c55; --accent: #e98c55; --bg: #fff5ed; --bg-card: #fffdfb; --bg-input: #fff8f3; --text: #4b3024; --text-muted: #8b7064; --border: #f0ded1; --sidebar-bg: #8a563b; --btn-dark-bg: #df8350; } html[data-client-theme="tea-beige"] { --client-accent: #9a7c63; --accent: #9a7c63; --bg: #f7f2ec; --bg-card: #fdfbf8; --bg-input: #faf6f1; --text: #40352e; --text-muted: #80736a; --border: #e8ddd1; --sidebar-bg: #695343; --btn-dark-bg: #8c6f59; } html[data-client-theme="rose-mist"] { --client-accent: #bd7183; --accent: #bd7183; --bg: #fbf0f3; --bg-card: #fffafb; --bg-input: #fdf5f7; --text: #493039; --text-muted: #8a6b75; --border: #eed9df; --sidebar-bg: #7b4957; --btn-dark-bg: #b66c7d; } html[data-client-theme="purple-pearl"] { --client-accent: #7a63c8; --accent: #7a63c8; --bg: #f4f0fd; --bg-card: #fcfbff; --bg-input: #f7f4fe; --text: #352d50; --text-muted: #756d8a; --border: #e3dcf4; --sidebar-bg: #524483; --btn-dark-bg: #725dbc; } html[data-client-theme="snow-purple"] { --client-accent: #7b6cb5; --accent: #7b6cb5; --bg: #f3f1fa; --bg-card: #fcfbfe; --bg-input: #f7f5fb; --text: #363248; --text-muted: #777184; --border: #e2deec; --sidebar-bg: #57506f; --btn-dark-bg: #7265a5; } html[data-client-theme="lake-graphite"] { --client-accent: #4a91aa; --accent: #4a91aa; --bg: #edf7fa; --bg-card: #fbfeff; --bg-input: #f4fafc; --text: #25373d; --text-muted: #687a80; --border: #d5e8ee; --sidebar-bg: #315d6d; --btn-dark-bg: #43869e; } html[data-theme="dark"][data-client-theme] { --writing-backdrop-color: #14161e; --wallpaper-overlay-color: #14161e; --bg: #14161e; --bg-card: #1e202a; --bg-input: #262834; --text: #d8dae2; --text-muted: #9ba1ad; --border: #343848; --sidebar-bg: #0e0f16; --sidebar-text: #d8dae2; --accent: var(--client-accent); --btn-dark-bg: var(--client-accent); --btn-dark-text: #fff; --btn-outline-bg: #1e202a; --btn-outline-text: #d8dae2; } html[data-theme="dark"][data-client-theme="forest-mint"] { --client-accent: #b8bec9; --accent: #b8bec9; --btn-dark-bg: #b8bec9; --btn-dark-text: #14161e; } html[data-font-size="small"] { --font-size-offset: -1px; --fs-xs: 9px; --fs-sm: 11px; --fs-md: 12px; --fs-base: 13px; --fs-lg: 15px; --fs-xl: 17px; --fs-2xl: 19px; --fs-3xl: 22px; } html[data-font-size="medium"] { --font-size-offset: 0px; --fs-xs: 10px; --fs-sm: 12px; --fs-md: 13px; --fs-base: 14px; --fs-lg: 16px; --fs-xl: 18px; --fs-2xl: 20px; --fs-3xl: 24px; } html[data-font-size="large"] { --font-size-offset: 1px; --fs-xs: 11px; --fs-sm: 13px; --fs-md: 14px; --fs-base: 15px; --fs-lg: 17px; --fs-xl: 19px; --fs-2xl: 22px; --fs-3xl: 26px; } html[data-font-size="xlarge"] { --font-size-offset: 3px; --fs-xs: 12px; --fs-sm: 14px; --fs-md: 16px; --fs-base: 17px; --fs-lg: 19px; --fs-xl: 22px; --fs-2xl: 25px; --fs-3xl: 29px; } html[data-font-size] body { width: 100%; height: 100vh; zoom: 1; font-size: var(--fs-base); } html[data-font-size] button, html[data-font-size] input, html[data-font-size] select, html[data-font-size] textarea, html[data-font-size] .nav-item, html[data-font-size] .settings-menu-item, html[data-font-size] .settings-preference-row, html[data-font-size] .chapter-item, html[data-font-size] .action-tab-btn { font-size: var(--fs-md); } html[data-font-size] .workbench-title, html[data-font-size] .settings-panel h3, html[data-font-size] .overview-sixday-title { font-size: var(--fs-2xl); } html[data-font-size] .action-template-arrow { font-size: 0; } /* 深色模式优先保证文字与编辑器对比度，不叠加浅色山景。 */ [data-theme="dark"] body, body[data-theme="dark"] { --writing-backdrop-color: #14161e; --wallpaper-overlay-color: #14161e; background-color: transparent; background-image: none; } html[data-theme="dark"] .app-wallpaper-layer { background-color: #14161e; background-blend-mode: multiply; } html[data-theme="dark"] .app-wallpaper-layer::after { background: #14161e; opacity: max(var(--wallpaper-overlay-opacity), .72); } [data-theme="dark"] body:has(#page-overview.active), body[data-theme="dark"]:has(#page-overview.active) { background-color: transparent; background-image: none; } [data-theme="dark"] .main-content { background-color: rgba(20, 22, 30, .91); background-image: none; backdrop-filter: none; } /* 全局背景规则加载在末尾：夜间模式必须在这里明确取消白天的半透明纸面。 */ [data-theme="dark"] body:has(#page-write.active) .write-body, [data-theme="dark"] body:has(#page-write.active) .write-plot { background-color: #20232e; backdrop-filter: none; box-shadow: none; } /* 总览页自己的白色变量需要整体改写，不能只覆盖少数卡片。 */ html[data-theme="dark"] #page-overview.workbench-page { --overview-bg: rgba(20, 22, 30, .9); --overview-surface: #20232e; --overview-surface-strong: #20232e; --overview-border-soft: #343848; --overview-shadow-control: none; --overview-shadow-panel: none; --overview-shadow-accent: none; --overview-placeholder-text: #8e909a; } html[data-theme="dark"] body:has(#page-overview.active) .main-container, html[data-theme="dark"] body:has(#page-overview.active) .content-wrapper, html[data-theme="dark"] body:has(#page-overview.active) .main-content { background: rgba(20, 22, 30, .91); } html[data-theme="dark"] #page-overview .overview-announcement-bar, html[data-theme="dark"] #page-overview .overview-recharge-entry, html[data-theme="dark"] #page-overview .workbench-tabs, html[data-theme="dark"] #page-overview .overview-stat-item, html[data-theme="dark"] #page-overview .overview-billing-trigger, html[data-theme="dark"] #page-overview .overview-list-panel, html[data-theme="dark"] #page-overview .overview-bottom-card, html[data-theme="dark"] #page-overview .book-card, html[data-theme="dark"] #page-overview .workbench-search, html[data-theme="dark"] #page-overview .overview-book-placeholder { background: #20232e !important; border-color: #343848 !important; backdrop-filter: none; box-shadow: none !important; } html[data-theme="dark"] #page-overview .workbench-tabs .tab-item { color: #d8dae2; } html[data-theme="dark"] #page-overview .workbench-tabs .tab-item.active, html[data-theme="dark"] #page-overview .overview-action-tile { background: #343848; background: var(--client-accent); color: #f5f7fb; border-color: #4a5164; } html[data-theme="dark"] #page-overview .overview-stat-head, html[data-theme="dark"] #page-overview .overview-section-head, html[data-theme="dark"] #page-overview .overview-table-title, html[data-theme="dark"] #page-overview .overview-sixday-title { color: #d8dae2; } html[data-theme="dark"] #page-overview .overview-stat-item strong, html[data-theme="dark"] #page-overview .overview-billing-trigger { color: #f5f7fb; } html[data-theme="dark"] #page-overview .overview-section-head, html[data-theme="dark"] #page-overview .overview-sixday-lines span { border-color: #343848; } html[data-theme="dark"] #page-overview .book-card .btn-row .btn { background: #262a36 !important; border-color: #3a4052 !important; color: #d8dae2 !important; } [data-theme="dark"] body:has(#page-setting.active) #page-setting .settings-panel { background: #20232e; border-color: #343848; backdrop-filter: none; } [data-theme="dark"] body:has(#page-setting.active) #page-setting .settings-status-item, [data-theme="dark"] body:has(#page-setting.active) #page-setting .settings-stat { background: #262a36; border-color: #3a4052; backdrop-filter: none; } html[data-theme="dark"] #page-setting .settings-menu-item { background: rgba(32, 35, 46, .94); border-color: #3a4052; color: #d8dae2; } html[data-theme="dark"] #page-setting .settings-menu-item:hover { background: #262a36; border-color: var(--client-accent); } html[data-theme="dark"] #page-setting .settings-menu-item.active { background: #262a36; border-color: var(--client-accent); color: #f5f7fb; box-shadow: inset 3px 0 0 var(--client-accent); } @media (max-width: 760px) { .app-wallpaper-layer { background-size: auto 100%; } } /* 视觉细调集中放在拆分样式末端，保留上游拆分基线的逐行兼容性。 */ .chapter-compose-bottom { margin-bottom: -13px; } /* 夜间模式弹窗补全：外壳已变暗时，内部列表、选择行、卡片和说明区不能继续使用日间硬编码色。 */ .feedback-dialog { background: #fff; color: #333; } .feedback-dialog-message { color: #333; } .feedback-dialog-input { background: #fff; color: #1e1e28; border: 1px solid #d4d8de; } html[data-theme="dark"] .feedback-dialog { background: var(--bg-card); color: var(--text); border: 1px solid var(--border); } html[data-theme="dark"] .feedback-dialog-message { color: var(--text); } html[data-theme="dark"] .feedback-dialog-input { background: var(--bg-input); color: var(--text); border: 1px solid var(--border); } html[data-theme="dark"] .feedback-dialog-input::placeholder { color: var(--text-muted); } html[data-theme="dark"] #templateSelectModal .modal-box > div:nth-child(2), html[data-theme="dark"] #templateSelectModal .modal-box > div:last-child { border-color: var(--border) !important; } html[data-theme="dark"] #templateSelectModal .modal-box > div:nth-child(3) > div:first-child { background: var(--bg-input) !important; border: 1px solid var(--border); } .tpl-sidebar-item { padding: 9px 14px; border-radius: 8px; cursor: pointer; color: #555; font-size: 15px; font-weight: 600; } .tpl-sidebar-item.active { background: #1a1d2b; color: #fff; } html[data-theme="dark"] .tpl-sidebar-item { color: var(--text-muted); } html[data-theme="dark"] .tpl-sidebar-item:hover { background: #2d3140; color: var(--text); } html[data-theme="dark"] .tpl-sidebar-item.active { background: var(--client-accent, #4a91aa); color: #fff; } html[data-theme="dark"] #templateSelectModal .tpl-selector-card { background: #262a36 !important; border-color: #3a4052 !important; color: var(--text); } html[data-theme="dark"] #templateSelectModal .tpl-selector-card:hover { border-color: var(--client-accent, #5f9cc7) !important; } html[data-theme="dark"] #templateSelectModal .tpl-selector-card.tpl-card-selected { background: #293544 !important; border-color: var(--client-accent, #5cbfe0) !important; } html[data-theme="dark"] #templateSelectModal .tpl-selector-card [style*="color:#1a1d2b"], html[data-theme="dark"] #templateSelectModal .tpl-selector-card [style*="color:#6e6e7a"] { color: var(--text) !important; } html[data-theme="dark"] #templateSelectModal .tpl-selector-card [style*="color:#9a9ca6"] { color: var(--text-muted) !important; } html[data-theme="dark"] #templateSelectModal .tpl-selector-card [style*="border-top:1px solid #e2e5ea"] { border-color: var(--border) !important; } html[data-theme="dark"] #templateSelectModal input, html[data-theme="dark"] #templateSelectModal select { background: var(--bg-input); color: var(--text); border-color: var(--border); } html[data-theme="dark"] .gen-option { background: var(--bg-input); color: var(--text); border: 1px solid var(--border); } html[data-theme="dark"] .gen-option:hover { background: #2d3140; } html[data-theme="dark"] #rwDirectionGroup .gen-option.is-selected { background: #4f46e5; color: #fff; border-color: #6b63f1; } html[data-theme="dark"] .tree-container, html[data-theme="dark"] .tree-folder, html[data-theme="dark"] .tree-file { background: var(--bg-input); border-color: var(--border); } html[data-theme="dark"] .tree-folder:hover, html[data-theme="dark"] .tree-file:hover { background: #2d3140; border-color: var(--client-accent, #5f9cc7); box-shadow: none; } html[data-theme="dark"] .tree-folder .folder-name, html[data-theme="dark"] .tree-file .file-name { color: var(--text); } html[data-theme="dark"] .tree-children { border-left-color: var(--border); } html[data-theme="dark"] .outline-genre-popup, html[data-theme="dark"] .outline-genre-column, html[data-theme="dark"] .outline-genre-popup-input-combo { background: var(--bg-card); border-color: var(--border); } html[data-theme="dark"] .outline-genre-column { background: var(--bg-input); } html[data-theme="dark"] .outline-genre-popup-selected { border-color: var(--border); } html[data-theme="dark"] #polishModal label { color: var(--text) !important; } html[data-theme="dark"] #polishSelectedText { background: var(--bg-input) !important; color: var(--text); border: 1px solid var(--border); } html[data-theme="dark"] #rewriteModal textarea, html[data-theme="dark"] #rewriteModal input, html[data-theme="dark"] #polishModal textarea { background: var(--bg-input); color: var(--text); border-color: var(--border) !important; } html[data-theme="dark"] .model-picker-box { background: var(--bg-card); border: 1px solid var(--border); } html[data-theme="dark"] .model-picker-sidebar { background: #181a23; border-right: 1px solid var(--border); } html[data-theme="dark"] .model-picker-cat { color: var(--text-muted); } html[data-theme="dark"] .model-picker-cat.active, html[data-theme="dark"] .model-picker-cat.advanced.active { background: #2d3140; color: var(--text); } html[data-theme="dark"] .model-picker-card, html[data-theme="dark"] .model-picker-card.disabled:hover { background: #262a36; border-color: #343848; } html[data-theme="dark"] .model-picker-card:hover { background: #2d3140; border-color: var(--client-accent, #5f9cc7); } html[data-theme="dark"] .model-picker-card.selected { background: #21332f; border-color: #4f9779; } html[data-theme="dark"] .model-picker-card-name { color: var(--text); } html[data-theme="dark"] .model-logo-wrap, html[data-theme="dark"] .model-picker-card-bar-wrap { background: #181a23; border-color: var(--border); } html[data-theme="dark"] .model-picker-footer { border-color: var(--border); } html[data-theme="dark"] .model-picker-footer button { background: var(--btn-outline-bg); color: var(--btn-outline-text); border-color: var(--border); } html[data-theme="dark"] .model-picker-footer button:hover { background: #2d3140; color: var(--text); border-color: var(--client-accent, #5f9cc7); } html[data-theme="dark"] #cloudRestoreModal #cloudRestoreBody { background: #181a23 !important; border-color: var(--border) !important; } html[data-theme="dark"] #cloudRestoreModal #cloudRestoreActions { border-color: var(--border) !important; } html[data-theme="dark"] #cloudRestoreModal .cloud-restore-book, html[data-theme="dark"] #cloudRestoreModal .cloud-restore-version, html[data-theme="dark"] #cloudRestoreModal .cloud-file-card { background: #262a36 !important; border-color: #3a4052 !important; color: var(--text) !important; } html[data-theme="dark"] #cloudRestoreModal .cloud-restore-book:hover, html[data-theme="dark"] #cloudRestoreModal .cloud-restore-version:hover, html[data-theme="dark"] #cloudRestoreModal .cloud-file-card:hover { background: #2d3140 !important; border-color: var(--client-accent, #5f9cc7) !important; } html[data-theme="dark"] #cloudRestoreModal [style*="color:#1d2433"] { color: var(--text) !important; } html[data-theme="dark"] #cloudRestoreModal [style*="color:#667085"], html[data-theme="dark"] #cloudRestoreModal [style*="color:#8a8f98"] { color: var(--text-muted) !important; } html[data-theme="dark"] #cloudFilePreviewMeta { color: var(--text-muted) !important; } html[data-theme="dark"] #cloudFilePreviewContent { background: var(--bg-input) !important; color: var(--text) !important; border-color: var(--border) !important; } html[data-theme="dark"] #importAnalysisEstimate { background: var(--bg-input); color: var(--text-muted); border: 1px solid var(--border); } html[data-theme="dark"] .full-analysis-notice { background: #202d3c; color: #c4d8ef; border-color: #38516c; } html[data-theme="dark"] .full-analysis-progress-card, html[data-theme="dark"] .full-analysis-save-card { background: var(--bg-input); border-color: var(--border); } html[data-theme="dark"] .full-analysis-progress-track { background: #181a23; } html[data-theme="dark"] .full-analysis-log { background: #181a23; border-color: var(--border); } html[data-theme="dark"] .full-analysis-log-item { color: var(--text-muted); } html[data-theme="dark"] .full-analysis-log-item.is-current { background: #20324a; color: #b9d5fa; } html[data-theme="dark"] .full-analysis-log-item.is-error { background: #3a2923; color: #f2b896; } /* source: ./styles/app/80-responsive-devices.css?v=202607301930 */ /* 手机、平板与 iPad 响应式收口：只调整布局、触控和可视范围，不改变业务行为。 */ html, body { max-width: 100%; } body, .main-container, .content-wrapper, .main-content, .page { min-width: 0; } img, video, canvas { max-width: 100%; } .og-input-toggle { display: none; } #stepLogFloat .log-collapse, #stepLogFloat .log-status-dot { display: none; } #stepLogFloat[data-tablet-log="true"][data-tablet-positioned="true"]:not(.is-collapsed) { right: auto !important; left: var(--zhiyu-tablet-log-left, 0px) !important; top: var(--zhiyu-tablet-log-top, 0px) !important; } #stepLogFloat .log-header { min-height: 48px; justify-content: flex-start; gap: 8px; cursor: grab; touch-action: none; } #stepLogFloat .log-header:active { cursor: grabbing; } #stepLogFloat .log-collapse { display: inline-flex; width: 34px; height: 24px; min-width: 34px; min-height: 24px; padding: 0; border: 1px solid #d4d8de; border-radius: 12px; background: #fff; box-shadow: none; color: #999; font: inherit; font-size: 14px; font-weight: 800; line-height: 1; touch-action: manipulation; align-items: center; justify-content: center; } #stepLogFloat .log-collapse:hover { background: #fff; color: #999; } #stepLogFloat .log-title { white-space: nowrap; } #stepLogFloat .log-header-spacer { flex: 1 1 auto; } #stepLogFloat.is-collapsed { top: var(--zhiyu-tablet-log-collapsed-top, 80px) !important; right: max(0px, env(safe-area-inset-right)) !important; left: auto !important; width: 46px !important; height: 54px !important; min-width: 46px !important; min-height: 54px !important; max-width: 46px !important; max-height: 54px !important; border-radius: 16px 0 0 16px; resize: none !important; cursor: ns-resize; } #stepLogFloat.is-collapsed .log-header { width: 100%; height: 100%; min-height: 0; padding: 0; border: 0; justify-content: center; cursor: ns-resize; } #stepLogFloat.is-collapsed :is( .log-collapse, .log-title, .log-header-spacer, .log-close, .log-body ) { display: none !important; } #stepLogFloat.is-collapsed .log-status-dot { display: block; width: 15px; height: 15px; border-radius: 50%; background: #9ca3af; } #stepLogFloat.is-collapsed[data-log-status="running"] .log-status-dot { background: #2684ff; box-shadow: 0 0 0 0 rgba(38, 132, 255, .45); animation: zhiyu-log-running-pulse 1.25s ease-out infinite; } #stepLogFloat.is-collapsed[data-log-status="success"] .log-status-dot { background: #22a95a; } #stepLogFloat.is-collapsed[data-log-status="warning"] .log-status-dot { background: #e5ad16; } #stepLogFloat.is-collapsed[data-log-status="error"] .log-status-dot { background: #e5484d; } @keyframes zhiyu-log-running-pulse { 0% { box-shadow: 0 0 0 0 rgba(38, 132, 255, .48); } 72% { box-shadow: 0 0 0 10px rgba(38, 132, 255, 0); } 100% { box-shadow: 0 0 0 0 rgba(38, 132, 255, 0); } } @supports (height: 100dvh) { body, .sidebar, .main-container, .content-wrapper, .main-content { height: 100dvh; } .single-auth-screen { min-height: 100dvh; } } @supports (height: 100dvh) { @media (min-width: 901px) { .single-auth-left, .single-auth-right { min-height: 100dvh; } } @media (min-width: 601px) and (max-width: 900px) { .single-auth-left { min-height: 34dvh; } .single-auth-right { min-height: 66dvh; } } } @media (max-width: 1180px), (any-pointer: coarse) and (max-width: 1440px) { body { min-height: 100vh; min-height: 100dvh; overflow: hidden; } .sidebar { box-sizing: border-box; height: 100vh; height: 100dvh; padding-bottom: max(12px, env(safe-area-inset-bottom)); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; } .sidebar .nav-item.active { margin-right: 0; padding-right: 8px; } .main-container { padding-right: env(safe-area-inset-right) !important; } .main-content { padding: clamp(8px, 1.6vw, 18px) 0 0 clamp(8px, 1.6vw, 18px) !important; } .page { max-width: 100%; overflow-x: hidden; overscroll-behavior: contain; } .modal-overlay { box-sizing: border-box; padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)) !important; } .modal-overlay > .modal-box, .modal-overlay > [role="dialog"] { box-sizing: border-box; max-width: calc(100vw - 16px) !important; max-height: calc(100vh - 16px) !important; max-height: calc(100dvh - 16px) !important; overscroll-behavior: contain; } .step-log-float, .ai-feedback-float, .og-file-float { right: max(8px, env(safe-area-inset-right)) !important; left: auto !important; width: min(420px, calc(100vw - 74px)) !important; max-width: calc(100vw - 74px) !important; max-height: calc(100vh - 16px) !important; max-height: calc(100dvh - 16px) !important; } .divider-v .divider-toggle { width: 36px; height: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; } #page-write .btn-row > :is(.btn, .format-split-btn, .ai-feedback-toggle) { flex: 0 0 auto; white-space: nowrap; } #page-write .word-stats > span { flex: 0 0 auto; white-space: nowrap; } [data-drag="catalog-main"] .divider-toggle { right: -18px; } [data-drag="main-action"] .divider-toggle { left: -18px; } #page-overview.workbench-page { overflow-x: hidden; overflow-y: auto; } #page-overview .workbench-shell { height: auto; min-height: 100%; overflow: visible; } #page-overview .workbench-head { flex: 0 0 auto; grid-template-columns: minmax(0, 1fr); gap: 10px; } #page-overview .overview-head-actions { width: 100%; display: grid; grid-template-columns: auto minmax(260px, 305px); justify-content: end; } #page-overview #panel-works { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(420px, auto) auto; gap: 14px; overflow: visible; } #page-overview .overview-top-grid, #page-overview .overview-list-panel, #page-overview .overview-side-grid { grid-column: 1; } #page-overview .overview-top-grid { grid-row: 1; grid-template-columns: 190px minmax(0, 1fr); } #page-overview .overview-list-panel { grid-row: 2; min-height: 420px; } #page-overview .overview-side-grid { grid-row: 3; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(320px, auto); } #page-overview .overview-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, 88px); height: auto; } #page-overview .overview-stat-item { height: 88px; padding: 12px 10px 10px; } #page-overview .overview-stat-item strong { margin-top: 9px; } #page-overview .overview-book-list { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow-y: visible; } #templateGrid { width: 100%; max-width: 100%; min-width: 0; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); overflow-x: hidden; overflow-y: auto; } #page-template > div, #page-template #templateTabs, #page-template #templateLength, #page-template #templateSubCat, #page-template .template-pagination { box-sizing: border-box; max-width: 100%; min-width: 0; } #page-template .template-pagination { flex-wrap: wrap; } .template-card { width: 100%; min-width: 0; } .workbench-head { flex-wrap: wrap; } } @media (max-width: 900px) { .single-auth-screen.active { align-content: start; overflow-x: hidden; overflow-y: auto; } } @media (max-width: 1440px) { html[data-zhiyu-device="tablet"] body, html[data-zhiyu-device="tablet"] .sidebar, html[data-zhiyu-device="tablet"] .main-container { height: calc( var(--zhiyu-tablet-viewport-height, 100dvh) + var(--zhiyu-tablet-viewport-top, 0px) ) !important; } html[data-zhiyu-device="tablet"] .sidebar { padding-top: calc(12px + max( env(safe-area-inset-top), var(--zhiyu-tablet-viewport-top, 0px) )) !important; } html[data-zhiyu-device="tablet"] .main-content { padding-top: calc(8px + max( env(safe-area-inset-top), var(--zhiyu-tablet-viewport-top, 0px) )) !important; } html[data-zhiyu-device="tablet"] body:has(#page-overview.active) .main-content, html[data-zhiyu-device="tablet"] body:has(#page-template.active) .main-content, html[data-zhiyu-device="tablet"] body:has(#page-setting.active) .main-content { padding-right: clamp(8px, 1.6vw, 18px) !important; } html[data-zhiyu-device="tablet"] body:has(#page-write.active) .main-content { padding-left: 4px !important; } html[data-zhiyu-device="tablet"] #sidebar #collapseBtn { display: none !important; } html[data-zhiyu-device="tablet"] #sidebar #homeBtn { top: calc(13px + max( env(safe-area-inset-top), var(--zhiyu-tablet-viewport-top, 0px) )) !important; left: 50% !important; right: auto !important; transform: translateX(-50%) !important; } html[data-zhiyu-device="tablet"] #sidebar.collapsed #userBar { width: 100%; padding: 10px 4px !important; } html[data-zhiyu-device="tablet"] #sidebar.collapsed #userBar > div { justify-content: center; gap: 0 !important; } html[data-zhiyu-device="tablet"] #sidebar.collapsed #userBar > div > div:not(#userAvatar) { display: none !important; } html[data-zhiyu-device="tablet"] #sidebar.collapsed #userAvatar { margin-inline: auto; } html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="catalog-main"], html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="main-action"] { cursor: default; } html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="catalog-main"] .drag-handle, html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="main-action"] .drag-handle { display: none; } /* 平板写作页的面板收起/展开按钮统一沿用关联文件区域的胶囊样式。 */ html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="catalog-main"] .divider-toggle, html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="main-action"] .divider-toggle, html[data-zhiyu-device="tablet"] #page-write #ogInputToggleBtn { display: inline-flex; top: 50% !important; width: 34px; height: 24px; min-height: 24px; padding: 0; border: 1px solid #d4d8de; border-radius: 12px; background: #fff; box-shadow: none; color: #999; font-size: 14px !important; font-weight: 800; line-height: 1; touch-action: manipulation; align-items: center; justify-content: center; } html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="catalog-main"] .divider-toggle:hover, html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="main-action"] .divider-toggle:hover, html[data-zhiyu-device="tablet"] #page-write #ogInputToggleBtn:hover { background: #fff; color: #999; } html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="catalog-main"] .divider-toggle { right: -17px; transform: translateY(-50%); } html[data-zhiyu-device="tablet"] #page-write .divider-v[data-drag="main-action"] .divider-toggle { left: -17px; transform: translateY(-50%); } html[data-zhiyu-device="tablet"] #page-write #ogDragDivider { cursor: default; position: relative; overflow: visible; } html[data-zhiyu-device="tablet"] #page-write #ogDragDivider .drag-handle { display: none; } html[data-zhiyu-device="tablet"] #page-write #ogInputToggleBtn { position: absolute; left: 50%; z-index: 12; transform: translate(-50%, -50%); } html[data-zhiyu-device="tablet"] #page-write #ogDragDivider.tablet-input-collapsed ~ #ogInputArea, html[data-zhiyu-device="tablet"] #page-write #ogDragDivider.tablet-input-collapsed ~ #btnActionModelSelect, html[data-zhiyu-device="tablet"] #page-write #ogDragDivider.tablet-input-collapsed ~ #btnOGSend, html[data-zhiyu-device="tablet"] #page-write #ogDragDivider.tablet-input-collapsed ~ #fineOutlineStepStrip, html[data-zhiyu-device="tablet"] #page-write #ogDragDivider.tablet-input-collapsed ~ #decomposeStepStrip, html[data-zhiyu-device="tablet"] #page-write #ogDragDivider.tablet-input-collapsed ~ #actionBtnsBottom { display: none !important; } } @media (max-width: 860px) { button, [role="button"], input, select, textarea { touch-action: manipulation; } #page-overview .workbench-head { display: grid; grid-template-columns: minmax(0, 1fr); } #page-overview .overview-head-actions { grid-template-columns: minmax(0, 1fr); justify-content: stretch; } #page-overview .overview-recharge-entry, #page-overview .workbench-tabs { width: 100%; min-width: 0; } #page-overview .overview-announcement-progress { display: none; } #page-overview #panel-works { display: flex; flex-direction: column; min-height: 0; } #page-overview .overview-top-grid { grid-template-columns: minmax(0, 1fr); } #page-overview .overview-quick-panel { height: auto; } #page-overview .overview-action-row { height: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: 46px; } #page-overview .overview-action-tile { min-width: 0; padding-inline: 10px; } #page-overview .overview-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, 82px); gap: 10px; } #page-overview .overview-stat-item { height: 82px; } #page-overview .overview-list-panel, #page-overview .overview-bottom-card { padding: 16px; border-radius: 16px; } #page-overview .overview-section-head { align-items: stretch; flex-direction: column; gap: 10px; } #page-overview .overview-list-tools { width: 100%; margin-left: 0; } #page-overview .workbench-search { width: 100%; min-width: 0; min-height: 44px; } #page-overview .overview-book-list { grid-template-columns: minmax(0, 1fr); } #page-overview .overview-side-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(2, minmax(300px, auto)); } #page-overview .overview-edit-toolbar { grid-template-columns: minmax(0, 1fr); } #page-overview .overview-table-select { justify-self: stretch; width: 100%; min-height: 44px; margin-right: 0; } #page-template > div { min-width: 0; max-width: 100%; } #page-template > div:first-child { flex-wrap: wrap; } #page-template > div:first-child > span { display: none; } #page-template #templateTabs, #templateLength, #templateSubCat { width: 100%; min-width: 0; flex-wrap: nowrap !important; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; } #page-template #templateTabs { order: 1; } #btnManageTemplates { order: 2; min-height: 44px; margin-left: auto; } #templateLength .btn, #templateSubCat .btn { min-height: 40px; flex: 0 0 auto; } #templateSort { min-height: 44px; } #templateSearch { width: 100%; min-width: 0 !important; min-height: 44px; flex-basis: 100% !important; } .memory-main-grid { grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)) !important; } .workbench-title { overflow-wrap: anywhere; } } @media (max-width: 600px) { .single-auth-screen.active { min-height: 100vh; min-height: 100dvh; overflow-x: hidden; overflow-y: auto; } .single-auth-left { min-height: 150px; padding: max(24px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) 24px max(18px, env(safe-area-inset-left)); } .single-auth-brand h1 { margin-bottom: 4px; font-size: 30px; } .single-auth-brand .single-auth-en { margin-bottom: 0; } .single-auth-points { display: none; } .single-auth-right { min-height: calc(100dvh - 150px); padding: 22px max(16px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); align-items: flex-start; } .single-auth-logo-wrap img { width: 112px; height: 112px; } .single-auth-account-actions { grid-template-columns: 1fr; } .modal-overlay > .modal-box, .modal-overlay > [role="dialog"] { width: calc(100vw - 16px) !important; border-radius: 12px !important; } #page-overview .overview-announcement-bar { padding-inline: 14px; } #page-overview .overview-book-list { grid-template-columns: minmax(0, 1fr); } #page-overview .overview-action-title { font-size: 14px; } #page-overview .overview-list-panel, #page-overview .overview-bottom-card { padding: 14px 12px; } #page-overview .overview-sixday-bars { left: 44px; right: 6px; gap: 6px; } #page-overview .overview-sixday-bar { width: min(22px, 8vw); } #page-overview .book-card .overview-book-card-actions { grid-template-columns: minmax(0, 1fr); } #page-overview .book-card .btn-row .btn { min-height: 40px; } .settings-menu-item { min-height: 64px; } } @media (max-width: 1440px) { html[data-zhiyu-device="tablet"] #page-overview #panel-works { display: grid !important; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(420px, auto) auto; } html[data-zhiyu-device="tablet"] #page-overview .overview-top-grid { --overview-tablet-top-height: 96px; grid-column: 1; grid-row: 1; grid-template-columns: clamp(170px, 24vw, 220px) minmax(0, 1fr); gap: 10px; align-items: stretch; } html[data-zhiyu-device="tablet"] #page-overview .overview-quick-panel, html[data-zhiyu-device="tablet"] #page-overview .overview-stat-panel { box-sizing: border-box; min-width: 0; height: var(--overview-tablet-top-height); } html[data-zhiyu-device="tablet"] #page-overview .overview-action-row { height: 100%; min-height: 0; grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(2, minmax(0, 1fr)); } html[data-zhiyu-device="tablet"] #page-overview .overview-action-tile { min-height: 0; } html[data-zhiyu-device="tablet"] #page-overview .overview-stat-grid { height: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 10px; } html[data-zhiyu-device="tablet"] #page-overview .overview-stat-item { min-width: 0; height: auto; padding: 0 8px; flex-direction: row; align-items: center; justify-content: space-between; text-align: left; } html[data-zhiyu-device="tablet"] #page-overview .overview-stat-head { width: auto; min-width: 0; flex: 1 1 auto; justify-content: flex-start; gap: 4px; font-size: 13px; line-height: 1.15; } html[data-zhiyu-device="tablet"] #page-overview .overview-stat-head > span:last-child { display: inline-block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transform: scale(.82); transform-origin: left center; } html[data-zhiyu-device="tablet"] #page-overview .overview-stat-item strong { width: auto; min-width: 0; max-width: 55%; flex: 0 1 auto; margin: 0 0 0 6px; font-size: 24px; line-height: 1.1; text-align: right; transform: scale(.7); transform-origin: right center; } html[data-zhiyu-device="tablet"] #page-overview .overview-billing-trigger .overview-stat-head { min-height: 0; } html[data-zhiyu-device="tablet"] #page-overview .overview-list-panel { grid-column: 1; grid-row: 2; } html[data-zhiyu-device="tablet"] #page-overview .overview-side-grid { grid-column: 1; grid-row: 3; grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(2, minmax(300px, auto)); } html[data-zhiyu-device="tablet"] #page-overview .overview-book-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } html[data-zhiyu-device="tablet"] #page-overview :is(#archiveContainer, #trashContainer) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: row; grid-auto-rows: minmax(190px, auto); align-content: start; align-items: stretch; gap: 18px; } html[data-zhiyu-device="tablet"] #page-overview :is(#archiveContainer, #trashContainer) > .book-card { min-width: 0; min-height: 190px; } html[data-zhiyu-device="tablet"] #page-overview :is(#archiveContainer, #trashContainer) > .book-card .btn-row > .btn { min-width: 0; flex: 1 1 0; } html[data-zhiyu-device="tablet"] #page-overview :is(#archiveContainer, #trashContainer) > :only-child:not(.book-card) { grid-column: 1 / -1; } html[data-zhiyu-device="tablet"] #page-overview .book-card .overview-book-card-actions { grid-template-columns: minmax(0, .88fr) minmax(0, .88fr) minmax(0, 1.24fr); } html[data-zhiyu-device="tablet"] #page-overview .book-card .btn-row .btn { min-height: 28px; } } @media (max-width: 1180px), (any-pointer: coarse) and (max-width: 1440px) { :is( #page-overview, #page-write, #page-template, #page-memory, #page-publish, #page-setting, .single-auth-screen ) :is(input, select, textarea):not([data-responsive-font-opt-out]) { font-size: 16px !important; } } @media (hover: none) { #page-overview .overview-action-tile:hover, #page-overview .book-card:hover, #page-overview .overview-billing-trigger:hover { transform: none; } } @media (prefers-reduced-motion: reduce) { #stepLogFloat .log-status-dot { animation: none !important; } .overview-announcement-text, .overview-announcement-progress::before { animation: none !important; } }