.app{grid-template-rows:var(--topbar-h) auto auto 1fr var(--statusbar-h);background:var(--bg);height:100dvh;min-height:420px;display:grid}.app>.topbar{grid-row:1}.app>.tabbar{grid-row:2}.app>.formatbar{grid-row:3}.app>.workspace{grid-row:4}.app>.statusbar{grid-row:5}html[data-working] .hide-while-working,html[data-editing] .hide-while-working{display:none!important}.tabbar{border-bottom:1px solid var(--border);background:var(--bg-subtle);align-items:flex-end;gap:4px;min-width:0;padding:6px 8px 0;display:flex}.tabs{scrollbar-width:thin;gap:2px;min-width:0;margin:0;padding:0;list-style:none;display:flex;overflow-x:auto}.tab{border-radius:var(--radius-sm) var(--radius-sm) 0 0;min-width:96px;max-width:220px;color:var(--text-muted);border:1px solid #0000;border-bottom:0;flex:0 200px;align-items:center;margin-bottom:-1px;display:flex}.tab:hover{background:var(--bg-muted);color:var(--text)}.tab[data-active]{background:var(--bg);border-color:var(--border);color:var(--text)}.tab-open{min-width:0;height:32px;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;flex:auto;padding:0 4px 0 12px;font-size:13.5px;font-weight:500}.tab-name{white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}.tab-close{border-radius:var(--radius-sm);width:24px;height:24px;color:var(--text-muted);cursor:pointer;background:0 0;border:0;flex:none;place-items:center;margin-right:4px;padding:0;display:grid}.tab-close:hover{background:var(--bg-muted);color:var(--text)}.tab:not([data-active]):not(:hover) .tab-close{opacity:.55}.tab-open:focus-visible,.tab-close:focus-visible,.tab-limit:focus-visible{outline:3px solid var(--focus);outline-offset:-3px}.tab-new{flex:none;width:32px;height:32px;margin-bottom:1px}.tab-limit{border:1px solid var(--border-strong);background:var(--bg);height:28px;color:var(--text-muted);font:inherit;white-space:nowrap;cursor:pointer;border-radius:999px;flex:none;align-items:center;gap:6px;margin:0 0 3px auto;padding:0 8px;font-size:12.5px;display:inline-flex}.tab-limit:hover{color:var(--text)}.tab-limit[hidden]{display:none}.pro-tag{background:var(--accent-soft);color:var(--accent);letter-spacing:.02em;border-radius:999px;padding:1px 7px;font-size:11.5px;font-weight:600;display:inline-block}@media (hover:none){.tab-close{width:44px;height:44px;margin-right:0}.tab-open{height:44px}.tab-new{width:44px;height:44px}.tab:not([data-active]) .tab-close{opacity:.7}}@media (width<=760px){.tab{flex-basis:150px;min-width:88px}}.topbar{border-bottom:1px solid var(--border);background:var(--bg);align-items:center;gap:12px;min-width:0;padding:0 12px 0 16px;display:flex}.doc-meta{border-left:1px solid var(--border);flex:auto;align-items:center;gap:8px;min-width:0;margin-left:2px;padding-left:12px;display:flex}.doc-title{border-radius:var(--radius-sm);width:100%;min-width:60px;max-width:320px;height:32px;color:var(--text);text-overflow:ellipsis;background:0 0;border:1px solid #0000;padding:0 8px;font-size:14px;font-weight:500}.doc-title:hover{border-color:var(--border)}.doc-title:focus{border-color:var(--focus);background:var(--bg);outline:none}.save-state{color:var(--text-muted);white-space:nowrap;flex:none;align-items:center;gap:5px;font-size:12.5px;display:inline-flex}.save-state:before{content:"";background:var(--success);border-radius:50%;width:6px;height:6px}.save-state[data-state=saving]:before{background:var(--text-muted)}.save-state[data-state=error]:before{background:var(--danger)}.actions{flex:none;align-items:center;gap:4px;margin-left:auto;display:flex}.actions .divider-v{background:var(--border);width:1px;height:22px;margin:0 6px}.segmented{border-radius:var(--radius);background:var(--bg-muted);gap:2px;padding:3px;display:inline-flex}.segmented button{height:28px;color:var(--text-muted);background:0 0;border:0;border-radius:6px;align-items:center;gap:6px;padding:0 10px;font-size:13px;font-weight:500;display:inline-flex}.segmented button:hover{color:var(--text)}.segmented button[aria-pressed=true]{background:var(--segmented-active);color:var(--text);box-shadow:var(--shadow-sm)}.mobile-only{display:none!important}.formatbar{height:var(--formatbar-h);border-bottom:1px solid var(--border);background:var(--bg-subtle);scrollbar-width:none;align-items:center;gap:2px;padding:0 10px;display:flex;overflow-x:auto}.formatbar::-webkit-scrollbar{display:none}.formatbar .btn-icon{width:32px;height:30px;color:var(--text-muted)}.formatbar .btn-icon:hover{color:var(--text)}.formatbar .sep{background:var(--border-strong);flex:none;width:1px;height:18px;margin:0 6px}.formatbar .spacer{flex:1}.formatbar .btn-text{height:30px;color:var(--text-muted);padding:0 8px;font-size:13px}.app[data-view=preview] .formatbar{display:none}.workspace{--split:50%;grid-template-columns:var(--split) 1px 1fr;min-height:0;display:grid;position:relative}.pane{min-width:0;min-height:0;position:relative;overflow:hidden}.pane-editor{background:var(--bg)}.pane-preview{background:var(--bg);scroll-behavior:auto;overflow-y:auto}.preview-inner{max-width:860px;margin:0 auto;padding:28px 40px 80px}#preview{contain:paint;position:relative}.app[data-view=edit] .workspace,.app[data-view=preview] .workspace{grid-template-columns:minmax(0,1fr)}.app[data-view=edit] .pane-preview,.app[data-view=edit] .divider,.app[data-view=preview] .pane-editor,.app[data-view=preview] .divider{display:none}.app[data-view=preview] .preview-inner{padding-top:40px}.divider{z-index:2;background:var(--border);cursor:col-resize;touch-action:none;position:relative}.divider:after{content:"";position:absolute;inset:0 -5px}.divider:hover,.divider:focus-visible,.divider[data-dragging]{background:var(--accent);outline:none}body[data-resizing]{cursor:col-resize;user-select:none}body[data-resizing] .pane{pointer-events:none}.editor{height:100%}.editor-fallback{resize:none;background:var(--bg);width:100%;height:100%;color:var(--text);font-family:var(--font-mono);font-variant-ligatures:none;tab-size:4;border:0;outline:none;padding:20px 24px;font-size:14px;line-height:1.65;display:block}.editor .cm-editor{background:var(--bg);height:100%;color:var(--text);font-size:14px}.editor .cm-editor.cm-focused{outline:none}.editor .cm-scroller{font-family:var(--font-mono);font-variant-ligatures:none;line-height:1.65;overflow:auto}.editor .cm-content{caret-color:var(--accent);max-width:900px;padding:20px 0 50vh}.editor .cm-line{padding:0 24px}.editor .cm-cursor{border-left:2px solid var(--accent)}.editor .cm-selectionBackground,.editor .cm-editor .cm-content ::selection{background:color-mix(in srgb, var(--accent) 22%, transparent)!important}.editor .cm-editor.cm-focused .cm-selectionBackground{background:color-mix(in srgb, var(--accent) 26%, transparent)!important}.editor .cm-activeLine{background:color-mix(in srgb, var(--bg-muted) 55%, transparent)}.editor .cm-placeholder{color:var(--text-muted)}.editor .cm-panels{background:var(--bg-subtle);color:var(--text);border-color:var(--border)}.editor .cm-panels-top{border-bottom:1px solid var(--border)}.editor .cm-search{font-family:var(--font-sans);padding:8px 10px;font-size:13px}.editor .cm-search input,.editor .cm-search button{font-family:var(--font-sans);font-size:13px}.editor .cm-textfield{border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--bg);color:var(--text);padding:4px 6px}.editor .cm-button{border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--bg-elevated);color:var(--text);background-image:none;padding:3px 8px}.editor .cm-searchMatch{background:var(--search-match)}.editor .cm-searchMatch-selected{background:var(--search-match-active)}.editor .tok-heading{color:var(--text);font-weight:700}.editor .tok-heading1{font-size:1.12em}.editor .tok-heading2{font-size:1.06em}.editor .tok-strong{font-weight:700}.editor .tok-emphasis{font-style:italic}.editor .tok-strikethrough{text-decoration:line-through}.editor .tok-link,.editor .tok-url{color:var(--accent)}.editor .tok-url{text-decoration:underline;text-decoration-color:color-mix(in srgb, var(--accent) 40%, transparent)}.editor .tok-monospace{color:var(--syn-inline-code)}.editor .tok-quote{color:var(--text-muted);font-style:italic}.editor .tok-meta,.editor .tok-processingInstruction,.editor .tok-punctuation,.editor .tok-contentSeparator{color:var(--text-muted)}.editor .tok-list{color:var(--accent)}.editor .tok-comment{color:var(--syn-comment);font-style:italic}.editor .tok-keyword,.editor .tok-operator{color:var(--syn-keyword)}.editor .tok-string,.editor .tok-string2{color:var(--syn-string)}.editor .tok-number,.editor .tok-bool,.editor .tok-atom,.editor .tok-propertyName,.editor .tok-attributeName{color:var(--syn-number)}.editor .tok-variableName{color:var(--syn-variable)}.editor .tok-variableName2,.editor .tok-definition{color:var(--syn-function)}.editor .tok-typeName,.editor .tok-className{color:var(--syn-type)}.editor .tok-tagName{color:var(--syn-tag)}.statusbar{border-top:1px solid var(--border);background:var(--bg-subtle);color:var(--text-muted);white-space:nowrap;align-items:center;gap:16px;padding:0 16px;font-size:12px;display:flex;overflow:hidden}.statusbar .stat{font-variant-numeric:tabular-nums}.statusbar .push{margin-left:auto}.statusbar a{color:var(--text-muted);text-decoration:none}.statusbar a:hover{color:var(--accent)}.statusbar .privacy-note{align-items:center;gap:5px;display:inline-flex}.drop-overlay{z-index:200;background:color-mix(in srgb, var(--bg) 82%, transparent);backdrop-filter:blur(3px);justify-content:center;align-items:center;padding:24px;display:none;position:fixed;inset:0}.drop-overlay[data-active]{display:flex}.drop-overlay .drop-box{border:2px dashed var(--accent);background:var(--accent-soft);width:min(520px,100%);color:var(--accent);text-align:center;border-radius:16px;place-items:center;gap:10px;padding:48px 24px;font-size:17px;font-weight:600;display:grid}.drop-overlay .icon{width:36px;height:36px}.drawer{border:0;border-right:1px solid var(--border);background:var(--bg-elevated);width:min(380px,100vw - 32px);max-width:none;height:100dvh;max-height:none;color:var(--text);box-shadow:var(--shadow-lg);margin:0 auto 0 0;padding:0}.drawer[open]{flex-direction:column;animation:.18s ease-out drawer-in;display:flex}@keyframes drawer-in{0%{opacity:0;transform:translate(-16px)}}.drawer::backdrop{background:var(--backdrop)}.drawer-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:8px;padding:14px 14px 14px 20px;display:flex}.drawer-header h2{margin:0;font-size:16px;font-weight:600}.drawer-actions{gap:8px;padding:12px 16px;display:flex}.drawer-actions .btn{flex:1}.doc-list{flex:1;margin:0;padding:4px 8px 16px;list-style:none;overflow-y:auto}.doc-item{border-radius:var(--radius);align-items:center;gap:4px;display:flex}.doc-item:hover{background:var(--bg-muted)}.doc-item[aria-current=true]{background:var(--accent-soft)}.doc-open{text-align:left;min-width:0;color:var(--text);background:0 0;border:0;flex:1;gap:1px;padding:9px 10px;display:grid}.doc-open .name{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;overflow:hidden}.doc-open .meta{color:var(--text-muted);font-size:12px}.doc-item .btn-icon{width:30px;height:30px;color:var(--text-muted);opacity:0}.doc-item:hover .btn-icon,.doc-item .btn-icon:focus-visible{opacity:1}@media (hover:none){.doc-item .btn-icon{opacity:1}}.drawer-footer{border-top:1px solid var(--border);color:var(--text-muted);padding:12px 20px 16px;font-size:12.5px}.share-row{gap:8px;display:flex}.share-row .input{font-family:var(--font-mono);font-size:13px}.shortcuts{border-collapse:collapse;width:100%;font-size:14px}.shortcuts td{border-bottom:1px solid var(--border);padding:7px 0}.shortcuts td:last-child{text-align:right}.info{border-top:1px solid var(--border);background:var(--bg-subtle)}.info-inner{max-width:1080px;margin:0 auto;padding:56px 24px}.info h2{letter-spacing:-.02em;margin:0 0 8px;font-size:26px;font-weight:700}.info .lead{max-width:720px;color:var(--text-secondary);margin:0 0 32px;font-size:16px}.feature-grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:0 0 48px;padding:0;list-style:none;display:grid}.feature-grid li{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg);padding:18px}.feature-grid h3{align-items:center;gap:8px;margin:0 0 6px;font-size:15px;font-weight:600;display:flex}.feature-grid h3 .icon{color:var(--accent)}.feature-grid p{color:var(--text-muted);margin:0;font-size:14px}.info-columns{grid-template-columns:2fr 1fr;gap:48px;display:grid}.faq h3{margin:0 0 12px;font-size:18px}.faq details{border-bottom:1px solid var(--border)}.faq summary{cursor:pointer;padding:14px 0;font-weight:550;list-style-position:outside}.faq details p{color:var(--text-secondary);margin:0 0 16px}.guide-links h3{margin:0 0 12px;font-size:18px}.guide-links ul{margin:0;padding:0;list-style:none}.guide-links li a{border-bottom:1px solid var(--border);color:var(--text);justify-content:space-between;align-items:center;padding:12px 0;font-weight:500;text-decoration:none;display:flex}.guide-links li a:hover{color:var(--accent)}html[data-restoring] #preview,html[data-restoring] #editor-fallback{visibility:hidden}@media (width<=1180px){.actions .label-lg{display:none}.actions .btn:has(.label-lg){width:34px;padding:0}}@media (width<=900px){.doc-meta .save-state{display:none}.preview-inner{padding:24px 24px 64px}}@media (width<=760px){:root{--topbar-h:54px}.topbar{gap:8px;padding:0 8px 0 12px}.brand-name{font-size:14px}.doc-meta,.desktop-only,.segmented [data-action=view-split],.actions .divider-v{display:none!important}.mobile-only{display:revert!important}.actions .btn-primary .label{display:none}.actions .btn-primary{width:34px;padding:0}.actions .btn-primary .chevron{display:none}.segmented button{padding:0 9px}.segmented .label{display:none}.app[data-view=split] .workspace{grid-template-columns:minmax(0,1fr)}.app[data-view=split] .pane-preview,.app[data-view=split] .divider{display:none}.editor .cm-line{padding:0 14px}.editor .cm-content{padding-top:14px}.editor .cm-editor,.editor-fallback{font-size:15px}.preview-inner,.app[data-view=preview] .preview-inner{padding:20px 16px 64px}.markdown-body{font-size:16px}.statusbar .hide-sm{display:none}.info-columns{grid-template-columns:1fr;gap:32px}.info-inner{padding:40px 16px}}@media (width<=400px){.brand-name{display:none}}@media print{@page{margin:16mm 14mm}:root{color-scheme:light}#preview{contain:none}body>:not(.app),.topbar,.tabbar,.formatbar,.statusbar,.pane-editor,.divider,.code-copy,.toasts,.consent{display:none!important}.app,.workspace{height:auto!important;min-height:0!important;display:block!important}.pane-preview{display:block!important;overflow:visible!important}.preview-inner{max-width:none;padding:0!important}.markdown-body{font-size:11.5pt}.markdown-body pre,.markdown-body table,.markdown-body img,.markdown-body .mdv-mermaid{break-inside:avoid}.markdown-body h1,.markdown-body h2,.markdown-body h3{break-after:avoid}.markdown-body pre>code{white-space:pre-wrap}}
