:root{--page-max-width:1120px;--content-max-width:800px;--reading-max-width:760px;--page-gutter:24px;--page-gutter-mobile:20px;--section-space:72px;--section-space-mobile:48px;--surface-base:#fff;--surface-subtle:hsla(0,0%,100%,.88);--surface-soft:#f8fafc;--surface-muted:#eef2ff;--border-subtle:#e2e8f0;--border-strong:#c7d2fe;--radius-sm:8px;--radius-md:10px;--radius-lg:12px;--radius-xl:16px;--shadow-sm:0 1px 3px rgba(15,23,42,.05);--shadow-md:0 12px 32px rgba(15,23,42,.08);--shadow-lg:0 20px 48px rgba(15,23,42,.12);--ring:0 0 0 4px rgba(79,70,229,.14)}.create-page{margin:0 auto;max-width:var(--page-max-width);padding:0 var(--page-gutter) 64px}@media(max-width:640px){.create-page{padding:0 var(--page-gutter-mobile) 40px}}.create-page__header{padding:36px 0 28px;text-align:center}.create-page__eyebrow{align-items:center;background:#ffffffd1;border:1px solid rgba(165,180,252,.74);border-radius:999px;box-shadow:var(--shadow-sm);color:#4338ca;display:inline-flex;font-size:.8125rem;font-weight:700;justify-content:center;margin-bottom:16px;padding:8px 14px}.create-page__title{color:#0f172a;font-size:clamp(1.85rem,1.35rem + 1.2vw,2.4rem);font-weight:800;letter-spacing:-.04em;margin-bottom:12px;text-wrap:balance}.create-page__desc{color:#475569;font-size:1.0625rem;line-height:1.5;margin:0 auto;max-width:680px}.create-page__workflow{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;list-style:none;margin:22px auto 0;max-width:760px;padding:0}.create-page__workflow-item{align-items:center;background:#ffffffd6;border:1px solid rgba(226,232,240,.95);border-radius:999px;color:#334155;display:inline-flex;font-size:.875rem;font-weight:600;gap:8px;padding:10px 14px}.create-page__workflow-item:before{align-items:center;background:linear-gradient(135deg,#6366f1,#4338ca);border-radius:50%;color:#fff;content:"";display:inline-flex;font-size:.75rem;font-weight:700;height:22px;justify-content:center;width:22px}.create-page__workflow-item--one:before{content:"1"}.create-page__workflow-item--two:before{content:"2"}.create-page__workflow-item--three:before{content:"3"}.create-page__details{border-top:1px solid rgba(226,232,240,.95);margin:56px auto 0;max-width:var(--content-max-width);padding:40px 36px 0}@media(max-width:640px){.create-page__details{padding:32px 0 0}}.create-page__details h2{color:#0f172a;font-size:24px;font-weight:800;margin-bottom:1em}.create-page__details h3{color:#1e293b;font-size:18px;font-weight:700;margin-bottom:1.5em;margin-top:28px}.create-page__details p{color:#475569;font-size:16px;line-height:1.5;margin-bottom:1.5em}.create-page__details ul{margin:10px 0;padding-left:24px}.create-page__details li{color:#475569;font-size:15px;line-height:1.5;margin-bottom:6px}.generator{align-items:start;display:grid;gap:24px;grid-template-columns:300px 1fr}@media(max-width:1024px){.generator{grid-template-columns:1fr}}.generator__sidebar{display:flex;flex-direction:column;gap:16px;position:sticky;top:80px}@media(max-width:1024px){.generator__sidebar{position:static}}.generator__main{min-width:0}.generator--skeleton{pointer-events:none}.generator__skeleton-card{background:#fffffff0;border:1px solid rgba(226,232,240,.92);border-radius:var(--radius-lg);padding:20px}.generator__skeleton-card--large{min-height:360px}.generator__skeleton-line,.generator__skeleton-pill,.generator__skeleton-tile{animation:generator-skeleton 1.25s ease-in-out infinite;background:linear-gradient(90deg,#e2e8f0d1 25%,#f1f5f9f5,#e2e8f0d1 75%);background-size:200% 100%}.generator__skeleton-line{border-radius:999px;height:14px;margin-bottom:12px}.generator__skeleton-line--title{height:16px;width:48%}.generator__skeleton-line--short{margin-bottom:0;width:62%}.generator__skeleton-grid{display:grid;gap:10px;grid-template-columns:repeat(2,1fr);margin-top:16px}.generator__skeleton-tile{aspect-ratio:8.5/11;border-radius:12px}.generator__skeleton-pill-row{display:flex;gap:10px;margin-bottom:24px}.generator__skeleton-pill{border-radius:999px;height:40px;width:140px}.generator__skeleton-note{color:#64748b;font-size:.875rem;font-weight:600;margin-top:12px}@keyframes generator-skeleton{to{background-position:-200% 0}}.generator__mode-toggle{background:#ffffffb3;border:1px solid rgba(226,232,240,.9);border-radius:var(--radius-md);display:flex;gap:4px;margin-bottom:20px;padding:8px}.generator__mode-btn{background:transparent;border:none;border-radius:100px;color:#64748b;cursor:pointer;flex:1;font-size:13px;font-weight:600;padding:1em 2em;transition:all .15s}.generator__mode-btn.is-active{background:#4338ca;color:#fff}.export-actions__btn:focus-visible,.generator__error button:focus-visible,.generator__mode-btn:focus-visible,.signature-pad__btn:focus-visible,.signature-pad__toggle:focus-visible,.template-selector__item:focus-visible,.tiptap-editor__btn:focus-visible{box-shadow:0 0 0 3px #6366f129;outline:none}.generator__preview-section{margin:24px 0}.generator__panel-loading{background:#fffffff0;border:1px solid rgba(226,232,240,.92);border-radius:var(--radius-lg);color:#475569;font-size:.9375rem;font-weight:600;padding:28px}.generator__preview-title{color:#1e293b;font-size:17px;font-weight:700;margin-bottom:14px}.generator__empty{background:#ffffffe6;border:1px dashed #c7d2fe;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:80px 32px;text-align:center}.generator__empty-icon{color:#cbd5e1;margin-bottom:16px}.generator__empty-title{color:#1e293b;font-size:18px;font-weight:700;margin-bottom:10px}.generator__empty-desc{color:#64748b;font-size:.9375rem;line-height:1.5;margin:0 auto;max-width:400px}.generator__empty-tip{color:#4338ca;font-size:.875rem;font-weight:600;margin-top:16px}.font-selector,.type-selector{background:#ffffffeb;border:1px solid rgba(226,232,240,.92);border-radius:var(--radius-md);padding:18px}.font-selector__title,.type-selector__title{color:#334155;font-size:13px;font-weight:700;margin-bottom:10px}.font-selector__select,.type-selector__select{background:#fff;border:1px solid #e2e8f0;border-radius:10px;color:#1e293b;cursor:pointer;font-size:14px;padding:10px 12px;width:100%}.font-selector__select:focus,.type-selector__select:focus{border-color:#818cf8;box-shadow:0 0 0 3px #6366f11a;outline:none}.template-selector{background:#ffffffeb;border:1px solid rgba(226,232,240,.92);border-radius:var(--radius-md);padding:18px}.template-selector__title{color:#334155;font-size:13px;font-weight:700;margin-bottom:12px}.template-selector__grid{display:grid;gap:10px;grid-template-columns:repeat(2,1fr)}.template-selector__item{background:#f8fafc;border:2px solid transparent;border-radius:10px;cursor:pointer;padding:10px;text-align:center;transition:all .15s}.template-selector__item:hover{border-color:#cbd5e1}.template-selector__item.is-active{background:#eef2ff;border-color:#6366f1}.template-selector__preview{aspect-ratio:8.5/11;background:#fff;border:1px solid #e2e8f0;border-radius:6px;display:flex;flex-direction:column;gap:4px;margin-bottom:8px;padding:8px;width:100%}.template-selector__preview-line{background:#e2e8f0;border-radius:1px;height:3px}.template-selector__preview-line--title{background:#cbd5e1;height:5px;margin-bottom:4px;width:60%}.template-selector__preview-line--short{width:40%}.template-selector__name{color:#475569;font-size:11px;font-weight:600}.form-panel{background:#fffffff0;border:1px solid rgba(226,232,240,.92);border-radius:var(--radius-lg);padding:28px}.form-panel__title{color:#1e293b;font-size:17px;font-weight:700;margin-bottom:8px}.form-panel__help{color:#64748b;font-size:.875rem;margin-bottom:16px}.form-panel__alert{background:#fef3c7d9;border:1px solid rgba(252,211,77,.75);border-radius:12px;color:#78350f;font-size:.875rem;font-weight:600;margin-bottom:20px;padding:12px 14px}.form-panel__section{border:none;margin:0 0 28px;padding:0}.form-panel__section:last-child{margin-bottom:0}.form-panel__legend{border-bottom:1px solid #e0e7ff;color:#4f46e5;display:block;font-size:12px;font-weight:700;letter-spacing:.06em;margin-bottom:14px;padding-bottom:.5em;text-transform:uppercase;width:100%}.form-panel__fields{display:grid;gap:16px;grid-template-columns:1fr 1fr}@media(max-width:640px){.form-panel__fields{grid-template-columns:1fr}}.form-panel__field{grid-column:span 2}@media(max-width:640px){.form-panel__field{grid-column:span 1}}.form-panel__field--half{grid-column:span 1}.form-panel__label{color:#334155;display:block;font-size:13px;font-weight:600;margin-bottom:6px}.form-panel__required{color:#ef4444;margin-left:2px}.form-panel__input{background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-sizing:border-box;color:#1e293b;font-family:inherit;font-size:14px;padding:10px 14px;transition:border-color .15s,box-shadow .15s;width:100%}.form-panel__input::-moz-placeholder{color:#94a3b8}.form-panel__input::placeholder{color:#94a3b8}.form-panel__input:focus{border-color:#818cf8;box-shadow:0 0 0 3px #6366f11a;outline:none}.form-panel__input[aria-invalid=true]{background:#fef2f2b3;border-color:#ef4444a6}.form-panel__textarea{min-height:80px;resize:vertical}.form-panel__select{cursor:pointer}.form-panel__error{color:#dc2626;font-size:.8125rem;font-weight:600;margin-top:6px}.letter-preview__wrapper{background:linear-gradient(180deg,#e0e7ffbf,#e2e8f0e0);border:1px solid rgba(199,210,254,.72);border-radius:var(--radius-lg);box-shadow:inset 0 1px #fffc;max-height:78vh;overflow:auto;padding:24px 20px;scrollbar-gutter:stable both-edges}@media(max-width:640px){.letter-preview__wrapper{padding:12px}}.letter-preview{background:#fff;border:1px solid rgba(148,163,184,.22);box-shadow:0 16px 36px #0f172a24;color:#1a1a1a;margin:0 auto;min-height:297mm;overflow:hidden;position:relative;width:min(100%,210mm)}.letter-preview__separator{border:none;border-top:1px solid #333;margin:0 0 18px}.letter-preview__body p{margin:0}.letter-preview__body>*{margin:0 0 var(--letter-preview-paragraph-spacing,16px)}.letter-preview__body>:last-child{margin-bottom:0}.letter-preview__body{width:100%}.letter-preview__richtext>*{margin:0 0 var(--letter-preview-paragraph-spacing,16px)}.letter-preview__richtext>:last-child{margin-bottom:0}.letter-preview__richtext blockquote,.letter-preview__richtext li,.letter-preview__richtext p{line-height:inherit}.letter-preview__richtext h1,.letter-preview__richtext h2,.letter-preview__richtext h3{line-height:1.25;margin:0 0 .75em;text-wrap:pretty}.letter-preview__richtext h1{font-size:1.5em}.letter-preview__richtext h2{font-size:1.3em}.letter-preview__richtext h3{font-size:1.15em}.letter-preview__body ol,.letter-preview__body ul,.letter-preview__richtext ol,.letter-preview__richtext ul{list-style-position:outside;margin:0 0 var(--letter-preview-paragraph-spacing,16px);padding-inline-start:1.6em}.letter-preview__body ul,.letter-preview__richtext ul{list-style-type:disc}.letter-preview__body ol,.letter-preview__richtext ol{list-style-type:decimal}.letter-preview__body li+li{margin-top:6px}.letter-preview__richtext li>p{display:inline}.letter-preview__richtext blockquote{border-left:3px solid rgba(99,102,241,.35);color:#334155;margin:0 0 var(--letter-preview-paragraph-spacing,16px);padding-left:1em}.letter-preview__richtext hr{border:none;border-top:1px solid rgba(51,65,85,.35);margin:1.2em 0}.letter-preview__richtext em{font-style:italic}.letter-preview__richtext u{text-decoration:underline}.letter-preview__richtext s{text-decoration:line-through}.letter-preview__signature{align-items:flex-start;display:inline-flex;flex-direction:column;gap:8px;margin-top:16px;padding-top:4px}.letter-preview__signature-img{display:block;max-height:80px;max-width:200px;pointer-events:auto}.letter-preview__signature:after{border-bottom:1px solid rgba(51,65,85,.45);content:"";max-width:100%;width:220px}.letter-preview--centered .letter-preview__separator{margin-inline:auto;margin-bottom:20px;width:68%}.letter-preview--letterhead{border-top:6px solid rgba(79,70,229,.82)}.letter-preview--letterhead .letter-preview__separator{border-top-color:#4f46e5a6}.letter-preview--bordered{border:2px solid rgba(51,65,85,.24)}.letter-preview--bordered .letter-preview__separator{border-top-width:2px}.letter-preview--legal{border:1px solid rgba(71,85,105,.34)}.letter-preview--legal .letter-preview__separator{border-top-color:#4755698c;border-top-style:dashed}.letter-preview--minimal .letter-preview__separator{display:none}.signature-pad{background:#fffffff0;border:1px solid rgba(226,232,240,.92);border-radius:var(--radius-lg);margin:20px 0;padding:22px}.signature-pad__header{align-items:center;display:flex;justify-content:space-between}.signature-pad__title{color:#1e293b;font-size:15px;font-weight:700}.signature-pad__toggle{background:#eef2ff;border:1px solid #c7d2fe;border-radius:8px;color:#4f46e5;cursor:pointer;font-size:13px;font-weight:600;padding:6px 14px}.signature-pad__toggle:hover{background:#e0e7ff}.signature-pad__body{margin-top:16px}.signature-pad__canvas-wrap{border:2px dashed #cbd5e1;border-radius:14px;overflow:hidden;position:relative}.signature-pad__canvas{cursor:crosshair;display:block;height:160px;touch-action:none;width:100%}.signature-pad__hint{bottom:8px;color:#94a3b8;font-size:12px;left:50%;pointer-events:none;position:absolute;transform:translate(-50%)}.signature-pad__actions{display:flex;gap:8px;margin-top:12px}.signature-pad__btn{border:none;border-radius:8px;cursor:pointer;font-size:13px;font-weight:600;padding:8px 18px;transition:background .15s}.signature-pad__btn--primary{background:#4f46e5;color:#fff}.signature-pad__btn--primary:hover{background:#4338ca}.signature-pad__btn--secondary{background:#f1f5f9;color:#475569}.signature-pad__btn--secondary:hover{background:#e2e8f0}.signature-pad__status{color:#16a34a;font-size:13px;font-weight:500;margin-top:10px}.export-actions{align-items:center;display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}@media(max-width:480px){.export-actions{flex-direction:column}}.export-actions__btn{align-items:center;border:none;border-radius:14px;cursor:pointer;display:inline-flex;flex:1;font-size:14px;font-weight:600;gap:8px;justify-content:center;padding:12px 28px;transition:all .15s}.export-actions__btn:active{transform:scale(.98)}.export-actions__btn:disabled{cursor:wait;opacity:.6}.export-actions__btn--primary{background:linear-gradient(135deg,#4f46e5,#4338ca);box-shadow:0 14px 26px #4f46e533;color:#fff}.export-actions__btn--primary:hover:not(:disabled){transform:translateY(-1px)}.export-actions__btn--secondary{background:#ffffffeb;border:1px solid rgba(226,232,240,.94);color:#334155}.export-actions__btn--secondary:hover{background:#f8fafc;border-color:#cbd5e1}.export-actions__status{color:#475569;flex-basis:100%;font-size:.875rem;font-weight:600}.export-actions__hint{color:#64748b;flex-basis:100%;font-size:.8125rem;margin:-2px 0 0}.export-actions__status--success{color:#047857}.export-actions__status--warning{color:#92400e}.export-actions__status--error{color:#dc2626}.export-actions__spinner{animation:spin .6s linear infinite;border:2px solid hsla(0,0%,100%,.3);border-radius:50%;border-top-color:#fff;height:16px;width:16px}@keyframes spin{to{transform:rotate(1turn)}}.tips-panel{background:linear-gradient(135deg,#fffbeb,#fff);border:1px solid #fde68a;border-radius:14px;padding:18px}.tips-panel__title{color:#92400e;font-size:13px;font-weight:700;margin-bottom:10px}.tips-panel__list{list-style:none;margin:0;padding:0}.tips-panel__item{color:#b45309;font-size:13px;line-height:1.55;padding:5px 0 5px 18px;position:relative}.tips-panel__item:before{background:#fbbf24;border-radius:50%;content:"";height:6px;left:0;position:absolute;top:11px;width:6px}.tiptap-editor{background:#fffffff0;border:1px solid rgba(226,232,240,.92);border-radius:var(--radius-lg)}.tiptap-editor__toolbar{background:#f8fafc;border-bottom:1px solid #e2e8f0;display:flex;flex-wrap:wrap;gap:8px;padding:10px 14px}.tiptap-editor__toolbar-group{border-right:1px solid rgba(203,213,225,.9);display:flex;flex-wrap:wrap;gap:6px;margin-right:2px;padding-right:8px}.tiptap-editor__toolbar-group:last-child{border-right:none;margin-right:0;padding-right:0}.tiptap-editor__btn{background:transparent;border:1px solid transparent;border-radius:8px;color:#475569;cursor:pointer;font-size:13px;font-weight:700;min-width:42px;padding:7px 12px}.tiptap-editor__btn:hover{background:#e2e8f0}.tiptap-editor__btn.is-active{background:#e0e7ff;border-color:#c7d2fe;color:#4338ca}.tiptap-editor__btn:disabled{cursor:not-allowed;opacity:.45}.tiptap-editor__content{min-height:360px;padding:24px 24px 28px 30px}.tiptap-editor__content .tiptap-editor__prosemirror{color:#1e293b;font-size:15px;line-height:1.65;min-height:300px;outline:none}.tiptap-editor__content .tiptap-editor__prosemirror p{margin:0 0 10px}.tiptap-editor__content .tiptap-editor__prosemirror h1,.tiptap-editor__content .tiptap-editor__prosemirror h2,.tiptap-editor__content .tiptap-editor__prosemirror h3{color:#0f172a;line-height:1.25;margin:0 0 .8em}.tiptap-editor__content .tiptap-editor__prosemirror h1{font-size:1.7rem}.tiptap-editor__content .tiptap-editor__prosemirror h2{font-size:1.35rem}.tiptap-editor__content .tiptap-editor__prosemirror h3{font-size:1.15rem}.tiptap-editor__content .tiptap-editor__prosemirror ol,.tiptap-editor__content .tiptap-editor__prosemirror ul{list-style-position:outside;margin:0 0 1em;padding-inline-start:1.6em}.tiptap-editor__content .tiptap-editor__prosemirror ul{list-style-type:disc}.tiptap-editor__content .tiptap-editor__prosemirror ol{list-style-type:decimal}.tiptap-editor__content .tiptap-editor__prosemirror li+li{margin-top:.35em}.tiptap-editor__content .tiptap-editor__prosemirror li>p{display:inline;margin:0}.tiptap-editor__content .tiptap-editor__prosemirror blockquote{border-left:3px solid #c7d2fe;color:#475569;margin:0 0 1em;padding-left:1em}.tiptap-editor__content .tiptap-editor__prosemirror hr{border:none;border-top:1px solid #cbd5e1;margin:1.2em 0}.tiptap-editor__content .tiptap-editor__prosemirror em{font-style:italic}.tiptap-editor__content .tiptap-editor__prosemirror u{text-decoration:underline}.tiptap-editor__content .tiptap-editor__prosemirror s{text-decoration:line-through}@media print{.letter-preview__wrapper{background:transparent;border:none;box-shadow:none;max-height:none;overflow:visible;padding:0}.letter-preview{border:none;box-shadow:none;margin:0;min-height:297mm;width:210mm}}@media(prefers-reduced-motion:reduce){.generator__skeleton-line,.generator__skeleton-pill,.generator__skeleton-tile{animation:none}}.generator__error{margin:40px auto;max-width:480px;padding:60px 24px;text-align:center}.generator__error h3{color:#0f172a;font-size:1.25rem;font-weight:700;margin-bottom:12px}.generator__error p{color:#64748b;font-size:.9375rem;line-height:1.4;margin-bottom:24px}.generator__error button{background:#4f46e5;border:none;border-radius:10px;color:#fff;cursor:pointer;font-size:.875rem;font-weight:600;padding:10px 24px;transition:background .15s}.generator__error button:hover{background:#4338ca}