:root{--bg: #0b0e13;--panel: #10141a;--head: #171d26;--border: #232c39;--text: #d7dde6;--dim: #7a8694;--accent: #7fd1ff;--ok: #8fd694;--err: #ff8a80;--result: #ffd479}*{box-sizing:border-box}html,body{height:100%;margin:0}body{display:flex;flex-direction:column;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px}#topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;background:var(--head);border-bottom:1px solid var(--border);flex:none}.brand{display:flex;align-items:baseline;gap:8px}.brand .logo{color:var(--accent);font-family:Menlo,monospace;font-size:18px;transform:translateY(1px)}.brand h1{font-size:16px;margin:0;letter-spacing:.5px}.brand .sub{color:var(--dim);font-size:12px}.controls{display:flex;align-items:center;gap:14px}.control{display:flex;align-items:center;gap:6px;color:var(--dim);font-size:12px}select,button{background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:5px;padding:5px 10px;font-size:13px;font-family:inherit;cursor:pointer}select:hover,button:hover{border-color:var(--accent)}button.primary{background:#1d4ed8;border-color:#1d4ed8;color:#fff;font-weight:600}button.primary:hover{background:#2563eb}main{flex:1;display:flex;min-height:0}#editor-pane{flex:1.4;display:flex;flex-direction:column;min-width:0;border-right:1px solid var(--border)}#output-pane{flex:1;display:flex;flex-direction:column;min-width:0}.pane-head{flex:none;padding:5px 12px;background:var(--head);border-bottom:1px solid var(--border);color:var(--dim);font-size:11px;text-transform:uppercase;letter-spacing:1px;display:flex;justify-content:space-between;align-items:center}.pane-head button{padding:1px 8px;font-size:11px;text-transform:none}#editor{flex:1;overflow:hidden}#editor .cm-editor{height:100%}.console{flex:1;overflow-y:auto;padding:10px 12px;font-family:SF Mono,Fira Code,Menlo,Consolas,monospace;font-size:12.5px;line-height:1.6;white-space:pre-wrap;word-break:break-word}.entry{color:var(--text)}.entry.divider{color:var(--dim);font-style:italic;margin-top:8px}.entry.divider:first-child{margin-top:0}.entry.out{color:#c3ccd8}.entry.result{color:var(--result)}.entry.error{color:var(--err)}#statusbar{flex:none;display:flex;justify-content:space-between;padding:4px 14px;background:var(--head);border-top:1px solid var(--border);color:var(--dim);font-size:12px;font-family:Menlo,monospace}#status.ok{color:var(--ok)}#status.err{color:var(--err)}
