:root{--bg:#f6f5f1;--panel:#fff;--canvas-bg:#e9e7e0;--fg:#1d1d1b;--muted:#6b6a65;--accent:#2f6f4f;--accent-soft:#2f6f4f22;--border:#d6d4cc;--danger:#b3261e;--select:#1a73e8;--guide:#e5007a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--fg);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#1b1f1d;--panel:#232826;--canvas-bg:#141715;--fg:#ecebe6;--muted:#a3a29b;--accent:#7fc7a0;--accent-soft:#7fc7a022;--border:#3a403c;--danger:#f2b8b5}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;overflow:hidden}button,input,select,textarea{font:inherit;color:inherit}.editor{-webkit-user-select:none;user-select:none;grid-template:"toolbar toolbar toolbar"48px"slides canvas props"1fr"status status status"26px/208px 1fr 264px;height:100%;display:grid}.toolbar{background:var(--panel);border-bottom:1px solid var(--border);grid-area:toolbar;align-items:center;gap:12px;padding:0 12px;display:flex}.brand{color:var(--accent);margin-right:4px;font-size:17px;font-weight:700}.tool-group{border-left:1px solid var(--border);gap:2px;padding-left:12px;display:flex}.spacer{flex:1}.tool-button{cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:6px;min-width:32px;height:32px;padding:0 7px;display:inline-flex}.tool-button:hover:not(:disabled){background:var(--accent-soft)}.tool-button{position:relative}.tool-button.text-only{color:var(--muted);font-size:13px}.badge{background:var(--accent);border-radius:50%;width:7px;height:7px;position:absolute;top:4px;right:4px}.tool-button.active{border-color:var(--accent);background:var(--accent-soft)}.tool-button:disabled{opacity:.35;cursor:default}.icon{flex:none}select,input[type=number]{border:1px solid var(--border);background:var(--panel);border-radius:6px;padding:4px 6px}.slide-panel{background:var(--panel);border-right:1px solid var(--border);flex-direction:column;grid-area:slides;min-height:0;display:flex}.slide-list{flex:1;margin:0;padding:12px 8px;list-style:none;overflow-y:auto}.slide-item{cursor:pointer;touch-action:none;border-radius:6px;align-items:flex-start;gap:6px;padding:6px 4px;display:flex;position:relative}.slide-item.drop-before:before,.slide-item.drop-after:after{content:"";background:var(--accent);border-radius:2px;height:3px;position:absolute;left:4px;right:4px}.slide-item.drop-before:before{top:-2px}.slide-item.drop-after:after{bottom:-2px}.slide-number{width:14px;color:var(--muted);text-align:right;font-size:12px}.thumbnail{outline:1px solid var(--border);pointer-events:none;border-radius:3px;overflow:hidden}.slide-item.current .thumbnail{outline:2px solid var(--accent)}.slide-actions{border-top:1px solid var(--border);justify-content:center;gap:4px;padding:6px;display:flex}.canvas-area{background:var(--canvas-bg);grid-area:canvas;min-width:0;min-height:0;position:relative}.canvas-viewport{touch-action:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0;overflow:hidden}.canvas-stage{flex:none;position:relative;box-shadow:0 2px 12px #0003}.slide{position:relative;overflow:hidden}.element{transform-origin:50%;position:absolute}.text-view{overflow-wrap:break-word;width:100%;height:100%;line-height:1.25}.rich-text{white-space:pre-wrap}.rich-text p{margin:0}.rich-text ul,.rich-text ol{margin:0;padding-left:1.2em}.rich-text code{font-family:ui-monospace,monospace;font-size:.9em}.text-editor{-webkit-user-select:text;user-select:text;cursor:text;outline:none;min-height:100%}.math-view{width:100%;height:100%}.math-view svg{width:100%;height:100%;display:block}.inline-math{display:inline-block}.inline-math svg{width:100%;height:100%;display:block}.stale{opacity:.55}.math-error,.math-pending{color:var(--danger);white-space:pre-wrap;font-family:ui-monospace,monospace;font-size:.6em}.math-pending{color:var(--muted)}.inline-math-node{border-radius:.1em;position:relative}.inline-math-node.selected{outline:.04em solid var(--select);background:#1a73e822}.inline-math-popover{z-index:10;text-align:left;color:var(--fg);background:var(--panel);border:2px solid var(--select);border-radius:8px;flex-direction:column;gap:4px;margin-top:8px;padding:8px;font-size:28px;font-style:normal;font-weight:400;line-height:1.3;display:flex;position:absolute;top:100%;left:0;box-shadow:0 6px 20px #0004}.inline-math-popover input{border:1px solid var(--border);background:var(--bg);border-radius:6px;width:16em;padding:4px 8px;font-family:ui-monospace,monospace}.popover-error{max-width:16em;color:var(--danger);font-size:.75em}.math-editor-panel{z-index:20;background:var(--panel);border:1px solid var(--border);border-radius:10px;flex-direction:column;width:min(760px,100% - 32px);display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%);box-shadow:0 8px 30px #0003}.math-editor-header{border-bottom:1px solid var(--border);align-items:center;gap:12px;padding:8px 10px;display:flex}.math-editor-header .hint{flex:1;margin:0}.tabs{gap:2px;display:flex}.tab{cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px 10px}.tab.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.code-editor .cm-editor{max-height:180px;font-size:16px}.code-editor .cm-editor.cm-focused{outline:none}.code-editor .cm-scroller{padding:8px 4px;font-family:ui-monospace,monospace}.visual-math-editor{min-height:72px;padding:10px}.visual-math-editor math-field{width:100%;color:var(--fg);background:0 0;border:none;outline:none;font-size:26px;display:block}.math-status{color:var(--accent);border-top:1px solid var(--border);padding:6px 12px;font-size:12px}.math-status.error{color:var(--danger)}.code-input{border:1px solid var(--border);background:var(--bg);resize:vertical;-webkit-user-select:text;user-select:text;border-radius:6px;width:100%;padding:6px 8px;font-family:ui-monospace,monospace;font-size:13px}.overlay{pointer-events:none;position:absolute;top:0;left:0}.overlay>*{position:absolute}.outline{outline-style:solid;outline-color:var(--select)}.outline.locked{outline-style:dashed;outline-color:var(--muted)}.handles{transform-origin:50%}.handle{border-style:solid;border-color:var(--select);pointer-events:auto;background:#fff;position:absolute}.handle.rotate{cursor:grab;border-radius:50%}.rotate-stem{background:var(--select);position:absolute;left:50%}.guide{background:var(--guide)}.marquee{border-style:solid;border-color:var(--select);background:#1a73e81a}.properties{background:var(--panel);border-left:1px solid var(--border);grid-area:props;padding:4px 14px 16px;overflow-y:auto}.prop-section{border-bottom:1px solid var(--border);padding:10px 0}.prop-section h2{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;font-size:12px;font-weight:600}.grid-2{grid-template-columns:1fr 1fr;gap:8px;display:grid}.number-field,.field{flex-direction:column;gap:3px;margin-bottom:8px;display:flex}.number-field input{width:100%}.field-label{color:var(--muted);font-size:12px}.field-controls{align-items:center;gap:8px;display:flex}.field-controls .number-field{flex:1;margin:0}input[type=color]{border:1px solid var(--border);background:var(--panel);cursor:pointer;border-radius:6px;width:40px;height:28px;padding:0 2px}.check{cursor:pointer;align-items:center;gap:6px;display:inline-flex}.button-row{flex-wrap:wrap;gap:4px;margin-bottom:8px;display:flex}.button-row.wrap{flex-wrap:wrap}.small-button{border:1px solid var(--border);background:var(--panel);cursor:pointer;border-radius:6px;align-items:center;gap:4px;padding:4px 8px;display:inline-flex}.small-button:hover{background:var(--accent-soft)}.small-button.active{border-color:var(--accent);background:var(--accent-soft)}.small-button.primary{color:#fff;border-color:var(--accent);background:var(--accent)}.small-button.danger{color:var(--danger)}.hint{color:var(--muted);margin:8px 0 0;font-size:12px;line-height:1.45}.hint.error{color:var(--danger);overflow-wrap:anywhere}.status-file{flex:1}.status-link{color:var(--accent);font-weight:600}.status-bar{color:var(--muted);background:var(--panel);border-top:1px solid var(--border);grid-area:status;align-items:center;gap:24px;padding:0 12px;font-size:12px;display:flex}.sim-view{background:#fff;width:100%;height:100%;position:relative;overflow:hidden}.sim-view iframe{transform-origin:0 0;background:#fff;border:none;position:absolute;top:0;left:0}.element.interacting{outline:6px solid var(--accent)}.sim-placeholder{color:#4a5a52;background:repeating-linear-gradient(45deg,#eef2ef,#eef2ef 24px,#e3e9e5 24px 48px);flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;height:100%;font-size:48px;display:flex;overflow:hidden}.sim-placeholder-icon{color:#2f6f4f;font-family:ui-monospace,monospace;font-size:120px;font-weight:700}.html-editor-panel .code-editor .cm-editor{height:42vh;max-height:none;font-size:14px}.text-input{border:1px solid var(--border);background:var(--panel);-webkit-user-select:text;user-select:text;border-radius:6px;width:100%;padding:4px 6px}.properties select{width:100%;margin-bottom:8px}