@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&display=swap";:root{--primary:#e8a0bf;--primary-light:#fce4ec;--secondary:#b4e4ff;--accent:#6c5b7b;--accent-dark:#4a3d5c;--bg:#f8f6f4;--surface:#fff;--text:#2d3436;--text-muted:#6b7280;--border:#cbd5e1;--border-light:#e2e8f0;--shadow-sm:0 1px 3px #0000000a;--shadow-md:0 4px 16px #0000000f;--shadow-lg:0 8px 32px #00000014;--radius:16px;--radius-sm:10px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:Outfit,sans-serif;overflow-x:hidden}h1,h2,h3,h4{font-family:Playfair Display,serif}#root{width:100%}.app-layout{border-radius:var(--radius);border:1px solid var(--border);grid-template-rows:auto 1fr;grid-template-columns:1fr 1fr;gap:0;height:850px;display:grid;overflow:hidden}.app-header{border-bottom:1px solid var(--border);background:var(--surface);grid-column:1/-1;justify-content:space-between;align-items:center;padding:16px 32px;display:flex}.app-header .logo{align-items:center;gap:12px;display:flex}.app-header .logo-icon{background:linear-gradient(135deg, var(--primary), var(--accent));color:#fff;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;display:flex;box-shadow:0 4px 12px #6c5b7b40}.app-header h1{color:var(--accent);font-size:1.4rem}.app-header .subtitle{color:var(--text-muted);letter-spacing:.05em;font-size:.75rem;font-weight:400}.editor-panel{border-right:1px solid var(--border);background:var(--surface);flex-direction:column;max-height:calc(100vh - 65px);display:flex;overflow-y:auto}.panel-tabs{border-bottom:1px solid var(--border);background:#faf9f7;display:flex}.panel-tab{text-align:center;color:var(--text-muted);cursor:pointer;text-transform:uppercase;letter-spacing:.08em;background:0 0;border:none;flex:1;justify-content:center;align-items:center;gap:6px;padding:12px 16px;font-family:Outfit,sans-serif;font-size:.8rem;font-weight:600;transition:all .2s;display:flex}.panel-tab.active{color:var(--accent);border-bottom:2px solid var(--primary);background:var(--surface)}.panel-tab:hover:not(.active){background:var(--border-light)}.panel-content{flex:1;padding:24px;overflow-y:auto}.section-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px;font-size:.7rem;font-weight:700}.title-input{border:none;border-bottom:2px solid var(--border);width:100%;color:var(--accent);background:0 0;outline:none;margin-bottom:20px;padding:8px 0;font-family:Playfair Display,serif;font-size:1.6rem;font-weight:700;transition:border-color .2s}.title-input:focus{border-color:var(--primary)}.title-input::placeholder{color:#ccc}.article-editor{border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;min-height:400px;color:var(--text);resize:vertical;background:#fdfcfb;outline:none;padding:20px;font-family:Outfit,sans-serif;font-size:.95rem;line-height:1.8;transition:border-color .2s}.article-editor:focus{border-color:var(--primary)}.article-editor::placeholder{color:#bbb}.editor-hint{color:var(--text-muted);background:var(--primary-light);border-radius:var(--radius-sm);margin-top:10px;padding:10px 14px;font-size:.72rem;line-height:1.6}.editor-hint code{background:#6c5b7b14;border-radius:4px;padding:1px 5px;font-size:.7rem;font-weight:600}.image-dropzone{border:2px dashed var(--border);border-radius:var(--radius);text-align:center;cursor:pointer;background:#fdfcfb;margin-bottom:20px;padding:40px;transition:all .3s}.image-dropzone:hover,.image-dropzone.drag-over{border-color:var(--primary);background:var(--primary-light)}.image-dropzone-icon{color:var(--primary);margin-bottom:12px}.image-dropzone p{color:var(--text-muted);margin-bottom:4px;font-size:.85rem}.image-dropzone .small{color:#bbb;font-size:.72rem}.image-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;display:grid}.image-thumb{aspect-ratio:1;border-radius:var(--radius-sm);border:2px solid var(--border-light);cursor:grab;background:#f5f3f0;transition:all .2s;position:relative;overflow:hidden}.image-thumb:hover{border-color:var(--primary);transform:scale(1.02)}.image-thumb img{object-fit:cover;width:100%;height:100%}.image-thumb .remove-btn{color:#fff;cursor:pointer;opacity:0;background:#0009;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:.7rem;transition:opacity .2s;display:flex;position:absolute;top:6px;right:6px}.image-thumb:hover .remove-btn{opacity:1}.preview-panel{background:#eae7e3;flex-direction:column;max-height:calc(100vh - 65px);display:flex;overflow-y:auto}.preview-toolbar{background:var(--surface);border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 24px;display:flex}.theme-selector{gap:8px;display:flex}.theme-btn{cursor:pointer;width:28px;height:28px;box-shadow:var(--shadow-sm);border:2px solid #0000;border-radius:50%;transition:all .2s}.theme-btn.active{border-color:var(--accent);box-shadow:var(--shadow-md);transform:scale(1.15)}.theme-btn:hover:not(.active){transform:scale(1.1)}.export-btn{background:linear-gradient(135deg, var(--accent), var(--accent-dark));color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:8px;padding:10px 24px;font-family:Outfit,sans-serif;font-size:.85rem;font-weight:600;transition:all .3s;display:flex;box-shadow:0 4px 15px #6c5b7b4d}.export-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px #6c5b7b66}.export-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.preview-area{flex:1;justify-content:center;align-items:flex-start;padding:32px;display:flex}.pdf-preview{width:595px;box-shadow:var(--shadow-lg);background:#fff;border-radius:4px}.settings-group{margin-bottom:24px}.settings-group label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:6px;font-size:.72rem;font-weight:700;display:block}.settings-input{border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text);background:#fdfcfb;outline:none;padding:10px 14px;font-family:Outfit,sans-serif;font-size:.88rem;transition:border-color .2s}.settings-input:focus{border-color:var(--primary)}.badge{text-transform:uppercase;letter-spacing:.06em;border-radius:20px;align-items:center;gap:4px;padding:3px 10px;font-size:.68rem;font-weight:600;display:inline-flex}.badge-pink{background:var(--primary-light);color:#c2185b}.badge-blue{color:#1565c0;background:#e3f2fd}.landing-page{background:var(--surface)}.container{max-width:1200px;margin:0 auto;padding:0 24px}.text-center{text-align:center}.bg-light{background:var(--bg);padding:60px 24px}.rounded-xl{border-radius:24px}.site-header{border-bottom:1px solid var(--border);background:var(--surface);z-index:100;padding:20px 0;position:sticky;top:0}.header-inner{justify-content:space-between;align-items:center;display:flex}.logo-brand{color:var(--accent);align-items:center;gap:10px;font-family:Playfair Display,serif;font-size:1.5rem;font-weight:700;display:flex}.high-end-tag{color:var(--primary);text-transform:uppercase;letter-spacing:.2em;margin-left:8px;font-family:Outfit,sans-serif;font-size:.7rem;font-weight:600}.site-nav{gap:30px;display:flex}.site-nav a{color:var(--text-muted);font-size:.95rem;font-weight:600;text-decoration:none;transition:color .2s}.site-nav a:hover{color:var(--primary)}.hero-section{background:linear-gradient(#fff5f9 0%,#fff 100%);padding:80px 0 60px}.hero-title{color:var(--accent);margin-bottom:20px;font-size:3.5rem;line-height:1.1}.hero-subtitle{color:var(--text-muted);max-width:800px;margin:0 auto;font-size:1.2rem;line-height:1.6}.tool-section{margin:40px auto 80px}.shadow-box{box-shadow:var(--shadow-lg), 0 20px 60px #0000001a}.content-section{padding:60px 0}.section-title{color:var(--accent);margin-bottom:50px;font-size:2.5rem}.grid-3{grid-template-columns:repeat(3,1fr);gap:40px;display:grid}.feature-card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border-light);box-shadow:var(--shadow-sm);padding:30px;transition:transform .3s,box-shadow .3s}.feature-card:hover{box-shadow:var(--shadow-md);transform:translateY(-5px)}.feature-icon{background:var(--primary-light);width:60px;height:60px;color:var(--primary);border-radius:16px;justify-content:center;align-items:center;margin-bottom:24px;display:flex}.feature-card h3{color:var(--accent);margin-bottom:15px;font-family:Outfit,sans-serif;font-size:1.3rem;font-weight:700}.feature-card p{color:var(--text-muted);font-size:.95rem;line-height:1.7}.faq-grid{grid-template-columns:1fr 1fr;gap:30px;max-width:1000px;margin:0 auto;display:grid}.faq-item{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:30px}.faq-item h3{color:var(--accent);margin-bottom:12px;font-family:Outfit,sans-serif;font-size:1.2rem;font-weight:700}.faq-item p{color:var(--text-muted);font-size:.95rem;line-height:1.7}.site-footer{background:var(--accent);margin-top:80px;padding:40px 0}.footer-inner{color:#fffc;justify-content:space-between;align-items:center;display:flex}.footer-brand{color:#fff;flex-direction:column;gap:8px;font-family:Playfair Display,serif;font-size:1.3rem;display:flex}.copyright{color:#fff9;font-family:Outfit,sans-serif;font-size:.8rem}.footer-links{gap:24px;display:flex}.footer-links a{color:#fffc;font-size:.9rem;text-decoration:none;transition:color .2s}.footer-links a:hover{color:#fff}@media (width<=900px){.container{padding:0 16px}.grid-3,.faq-grid{grid-template-columns:1fr;gap:24px}.hero-title{font-size:2.2rem}.hero-subtitle{padding:0 10px;font-size:1rem}.app-layout{border-left:none;border-right:none;border-radius:0;grid-template-rows:auto auto minmax(500px,1fr);grid-template-columns:1fr;height:auto}.header-inner{flex-direction:column;gap:16px;padding:16px 0}.site-nav{flex-wrap:wrap;justify-content:center;gap:16px}.app-header{flex-direction:column;align-items:flex-start;gap:16px;padding:20px}.panel-content{padding:16px}.editor-panel{border-right:none;border-bottom:1px solid var(--border)}.footer-inner{text-align:center;flex-direction:column;gap:24px}.footer-brand{align-items:center}.footer-links{flex-direction:column;gap:12px}}