:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);background:var(--background);--background:#f2f6fa;--surface:#fff;--surface-soft:#eaf1f6;--text:#183653;--muted:#5d7388;--border:#d5e1eb;--teal:#007d8b;--hover:#e0eff1;--split:50%;--syntax-function:#005a9c;--syntax-namespace:#006b5d;--syntax-variable:#604080;--syntax-keyword:#804080;--syntax-number:#875500;--syntax-string:#a32929;--syntax-comment:#687369;font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:14px}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--background:#0c1727;--surface:#142338;--surface-soft:#102033;--text:#e1edf9;--muted:#9eb3c9;--border:#2b4058;--hover:#203b50;--teal:#64d7d0;--syntax-function:#88c7ff;--syntax-namespace:#87d7bf;--syntax-variable:#ceaff0;--syntax-keyword:#dfafe2;--syntax-number:#e5c37c;--syntax-string:#f2a5a5;--syntax-comment:#a0b4a5}*{box-sizing:border-box}html [hidden]{display:none}body{margin:0}header{justify-content:space-between;align-items:center;gap:12px;padding:10px 28px;display:flex}.brand{border-radius:7px;flex-shrink:0;display:inline-flex}.brand img{width:246px;height:auto;display:block}.brand .brand-dark,:root[data-theme=dark] .brand-light{display:none}:root[data-theme=dark] .brand .brand-dark{display:block}.header-actions{align-items:center;gap:12px;display:flex}button,select,input{font:inherit;color:var(--text)}button,select,input[type=text]{background:var(--surface);border:1px solid var(--border);border-radius:5px;min-height:34px;padding:6px 10px}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}button:hover:enabled{background:var(--hover)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--teal);outline-offset:3px}.header-actions>button,.github-link{color:var(--muted);background:0 0;border:0;border-radius:7px;justify-content:center;align-items:center;width:36px;height:36px;padding:7px;display:inline-flex}.header-actions svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.github-link:hover{background:var(--hover)}.github-link svg{width:20px;height:20px}.project-actions{position:relative}.project-actions summary{cursor:pointer;color:var(--muted);border-radius:5px;align-items:center;gap:8px;padding:8px;font-weight:600;list-style:none;display:flex}.project-actions .menu-chevron{width:12px;height:12px}.project-actions summary::-webkit-details-marker{display:none}.project-actions summary:hover{background:var(--hover)}.project-actions .actions{z-index:10;background:var(--surface);border:1px solid var(--border);border-radius:8px;gap:6px;width:286px;padding:10px;display:grid;position:absolute;top:100%;right:0;box-shadow:0 16px 48px #0002}:where(.project-actions) .actions>button{text-align:left;border:0}main{max-width:1920px;margin:auto;padding:8px 28px 12px}.hint{color:var(--muted);font-size:12px}.workspace{grid-template-columns:minmax(0, var(--split)) 24px minmax(0, 1fr);height:calc(100dvh - 97px);min-height:430px;display:grid}.editor-pane,.preview-pane{flex-direction:column;min-width:0;min-height:0;display:flex}.pane-heading{flex-shrink:0;align-items:center;gap:8px;height:46px;display:flex}#save-state{text-align:right;flex:0 0 4.5em}.editor-tabs{flex:1;min-width:0;height:100%;display:flex}.editor-tabs button{color:var(--muted);background:0 0;border:0;border-bottom:2px solid #0000;border-radius:0;flex:1;justify-content:center;align-items:center;gap:9px;display:inline-flex}.editor-tabs button:hover:enabled{color:var(--teal);background:0 0}.editor-tabs svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;width:19px;height:19px}.editor-tabs button[aria-selected=true]{border-bottom-color:var(--teal);color:var(--teal);font-weight:600}.source-body{border:1px solid var(--border);background:var(--surface);border-radius:8px;flex:1;min-height:0;overflow:hidden}#editor{height:100%}#settings-controls{border:1px solid var(--border);background:var(--surface);border-bottom:0;border-radius:8px 8px 0 0;padding:8px 12px}.preview-options{font-size:12px}.cm-editor{color:var(--text);background:var(--surface)}.cm-editor .cm-gutters{background:var(--surface-soft);color:var(--muted);border-color:var(--border)}.cm-editor .cm-activeLine,.cm-editor .cm-activeLineGutter{background:color-mix(in srgb, var(--teal) 7%, transparent)}.cm-editor .cm-cursor{border-color:var(--text)}.cm-editor .cm-selectionBackground,.cm-editor.cm-focused .cm-selectionBackground{background:color-mix(in srgb, var(--teal) 24%, var(--surface))}.cm-editor .cm-tooltip,.cm-editor .cm-panels,.cm-editor .cm-foldPlaceholder{background:var(--surface-soft);color:var(--text);border-color:var(--border)}#divider{cursor:col-resize;touch-action:none;place-items:center;display:grid}#divider svg{width:12px;height:32px;fill:var(--border)}#divider:where(:hover) svg{fill:var(--teal)}.preview-pane>.pane-heading{padding:0 20px}.client-controls,.navigation,.zoom-controls{align-items:center;gap:4px;display:flex}.client-controls{color:var(--muted);white-space:nowrap;margin-right:auto;font-size:12px}.navigation button,.zoom-controls button{background:0 0;border:0;min-height:28px;padding:2px 5px;font-size:21px}#position{text-align:center;min-width:35px}#pages{color:var(--muted);white-space:nowrap;font-size:11px}#preview-state{width:18px;height:18px;color:var(--muted);flex-shrink:0}#preview-state svg{fill:none;stroke:currentColor;stroke-width:1.8px;width:100%;height:100%}#preview-state[data-state=ready]{visibility:hidden}#preview-state[data-state=updating] svg{animation:1.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}#preview-scroll{overflow-anchor:none;flex:1;min-height:0;padding:1px 20px 24px;overflow:auto}.preview-page{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background:#fff;margin:0 auto 20px;position:relative;box-shadow:0 2px 5px #15343f10,0 10px 28px #15343f0a}:root[data-theme=dark] .preview-page{box-shadow:0 3px 8px #0003,0 16px 40px #0003}.preview-page canvas{display:block}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.preview-overlay{pointer-events:none;position:absolute;inset:0}.envelope-window,.envelope-safe,.envelope-address{background:#ef74740a;border:1px dashed #d43c41;position:absolute}.envelope-address{background:0 0;border-color:#196fc0}.envelope-safe{background:0 0;border-color:#177669}.source-target{background:#ffcd5460;border-radius:3px;outline:2px solid #ce9821}.pdf-source-target{pointer-events:none;position:absolute}.feedback{background:var(--surface);border:1px solid var(--border);border-radius:6px;flex-shrink:0;max-height:24vh;margin-top:10px;padding:8px 12px;overflow:auto}#diagnostics{margin:0;padding:0;font-size:12px;list-style:none}#diagnostics li+li{margin-top:8px}#diagnostics .error{color:#ad302b}#diagnostics .warning{color:#876023}:root[data-theme=dark] #diagnostics .error{color:#ffaaa0}:root[data-theme=dark] #diagnostics .warning{color:#e8c38a}#diagnostics button{color:inherit;text-align:left;background:0 0;border:0;min-height:0;padding:0}#diagnostics details{color:var(--muted);margin-top:4px}:where(#diagnostics) pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px}.theme-panel{background:var(--surface);border:1px solid var(--border);border-radius:8px;flex:1;min-height:0;padding:20px;overflow:auto}.theme-starters{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;display:grid}.theme-starters label,.signature-name-field,.asset-upload{flex-direction:column;gap:6px;min-width:0;font-size:12px;display:flex}.theme-starters select{width:100%;min-width:0}#health-unit-undo{margin-bottom:12px;font-size:12px}.theme-pickers{grid-template-columns:minmax(0,1fr) repeat(3,max-content);align-items:end;gap:10px;margin-bottom:20px;display:grid}.theme-pickers label{flex-direction:column;gap:7px;font-size:12px;display:flex}.theme-pickers select{width:100%;min-width:0}.theme-pickers input[type=color]{background:var(--surface);border:1px solid var(--border);border-radius:5px;width:28px;height:28px;padding:2px}.asset-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.asset-card{min-width:0}.asset-card h3{margin:0 0 10px;font-size:14px}.asset-card h3 span{color:var(--muted);margin-left:5px;font-size:11px;font-weight:400}.asset-preview{background:var(--surface-soft);border:1px solid var(--border);height:76px;color:var(--muted);border-radius:5px;justify-content:center;align-items:center;margin-bottom:10px;padding:12px;font-size:12px;display:flex}.asset-preview:has(img:not([hidden])){--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background-color:#f8fafc;background-image:conic-gradient(#e9eef3 25%, transparent 0 50%, #e9eef3 0 75%, transparent 0);background-size:16px 16px}.asset-preview img{object-fit:contain;max-width:100%;max-height:100%}.asset-upload input{width:100%;font-size:11px}.asset-upload input::file-selector-button{font:inherit;background:var(--surface-soft);color:var(--text);border:1px solid var(--border);border-radius:4px;padding:6px}.signature-name-field{margin-top:12px}.asset-card code{overflow-wrap:anywhere;margin-top:10px;font-size:11px;display:block}.function-help{max-width:380px;padding:12px;font-size:12px}.function-help p,.function-help dl{margin:8px 0}.function-help dt{font-weight:600}.function-help dd{margin:2px 0 8px}.function-help pre{white-space:pre-wrap;font-size:11px}.function-help a{color:var(--teal)}#tour-dialog{width:100vw;max-width:none;height:100dvh;max-height:none;color:var(--text);background:0 0;border:0;margin:0;padding:0;overflow:visible}#tour-dialog::backdrop{background:#10243677}#tour-highlight{pointer-events:none;border-radius:8px;outline:3px solid #69d2d4;position:fixed;box-shadow:0 0 0 6px #69d2d426}#tour-arrow{color:#69d2d4;pointer-events:none;width:100%;height:100%;position:fixed;inset:0}#tour-card{border:1px solid var(--border);background:var(--surface);border-radius:10px;width:340px;max-width:calc(100vw - 32px);padding:18px;position:fixed;box-shadow:0 16px 48px #0003}#tour-card h2{margin:10px 0;font-size:18px}#tour-text{font-size:13px;line-height:1.6}.help-heading,.tour-navigation{justify-content:space-between;align-items:center;gap:12px;display:flex}#tour-progress{color:var(--muted);font-size:11px}#tour-close{background:0 0;border:0;min-height:24px}#tour-next{color:var(--teal);font-weight:600}@media (width<=1100px){.asset-grid{grid-template-columns:1fr}}@media (width<=850px){header{padding:10px 16px}main{padding:0 12px 12px}.workspace{flex-direction:column;height:auto;min-height:0;display:flex}.editor-pane{height:65dvh;min-height:380px}.preview-pane{height:80dvh;min-height:440px;margin-top:16px}#divider{display:none}.brand img{width:216px}}@media (width<=480px){.brand img{width:172px}.header-actions{gap:2px}.project-actions summary{gap:4px;padding:6px}.project-actions summary>svg:first-child{display:none}.editor-tabs button{gap:6px;padding-inline:8px;font-size:12px}.header-actions>button,.github-link{width:30px;padding:5px}.preview-pane>.pane-heading{gap:3px;padding:0 4px}.client-controls{font-size:11px}.theme-panel{padding:12px}}@media (width<=360px){.brand img{width:140px}}@media (prefers-reduced-motion:reduce){#preview-state[data-state=updating] svg{animation:none}}