:root{--bg-0:#e8eef4;--bg-1:#f7fafc;--surface:#ffffff;--ink:#0f1c2e;--ink-soft:#5a6b7d;--line:#c9d4e0;--accent:#0d7a6f;--accent-hover:#0a645b;--accent-soft:#d5f0ec;--stage:#6b7785;--shadow:0 12px 40px rgba(15, 28, 46, 0.12);--radius:10px;--font:"IBM Plex Sans", "Segoe UI", sans-serif;--mono:"IBM Plex Mono", Consolas, monospace;--page-width:210mm;--page-height:297mm;--topbar-h:60px}*,*::before,*::after{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:var(--font);color:var(--ink);background:radial-gradient(1200px 600px at 10% -10%,#cfe8e4 0%,transparent 55%),radial-gradient(900px 500px at 100% 0%,#d6e3f2 0%,transparent 50%),var(--bg-0)}button,select,textarea{font:inherit}.app{height:100%;display:flex;flex-direction:column;min-height:0}.topbar{height:var(--topbar-h);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 20px;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-mark{width:28px;height:28px;border-radius:8px;background:linear-gradient(145deg,var(--accent) 0%,#1a9b8e 55%,#0b4f48 100%);box-shadow:inset 0 1px rgba(255,255,255,.35);flex-shrink:0}.brand-text{display:flex;flex-direction:column;line-height:1.15}.brand-text strong{font-size:1.05rem;letter-spacing:-.02em}.brand-text span{font-size:.75rem;color:var(--ink-soft)}.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.field-inline{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;color:var(--ink-soft)}.field-inline select{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:7px 10px;color:var(--ink)}.btn{border:1px solid transparent;border-radius:8px;padding:8px 14px;font-size:.875rem;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .1s ease}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:disabled{opacity:.55;cursor:wait}.btn-ghost{background:var(--surface);border-color:var(--line);color:var(--ink)}.btn-ghost:hover{background:var(--bg-1)}.btn-text{border:none;background:0 0;color:var(--ink-soft);font-size:.8rem;font-weight:500;cursor:pointer;padding:6px 10px}.btn-text:hover{color:var(--accent)}.btn-icon{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);cursor:pointer;padding:0;transition:background .15s ease,border-color .15s ease,color .15s ease}.btn-icon:hover{background:var(--bg-1);color:var(--accent)}.btn-icon[aria-pressed=true]{background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 35%,var(--line));color:var(--accent-hover)}.pane-toggles{display:inline-flex;gap:6px;margin-right:4px}.workspace{flex:1;display:flex;min-height:0;padding:14px;gap:0}.workspace.editor-hidden .editor-pane,.workspace.preview-hidden .preview-pane{display:none}.workspace.editor-hidden .splitter,.workspace.preview-hidden .splitter{display:none}.workspace.editor-hidden .preview-pane,.workspace.preview-hidden .editor-pane{flex:auto;border-radius:var(--radius);border:1px solid var(--line)}.pane{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--surface);border:1px solid var(--line);overflow:hidden}.editor-pane{flex:0 0 46%;border-radius:var(--radius)0 0 var(--radius);border-right:none}.preview-pane{flex:1;border-radius:0 var(--radius)var(--radius)0}.splitter{width:6px;flex:0 0 6px;cursor:col-resize;background:linear-gradient(90deg,transparent,rgba(13,122,111,.2),transparent);border-top:1px solid var(--line);border-bottom:1px solid var(--line);touch-action:none}.splitter:hover,.splitter.active{background:var(--accent-soft)}.tabs{display:flex;align-items:center;gap:2px;padding:8px 8px 0;background:var(--bg-1);border-bottom:1px solid var(--line)}.tab{border:none;background:0 0;color:var(--ink-soft);font-size:.82rem;font-weight:600;padding:10px 14px;border-radius:8px 8px 0 0;cursor:pointer}.tab.active{background:var(--surface);color:var(--ink);box-shadow:0 1px 0 var(--surface)}.tabs-spacer{flex:1}.md-toolbar{display:flex;flex-wrap:wrap;gap:6px;padding:8px 10px;background:var(--surface);border-bottom:1px solid var(--line)}.md-toolbar[hidden]{display:none!important}.md-group{display:inline-flex;flex-wrap:wrap;gap:2px;padding-right:6px;border-right:1px solid var(--line)}.md-group:last-child{border-right:none;padding-right:0}.md-btn{border:1px solid transparent;background:0 0;color:var(--ink);font-size:.75rem;font-weight:600;font-family:var(--font);line-height:1;min-width:30px;height:28px;padding:0 8px;border-radius:6px;cursor:pointer;white-space:nowrap}.md-btn:hover{background:var(--bg-1);border-color:var(--line);color:var(--accent-hover)}.md-btn:active{background:var(--accent-soft)}.md-btn strong,.md-btn em,.md-btn s{font-size:.82rem}.code-area{display:none;flex:1;width:100%;border:none;outline:none;resize:none;padding:16px 18px;font-family:var(--mono);font-size:.86rem;line-height:1.55;color:var(--ink);background:var(--surface);tab-size:2}.code-area.active{display:block}.css-editor-host{display:none;padding:0;min-height:0;overflow:hidden}.css-editor-host.active{display:flex;flex-direction:column}.css-editor-host .CodeMirror{flex:1;height:100%;font-family:fira code,var(--mono);font-size:.86rem;line-height:1.55;background:var(--surface);color:var(--ink)}.css-editor-host .CodeMirror-scroll{min-height:100%}.css-editor-host .CodeMirror-gutters{background:var(--bg-1);border-right:1px solid var(--line)}.css-editor-host .CodeMirror-linenumber{color:var(--ink-soft)}.css-editor-host .CodeMirror-cursor{border-left-color:var(--accent)}.css-editor-host .CodeMirror-focused .CodeMirror-selected{background:color-mix(in srgb,var(--accent-soft) 80%,#fff)}.cm-s-default .cm-keyword{color:#0d7a6f;font-weight:600}.cm-s-default .cm-atom{color:#b45309}.cm-s-default .cm-number{color:#b45309}.cm-s-default .cm-def{color:#1d4ed8}.cm-s-default .cm-variable,.cm-s-default .cm-property{color:#0f1c2e}.cm-s-default .cm-variable-2{color:#1d4ed8}.cm-s-default .cm-variable-3,.cm-s-default .cm-type{color:#0d7a6f}.cm-s-default .cm-comment{color:#7a8b9a;font-style:italic}.cm-s-default .cm-string{color:#0b6e4f}.cm-s-default .cm-string-2{color:#0d7a6f}.cm-s-default .cm-meta{color:#64748b}.cm-s-default .cm-qualifier{color:#1d4ed8}.cm-s-default .cm-builtin{color:#0d7a6f}.cm-s-default .cm-tag{color:#b45309}.cm-s-default .cm-attribute{color:#1d4ed8}.cm-s-default .cm-operator{color:#475569}.CodeMirror-hints{font-family:fira code,var(--mono);font-size:.8rem;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);background:var(--surface);max-height:220px;z-index:1000}.CodeMirror-hint{color:var(--ink);padding:4px 10px}li.CodeMirror-hint-active{background:var(--accent);color:#fff}.preview-meta{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;font-size:.78rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--ink-soft);background:var(--bg-1);border-bottom:1px solid var(--line)}.muted{font-weight:500;text-transform:none;letter-spacing:0;opacity:.9}.preview-stage{flex:1;overflow:auto;padding:28px 20px;background:repeating-linear-gradient( -12deg,transparent,transparent 11px,rgba(255,255,255,3%) 11px,rgba(255,255,255,3%) 12px ),var(--stage);display:flex;justify-content:center;align-items:flex-start}.page-sheet{width:min(100%,var(--page-width));min-height:297mm;background:#fff;padding:18mm 16mm;box-shadow:var(--shadow);border-radius:2px}.markdown-body{box-sizing:border-box;font-family:var(--font)}.markdown-body pre{overflow:auto}.pdf-dialog{width:min(960px,calc(100vw - 32px));height:min(90vh,920px);max-width:none;max-height:none;border:1px solid var(--line);border-radius:14px;padding:0;background:var(--surface);box-shadow:0 24px 80px rgba(15,28,46,.28);overflow:hidden}.pdf-dialog::backdrop{background:rgba(15,28,46,.45);backdrop-filter:blur(3px)}.pdf-dialog-chrome{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--bg-1)}.pdf-dialog-title{display:flex;flex-direction:column;gap:2px}.pdf-dialog-title .muted{font-size:.8rem;color:var(--ink-soft)}.pdf-dialog-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.zoom-label{min-width:48px;text-align:center;font-family:var(--mono);font-size:.8rem;color:var(--ink-soft)}.pdf-dialog-body{height:calc(100% - 64px);overflow:auto;padding:28px 16px;background:var(--stage)}.pdf-dialog-title code{font-family:var(--mono);font-size:.72rem;background:color-mix(in srgb,var(--accent-soft) 70%,#fff);padding:1px 5px;border-radius:4px}.pdf-pages{display:flex;flex-direction:column;align-items:center;gap:0;transform-origin:top center;transition:transform .15s ease;width:100%}.pdf-sheet-wrap{display:flex;flex-direction:column;align-items:center;width:100%}.pdf-sheet{width:min(100%,var(--page-width));height:var(--page-height);min-height:var(--page-height);max-height:var(--page-height);overflow:hidden;background:#fff;padding:14mm;box-shadow:var(--shadow);border-radius:2px;box-sizing:border-box;position:relative}.pdf-sheet-label{position:absolute;top:6px;right:10px;font-size:.68rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#94a3b8;pointer-events:none}.pdf-break-marker{width:min(100%,var(--page-width));margin:10px 0 14px;display:flex;align-items:center;gap:10px;color:#f8fafc;font-size:.72rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase}.pdf-break-marker::before,.pdf-break-marker::after{content:"";flex:1;border-top:2px dashed rgba(255,255,255,.55)}.pdf-break-marker[data-kind=manual] span{background:#0d7a6f;padding:3px 10px;border-radius:999px}.pdf-break-marker[data-kind=auto] span{background:#334155;padding:3px 10px;border-radius:999px}.markdown-body [data-pagebreak],.markdown-body [data-break=page]{display:flex;align-items:center;gap:10px;margin:1.25em 0;border:none;height:auto;min-height:0;page-break-after:always;break-after:page}.markdown-body [data-pagebreak]::before,.markdown-body [data-break=page]::before{content:"";flex:1;border-top:2px dashed #0d7a6f}.markdown-body [data-pagebreak]::after,.markdown-body [data-break=page]::after{content:"page break";flex:none;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#0d7a6f;background:#e8f4f2;padding:2px 8px;border-radius:999px}#pdf-export-root [data-pagebreak],#pdf-export-root [data-break=page]{display:block!important;height:0!important;margin:0!important;padding:0!important;overflow:hidden!important;border:none!important;page-break-after:always!important;break-after:page!important}#pdf-export-root [data-pagebreak]::before,#pdf-export-root [data-pagebreak]::after,#pdf-export-root [data-break=page]::before,#pdf-export-root [data-break=page]::after{content:none!important;display:none!important}@media(max-width:860px){.workspace{flex-direction:column;padding:10px}.editor-pane,.preview-pane{flex:1 1 50%;border-radius:var(--radius);border:1px solid var(--line)}.editor-pane{border-bottom:none;border-radius:var(--radius)var(--radius)0 0}.preview-pane{border-radius:0 0 var(--radius)var(--radius)}.splitter{width:100%;height:6px;flex-basis:6px;cursor:row-resize}.brand-text span{display:none}.page-sheet{min-height:auto;padding:20px}}