.editor{height:100%;display:flex;flex-direction:column;background:#fff}.editor-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--primary-200, #e2e8f0)}.editor-title{font-size:14px;font-weight:600;color:var(--primary-800, #1e293b);letter-spacing:.02em}.editor-status{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--primary-500, #64748b)}.editor-status:before{content:"";width:6px;height:6px;background:var(--success, #10b981);border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.editor-meta{padding:16px 24px 0;display:flex;flex-direction:column;gap:12px;background:var(--primary-50, #f8fafc)}.meta-row{display:flex;gap:12px}.meta-input{flex:1;padding:12px 16px;border:1px solid var(--primary-200, #e2e8f0);border-radius:var(--radius-sm, 6px);font-size:14px;outline:none;background:#fff;transition:all .2s;color:var(--primary-800, #1e293b)}.meta-input::placeholder{color:var(--primary-400, #94a3b8)}.meta-input:focus{border-color:var(--accent-500, #f59e0b);box-shadow:0 0 0 3px #f59e0b14}.cover-input-wrapper{flex:1;display:flex;gap:8px}.btn-icon{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid var(--primary-200, #e2e8f0);border-radius:var(--radius-sm, 6px);background:#fff;cursor:pointer;transition:all .2s;font-size:18px}.btn-icon:hover{background:var(--primary-50, #f8fafc);border-color:var(--primary-300, #cbd5e1)}.btn-icon:active{background:var(--primary-100, #f1f5f9)}.btn-icon:disabled{opacity:.6;cursor:not-allowed}.editor-content{flex:1;padding:16px 24px 24px;background:var(--primary-50, #f8fafc);overflow:hidden;display:flex;flex-direction:column}.editor-textarea{flex:1;width:100%;padding:24px;border:1px solid var(--primary-200, #e2e8f0);border-radius:var(--radius-md, 10px);font-size:15px;line-height:1.8;font-family:JetBrains Mono,Fira Code,Consolas,Monaco,monospace;resize:none;outline:none;background:#fff;color:var(--primary-800, #1e293b);box-shadow:var(--shadow-sm, 0 1px 2px 0 rgb(0 0 0 / .03));transition:all .2s ease}.editor-textarea::placeholder{color:var(--primary-400, #94a3b8)}.editor-textarea:hover{border-color:var(--primary-300, #cbd5e1)}.editor-textarea:focus{border-color:var(--accent-500, #f59e0b);box-shadow:0 0 0 3px #f59e0b14}.editor-footer{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;border-top:1px solid var(--primary-100, #f1f5f9);font-size:12px;color:var(--primary-500, #64748b)}.editor-stats{display:flex;align-items:center;gap:16px}.stat-item{display:flex;align-items:center;gap:6px}.stat-value{font-weight:600;color:var(--primary-700, #334155)}.preview{height:100%;display:flex;flex-direction:column;background:#fff}.preview-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--primary-200, #e2e8f0)}.preview-title{font-size:14px;font-weight:600;color:var(--primary-800, #1e293b);letter-spacing:.02em}.preview-device-switcher{display:flex;align-items:center;background:var(--primary-100, #f1f5f9);border-radius:6px;padding:2px}.device-btn{padding:5px 14px;border:none;background:transparent;color:var(--primary-500, #64748b);font-size:12px;font-weight:500;border-radius:5px;cursor:pointer;transition:all .15s ease}.device-btn.active{background:#fff;color:var(--primary-800, #1e293b);box-shadow:var(--shadow-sm, 0 1px 2px 0 rgb(0 0 0 / .05))}.device-btn:hover:not(.active){color:var(--primary-700, #334155)}.preview-container{flex:1;background:var(--primary-100, #f1f5f9);padding:32px;overflow:hidden;display:flex;justify-content:center}.desktop-preview{width:100%;max-width:800px;height:100%;background:#fff;border-radius:12px;padding:40px;overflow-y:auto;box-shadow:0 4px 20px #00000014}.desktop-preview::-webkit-scrollbar{width:6px}.desktop-preview::-webkit-scrollbar-track{background:transparent}.desktop-preview::-webkit-scrollbar-thumb{background:#00000026;border-radius:3px}.phone-mockup{width:375px;height:687px;background:#1a1a1a;border-radius:36px;padding:10px;box-shadow:0 25px 50px -12px #00000040;position:relative;flex-shrink:0;overflow:hidden;box-sizing:border-box}.phone-notch{position:absolute;top:10px;left:50%;transform:translate(-50%);width:120px;height:24px;background:#1a1a1a;border-radius:0 0 12px 12px;z-index:10}.phone-screen{width:100%;height:667px;background:#fff;border-radius:26px;overflow:hidden;position:relative;display:flex;flex-direction:column}.wechat-header{background:#f5f5f5;padding:36px 16px 10px;text-align:center;border-bottom:.5px solid #e0e0e0;flex-shrink:0}.wechat-title{font-size:14px;font-weight:500;color:#000}.wechat-content{flex:1;overflow-y:auto;padding:20px;background:#fff;box-sizing:border-box;-webkit-overflow-scrolling:touch}.wechat-content::-webkit-scrollbar{width:4px}.wechat-content::-webkit-scrollbar-track{background:transparent}.wechat-content::-webkit-scrollbar-thumb{background:#00000026;border-radius:2px}.preview-content{font-size:16px;line-height:1.8;color:#333}.article-meta{margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid #e0e0e0}.article-title{font-size:22px;font-weight:600;color:#333;margin-bottom:14px;line-height:1.4}.article-info{display:flex;align-items:center;gap:10px;font-size:15px;color:#0000004d;margin-bottom:8px}.article-meta-secondary{font-size:14px;color:#0000004d;margin-bottom:16px}.article-author,.article-account{color:#576b95;font-weight:500;cursor:pointer}.article-cover{margin-top:16px;width:100%;border-radius:4px;overflow:hidden}.article-cover img{width:100%;height:auto;display:block}.template-default{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,sans-serif;padding:8px 4px}.template-default h1{font-size:26px;font-weight:700;margin-bottom:32px;color:#111;line-height:1.3;letter-spacing:-.02em}.template-default h2{font-size:18px;font-weight:600;margin:40px 0 16px;color:#222;padding-bottom:10px;border-bottom:1px solid #eee}.template-default h3{font-size:16px;font-weight:600;margin:28px 0 12px;color:#333}.template-default p{margin-bottom:20px;text-align:justify;color:#444;line-height:1.9}.template-default strong{color:#111;font-weight:700}.template-default img{max-width:100%;height:auto;border-radius:6px;margin:24px 0}.template-default blockquote{margin:28px 0;padding:20px 24px;color:#555;background:#fafafa;border-left:2px solid #ddd;font-style:italic}.template-default blockquote p:last-child{margin-bottom:0}.template-default code{background:#f5f5f5;padding:3px 8px;border-radius:4px;font-family:SF Mono,Monaco,monospace;font-size:14px;color:#d73a49}.template-default pre{background:#1a1a1a;padding:20px;border-radius:8px;overflow-x:auto;margin:24px 0}.template-default pre code{background:none;padding:0;color:#e6e6e6;font-size:13px;line-height:1.6}.template-default ul,.template-default ol{margin:20px 0;padding-left:28px}.template-default li{margin-bottom:10px;color:#444}.template-default a{color:#0366d6;text-decoration:none;border-bottom:1px solid transparent;transition:all .15s ease}.template-default a:hover{border-bottom-color:#0366d6}.template-default hr{border:none;height:1px;background:linear-gradient(90deg,transparent,#e0e0e0,transparent);margin:40px 0}.template-business{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,sans-serif;padding:12px}.template-business h1{font-size:24px;font-weight:700;color:#0c4a6e;margin-bottom:24px;padding-bottom:16px;border-bottom:3px solid #0ea5e9;line-height:1.3}.template-business h2{font-size:18px;font-weight:700;color:#075985;margin:32px 0 14px;padding-left:12px;border-left:4px solid #38bdf8}.template-business h3{font-size:15px;font-weight:700;color:#0369a1;margin:24px 0 10px}.template-business p{line-height:1.85;color:#334155;margin-bottom:16px;text-align:justify}.template-business strong{color:#0c4a6e;font-weight:700}.template-business img{max-width:100%;height:auto;border-radius:8px;margin:20px 0;box-shadow:0 4px 12px #0ea5e926}} .template-business blockquote{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border-left:4px solid #0ea5e9;padding:20px;margin:24px 0;border-radius:0 12px 12px 0;color:#0c4a6e}.template-business blockquote p{color:#075985;margin-bottom:0}.template-business code{background:#e0f2fe;color:#0369a1;padding:3px 8px;border-radius:4px;font-family:SF Mono,Monaco,monospace;font-size:13px}.template-business pre{background:#0c4a6e;padding:20px;border-radius:10px;overflow-x:auto;margin:20px 0}.template-business pre code{background:none;color:#e0f2fe;padding:0}.template-business ul,.template-business ol{margin:16px 0;padding-left:24px}.template-business li{margin-bottom:8px;color:#334155}.template-business li::marker{color:#0ea5e9}.template-business a{color:#0284c7;text-decoration:none;font-weight:500;border-bottom:1px solid #bae6fd;transition:all .15s ease}.template-business a:hover{color:#0ea5e9;border-bottom-color:#0ea5e9}.template-tech{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,sans-serif;padding:8px}.template-tech h1{font-size:28px;font-weight:800;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:24px;line-height:1.2;letter-spacing:-.02em}.template-tech h2{font-size:19px;font-weight:700;color:#5b21b6;margin:32px 0 14px;position:relative;padding-left:16px}.template-tech h2:before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:4px;background:linear-gradient(180deg,#8b5cf6,#a855f7);border-radius:2px}.template-tech h3{font-size:16px;font-weight:600;color:#7c3aed;margin:24px 0 10px}.template-tech p{line-height:1.85;color:#4b5563;margin-bottom:18px}.template-tech strong{color:#5b21b6;font-weight:700}.template-tech img{max-width:100%;height:auto;border-radius:12px;margin:24px 0;box-shadow:0 8px 30px #8b5cf633}.template-tech blockquote{background:linear-gradient(135deg,#ede9fe,#f5f3ff);border:1px solid #ddd6fe;padding:24px;margin:28px 0;border-radius:12px;position:relative;color:#5b21b6}.template-tech blockquote:before{content:'"';position:absolute;top:8px;left:16px;font-size:48px;color:#c4b5fd;font-family:Georgia,serif;line-height:1}.template-tech blockquote p{color:#6d28d9;position:relative;z-index:1;margin-bottom:0}.template-tech code{background:#ede9fe;color:#7c3aed;padding:3px 8px;border-radius:6px;font-family:SF Mono,Monaco,monospace;font-size:13px}.template-tech pre{background:linear-gradient(135deg,#1e1b4b,#312e81);padding:24px;border-radius:12px;overflow-x:auto;margin:24px 0;box-shadow:0 4px 20px #4c1d954d}.template-tech pre code{background:none;color:#e0e7ff;padding:0;font-size:13px;line-height:1.6}.template-tech ul,.template-tech ol{margin:18px 0;padding-left:24px}.template-tech li{margin-bottom:10px;color:#4b5563}.template-tech li::marker{color:#8b5cf6}.template-tech a{color:#7c3aed;text-decoration:none;font-weight:500;border-bottom:2px solid #ddd6fe;transition:all .15s ease}.template-tech a:hover{color:#6d28d9;border-bottom-color:#8b5cf6}.template-tech hr{border:none;height:2px;background:linear-gradient(90deg,transparent,#ddd6fe,transparent);margin:36px 0}.template-literary{font-family:Georgia,Times New Roman,serif;padding:8px}.template-literary h1{font-size:32px;font-weight:700;color:#1a1a1a;text-align:center;margin-bottom:8px;line-height:1.2;letter-spacing:-.02em}.template-literary h1:after{content:none}.template-literary h2{font-size:20px;font-weight:600;color:#333;margin:36px 0 16px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;letter-spacing:.05em}.template-literary h3{font-size:16px;font-weight:600;color:#444;margin:28px 0 12px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.template-literary p{line-height:2;color:#333;margin-bottom:20px;text-align:justify;text-indent:2em}.template-literary h1+p,.template-literary h2+p,.template-literary h3+p{text-indent:0}.template-literary h1+p:first-letter,.template-literary h2+p:first-letter{font-size:3em;float:left;line-height:1;margin-right:8px;margin-top:4px;font-weight:700;color:#1a1a1a}.template-literary strong{color:#000;font-weight:700}.template-literary img{max-width:100%;height:auto;margin:32px 0;display:block;border-radius:6px}.template-literary blockquote{margin:36px 24px;border-left:none;border-top:1px solid #ddd;border-bottom:1px solid #ddd;color:#555;font-style:italic;text-align:center;padding:24px}.template-literary blockquote p{text-indent:0;margin-bottom:0;font-size:18px;line-height:1.8}.template-literary code{background:#f0f0f0;padding:2px 6px;border-radius:3px;font-family:SF Mono,Monaco,monospace;font-size:13px;color:#666}.template-literary pre{background:#fafafa;border:1px solid #eee;padding:20px;border-radius:8px;overflow-x:auto;margin:24px 0}.template-literary pre code{background:none;padding:0}.template-literary ul,.template-literary ol{margin:20px 0;padding-left:28px}.template-literary li{margin-bottom:10px;color:#333}.template-literary a{color:#333;text-decoration:none;border-bottom:1px solid #999;transition:all .15s ease}.template-literary a:hover{color:#000;border-bottom-color:#000}.template-literary hr{border:none;height:1px;background:#ddd;margin:40px 0;position:relative}.template-literary hr:before{content:"§";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#fff;padding:0 16px;color:#999;font-size:18px}.template-dark{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,sans-serif;padding:12px;background:#0a0a0a;color:#e5e5e5;margin:-20px;min-height:100%}.template-dark h1{font-size:26px;font-weight:700;color:#fafafa;margin-bottom:28px;line-height:1.3;letter-spacing:-.01em}.template-dark h2{font-size:18px;font-weight:600;color:#e5e5e5;margin:36px 0 16px;padding-bottom:10px;border-bottom:1px solid #333}.template-dark h3{font-size:15px;font-weight:600;color:#d4d4d4;margin:28px 0 12px}.template-dark p{line-height:1.85;color:#a3a3a3;margin-bottom:18px;text-align:justify}.template-dark strong{color:#f5f5f5;font-weight:600}.template-dark img{max-width:100%;height:auto;border-radius:8px;margin:24px 0;opacity:.9}.template-dark blockquote{background:linear-gradient(135deg,#171717,#262626);border-left:3px solid #525252;padding:20px 24px;margin:28px 0;border-radius:0 10px 10px 0;color:#d4d4d4}.template-dark blockquote p{color:#a3a3a3;margin-bottom:0}.template-dark code{background:#262626;color:#f97316;padding:3px 8px;border-radius:4px;font-family:SF Mono,Monaco,monospace;font-size:13px}.template-dark pre{background:#171717;border:1px solid #333;padding:20px;border-radius:10px;overflow-x:auto;margin:24px 0}.template-dark pre code{background:none;color:#d4d4d4;padding:0;font-size:13px}.template-dark ul,.template-dark ol{margin:18px 0;padding-left:24px}.template-dark li{margin-bottom:10px;color:#a3a3a3}.template-dark li::marker{color:#525252}.template-dark a{color:#60a5fa;text-decoration:none;border-bottom:1px solid transparent;transition:all .15s ease}.template-dark a:hover{color:#93c5fd;border-bottom-color:#60a5fa}.template-dark hr{border:none;height:1px;background:linear-gradient(90deg,transparent,#333,transparent);margin:40px 0}.template-oriental{font-family:PingFang SC,"Noto Serif SC",Microsoft YaHei,serif;padding:12px}.template-oriental h1{font-size:28px;font-weight:600;color:#451a03;text-align:center;margin-bottom:32px;line-height:1.4;letter-spacing:.15em;position:relative;padding-bottom:20px}.template-oriental h1:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:60px;height:3px;background:linear-gradient(90deg,transparent,#92400e,transparent)}.template-oriental h2{font-size:18px;font-weight:600;color:#78350f;margin:36px 0 16px;padding-left:16px;border-left:3px solid #b45309;letter-spacing:.1em}.template-oriental h3{font-size:16px;font-weight:600;color:#92400e;margin:28px 0 12px;letter-spacing:.05em}.template-oriental p{line-height:2;color:#44403c;margin-bottom:20px;text-align:justify;text-indent:2em}.template-oriental h1+p,.template-oriental h2+p,.template-oriental h3+p{text-indent:0}.template-oriental strong{color:#451a03;font-weight:600}.template-oriental img{max-width:100%;height:auto;border-radius:6px;margin:28px 0;box-shadow:0 4px 20px #92400e1a}} .template-oriental blockquote{background:linear-gradient(135deg,#fffbeb,#fef3c7);border:1px solid #fde68a;padding:24px;margin:28px 0;border-radius:8px;color:#78350f;position:relative}.template-oriental blockquote:before{content:"「";position:absolute;top:8px;left:12px;font-size:24px;color:#d97706;opacity:.5}.template-oriental blockquote:after{content:"」";position:absolute;bottom:8px;right:12px;font-size:24px;color:#d97706;opacity:.5}.template-oriental blockquote p{color:#92400e;text-indent:0;margin-bottom:0}.template-oriental code{background:#fffbeb;color:#b45309;padding:3px 8px;border-radius:4px;font-family:SF Mono,Monaco,monospace;font-size:13px;border:1px solid #fde68a}.template-oriental pre{background:#292524;padding:20px;border-radius:8px;overflow-x:auto;margin:24px 0}.template-oriental pre code{background:none;color:#e7e5e4;padding:0;border:none}.template-oriental ul,.template-oriental ol{margin:20px 0;padding-left:28px}.template-oriental li{margin-bottom:10px;color:#44403c}.template-oriental li::marker{color:#b45309}.template-oriental a{color:#b45309;text-decoration:none;border-bottom:1px dashed #d97706;transition:all .15s ease}.template-oriental a:hover{color:#92400e;border-bottom-style:solid}.template-oriental hr{border:none;height:1px;background:linear-gradient(90deg,transparent,#d6d3d1,transparent);margin:40px 0;position:relative}.template-oriental hr:before{content:"◆";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#fff;padding:0 12px;color:#d97706;font-size:12px}.template-ai{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,sans-serif;padding:16px;background:linear-gradient(180deg,#fafafa,#fff)}.template-ai h1{font-size:26px;font-weight:800;background:linear-gradient(135deg,#0891b2,#06b6d4,#f59e0b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px;line-height:1.3;letter-spacing:-.02em}.template-ai h1+p{font-size:15px;color:#64748b;margin-bottom:28px;padding-bottom:20px;border-bottom:2px solid #e2e8f0}.template-ai h2{font-size:18px;font-weight:700;color:#0e7490;margin:36px 0 16px;display:flex;align-items:center;gap:10px}.template-ai h2:before{content:"";width:4px;height:20px;background:linear-gradient(180deg,#06b6d4,#f59e0b);border-radius:2px}.template-ai h3{font-size:15px;font-weight:700;color:#155e75;margin:28px 0 12px;padding-left:12px;border-left:3px solid #cbd5e1}.template-ai p{line-height:1.9;color:#334155;margin-bottom:18px;text-align:justify}.template-ai strong{color:#b45309;font-weight:700;background:linear-gradient(180deg,transparent 60%,rgba(245,158,11,.2) 60%);padding:0 2px}.template-ai img{max-width:100%;height:auto;border-radius:12px;margin:24px 0;box-shadow:0 4px 20px #06b6d426;border:1px solid #e2e8f0}.template-ai blockquote{background:linear-gradient(135deg,#ecfeff,#f0fdfa);border:1px solid #99f6e4;border-left:4px solid #06b6d4;padding:20px 24px;margin:28px 0;border-radius:0 12px 12px 0;position:relative}.template-ai blockquote:before{content:"AI";position:absolute;top:-10px;left:16px;background:#06b6d4;color:#fff;font-size:10px;font-weight:800;padding:3px 10px;border-radius:20px;letter-spacing:.1em}.template-ai blockquote p{color:#0e7490;margin-bottom:0;margin-top:8px}.template-ai code{background:#ecfeff;color:#0891b2;padding:3px 8px;border-radius:4px;font-family:SF Mono,JetBrains Mono,monospace;font-size:13px;border:1px solid #cffafe}.template-ai pre{background:linear-gradient(135deg,#0f172a,#1e293b);padding:24px;border-radius:12px;overflow-x:auto;margin:24px 0;position:relative;box-shadow:0 8px 30px #0f172a4d}.template-ai pre:before{content:"";position:absolute;top:12px;left:16px;width:40px;height:10px;background:radial-gradient(circle at 5px 50%,#ff5f56 0%,#ff5f56 4px,transparent 5px),radial-gradient(circle at 15px 50%,#ffbd2e 0%,#ffbd2e 4px,transparent 5px),radial-gradient(circle at 25px 50%,#27ca40 0%,#27ca40 4px,transparent 5px)}.template-ai pre code{background:none;color:#e2e8f0;padding:0;border:none;font-size:13px;line-height:1.6}.template-ai ul,.template-ai ol{margin:18px 0;padding-left:24px}.template-ai li{margin-bottom:10px;color:#334155;line-height:1.8}.template-ai li::marker{color:#06b6d4}.template-ai a{color:#0891b2;text-decoration:none;font-weight:600;border-bottom:2px solid #cffafe;transition:all .15s ease}.template-ai a:hover{color:#f59e0b;border-bottom-color:#fde68a}.template-ai hr{border:none;height:2px;background:linear-gradient(90deg,transparent,#06b6d4,#f59e0b,transparent);margin:40px 0;position:relative}.template-ai table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px}.template-ai th{background:linear-gradient(135deg,#06b6d4,#0891b2);color:#fff;padding:12px 16px;text-align:left;font-weight:600}.template-ai td{padding:12px 16px;border-bottom:1px solid #e2e8f0;color:#334155}.template-ai tr:nth-child(2n){background:#f8fafc}.template-ai .highlight-box{background:linear-gradient(135deg,#fffbeb,#fef3c7);border-left:4px solid #f59e0b;padding:16px 20px;margin:20px 0;border-radius:0 10px 10px 0}.template-ai .highlight-box strong{color:#b45309;background:none}.template-selector{height:100%;display:flex;flex-direction:column;overflow-y:auto}.sidebar-header{padding:24px;background:var(--primary-900, #0f172a);color:#fff}.sidebar-title{font-size:15px;font-weight:600;letter-spacing:.02em}.sidebar-subtitle{font-size:12px;color:var(--primary-500, #64748b);margin-top:4px}.sidebar-content{flex:1;padding:24px}.section-title{font-size:12px;font-weight:600;color:var(--primary-800, #1e293b);text-transform:uppercase;letter-spacing:.08em}.section-badge{font-size:11px;font-weight:500;color:var(--primary-500, #64748b);background:var(--primary-100, #f1f5f9);padding:3px 8px;border-radius:20px}.template-list{display:flex;flex-direction:column;gap:10px;margin-bottom:32px}.template-card{position:relative;padding:14px;border:1px solid var(--primary-200, #e2e8f0);border-radius:var(--radius-md, 10px);cursor:pointer;transition:all .2s ease;background:#fff}.template-card:hover{border-color:var(--primary-300, #cbd5e1);box-shadow:var(--shadow-sm, 0 1px 2px 0 rgb(0 0 0 / .03))}.template-card.active{border-color:var(--accent-500, #f59e0b);background:var(--accent-50, #fffbeb)}.template-card.active:before{content:"";position:absolute;left:-1px;top:0;bottom:0;width:3px;background:var(--accent-500, #f59e0b);border-radius:var(--radius-md, 10px) 0 0 var(--radius-md, 10px)}.template-preview{width:100%;height:48px;border-radius:6px;margin-bottom:10px}.template-preview-ai{background:linear-gradient(135deg,#06b6d4,#f59e0b)}.template-preview-default{background:linear-gradient(135deg,#f8fafc,#e2e8f0)}.template-preview-business{background:linear-gradient(135deg,#0f172a,#1e293b)}.template-preview-tech{background:linear-gradient(135deg,#4f46e5,#6366f1)}.template-preview-literary{background:linear-gradient(135deg,#fef3c7,#fde68a)}.template-preview-dark{background:linear-gradient(135deg,#0a0a0a,#262626);border:1px solid #333}.template-preview-oriental{background:linear-gradient(135deg,#fffbeb,#fef3c7);border:1px solid #fde68a}.template-info{display:flex;flex-direction:column;gap:2px}.template-name{font-size:13px;font-weight:600;color:var(--primary-800, #1e293b)}.template-card.active .template-name{color:var(--accent-700, #b45309)}.template-desc{font-size:11px;color:var(--primary-500, #64748b);line-height:1.4}.help-section{margin-top:24px;padding:18px;background:var(--primary-50, #f8fafc);border-radius:var(--radius-md, 10px)}.help-title{font-size:12px;font-weight:600;color:var(--primary-700, #334155);margin-bottom:10px;text-transform:uppercase;letter-spacing:.05em}.help-list{list-style:none;padding:0;margin:0}.help-list li{position:relative;padding-left:14px;margin-bottom:8px;font-size:12px;color:var(--primary-600, #475569);line-height:1.5}.help-list li:before{content:"";position:absolute;left:0;top:8px;width:4px;height:4px;background:var(--primary-400, #94a3b8);border-radius:50%}.help-list li:last-child{margin-bottom:0}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px}.login-box{width:100%;max-width:400px;background:#fff;border-radius:16px;padding:40px;box-shadow:0 25px 50px -12px #00000040}.login-logo{width:56px;height:56px;background:linear-gradient(135deg,#06b6d4,#f59e0b);border-radius:12px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center}.login-logo:before{content:"";width:24px;height:24px;border:2px solid #fff;border-radius:4px}.login-title{font-size:22px;font-weight:700;color:#1e293b;text-align:center;margin-bottom:4px}.login-subtitle{font-size:14px;color:#64748b;text-align:center;margin-bottom:32px}.login-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:13px;font-weight:600;color:#374151}.form-group input{padding:12px 16px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;transition:all .2s ease}.form-group input:focus{outline:none;border-color:#06b6d4;box-shadow:0 0 0 3px #06b6d41a}.form-group input::placeholder{color:#9ca3af}.login-error{padding:12px 16px;background:#fef2f2;color:#dc2626;border-radius:8px;font-size:13px}.login-btn{padding:14px;background:linear-gradient(135deg,#06b6d4,#0891b2);color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:8px}.login-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #06b6d44d}.login-btn:disabled{opacity:.7;cursor:not-allowed}.login-hint{margin-top:24px;padding-top:24px;border-top:1px solid #f3f4f6;font-size:13px;color:#9ca3af;text-align:center}.account-manager-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.account-manager{width:100%;max-width:600px;max-height:80vh;background:#fff;border-radius:16px;box-shadow:0 25px 50px -12px #00000040;display:flex;flex-direction:column;overflow:hidden}.account-manager-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,#f8fafc,#fff)}.account-manager-header h2{font-size:18px;font-weight:700;color:#1e293b}.account-manager-content{flex:1;overflow-y:auto;padding:24px}.list-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.list-header h3{font-size:14px;font-weight:600;color:#374151}.btn-add{padding:8px 16px;background:linear-gradient(135deg,#06b6d4,#0891b2);color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-add:hover{transform:translateY(-1px);box-shadow:0 4px 12px #06b6d44d}.empty-state{text-align:center;padding:48px 24px;color:#9ca3af}.empty-state .hint{font-size:13px}.account-items{display:flex;flex-direction:column;gap:12px}.account-item{display:flex;align-items:center;justify-content:space-between;padding:16px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;transition:all .2s ease}.account-item:hover{border-color:#cbd5e1;box-shadow:0 2px 8px #0000000a}.account-info{flex:1}.account-name{font-size:15px;font-weight:600;color:#1e293b;margin-bottom:6px}.account-appid{font-size:12px;color:#64748b;display:flex;align-items:center;gap:8px;margin-bottom:4px}.copy-btn{padding:2px 8px;background:#e2e8f0;border:none;border-radius:4px;font-size:11px;color:#475569;cursor:pointer;transition:all .15s ease}.copy-btn:hover{background:#cbd5e1}.account-date{font-size:11px;color:#94a3b8}.btn-delete{padding:8px 16px;background:transparent;border:1px solid #fecaca;color:#dc2626;border-radius:8px;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease}.add-account-form{margin-top:24px;padding-top:24px;border-top:1px solid #e5e7eb}.add-account-form h4{font-size:14px;font-weight:600;color:#374151;margin-bottom:16px}.add-account-form .form-group{margin-bottom:16px}.add-account-form label{display:block;font-size:13px;font-weight:600;color:#374151;margin-bottom:6px}.add-account-form input{width:100%;padding:12px 16px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;transition:all .2s ease}.add-account-form input:focus{outline:none;border-color:#06b6d4;box-shadow:0 0 0 3px #06b6d41a}.btn-secondary{padding:10px 20px;background:#f3f4f6;border:none;border-radius:8px;font-size:13px;font-weight:600;color:#4b5563;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{background:#e5e7eb}.btn-primary{padding:10px 20px;background:linear-gradient(135deg,#06b6d4,#0891b2);border:none;border-radius:8px;font-size:13px;font-weight:600;color:#fff;cursor:pointer;transition:all .2s ease}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #06b6d44d}.btn-primary:disabled{opacity:.7;cursor:not-allowed}.admin-panel-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.admin-panel{width:100%;max-width:700px;max-height:80vh;background:#fff;border-radius:16px;box-shadow:0 25px 50px -12px #00000040;display:flex;flex-direction:column;overflow:hidden;position:relative}.admin-panel-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,#0f172a,#1e293b)}.admin-panel-header h2{font-size:18px;font-weight:700;color:#fff}.close-btn:hover{background:#ffffff1a;color:#fff}.admin-panel-content{flex:1;overflow-y:auto;padding:24px}.message.success{background:#f0fdf4;color:#16a34a}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-header h3{font-size:14px;font-weight:600;color:#374151}.btn-add{padding:8px 16px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-add:hover{transform:translateY(-1px);box-shadow:0 4px 12px #f59e0b4d}.users-table-wrapper{border:1px solid #e5e7eb;border-radius:12px;overflow:hidden}.users-table{width:100%;border-collapse:collapse;font-size:13px}.users-table th{background:#f8fafc;padding:12px 16px;text-align:left;font-weight:600;color:#374151;border-bottom:1px solid #e5e7eb}.users-table td{padding:14px 16px;border-bottom:1px solid #f1f5f9;color:#4b5563}.users-table tr:last-child td{border-bottom:none}.users-table tr:hover{background:#f8fafc}.users-table tr.current-user{background:#f0f9ff}.username{font-weight:600;color:#1e293b}.badge{display:inline-block;padding:2px 8px;background:#06b6d4;color:#fff;font-size:10px;font-weight:600;border-radius:20px;margin-left:8px}.role-badge{display:inline-block;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:600}.role-badge.admin{background:#fef3c7;color:#b45309}.role-badge.member{background:#f3f4f6;color:#4b5563}.empty-state{text-align:center;padding:48px 24px;color:#9ca3af;border:1px dashed #e5e7eb;border-radius:12px}.add-user-form{margin-top:24px;padding-top:24px;border-top:1px solid #e5e7eb}.add-user-form h4{font-size:14px;font-weight:600;color:#374151;margin-bottom:16px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.add-user-form .form-group{margin-bottom:0}.add-user-form label{display:block;font-size:12px;font-weight:600;color:#374151;margin-bottom:6px}.add-user-form input,.add-user-form select{width:100%;padding:10px 14px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;transition:all .2s ease}.add-user-form input:focus,.add-user-form select:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b1a}.password-group{grid-column:1}.password-input-wrapper{display:flex;gap:8px}.password-input-wrapper input{flex:1}.btn-generate{padding:10px 14px;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:8px;font-size:12px;font-weight:500;color:#4b5563;cursor:pointer;white-space:nowrap;transition:all .2s ease}.btn-generate:hover{background:#e5e7eb}.form-hint{padding:12px;background:#f0f9ff;border-radius:8px;margin-bottom:16px}.form-hint p{font-size:12px;color:#0369a1}.form-actions{display:flex;gap:12px;justify-content:flex-end}.modal-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#fffffff2;display:flex;align-items:center;justify-content:center;z-index:10;border-radius:16px}.modal{width:100%;max-width:400px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 10px 25px -5px #0000001a;padding:24px}.modal h3{font-size:16px;font-weight:700;color:#1e293b;margin-bottom:20px;text-align:center}.btn-text{background:none;border:none;color:#0ea5e9;font-size:12px;font-weight:500;cursor:pointer;margin-left:8px;padding:2px 6px;border-radius:4px;transition:all .15s}.btn-text:hover{background:#f0f9ff;color:#0284c7}.modal .form-group{margin-bottom:16px}.modal label{display:block;font-size:12px;font-weight:600;color:#374151;margin-bottom:6px}.modal input{width:100%;padding:10px 14px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;transition:all .2s ease}.modal input:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b1a}.btn-secondary{padding:8px 16px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;font-size:13px;font-weight:500;color:#4b5563;cursor:pointer}.btn-primary{padding:8px 16px;background:linear-gradient(135deg,#f59e0b,#d97706);border:none;border-radius:8px;font-size:13px;font-weight:600;color:#fff;cursor:pointer}.draft-list-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.draft-list{width:100%;max-width:800px;max-height:80vh;background:#fff;border-radius:16px;box-shadow:0 25px 50px -12px #00000040;display:flex;flex-direction:column;overflow:hidden}.draft-list-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,#f8fafc,#fff)}.draft-list-header h2{font-size:18px;font-weight:700;color:#1e293b}.close-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;background:transparent;color:#94a3b8;font-size:24px;cursor:pointer;border-radius:8px;transition:all .15s ease}.close-btn:hover{background:#f1f5f9;color:#64748b}.draft-list-content{flex:1;overflow-y:auto;padding:24px}.message{padding:12px 16px;border-radius:8px;font-size:13px;margin-bottom:16px}.message.error{background:#fef2f2;color:#dc2626}.account-filter{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid #e5e7eb}.account-filter label{font-size:14px;font-weight:500;color:#374151}.account-filter select{padding:8px 16px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;background:#fff;cursor:pointer;outline:none;transition:all .2s ease}.account-filter select:focus{border-color:#06b6d4;box-shadow:0 0 0 3px #06b6d41a}.draft-count{font-size:13px;color:#64748b;margin-left:auto}.draft-items{display:flex;flex-direction:column;gap:12px}.draft-item{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;transition:all .2s ease}.draft-item:hover{border-color:#cbd5e1;box-shadow:0 2px 8px #0000000a}.draft-info{flex:1;min-width:0}.draft-title{font-size:15px;font-weight:600;color:#1e293b;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.draft-meta{display:flex;gap:16px;font-size:12px;color:#64748b}.draft-author{color:#475569}.draft-time{color:#94a3b8}.draft-actions{display:flex;gap:8px;margin-left:16px}.btn-open{padding:8px 16px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;font-size:13px;font-weight:500;color:#374151;cursor:pointer;transition:all .2s ease}.btn-open:hover{background:#f9fafb;border-color:#d1d5db}.btn-delete{padding:8px 16px;background:transparent;border:1px solid #fecaca;border-radius:8px;font-size:13px;font-weight:500;color:#dc2626;cursor:pointer;transition:all .2s ease}.btn-delete:hover{background:#fef2f2;border-color:#dc2626}.empty-state{text-align:center;padding:64px 24px;color:#9ca3af;border:1px dashed #e5e7eb;border-radius:12px}.empty-state p{margin-bottom:8px}.empty-state .hint{font-size:13px;color:#cbd5e1}.loading{text-align:center;padding:48px;color:#9ca3af;font-size:14px}:root{--primary-900: #0f172a;--primary-800: #1e293b;--primary-700: #334155;--primary-600: #475569;--primary-500: #64748b;--primary-400: #94a3b8;--primary-300: #cbd5e1;--primary-200: #e2e8f0;--primary-100: #f1f5f9;--primary-50: #f8fafc;--accent-600: #d97706;--accent-500: #f59e0b;--accent-400: #fbbf24;--success: #10b981;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .03);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .05), 0 2px 4px -2px rgb(0 0 0 / .05);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .05), 0 4px 6px -4px rgb(0 0 0 / .05);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:var(--primary-100);color:var(--primary-800);-webkit-font-smoothing:antialiased}.app{height:100vh;display:flex;flex-direction:column;overflow:hidden}.header{height:64px;background:var(--primary-900);display:flex;align-items:center;justify-content:space-between;padding:0 32px;box-shadow:var(--shadow-md)}.header-brand{display:flex;align-items:center;gap:16px}.header-logo{width:36px;height:36px;background:var(--accent-500);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;position:relative}.header-logo:before{content:"";width:16px;height:16px;border:2px solid #fff;border-radius:2px}.header-title-group{display:flex;flex-direction:column;gap:2px}.header h1{font-size:18px;font-weight:600;color:#fff;letter-spacing:.02em}.header-subtitle{font-size:11px;color:var(--primary-500);font-weight:500;letter-spacing:.1em;text-transform:uppercase}.header-actions{display:flex;align-items:center;gap:12px}.account-select{padding:8px 12px;border:1px solid var(--primary-700);border-radius:var(--radius-sm);background:var(--primary-800);color:#fff;font-size:13px;cursor:pointer;outline:none}.account-select:focus{border-color:var(--accent-500)}.user-menu{display:flex;align-items:center;gap:12px;margin-left:16px;padding-left:16px;border-left:1px solid var(--primary-700)}.user-name{font-size:13px;color:var(--primary-300)}.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border:none;border-radius:var(--radius-sm);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-primary{background:var(--accent-500);color:#fff}.btn-primary:hover{background:var(--accent-600);transform:translateY(-1px);box-shadow:0 4px 12px #f59e0b4d}.btn-copy{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:10px 20px;border:none;border-radius:var(--radius-sm);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-copy:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #10b9814d}.btn-copy:disabled{opacity:.7;cursor:not-allowed}.btn-secondary{background:transparent;color:var(--primary-400);border:1px solid var(--primary-700);padding:10px 20px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{background:#ffffff0d;color:var(--primary-200);border-color:var(--primary-600)}.admin-btn{background:linear-gradient(135deg,#f59e0b1a,#f59e0b0d)!important;border-color:#f59e0b4d!important;color:#fbbf24!important}.admin-btn:hover{background:linear-gradient(135deg,#f59e0b33,#f59e0b1a)!important;border-color:#f59e0b80!important}.container{flex:1;display:flex;overflow:hidden;padding:20px;gap:20px}.sidebar{width:280px;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);overflow-y:auto;display:flex;flex-direction:column}.main-content{flex:1;display:flex;gap:20px;overflow:hidden}.editor-panel,.preview-panel{flex:1;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);overflow:hidden;display:flex;flex-direction:column}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--primary-300);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--primary-400)}.notification-bar{padding:14px 32px;font-size:14px;font-weight:500;text-align:center;color:#fff;animation:slideDown .3s ease-out}.notification-success{background:linear-gradient(135deg,#10b981,#059669)}.notification-error{background:linear-gradient(135deg,#ef4444,#dc2626)}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.loading{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--primary-100);color:var(--primary-600);font-size:14px}