:root{--bg: oklch(95% .006 65);--surface: oklch(99% .003 65);--surface-2: oklch(93% .009 65);--border: oklch(86% .01 65);--border-subtle: oklch(90% .007 65);--text: oklch(17% .01 65);--text-2: oklch(45% .009 65);--text-3: oklch(62% .007 65);--accent: oklch(44% .17 235);--accent-hover: oklch(38% .17 235);--accent-text: oklch(99% .003 235);--accent-subtle: oklch(95% .06 235);--success: oklch(52% .14 145);--success-subtle: oklch(95% .05 145);--error: oklch(50% .18 25);--error-subtle: oklch(96% .05 25);--radius: 7px;--radius-sm: 4px;--font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-mono: "JetBrains Mono", "Cascadia Code", "Fira Code", monospace;--paper-bg: oklch(99.5% .002 65);--paper-text: #1a1814;--paper-subtext: #5a5650;--paper-border: oklch(84% .01 65)}:root[data-theme=dark]{--bg: oklch(13% .007 65);--surface: oklch(17% .009 65);--surface-2: oklch(22% .01 65);--border: oklch(30% .011 65);--border-subtle: oklch(25% .009 65);--text: oklch(92% .005 65);--text-2: oklch(60% .007 65);--text-3: oklch(40% .006 65);--accent: oklch(64% .16 235);--accent-hover: oklch(70% .16 235);--accent-text: oklch(13% .007 65);--accent-subtle: oklch(22% .09 235);--success: oklch(68% .14 145);--success-subtle: oklch(18% .06 145);--error: oklch(68% .16 25);--error-subtle: oklch(18% .06 25);--paper-bg: #1e1c18;--paper-text: #e2dcd4;--paper-subtext: #a09880;--paper-border: #3a3830}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}.app{display:flex;flex-direction:column;height:100%}.app-body{display:flex;flex:1;overflow:hidden;min-height:0}.app-header{display:flex;align-items:center;gap:10px;padding:0 16px 0 20px;height:48px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0}.header-logo{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--text);letter-spacing:-.02em}.header-logo svg{color:var(--accent)}.header-spacer{flex:1}.header-divider{width:1px;height:20px;background:var(--border);flex-shrink:0}.chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:500}.chip--sending{background:var(--accent-subtle);color:var(--accent)}.chip--sent{background:var(--success-subtle);color:var(--success)}.chip--error{background:var(--error-subtle);color:var(--error);max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toggle-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;height:28px;min-width:28px;padding:0 8px;border-radius:var(--radius-sm);border:1px solid var(--border);background:none;color:var(--text-2);font-family:var(--font);font-size:11.5px;font-weight:500;cursor:pointer;transition:background .12s,color .12s}.toggle-btn:hover{background:var(--surface-2);color:var(--text)}.toggle-btn:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.send-btn{display:inline-flex;align-items:center;gap:7px;padding:0 16px;height:34px;background:var(--accent);color:var(--accent-text);border:none;border-radius:var(--radius);font-family:var(--font);font-size:13px;font-weight:500;cursor:pointer;flex-shrink:0;transition:background .15s ease-out,transform .1s ease-out,opacity .15s}.send-btn:hover:not(:disabled){background:var(--accent-hover)}.send-btn:active:not(:disabled){transform:scale(.97)}.send-btn:disabled{opacity:.45;cursor:not-allowed}.send-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.fax-editor{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0;position:relative}.mode-bar{position:absolute;display:flex;justify-content:center;align-items:center;padding:10px 0 8px;flex-shrink:0;right:2rem;z-index:20}.mode-pill{display:inline-flex;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:3px;gap:0;box-shadow:0 1px 3px #00000012,0 3px 10px #0000000d}.mode-pill-btn{padding:5px 22px;height:30px;border-radius:999px;border:none;font-family:var(--font);font-size:12.5px;font-weight:500;color:var(--text-3);background:transparent;cursor:pointer;transition:background .15s ease-out,color .15s ease-out;white-space:nowrap}.mode-pill-btn:hover:not(.mode-pill-btn--active){color:var(--text-2)}.mode-pill-btn--active{background:var(--accent);color:var(--accent-text);box-shadow:0 1px 2px #00000024}.mode-pill-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.workspace{display:flex;flex:1;overflow:hidden;min-height:0}.workspace-main{display:flex;flex-direction:column;flex:1;overflow:hidden;min-width:0}.toolbar{display:flex;align-items:center;gap:1px;padding:0 8px;height:40px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.toolbar::-webkit-scrollbar{display:none}.toolbar--centered{justify-content:center}.tb-btn{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 7px;border-radius:var(--radius-sm);border:none;background:none;color:var(--text-2);font-family:var(--font);font-size:12px;font-weight:500;cursor:pointer;transition:background .1s,color .1s;white-space:nowrap;flex-shrink:0}.tb-btn:hover{background:var(--surface-2);color:var(--text)}.tb-btn--active{background:var(--accent-subtle);color:var(--accent)}.tb-btn:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.tb-btn__heading{font-size:11px;font-weight:700;letter-spacing:-.02em}.tb-btn__label{font-size:12px}.tb-sep{width:1px;height:16px;background:var(--border);margin:0 3px;flex-shrink:0}@media(max-width:700px){.toolbar{height:auto;flex-wrap:wrap;padding:5px 8px;gap:2px}.tb-sep{width:100%;height:1px;margin:1px 0;display:none}}.editor-canvas{flex:1;overflow-y:auto;overflow-x:hidden;background:var(--bg);padding:20px clamp(24px,4vw,80px) 48px;display:flex;justify-content:center;align-items:flex-start;scrollbar-gutter:stable both-edges}.editor-canvas::-webkit-scrollbar{width:6px}.editor-canvas::-webkit-scrollbar-track{background:transparent}.editor-canvas::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}.visual-frame{width:min(210mm,100%);flex-shrink:0;display:flex;flex-direction:column}.visual-frame .toolbar{position:sticky;top:0;z-index:5;border-radius:2px 2px 0 0;border:1px solid var(--paper-border);border-bottom:1px solid var(--border)}.visual-frame .editor-paper{border-radius:0 0 2px 2px;border:1px solid var(--paper-border);border-top:none;box-shadow:0 1px 3px #312d290f,0 6px 24px #312d291a}:root[data-theme=dark] .visual-frame .editor-paper{box-shadow:0 1px 4px #00000073,0 6px 24px #00000080}.editor-paper{width:min(210mm,100%);flex-shrink:0;background:var(--paper-bg);border-radius:2px;box-shadow:0 1px 3px #312d290f,0 6px 24px #312d291a,0 0 0 1px var(--paper-border);position:relative}.editor-paper:after{content:"p. 2";position:absolute;left:0;right:0;top:297mm;border-top:1px dashed rgba(200,60,60,.38);font-size:7.5pt;color:#c83c3c66;padding:3px 18mm 0;pointer-events:none;font-family:var(--font);letter-spacing:.03em}.editor-paper .ProseMirror{outline:none;padding:12mm 18mm 15mm;min-height:297mm;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Arial,Helvetica,sans-serif;font-size:11.5pt;line-height:1.65;color:var(--paper-text);caret-color:var(--accent);background-image:linear-gradient(180deg,rgba(99,132,185,.065) 12mm,transparent 12mm),linear-gradient(90deg,rgba(99,132,185,.065) 18mm,transparent 18mm),linear-gradient(270deg,rgba(99,132,185,.065) 18mm,transparent 18mm)}:root[data-theme=dark] .editor-paper .ProseMirror{background-image:linear-gradient(180deg,rgba(99,132,185,.04) 12mm,transparent 12mm),linear-gradient(90deg,rgba(99,132,185,.04) 18mm,transparent 18mm),linear-gradient(270deg,rgba(99,132,185,.04) 18mm,transparent 18mm)}.editor-paper .ProseMirror p{margin:0 0 .8em}.editor-paper .ProseMirror h1,.editor-paper .ProseMirror h2,.editor-paper .ProseMirror h3,.editor-paper .ProseMirror h4{margin:.85em 0 .4em;line-height:1.3}.editor-paper .ProseMirror h1{font-size:1.6em}.editor-paper .ProseMirror h2{font-size:1.35em}.editor-paper .ProseMirror h3{font-size:1.15em}.editor-paper .ProseMirror ul,.editor-paper .ProseMirror ol{padding-left:1.4em;margin:0 0 .8em}.editor-paper .ProseMirror li{margin-bottom:.25em}.editor-paper .ProseMirror li>p{margin:0}.editor-paper .ProseMirror hr{border:none;border-top:1px solid var(--paper-border);margin:1.4em 0}.editor-paper .ProseMirror blockquote{margin:.8em 0;padding:.6em 1em;background:#f4f1ef;color:var(--paper-subtext);font-style:italic}:root[data-theme=dark] .editor-paper .ProseMirror blockquote{background:#181513}.editor-paper .ProseMirror pre{background:#f1eeeb;padding:.8em 1em;border-radius:3px;font-size:10pt;overflow-x:auto;margin-bottom:.8em}:root[data-theme=dark] .editor-paper .ProseMirror pre{background:#14110e}.editor-paper .ProseMirror code{font-family:var(--font-mono);font-size:10pt;background:#f1eeeb;padding:.1em .35em;border-radius:2px}:root[data-theme=dark] .editor-paper .ProseMirror code{background:#181513}.fax-image-nv{display:block;line-height:0}.editor-paper .ProseMirror .fax-image{position:relative;margin:14px 0;outline:1.5px dashed oklch(75% .06 235);outline-offset:3px;border-radius:2px}.editor-paper .ProseMirror .fax-image--fullpage{outline-style:solid;outline-color:var(--accent)}.editor-paper .ProseMirror .fax-image img{max-width:100%;display:block}.fax-image__controls{position:absolute;top:-38px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:2px;background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:3px;box-shadow:0 2px 8px #0000001a,0 0 0 .5px var(--border);z-index:20;white-space:nowrap}.fax-image__ctrl-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;border-radius:4px;background:none;color:var(--text-2);cursor:pointer;transition:background .1s,color .1s}.fax-image__ctrl-btn:hover{background:var(--surface-2);color:var(--text)}.fax-image__ctrl-btn.is-active{background:var(--accent-subtle);color:var(--accent)}.fax-image__ctrl-sep{width:1px;height:14px;background:var(--border);margin:0 1px}.fax-image__resize-handle{position:absolute;bottom:4px;right:4px;width:14px;height:14px;background:var(--accent);border-radius:3px;cursor:se-resize;touch-action:none;opacity:0;transition:opacity .12s;z-index:10}.fax-image:hover .fax-image__resize-handle{opacity:.7}.ProseMirror-selectednode .fax-image__resize-handle{opacity:1}.editor-paper .ProseMirror ::selection{background:#b3e2ff;background:oklch(89% .08 235)}:root[data-theme=dark] .editor-paper .ProseMirror ::selection{background:#003249;background:oklch(30% .12 235)}:root[data-theme=dark] .editor-paper,:root[data-theme=dark] .preview-paper{box-shadow:0 1px 4px #00000073,0 6px 24px #00000080,0 0 0 1px var(--paper-border)}.html-split-wrap{flex:1;overflow:hidden;display:flex;background:var(--bg);padding:0;min-height:0}.editor-split{display:flex;flex:1;overflow:hidden;min-height:0}.editor-split__left{width:420px;flex-shrink:0;display:flex;flex-direction:column;border-right:1px solid var(--border);min-height:0}.editor-split__code{flex:1;overflow:hidden;background:var(--surface);min-height:0;display:flex;flex-direction:column}.editor-split__code>div{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}.editor-split__code .cm-editor{flex:1;min-height:0}.editor-split__code .cm-scroller{flex:1;overflow-y:auto;min-height:0}.editor-split__code::-webkit-scrollbar{width:5px}.editor-split__code::-webkit-scrollbar-track{background:transparent}.editor-split__code::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}.editor-split__preview{flex:1;overflow-y:auto;overflow-x:hidden;background:var(--bg);padding:20px clamp(20px,3vw,56px) 40px 20px}.editor-split__preview::-webkit-scrollbar{width:6px}.editor-split__preview::-webkit-scrollbar-track{background:transparent}.editor-split__preview::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}.preview-paper{width:min(210mm,100%);margin:0 auto;background:var(--paper-bg);border-radius:2px;box-shadow:0 1px 3px #312d290f,0 6px 24px #312d291a,0 0 0 1px var(--paper-border);overflow:hidden}.image-sidebar{width:196px;flex-shrink:0;align-self:flex-start;max-height:min(90vh,640px);border-left:1px solid var(--border);background:var(--surface);display:flex;flex-direction:column;overflow:hidden}.image-sidebar__header{padding:11px 14px 9px;font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text-3);border-bottom:1px solid var(--border);flex-shrink:0}.image-sidebar__list{flex:1;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:8px;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.image-sidebar__item{position:relative;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.image-sidebar__thumb-wrap{height:72px;overflow:hidden;background:var(--border-subtle)}.image-sidebar__thumb{width:100%;height:100%;object-fit:cover;display:block}.image-sidebar__remove{position:absolute;top:4px;right:4px;display:flex;align-items:center;justify-content:center;width:20px;height:20px;background:#0000008c;color:#f5f5f5;border:none;border-radius:3px;cursor:pointer;opacity:0;transition:opacity .12s;z-index:1}.image-sidebar__item:hover .image-sidebar__remove{opacity:1}.image-sidebar__remove:focus-visible{opacity:1;outline:2px solid var(--accent);outline-offset:1px}.image-sidebar__name{padding:5px 8px 2px;font-size:10.5px;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.image-sidebar__actions{display:flex;padding:4px 6px 6px;gap:4px}.image-sidebar__action-btn{flex:1;padding:4px 0;font-size:10.5px;font-family:var(--font);font-weight:500;background:var(--accent-subtle);color:var(--accent);border:none;border-radius:3px;cursor:pointer;transition:background .1s,color .1s}.image-sidebar__action-btn:hover{background:var(--accent);color:var(--accent-text)}.image-sidebar__action-btn:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.html-mode-toggle{display:none}@media(max-width:700px){.mode-bar{position:relative;right:auto;justify-content:center;z-index:auto;padding:8px 0}.fax-editor--source .mode-bar{display:none}.workspace{flex-direction:column}.workspace-main{flex:1;min-height:0}.image-sidebar{width:100%;max-height:160px;border-left:none;border-top:1px solid var(--border);align-self:auto;flex-direction:row;overflow-y:hidden;overflow-x:auto}.image-sidebar__list{flex-direction:row;padding:8px;gap:8px}.image-sidebar__item{flex-shrink:0;width:110px}.image-sidebar__header{display:none}.editor-split{flex-direction:column;overflow-y:auto}.editor-split__left{width:100%;border-right:none;border-bottom:1px solid var(--border);flex:none;height:auto}.editor-split__code{height:auto;min-height:140px;max-height:38vh;overflow-y:auto;display:block;flex:none}.editor-split__code>div{flex:none;overflow:visible;display:block}.editor-split__code .cm-editor{flex:none;min-height:140px}.editor-split__code .cm-scroller{overflow-y:auto;flex:none}.editor-split__preview{flex:1;min-height:200px;padding:16px 16px 32px}.html-mode-toggle{display:inline-flex;margin-left:auto;align-items:center;background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:2px;gap:0}.html-mode-toggle__btn{padding:3px 14px;height:24px;border-radius:999px;border:none;font-family:var(--font);font-size:11.5px;font-weight:500;color:var(--text-3);background:transparent;cursor:pointer;white-space:nowrap}.html-mode-toggle__btn--active{background:var(--accent);color:var(--accent-text)}}.gate{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:var(--bg);padding:24px}.gate-card{display:flex;flex-direction:column;gap:14px;width:100%;max-width:320px;padding:28px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 8px 32px #00000012}.gate-card--shake{animation:gate-shake .4s ease}@keyframes gate-shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(4px)}30%,50%,70%{transform:translate(-6px)}40%,60%{transform:translate(6px)}}.gate-logo{display:flex;align-items:center;gap:8px;font-weight:600;font-size:16px;color:var(--text);margin-bottom:4px}.gate-label{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-2)}.gate-input{font-family:var(--font);font-size:14px;padding:10px 12px;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);outline:none;transition:border-color .15s,box-shadow .15s}.gate-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-subtle)}.gate-input--error{border-color:var(--error);box-shadow:0 0 0 3px var(--error-subtle)}.gate-error{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--error);margin-top:-6px}.gate-submit{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font);font-size:13px;font-weight:500;padding:9px 14px;background:var(--accent);color:var(--accent-text);border:none;border-radius:var(--radius-sm);cursor:pointer;transition:background .15s,transform .1s,opacity .15s}.gate-submit:hover:not(:disabled){background:var(--accent-hover)}.gate-submit:active:not(:disabled){transform:scale(.97)}.gate-submit:disabled{opacity:.45;cursor:not-allowed}