body{--font-mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--radius:4px;--bg:oklch(95.8% .01 85);--panel:oklch(98.5% .006 90);--panel2:oklch(94.5% .01 85);--fg:oklch(28% .012 60);--fg-muted:oklch(50% .015 70);--fg-faint:oklch(66% .015 75);--border:oklch(90% .012 85);--active-line:#5a46280d;--selection:#5a462826;--accent:oklch(58% .125 40);--accent-hover:oklch(53% .125 40);--on-accent:oklch(98% .005 85);--ok:oklch(55% .11 150);--note:oklch(63% .11 80);--err:oklch(55% .16 30);--syn-keyword:oklch(48% .12 300);--syn-string:oklch(50% .1 150);--syn-number:oklch(50% .11 250);--syn-comment:oklch(66% .015 75);--syn-meta:oklch(48% .12 300)}body[data-theme=dark]{--bg:oklch(23.5% .008 65);--panel:oklch(27.5% .009 70);--panel2:oklch(31% .01 70);--fg:oklch(92% .01 85);--fg-muted:oklch(68% .012 80);--fg-faint:oklch(50% .01 75);--border:oklch(34% .01 70);--active-line:#fff0dc0d;--selection:#fff0dc29;--accent:oklch(66% .125 40);--accent-hover:oklch(71% .125 40);--on-accent:oklch(98% .005 85);--ok:oklch(72% .11 150);--note:oklch(76% .1 85);--err:oklch(68% .14 30);--syn-keyword:oklch(75% .1 300);--syn-string:oklch(76% .09 150);--syn-number:oklch(75% .09 250);--syn-comment:oklch(50% .01 75);--syn-meta:oklch(75% .1 300)}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%}body{font-family:var(--font-mono);background:var(--bg);color:var(--fg);font-size:13px}#app{--output-height:220px;grid-template-rows:auto 1fr var(--output-height) auto;display:grid}.spacer{flex:1}.hidden{display:none!important}@keyframes spin{to{transform:rotate(360deg)}}.topbar{border-bottom:1px solid var(--border);background:var(--panel);align-items:center;gap:24px;padding:10px 16px;display:flex}.brand{letter-spacing:.02em;font-weight:700}.brand-mark{color:var(--accent);margin-right:2px}.brand sup{color:var(--fg-muted);font-weight:400}.actions{gap:8px;display:flex}.btn{font:inherit;color:var(--fg);background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;padding:4px 12px;transition:background .15s}.btn:hover{border-color:var(--fg-faint);background:var(--active-line)}.btn:active{background:var(--panel2)}.btn-primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn-small{padding:1px 8px;font-size:12px}.select,.input{font:inherit;width:100%;color:var(--fg);background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:5px 8px}.select:focus,.input:focus{border-color:var(--accent);outline:none}.input::placeholder{color:var(--fg-faint)}.main{min-height:0;display:flex}.editor{flex:1;min-width:0;overflow:hidden}.editor .cm-editor{height:100%}.settings{border-left:1px solid var(--border);background:var(--panel);flex-direction:column;flex-shrink:0;gap:8px;width:340px;padding:16px;display:flex;overflow-y:auto}.settings.hidden{display:none}.panel-title{text-transform:uppercase;letter-spacing:.12em;color:var(--fg-muted);font-size:11px;font-weight:700}.field-label{letter-spacing:.08em;color:var(--fg-muted);margin-top:12px;font-size:11px}.credit{color:var(--fg-faint);margin-top:auto;padding-top:16px;font-size:11px}.credit a{color:var(--fg-muted);border-bottom:1px solid var(--border);text-decoration:none}.credit a:hover{color:var(--accent);border-bottom-color:var(--accent)}.compiler-status{color:var(--fg-muted);flex-direction:column;gap:5px;margin-top:2px;font-size:11px;display:flex}.progress{background:var(--panel2);border-radius:2px;height:3px;overflow:hidden}.progress-fill{background:var(--accent);width:0%;height:100%;transition:width .15s}.output{border-top:1px solid var(--border);background:var(--panel);flex-direction:column;min-height:0;display:flex;position:relative}.output-resizer{cursor:ns-resize;z-index:10;height:8px;position:absolute;top:-4px;left:0;right:0}.output-resizer:after{content:"";background:0 0;height:2px;transition:background .15s;position:absolute;top:3px;left:0;right:0}.output-resizer:hover:after,.output-resizer.dragging:after{background:var(--accent)}.output-header{border-bottom:1px solid var(--border);align-items:center;padding:6px 16px;display:flex}.console{flex:1;padding:10px 16px;font-family:inherit;line-height:1.6;overflow-y:auto}.line-cmd{font-weight:700}.line-info{color:var(--fg-muted)}.line-success{color:var(--ok)}.line-note{color:var(--note);font-style:italic}.line-warn{color:var(--note)}.line-err{color:var(--err)}.statusbar{border-top:1px solid var(--border);background:var(--panel);color:var(--fg-muted);gap:16px;padding:5px 16px;font-size:11px;display:flex}.state{align-items:center;gap:6px;display:inline-flex}.state-done{color:var(--ok)}.state-error{color:var(--err)}.spinner{border:1.5px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:10px;height:10px;animation:.8s linear infinite spin;display:inline-block}.dot{background:var(--ok);border-radius:50%;width:5px;height:5px;display:inline-block}.dot-error{background:var(--err)}.cm-lintRange{text-underline-offset:3px;background-image:none;text-decoration-line:underline;text-decoration-style:wavy;text-decoration-thickness:1px}.cm-lintRange-error{-webkit-text-decoration-color:var(--err);text-decoration-color:var(--err)}.cm-lintRange-warning{-webkit-text-decoration-color:var(--note);text-decoration-color:var(--note)}.cm-tooltip{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);color:var(--fg);font-family:var(--font-mono);font-size:12px}.cm-tooltip .cm-diagnostic{border-left:none;padding:4px 8px}.cm-tooltip .cm-diagnostic-error{border-left:2px solid var(--err)}.cm-tooltip .cm-diagnostic-warning{border-left:2px solid var(--note)}.tok-keyword{color:var(--syn-keyword);font-weight:600}.tok-string,.tok-string2,.tok-character{color:var(--syn-string)}.tok-number{color:var(--syn-number)}.tok-comment{color:var(--syn-comment);font-style:italic}.tok-meta,.tok-annotation{color:var(--syn-meta)}.tok-atom,.tok-bool,.tok-definition{color:var(--syn-number)}