.app-mockup{--background:#eeeee9;--surface:#f7f7f2;--surface-float:#fdfdf8;--foreground:#5b5c58;--muted:#a29c92;--accent:#3f5871;--toolbar:color-mix(in srgb, var(--background) 90%, white);--hairline:color-mix(in srgb, var(--muted) 22%, transparent);--titlebar-inset:78px;--titlebar-height:32px;--document-tab-strip-height:28px;--radius-sm:3px;--background-primary:var(--surface-float);--background-primary-alt:color-mix(in srgb, var(--surface) 78%, transparent);--background-secondary:color-mix(in srgb, var(--surface) 92%, var(--surface-float));--background-secondary-alt:color-mix(in srgb, var(--surface) 84%, transparent);--text-normal:var(--foreground);--text-faint:color-mix(in srgb, var(--muted) 74%, transparent);--font-interface-theme:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-text-theme:var(--font-interface-theme);--font-heading-theme:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-monospace-theme:"SFMono-Regular", ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;--noute-inline-code-bg:color-mix(in srgb, var(--background-secondary) 90%, transparent);--noute-inline-code-radius:6px;--noute-inline-code-pad-x:.3rem;--noute-inline-code-pad-y:2px;--noute-type-h1-size:1.85em;--noute-type-h1-weight:650;--noute-type-heading-color:var(--foreground);--noute-type-heading-letter-spacing:0;--noute-type-heading-line-height:1.35;--noute-type-body-line-height:1.65;--noute-type-pad-y:28px;--noute-type-pad-x:28px;--noute-type-pad-y-end:56px;--noute-type-measure:40rem;--noute-type-indent:1.4em;--noute-type-list-marker-size:.96em;--noute-type-list-item-gap:.58em;--noute-type-list-nested-gap:.38em;--line-height-normal:1.6;--font-text-size:14px;background:var(--background);min-height:420px;color:var(--foreground);font-family:var(--font-interface-theme);text-align:left;border-radius:10px;grid-template-rows:auto auto minmax(0,1fr) auto;font-size:13px;line-height:1.45;display:grid;overflow:hidden}.app-mockup-frame{border:1px solid var(--hairline,#a29c9238);border-radius:10px;overflow:hidden;box-shadow:0 1px 2px #5b5c580a,0 12px 40px -12px #5b5c5824}.app-mockup .titlebar{min-height:var(--titlebar-height);padding:0 12px 0 var(--titlebar-inset);border-bottom:1px solid var(--hairline);background:var(--toolbar);-webkit-user-select:none;user-select:none;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:0 8px;display:grid}.app-mockup .titlebar-side{align-self:center;align-items:center;min-width:0;min-height:20px;display:flex}.app-mockup .titlebar-side-leading{width:var(--titlebar-inset);justify-content:center;padding-left:0;position:absolute;left:0}.app-mockup .titlebar{position:relative}.app-mockup .titlebar-drag-region{align-self:stretch;min-width:0;min-height:20px}.app-mockup .titlebar-side-trailing{justify-content:flex-end;gap:8px}.app-mockup .titlebar-actions,.app-mockup .titlebar-editor-controls{flex:none;align-items:center;gap:6px;display:inline-flex}.app-mockup .titlebar-view-mode{gap:4px}.app-mockup .titlebar-editor-options-trigger,.app-mockup .quiet-action,.app-mockup .editor-mode-toggle{color:color-mix(in srgb, var(--muted) 92%, var(--foreground));cursor:default;border-radius:var(--radius-sm);background:0 0;border:0;justify-content:center;align-items:center;padding:1px;line-height:1;display:inline-flex}.app-mockup .editor-mode-toggle.is-pressed{color:var(--accent)}.app-mockup .action-separator{color:color-mix(in srgb, var(--muted) 40%, transparent);font-size:11px;line-height:1}.app-mockup-traffic-lights{align-items:center;gap:8px;padding-left:12px;display:flex}.app-mockup-traffic-lights span{border-radius:999px;width:12px;height:12px}.app-mockup-traffic-lights span:first-child{background:#ff5f57}.app-mockup-traffic-lights span:nth-child(2){background:#febc2e}.app-mockup-traffic-lights span:nth-child(3){background:#28c840}.app-mockup .document-tab-strip{min-height:var(--document-tab-strip-height);border-bottom:1px solid var(--hairline);background:var(--toolbar);-webkit-user-select:none;user-select:none;align-items:center;padding:2px 12px;display:flex}.app-mockup .document-tab-bar{justify-content:flex-start;align-items:center;gap:2px;width:100%;min-width:0;display:flex}.app-mockup .document-tab{min-width:0;max-width:min(200px,26vw);height:24px;color:color-mix(in srgb, var(--foreground) 60%, var(--muted));background:0 0;border:1px solid #0000;border-radius:7px;flex:0 auto;align-items:center;display:inline-flex;position:relative}.app-mockup .document-tab.is-active{background:var(--surface-float);border-color:color-mix(in srgb, var(--muted) 18%, transparent);color:color-mix(in srgb, var(--foreground) 96%, transparent)}.app-mockup .document-tab-label{min-width:0;height:100%;color:inherit;cursor:default;font:inherit;background:0 0;border:0;align-items:center;gap:4px;padding:0 3px 0 8px;font-size:11px;line-height:1.2;display:inline-flex}.app-mockup .document-tab.is-active .document-tab-name{font-weight:500}.app-mockup .document-tab-name{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.app-mockup .document-tab-close{width:16px;height:16px;color:color-mix(in srgb, var(--muted) 88%, var(--foreground));cursor:default;opacity:0;background:0 0;border:0;border-radius:5px;flex:none;margin-right:4px;padding:0;font-size:12px;line-height:1}.app-mockup .document-tab.is-active .document-tab-close{opacity:1}.app-mockup .document-tab-new{cursor:default;width:22px;min-width:22px;max-width:22px;height:22px;color:color-mix(in srgb, var(--muted) 88%, var(--foreground));background:0 0;border:1px solid #0000;border-radius:6px;flex:none;justify-content:center;margin-left:2px;padding:0;font-size:14px;line-height:1}.app-mockup .workspace{background:var(--surface);flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.app-mockup .editor-workspace,.app-mockup .editor-host-wrap,.app-mockup .editor-host,.app-mockup .static-markdown-preview{flex-direction:column;flex:1;min-width:0;min-height:0;display:flex}.app-mockup .static-markdown-preview{background:var(--surface)}.app-mockup .static-markdown-preview__scroller{min-height:0;padding:var(--noute-type-pad-y) var(--noute-type-pad-x) var(--noute-type-pad-y-end);font-family:var(--font-text-theme);line-height:var(--noute-type-body-line-height);color:var(--text-normal);font-size:var(--font-text-size);flex:1;overflow:auto}.app-mockup .static-markdown-preview__prose{max-width:var(--noute-type-measure);margin:0 auto}.app-mockup .static-markdown-preview__prose h1{margin:calc(var(--font-text-size) * var(--line-height-normal)) 0;color:var(--noute-type-heading-color);font-family:var(--font-heading-theme);font-size:var(--noute-type-h1-size);font-weight:var(--noute-type-h1-weight);letter-spacing:var(--noute-type-heading-letter-spacing);line-height:var(--noute-type-heading-line-height)}.app-mockup .static-markdown-preview__prose :where(p,ul,ol){margin:0 0 calc(var(--font-text-size) * var(--line-height-normal))}.app-mockup .static-markdown-preview__prose :is(ul,ol){padding-left:calc(var(--noute-type-indent) + .2rem);margin-left:0;list-style-position:outside}.app-mockup .static-markdown-preview__prose ul{list-style-type:disc}.app-mockup .static-markdown-preview__prose ul ul{margin-top:var(--noute-type-list-nested-gap);margin-bottom:0;list-style-type:circle}.app-mockup .static-markdown-preview__prose ul ul ul{list-style-type:square}.app-mockup .static-markdown-preview__prose li{margin:0;padding-block:.08em}.app-mockup .static-markdown-preview__prose li+li{margin-top:var(--noute-type-list-item-gap)}.app-mockup .static-markdown-preview__prose li::marker{color:currentColor;font-size:var(--noute-type-list-marker-size)}.app-mockup .static-markdown-preview__prose li>:is(ul,ol):first-child{margin-top:var(--noute-type-list-nested-gap)}.app-mockup .static-markdown-preview__prose code{font-family:var(--font-monospace-theme);background:var(--noute-inline-code-bg);border-radius:var(--noute-inline-code-radius);padding:var(--noute-inline-code-pad-y) var(--noute-inline-code-pad-x);font-size:.92em}.app-mockup .app-mockup-fenced-code{margin:0 0 calc(var(--font-text-size) * var(--line-height-normal));background:color-mix(in srgb, var(--background-primary) 54%, var(--background-secondary));font-family:var(--font-monospace-theme);border-radius:0;font-size:.92em;line-height:1.5;overflow:hidden}.app-mockup .app-mockup-fenced-code__line{color:var(--text-normal);white-space:pre;padding:0 1em;position:relative}.app-mockup .app-mockup-tok--keyword{color:var(--tt-color-text-pink)}.app-mockup .app-mockup-tok--namespace,.app-mockup .app-mockup-tok--class{color:var(--tt-color-text-orange)}.app-mockup .app-mockup-tok--string{color:var(--tt-color-text-green)}.app-mockup .app-mockup-tok--property,.app-mockup .app-mockup-tok--function{color:var(--tt-color-text-blue)}.app-mockup .app-mockup-tok--comment{color:var(--text-faint);opacity:.72}.app-mockup .app-mockup-fenced-code__line:first-child{padding-top:.35em;padding-right:4.25em}.app-mockup .app-mockup-fenced-code__line:first-child:after{content:attr(data-lang);color:var(--text-faint);letter-spacing:.01em;font-size:.78em;font-weight:500;position:absolute;top:.43em;right:.75em}.app-mockup .app-mockup-fenced-code__line:last-child{padding-bottom:.35em}.app-mockup .statusbar{border-top:1px solid var(--hairline);background:color-mix(in srgb, var(--background) 94%, white);min-height:28px;color:color-mix(in srgb, var(--muted) 84%, var(--foreground));justify-content:space-between;align-items:center;gap:16px;padding:0 16px;font-size:11px;line-height:1.35;display:flex}
