:root{--bg:#15141a;--panel:#1e1d25;--border:#33313d;--fg:#e8e6ef;--dim:#9a97a8;--accent:#e6a23c;--err:#ff7b72;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--ok:#7ee787;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=light]{--bg:#fbf8f2;--panel:#f1ece2;--border:#d9d1c3;--fg:#24201a;--dim:#6b6458;--accent:#a8650f;--err:#c62828;--ok:#2e7d32;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--fg);flex-direction:column;font:14px/1.4 system-ui,sans-serif;display:flex}.toolbar{border-bottom:1px solid var(--border);align-items:center;gap:10px;padding:8px 12px;display:flex}.toolbar h1{color:var(--accent);margin:0 8px 0 0;font-size:15px}.toolbar button{font:inherit;border:1px solid var(--border);background:var(--panel);color:var(--fg);cursor:pointer;border-radius:4px;padding:4px 12px}.toolbar button:disabled{opacity:.45;cursor:default}#run-btn{border-color:var(--accent)}.examples select{font:inherit;background:var(--panel);color:var(--fg);border:1px solid var(--border);margin-left:4px}.status{color:var(--dim);font-family:var(--mono);margin-left:auto;font-size:12px}.spices{position:relative}.spices>summary{cursor:pointer;border:1px solid var(--border);background:var(--panel);border-radius:4px;padding:4px 10px;list-style:none}.spices>summary::-webkit-details-marker{display:none}.spices-panel{z-index:10;background:var(--panel);border:1px solid var(--border);border-radius:4px;width:340px;padding:10px;position:absolute;top:calc(100% + 4px);left:0}.spices-help{color:var(--dim);margin:0 0 8px;font-size:12px}.spice{cursor:pointer;grid-template-columns:auto auto 1fr;align-items:baseline;gap:6px;padding:3px 0;display:grid}.spice-name{font-family:var(--mono)}.spice-desc{color:var(--dim);font-size:12px}.lsp-status{color:var(--dim);font-family:var(--mono);font-size:12px}.fps{color:var(--ok);font-family:var(--mono);font-size:12px}.lsp-status[data-state=idle]:before{content:"●";color:var(--ok)}.lsp-status[data-state=booting]:before,.lsp-status[data-state=analyzing]:before{content:"●";color:var(--accent)}.no-jspi{border-bottom:1px solid var(--border);background:var(--panel);color:var(--err);padding:8px 12px}.panes{flex:1;grid-template-columns:1fr 1fr;min-height:0;display:grid}.editor-pane{border-right:1px solid var(--border);display:flex}.monaco-host{flex:1;min-width:0;min-height:0}#editor{resize:none;background:var(--bg);color:var(--fg);font:13px/1.5 var(--mono);tab-size:2;border:0;outline:none;flex:1;margin:0;padding:12px}.right{flex-direction:column;min-height:0;display:flex}.screen-host{aspect-ratio:16/9;border-bottom:1px solid var(--border);background:#000;justify-content:center;align-items:center;max-height:55%;display:flex}.screen-host iframe{border:0;width:100%;height:100%}.console{font:13px/1.5 var(--mono);white-space:pre-wrap;flex:1;margin:0;padding:8px 12px;overflow:auto}.console .err{color:var(--err)}.console .engine{color:var(--dim)}@media (width<=800px){html,body{height:auto}body{min-height:100%}.toolbar{flex-wrap:wrap;gap:6px 8px;padding:6px 10px}.toolbar h1{flex-basis:100%;margin:0}.toolbar button,.spices>summary{min-height:36px;padding:6px 12px}.examples select{max-width:60vw;min-height:36px}.status{flex-basis:100%;order:10;margin-left:0}.spices-panel{width:auto;position:fixed;top:auto;left:10px;right:10px}.panes{flex-direction:column;display:flex}.right{display:contents}.screen-host{order:1;width:100%;max-height:none}.editor-pane{border-right:0;border-bottom:1px solid var(--border);order:2;height:60vh}.console{flex:none;order:3;min-height:8em;max-height:40vh}}body.screen{background:#000;justify-content:center;align-items:center}body.screen #canvas{max-width:100%;max-height:100%;image-rendering:pixelated;outline:none}