:root{--bg: #17161a;--bg-raised: #1f1e23;--bg-input: #131215;--border: #302e36;--border-strong: #413e49;--text: #eae7f0;--text-dim: #a29daf;--text-faint: #6f6a7b;--accent: #c98a63;--accent-dim: #8a5c40;--danger: #d97b6c;--ok: #7fae86;--radius: 10px;--panel-width: 420px;color-scheme:dark;font-family:Inter,Noto Sans SC,PingFang SC,Microsoft YaHei,system-ui,sans-serif;font-synthesis:none;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-size:14px;line-height:1.6;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--border-strong);background:var(--bg-raised);border-radius:8px;padding:7px 13px;transition:border-color .15s,background .15s,color .15s}button:hover:not(:disabled){border-color:var(--accent-dim)}button:disabled{opacity:.42;cursor:not-allowed}button:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.primary{background:var(--accent);border-color:var(--accent);color:#23180f;font-weight:600}button.primary:hover:not(:disabled){background:#d99b74}button.ghost{background:transparent;border-color:transparent;color:var(--text-dim);padding:6px 9px}button.ghost:hover:not(:disabled){color:var(--text);background:var(--bg-raised)}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;align-items:center;gap:14px;padding:0 18px;height:54px;border-bottom:1px solid var(--border);background:var(--bg-raised);flex:none}.brand{display:flex;align-items:baseline;gap:8px;font-weight:600;letter-spacing:.3px}.brand .cn{font-family:LXGW WenKai Screen,serif;color:var(--accent);font-size:15px}.brand .slogan{color:var(--text-faint);font-size:12px;font-weight:400;margin-left:4px}.topbar .spacer{flex:1}.save-status{font-size:12px;color:var(--text-faint);display:flex;align-items:center;gap:6px}.save-status .dot{width:6px;height:6px;border-radius:50%;background:var(--text-faint)}.save-status.saved .dot{background:var(--ok)}.save-status.saving .dot{background:var(--accent)}.save-status.error .dot{background:var(--danger)}.main{flex:1;display:flex;min-height:0}.panel{width:var(--panel-width);flex:none;border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:0;background:var(--bg)}.tabs{display:flex;gap:2px;padding:10px 12px 0;border-bottom:1px solid var(--border);flex:none}.tabs button{border:none;background:transparent;border-radius:8px 8px 0 0;color:var(--text-dim);padding:8px 14px;border-bottom:2px solid transparent}.tabs button[aria-selected=true]{color:var(--text);border-bottom-color:var(--accent)}.panel-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:16px;min-height:0}.field-label{font-size:12px;color:var(--text-dim);margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;gap:8px}textarea{width:100%;min-height:260px;flex:1;resize:none;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);padding:14px;font-family:LXGW WenKai Screen,Noto Sans SC,system-ui,sans-serif;font-size:14.5px;line-height:1.85}textarea::placeholder{color:var(--text-faint)}.meta-row{display:flex;gap:14px;font-size:12px;color:var(--text-faint);flex-wrap:wrap}.meta-row strong{color:var(--text-dim);font-weight:500}.button-row,.chip-group{display:flex;gap:8px;flex-wrap:wrap}.chip{padding:7px 12px;border-radius:999px;border:1px solid var(--border-strong);background:transparent;color:var(--text-dim);font-size:13px}.chip[aria-pressed=true]{border-color:var(--accent);color:var(--accent);background:#c98a631a}.theme-card{display:flex;gap:12px;align-items:flex-start;text-align:left;padding:12px;border-radius:var(--radius);width:100%}.theme-card[aria-pressed=true]{border-color:var(--accent)}.theme-card .swatch{width:42px;height:54px;border-radius:5px;flex:none;border:1px solid rgba(0,0,0,.25);display:flex;align-items:flex-end;padding:5px}.theme-card .swatch span{display:block;width:60%;height:3px;border-radius:2px}.theme-card .name{font-size:13.5px;color:var(--text)}.theme-card .desc{font-size:12px;color:var(--text-faint);line-height:1.5;margin-top:3px}.block-list{display:flex;flex-direction:column;gap:6px}.block-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--bg-raised);font-size:12.5px}.block-row .type{flex:none;color:var(--accent);font-size:11px;min-width:32px}.block-row .snippet{flex:1;color:var(--text-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.block-row button{flex:none;font-size:11.5px;padding:4px 9px}.block-row button[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}.preview{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0;background:#0f0e11}.preview-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:26px;min-height:0;overflow:auto}.card-frame{box-shadow:0 18px 50px #00000080;border-radius:4px;overflow:hidden;background:#fff;transition:width .18s,height .18s}.card-frame svg{display:block;width:100%;height:100%}.empty-state{text-align:center;color:var(--text-faint);max-width:340px;line-height:1.8}.empty-state h2{font-family:LXGW WenKai Screen,serif;color:var(--text-dim);font-weight:400;font-size:19px;margin:0 0 10px}.preview-bar{flex:none;border-top:1px solid var(--border);background:var(--bg-raised);padding:10px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.page-nav{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text-dim)}.thumbs{display:flex;gap:6px;overflow-x:auto;max-width:260px;padding-bottom:2px}.thumb{flex:none;width:34px;border-radius:3px;border:1px solid var(--border-strong);overflow:hidden;background:#fff;padding:0;line-height:0}.thumb[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.thumb svg{width:100%;height:100%;display:block}.warnings{padding:10px 16px;border-top:1px solid var(--border);background:#d97b6c14;font-size:12.5px;color:#e8b3a8;display:flex;flex-direction:column;gap:4px;flex:none;max-height:108px;overflow-y:auto}.warnings .blocking{color:var(--danger);font-weight:500}.perf{font-size:11.5px;color:var(--text-faint);font-variant-numeric:tabular-nums}.mobile-tabs{display:none}.topbar-status{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--accent);margin-right:14px}.spinner{width:11px;height:11px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;display:inline-block;animation:spin .7s linear infinite;vertical-align:-1px}@keyframes spin{to{transform:rotate(360deg)}}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mode-card{display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;padding:10px 12px}.mode-card[aria-pressed=true]{border-color:var(--accent);background:#c98a631a}.mode-name{font-size:13.5px;color:var(--text)}.mode-card[aria-pressed=true] .mode-name{color:var(--accent)}.mode-goal{font-size:11.5px;color:var(--text-faint);line-height:1.45}.error-notice{border-color:var(--danger);border-style:solid;color:#e8b3a8;background:#d97b6c14}.ai-report{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-raised);padding:12px;display:flex;flex-direction:column;gap:9px}.ai-report-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:13px}.ai-report-row{display:flex;flex-wrap:wrap;gap:6px}.ok-chip,.warn-chip,.prov-chip{font-size:11px;padding:3px 8px;border-radius:999px;border:1px solid var(--border-strong);color:var(--text-dim);white-space:nowrap}.ok-chip{border-color:#7fae8680;color:var(--ok)}.warn-chip{border-color:#d97b6c99;color:var(--danger)}.prov-source{border-color:#7fae8659}.prov-ai_new{border-color:#c98a6399;color:var(--accent)}.prov-ai_rewrite{border-color:var(--border-strong)}.ai-warnings{margin:0;padding-left:18px;font-size:12.5px;color:#e8b3a8;line-height:1.65;display:flex;flex-direction:column;gap:4px}.ai-note{font-size:12.5px;color:var(--text-faint)}.version-list{display:flex;flex-direction:column;gap:6px}.version-row{display:flex;align-items:center;border:1px solid var(--border);border-radius:8px;background:var(--bg-raised);overflow:hidden}.version-row.active{border-color:var(--accent)}.version-main{flex:1;min-width:0;display:flex;align-items:center;gap:8px;border:none;border-radius:0;background:transparent;padding:9px 10px;font-size:12.5px;text-align:left}.version-kind{flex:none;font-size:10.5px;padding:2px 6px;border-radius:4px;border:1px solid var(--border-strong);color:var(--text-faint)}.kind-source{border-color:#7fae8680;color:var(--ok)}.kind-ai{border-color:#c98a6399;color:var(--accent)}.version-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}.version-edited{flex:none;font-size:10.5px;color:var(--text-faint)}.version-time{flex:none;font-size:11px;color:var(--text-faint);font-variant-numeric:tabular-nums}.version-actions{display:flex;flex:none;padding-right:4px}.version-actions button{font-size:11.5px;padding:4px 7px}.diff-view{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-input);overflow:hidden}.diff-legend{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--border);flex-wrap:wrap}.diff-chip{font-size:11px;padding:2px 8px;border-radius:999px}.diff-chip.removed{background:#d97b6c29;color:#e8b3a8}.diff-chip.added{background:#7fae8629;color:#a9cfae}.diff-body{padding:12px;max-height:260px;overflow-y:auto;font-size:13px;line-height:1.85;white-space:pre-wrap;word-break:break-word;color:var(--text-dim)}.diff-added{background:#7fae8633;color:#cfe6d2;border-radius:2px}.diff-removed{background:#d97b6c2e;color:#e8b3a8;text-decoration:line-through;border-radius:2px}.block-row .prov{flex:none;font-size:10px;padding:1px 5px;border-radius:3px;border:1px solid var(--border-strong);color:var(--text-faint)}.block-row .prov.prov-ai_new{border-color:#c98a6399;color:var(--accent)}.notice{font-size:12px;color:var(--text-faint);line-height:1.65;padding:10px 12px;border:1px dashed var(--border-strong);border-radius:8px}@media(max-width:900px){.main{position:relative}.panel{width:100%;border-right:none}.panel,.preview{display:none}.panel.mobile-active,.preview.mobile-active{display:flex}.mobile-tabs{display:flex;flex:none;border-top:1px solid var(--border);background:var(--bg-raised)}.mobile-tabs button{flex:1;border:none;border-radius:0;background:transparent;color:var(--text-dim);padding:12px 0}.mobile-tabs button[aria-selected=true]{color:var(--accent)}.brand .slogan{display:none}.thumbs{max-width:120px}}