:root{--color-primary: #667eea;--color-primary-deep: #4b5fd6;--color-primary-soft: rgba(102, 126, 234, .12);--color-accent: #06d6a0;--color-accent-soft: rgba(6, 214, 160, .15);--color-danger: #ff6b6b;--color-danger-soft: rgba(255, 107, 107, .14);--color-text: #202334;--color-muted: #6b7280;--color-border: #e7eaf3;--color-surface: #ffffff;--color-page: #f7f8fc;--color-reading-paper: #fff8ec;--color-night-page: #111827;--color-night-surface: #1f2937;--radius-small: 6px;--radius-medium: 12px;--radius-large: 20px;--radius-pill: 999px;--shadow-panel: 0 6px 24px rgba(0, 0, 0, .08);--shadow-floating: 0 12px 36px rgba(32, 35, 52, .14);--shadow-soft: 0 4px 16px rgba(102, 126, 234, .1);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif;color:var(--color-text);background:var(--color-page)}*{box-sizing:border-box}body{margin:0;min-width:320px;background:linear-gradient(135deg,rgba(102,126,234,.08),transparent 34%),linear-gradient(315deg,rgba(6,214,160,.06),transparent 26%),var(--color-page)}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{border:0;border-radius:6px;padding:10px 14px;color:#fff;background:var(--color-primary);cursor:pointer;min-height:40px;font-weight:700;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}button:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--shadow-soft)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(102,126,234,.32);outline-offset:2px}button:disabled{cursor:not-allowed;opacity:.55}button.secondary{color:var(--color-primary);background:var(--color-primary-soft)}button.danger{color:#fff;background:var(--color-danger)}input,select,textarea{width:100%;border:1px solid var(--color-border);border-radius:6px;padding:10px 12px;background:#fff;color:var(--color-text)}textarea{min-height:110px;line-height:1.7;resize:vertical}.app-shell{min-height:100vh}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px clamp(16px,5vw,56px);border-bottom:1px solid var(--color-border);background:#ffffffdb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:sticky;top:0;z-index:10}.brand{font-size:20px;font-weight:700;color:var(--color-primary)}.nav{display:flex;flex-wrap:wrap;gap:10px;color:var(--color-muted)}.nav a,.side-nav-item{border-radius:var(--radius-pill);padding:7px 10px}.nav a:hover,.side-nav-item:hover,.side-nav-item.active{color:var(--color-primary);background:var(--color-primary-soft)}.product-topbar{min-height:72px}.product-nav{align-items:center}.topbar-actions{display:flex;align-items:center;gap:var(--space-2)}.page{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:28px 0 56px}.hero,.panel{border:1px solid var(--color-border);border-radius:12px;background:var(--color-surface);box-shadow:var(--shadow-panel)}.hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:28px;padding:clamp(24px,4vw,44px);overflow:hidden;background:radial-gradient(circle at 0 0,rgba(102,126,234,.16),transparent 32%),linear-gradient(135deg,#fff,#f8f9ff 58%,#f0f4ff)}.hero h1{margin:0 0 14px;font-size:clamp(30px,4vw,54px);line-height:1.15}.hero p,.muted{color:var(--color-muted)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.panel{padding:18px}.ui-card,.stat-card,.product-work-card{position:relative}.ui-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-4)}.ui-card-head h2{margin:0}.ui-card-actions{display:flex;align-items:center;gap:var(--space-2)}.ui-eyebrow{margin:0 0 4px;color:var(--color-muted);font-size:12px;font-weight:700}.side-nav{display:grid;align-content:start;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-medium);background:#ffffffd1}.side-nav-item{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);color:var(--color-muted)}.side-nav-item strong{border-radius:var(--radius-pill);padding:2px 7px;color:var(--color-primary);background:var(--color-primary-soft);font-size:12px}.stat-card{display:grid;gap:var(--space-2);min-height:118px}.stat-card span,.stat-card small{color:var(--color-muted)}.stat-card strong{font-size:clamp(26px,4vw,38px);color:var(--color-primary);line-height:1}.stat-card-accent strong{color:var(--color-accent)}.stat-card-danger strong{color:var(--color-danger)}.product-work-card{grid-template-columns:88px minmax(0,1fr);align-items:start}.work-cover{width:88px;aspect-ratio:3 / 4;border-radius:var(--radius-small);object-fit:cover;background:linear-gradient(145deg,#667eea42,#06d6a02e)}.work-cover-empty{display:block}.chapter-list{display:grid;border:1px solid var(--color-border);border-radius:var(--radius-medium);overflow:hidden}.chapter-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;align-items:center;gap:var(--space-3);padding:12px 14px;border-bottom:1px solid var(--color-border);background:var(--color-surface)}.chapter-row:last-child{border-bottom:0}.chapter-actions{display:flex;gap:var(--space-2)}.state-block{display:grid;place-items:center;gap:var(--space-2);min-height:160px;padding:var(--space-6);border:1px dashed var(--color-border);border-radius:var(--radius-medium);color:var(--color-muted);text-align:center;background:#ffffffad}.state-block strong{color:var(--color-text)}.loading-state{border-style:solid}.error-state{border-color:#ff6b6b5c;background:#ff6b6b14}.dialog-backdrop{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:var(--space-6);background:#1118276b}.confirm-dialog{width:min(420px,100%);border-radius:var(--radius-medium);padding:var(--space-6);background:var(--color-surface);box-shadow:var(--shadow-floating)}.payment-panel{background:linear-gradient(145deg,#fff,#f4f7ff)}.reader-settings{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3)}.reader-settings label{display:grid;gap:var(--space-1);min-width:180px;color:var(--color-muted);font-size:14px}.admin-table{font-size:14px}.form-section{display:grid;gap:var(--space-3);margin:0;border:1px solid var(--color-border);border-radius:var(--radius-medium);padding:var(--space-4);background:#ffffffb8}.form-section legend{padding:0 var(--space-2);color:var(--color-primary);font-weight:800}.panel h2,.panel h3{margin:0 0 12px}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.status{display:inline-flex;align-items:center;border-radius:999px;padding:4px 9px;font-size:12px;color:#3f4aa8;background:var(--color-primary-soft)}.status.ok{color:#067a61;background:var(--color-accent-soft)}.status.warn{color:#b54747;background:var(--color-danger-soft)}.status.danger{color:#b42318;background:var(--color-danger-soft)}.table{width:100%;border-collapse:collapse}.table th,.table td{border-bottom:1px solid var(--color-border);padding:10px 8px;text-align:left;vertical-align:top}.reader-body{max-width:720px;margin:0 auto;font-size:18px;line-height:1.8}.reader-body p{margin:0 0 1em}@media(max-width:760px){.topbar{align-items:flex-start;flex-direction:column}.hero,.product-work-card,.chapter-row{grid-template-columns:1fr}button,input,select,textarea{min-height:44px}}:root{--reader-bg: #f6f8fb;--reader-surface: #ffffff;--reader-surface-soft: #f0f4f8;--reader-ink: #162033;--reader-muted: #657386;--reader-border: #dfe6ef;--reader-primary: #4f63d9;--reader-primary-soft: rgba(79, 99, 217, .1);--reader-accent: #06a88e;--reader-accent-soft: rgba(6, 168, 142, .12);--reader-danger: #df5c62;--reader-danger-soft: rgba(223, 92, 98, .12);--reader-warn: #b7791f;--reader-warn-soft: rgba(183, 121, 31, .12);--reader-radius: 8px;--reader-radius-sm: 6px;--reader-shadow: 0 14px 45px rgba(22, 32, 51, .08);--reader-shadow-sm: 0 8px 20px rgba(22, 32, 51, .06);color:var(--reader-ink)}body{background:var(--reader-bg)}button,input,select,textarea{letter-spacing:0}.product-shell{min-height:100vh;background:linear-gradient(180deg,#ffffffe6,#f6f8fbf5 220px),var(--reader-bg)}.global-header{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px;min-height:72px;padding:12px clamp(18px,4vw,52px);border-bottom:1px solid var(--reader-border);background:#ffffffe6;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand-lockup,.main-nav button,.account-chip{border:0;background:transparent;color:inherit;cursor:pointer}.brand-lockup{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0;text-align:left}.brand-lockup:hover,.main-nav button:hover,.account-chip:hover{box-shadow:none;transform:none}.brand-mark{display:grid;width:38px;height:38px;place-items:center;border-radius:var(--reader-radius);background:var(--reader-ink);color:#fff;font-weight:800}.brand-lockup strong,.brand-lockup small,.account-chip span,.account-chip small{display:block}.brand-lockup strong{color:var(--reader-ink);font-size:16px}.brand-lockup small,.account-chip small{color:var(--reader-muted);font-size:12px}.main-nav,.header-actions,.button-row,.table-actions,.hero-actions,.page-actions,.surface-actions,.meta-row,.tag-row,.chip-row,.section-tabs{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.main-nav{justify-content:center}.main-nav button{min-height:34px;padding:8px 11px;border-radius:var(--reader-radius-sm);color:var(--reader-muted);font-size:14px;font-weight:700;text-decoration:none}.main-nav button.active,.main-nav button:hover{color:var(--reader-primary);background:var(--reader-primary-soft)}.header-actions{justify-content:end}.account-chip{min-height:42px;padding:6px 10px;border:1px solid var(--reader-border);border-radius:var(--reader-radius);background:#fff}.layout-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;width:min(1320px,calc(100% - 32px));margin:0 auto;padding:24px 0 64px}.route-view,.page-stack,.form-stack,.record-list,.comment-list{display:grid;gap:18px}.page-header{display:flex;align-items:end;justify-content:space-between;gap:18px;padding:8px 0}.page-header h1{margin:0;color:var(--reader-ink);font-size:clamp(30px,4vw,48px);line-height:1.12}.page-header-compact h1{font-size:clamp(28px,4vw,42px)}.page-header p,.surface-head p,.muted,.work-card p,.data-state p{color:var(--reader-muted);line-height:1.7}.page-header p,.surface-head p{max-width:720px;margin:10px 0 0}.surface,.work-card,.data-state,.home-control-panel,.detail-hero,.reader-toolbar,.reader-paper{border:1px solid var(--reader-border);border-radius:var(--reader-radius);background:var(--reader-surface);box-shadow:var(--reader-shadow-sm)}.surface{padding:clamp(18px,3vw,26px)}.surface-head{display:flex;align-items:start;justify-content:space-between;gap:18px;margin-bottom:18px}.surface h2,.data-state strong{margin:0;color:var(--reader-ink);font-size:22px;line-height:1.25}.btn{min-height:40px;padding:10px 14px;border:1px solid transparent;border-radius:var(--reader-radius-sm);font-weight:800;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn-primary{background:var(--reader-primary);color:#fff}.btn-secondary{border-color:#4f63d92e;background:var(--reader-primary-soft);color:var(--reader-primary)}.btn-ghost{border-color:var(--reader-border);background:#fff;color:var(--reader-ink)}.btn-danger{background:var(--reader-danger);color:#fff}.field{display:grid;gap:8px;min-width:0;color:var(--reader-muted);font-size:14px;font-weight:700}.field input,.field select,.field textarea,.comment-composer textarea,.chapter-editor{width:100%;border:1px solid var(--reader-border);border-radius:var(--reader-radius-sm);background:#fff;color:var(--reader-ink)}.field textarea,.chapter-editor{min-height:170px;line-height:1.8}.field-error{color:var(--reader-danger)}.form-grid,.filter-grid,.payment-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:end}.form-grid-2,.split-row,.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:end}.home-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.58fr);gap:24px;align-items:stretch;min-height:360px;padding:clamp(28px,5vw,58px);border:1px solid var(--reader-border);border-radius:var(--reader-radius);background:linear-gradient(135deg,#4f63d91a,#06a88e14),#fff;box-shadow:var(--reader-shadow)}.home-hero h1{max-width:820px;margin:0;font-size:clamp(42px,7vw,76px);line-height:1.05}.home-hero p{max-width:720px;color:var(--reader-muted);font-size:18px;line-height:1.8}.home-control-panel{display:grid;align-content:center;gap:14px;padding:22px}.home-control-panel span,.record-list span{color:var(--reader-muted)}.work-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.work-card{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px;padding:14px;min-height:210px}.work-cover{width:96px;aspect-ratio:3 / 4;border-radius:var(--reader-radius-sm);object-fit:cover;background:linear-gradient(145deg,#4f63d942,#06a88e2e)}.work-cover-empty{display:grid;place-items:center;border:1px solid var(--reader-border)}.work-cover-empty span{max-width:72px;color:var(--reader-primary);font-weight:900;line-height:1.35;text-align:center}.work-card-body{display:grid;gap:10px;align-content:start}.work-card-top{display:flex;justify-content:space-between;gap:10px;color:var(--reader-muted);font-size:13px}.work-card h3{margin:0;color:var(--reader-ink);font-size:21px;line-height:1.25}.work-summary{display:-webkit-box;min-height:5.1em;max-height:5.1em;margin:0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3}.metric-row,.pagination,.stat-strip,.reader-footer{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.metric-row,.meta-row,.tag-row{color:var(--reader-muted);font-size:14px}.tag-row span,.status-pill,.chip{display:inline-flex;align-items:center;min-height:28px;padding:4px 9px;border-radius:var(--reader-radius-sm);font-size:13px;font-weight:800}.tag-row span,.chip{border:1px solid var(--reader-border);background:#fff;color:var(--reader-muted)}.chip{cursor:pointer}.chip.active,.chip:hover{border-color:#4f63d947;background:var(--reader-primary-soft);color:var(--reader-primary)}.status-pill{background:var(--reader-surface-soft);color:var(--reader-muted)}.status-ok{background:var(--reader-accent-soft);color:var(--reader-accent)}.status-warn{background:var(--reader-warn-soft);color:var(--reader-warn)}.status-danger{background:var(--reader-danger-soft);color:var(--reader-danger)}.detail-hero{display:grid;grid-template-columns:180px minmax(0,1fr);gap:24px;padding:clamp(18px,3vw,28px)}.detail-cover{width:100%;aspect-ratio:3 / 4;border-radius:var(--reader-radius);object-fit:cover}.chapter-list,.responsive-table{display:grid;gap:8px;overflow-x:auto}.chapter-row,.record-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:12px;align-items:center;min-height:54px;padding:10px 0;border-bottom:1px solid var(--reader-border)}.comment-composer,.comment-item{display:grid;gap:12px}.comment-item{padding:14px 0;border-bottom:1px solid var(--reader-border)}.comment-item p{margin:0;line-height:1.7}.reading-page{display:grid;gap:18px}.reader-toolbar{position:sticky;top:88px;z-index:12;display:flex;justify-content:space-between;gap:14px;padding:14px 16px}.reader-toolbar>div{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.reader-toolbar button{min-height:34px;padding:7px 10px}.reader-settings{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.reader-settings label{display:flex;align-items:center;gap:8px;color:var(--reader-muted);font-size:14px;font-weight:700}.reader-paper{max-width:820px;margin:0 auto;padding:clamp(28px,6vw,70px)}.reader-paper h1{margin:0 0 28px;font-size:clamp(30px,5vw,48px)}.reader-body{color:var(--reader-ink);line-height:1.8}.reader-body p{margin:0 0 1.1em}.reader-footer{justify-content:center}.account-grid,.entry-grid,.editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:16px}.profile-editor{display:grid;grid-template-columns:92px minmax(0,1fr);gap:16px;align-items:start}.avatar-preview{display:grid;width:92px;height:92px;place-items:center;border-radius:var(--reader-radius);object-fit:cover;background:var(--reader-ink);color:#fff;font-size:30px;font-weight:800}.stat-strip,.stat-grid,.review-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.stat-strip div,.stat-grid div,.review-grid div{display:grid;gap:8px;min-height:96px;padding:14px;border:1px solid var(--reader-border);border-radius:var(--reader-radius-sm);background:var(--reader-surface-soft)}.stat-strip span,.stat-grid span,.review-grid span{color:var(--reader-muted);font-size:13px;font-weight:800}.stat-strip strong,.stat-grid strong,.review-grid strong{color:var(--reader-primary);font-size:26px}.data-state{display:grid;justify-items:start;gap:10px;min-height:220px;align-content:center;padding:clamp(22px,4vw,42px)}.state-mark{width:42px;height:6px;border-radius:var(--reader-radius-sm);background:var(--reader-primary)}.data-state-loading .state-mark{animation:loading-bar 1.1s ease-in-out infinite}.data-state-error .state-mark,.data-state-forbidden .state-mark{background:var(--reader-danger)}.recommendation-list,.category-grid,.ad-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.recommendation-list article,.category-grid button,.ad-list a{min-height:96px;padding:14px;border:1px solid var(--reader-border);border-radius:var(--reader-radius-sm);background:#fff;text-align:left}.category-grid button{color:var(--reader-ink);font-size:17px}table{width:100%;min-width:760px;border-collapse:collapse}th,td{padding:12px;border-bottom:1px solid var(--reader-border);text-align:left;vertical-align:top}th{color:var(--reader-muted);font-size:13px}td p{max-width:420px;margin:6px 0 0;color:var(--reader-muted);line-height:1.6}.toast{position:relative;max-width:min(420px,calc(100vw - 48px));margin:0 0 18px auto;padding:14px 16px;border:1px solid var(--reader-border);border-radius:var(--reader-radius);background:var(--reader-ink);color:#fff;box-shadow:var(--reader-shadow)}.toast-error{background:var(--reader-danger)}.toast-success{background:#173f37}.modal-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:18px;background:#16203361}.modal{width:min(420px,100%);padding:22px;border-radius:var(--reader-radius);background:#fff;box-shadow:var(--reader-shadow)}.modal h2{margin:0 0 10px}.toggle-row{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:12px;border:1px solid var(--reader-border);border-radius:var(--reader-radius-sm)}.reader-night{--reader-bg: #151824;--reader-surface: #1d2233;--reader-surface-soft: #242a3d;--reader-ink: #eef2ff;--reader-muted: #aeb7d0;--reader-border: #343b55;background:var(--reader-bg)}.reader-night .global-header,.reader-night .surface,.reader-night .work-card,.reader-night .data-state,.reader-night .reader-toolbar,.reader-night .reader-paper,.reader-night .home-control-panel,.reader-night .detail-hero,.reader-night .account-chip,.reader-night .modal{background:var(--reader-surface)}.reader-night .home-hero{background:linear-gradient(135deg,#4f63d92e,#06a88e1a),var(--reader-surface)}.reader-night input,.reader-night select,.reader-night textarea,.reader-night .btn-ghost,.reader-night .tag-row span,.reader-night .chip,.reader-night .recommendation-list article,.reader-night .category-grid button,.reader-night .ad-list a{background:#151824;color:var(--reader-ink)}@keyframes loading-bar{0%,to{width:36px;opacity:.6}50%{width:86px;opacity:1}}@media(max-width:960px){.global-header{grid-template-columns:1fr}.main-nav{justify-content:start;overflow-x:auto;flex-wrap:nowrap}.layout-grid,.home-hero,.account-grid,.entry-grid,.editor-grid,.detail-hero{grid-template-columns:1fr}.filter-grid,.form-grid,.payment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.layout-grid{width:min(100% - 20px,1320px);padding-top:14px}.global-header{padding:10px 12px}.page-header,.surface-head,.reader-toolbar{align-items:start;flex-direction:column}.home-hero{min-height:auto;padding:24px}.home-hero h1{font-size:40px}.filter-grid,.form-grid,.form-grid-2,.split-row,.payment-grid,.settings-grid,.profile-editor,.work-card,.chapter-row,.record-row{grid-template-columns:1fr}.work-cover{width:min(140px,46vw)}.detail-cover{width:min(180px,60vw)}.reader-toolbar{position:static}.reader-paper{padding:24px 18px}.toast{max-width:none;margin:0 0 14px}}
