@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@500;600;700&display=swap";:root{--bg-app: #fbf8f3;--bg-panel: #ffffff;--text-main: #111111;--text-muted: #888888;--border: #e6e6e6;--input-bg: #ffffff;--input-border: #e6e6e6;--input-text: #111111;--input-placeholder: #a1a1a1;--primary: #111111;--primary-hover: #333333;--radius-pill: 20px;--radius-card: 20px;--container-width: 680px;--shadow-soft: 0 10px 40px -10px rgba(0, 0, 0, .06);--trans-fast: .2s cubic-bezier(.2, .8, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,sans-serif;background-color:var(--bg-app);color:var(--text-main);line-height:1.5;transition:background-color var(--trans-fast),color var(--trans-fast);display:flex;justify-content:center;padding-top:60px;padding-bottom:60px;min-height:100vh}#root{width:100%;max-width:var(--container-width);display:flex;justify-content:center}h1,h2,h3,h4,button,input{font-family:Inter,sans-serif}.fade-up{opacity:0;transform:translateY(15px);animation:fadeUp .5s cubic-bezier(.2,.8,.2,1) forwards}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}.app-container{width:100%;max-width:var(--container-width);padding:0 20px}.app-header{text-align:center;margin-bottom:40px}.app-header h2{font-size:1.8rem;line-height:1.2;font-weight:700;margin-bottom:8px;letter-spacing:-.04em;color:var(--text-main)}.subtitle{color:var(--text-muted);font-size:1rem}.main-stack{display:flex;flex-direction:column;gap:30px;width:100%}.input-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media(max-width:600px){.input-grid{grid-template-columns:1fr}.theme-label{display:none}.preview-mode-btn{padding:8px 10px;font-size:12px}.preview-controls{gap:4px;justify-content:space-between}}.input-wrapper{position:relative;width:100%}.input-wrapper.full-width{grid-column:1 / -1}input[type=text],input[type=tel],input[type=email],input[type=url]{width:100%;padding:14px 20px;border-radius:var(--radius-pill);border:1px solid transparent;background-color:var(--input-bg);box-shadow:0 2px 6px #00000005;color:var(--input-text);font-size:1rem;outline:none;transition:all var(--trans-fast)}input::placeholder{color:var(--input-placeholder)}input:focus{box-shadow:0 0 0 2px var(--text-main)}.preview-section{position:relative;width:100%}.preview-controls{display:flex;align-items:center;gap:8px;margin-bottom:12px}.preview-mode-btn{padding:8px 16px;border-radius:12px;border:1px solid var(--border);background-color:var(--bg-panel);color:var(--text-muted);font-size:13px;font-weight:500;cursor:pointer;transition:all var(--trans-fast)}.preview-mode-btn:hover{background-color:#f5f5f5}.preview-mode-btn.active{background-color:var(--primary);color:#fff;border-color:var(--primary)}.preview-container{background-color:#fff;color:#111;border-radius:var(--radius-card);box-shadow:var(--shadow-soft);padding:32px;min-height:200px;width:100%}.preview-container.dark{background-color:#1a1a1a;color:#fff}.demo-email-header{border-bottom:1px solid #e6e6e6;padding-bottom:16px;margin-bottom:20px}.preview-container.dark .demo-email-header{border-color:#333}.demo-email-row{display:flex;gap:8px;margin-bottom:8px;font-size:13px}.demo-email-row:last-child{margin-bottom:0}.demo-email-label{color:#888;min-width:50px}.preview-container.dark .demo-email-label{color:#aaa}.demo-email-body{font-size:14px;line-height:1.6;margin-bottom:24px}.demo-email-body p{margin-bottom:16px}.demo-email-body p.last{margin-bottom:0}.demo-signature-divider{border-top:1px solid #e6e6e6;padding-top:20px;margin-top:8px}.preview-container.dark .demo-signature-divider{border-color:#333}.theme-toggle-wrapper{position:relative}.actions-section{display:flex;gap:16px;margin-top:10px}.btn{flex:1;padding:16px;border-radius:var(--radius-pill);font-size:1rem;font-weight:600;cursor:pointer;text-align:center;transition:transform .1s,background-color .2s;border:none}.primary-btn{background-color:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center}.primary-btn.copied{background-color:#22c55e;cursor:default}.primary-btn:active:not(.copied){transform:scale(.98)}.secondary-btn{color:var(--text-main);border:1px solid var(--border);background-color:var(--bg-panel);box-shadow:0 2px 6px #00000005}.secondary-btn:hover{background-color:#f7f7f7}.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:var(--bg-panel);width:90%;max-width:500px;border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow-soft)}.modal-header{padding:20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}.modal-header h3{color:var(--text-main)}.close-modal-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-main)}.modal-body{padding:24px;max-height:60vh;overflow-y:auto}.faq-list{display:flex;flex-direction:column;gap:8px}.faq-item{border:1px solid var(--border);border-radius:12px;overflow:hidden}.faq-question{width:100%;padding:14px 16px;background:var(--bg-panel);border:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;text-align:left;font-size:14px;font-weight:500;color:var(--text-main);transition:background-color var(--trans-fast)}.faq-question:hover{background-color:#f5f5f5}.faq-answer{padding:0 16px 14px;font-size:13px;color:var(--text-muted);line-height:1.6}