:root{--bg: #1e1f22;--bg-elev: #2b2d30;--bg-topbar: #25272a;--bg-pane: #1e1f22;--bg-pane-header: #2b2d30;--fg: #bcbec4;--fg-dim: #868a91;--fg-strong: #dfe1e5;--border: #393b40;--border-soft: #2f3136;--accent: #cf8e6d;--accent-soft: rgba(207, 142, 109, .18);--link: #589df6;--danger: #e26f6f;--warn: #ffc66d;--ok: #6aab73;--tok-keyword: #cf8e6d;--tok-type: #ffc66d;--tok-string: #6aab73;--tok-number: #2aacb8;--tok-comment: #7a7e85;--tok-annotation: #b3ae60;--tok-function: #56a8f5;--tok-operator: #bcbec4;--tok-punct: #bcbec4;--cm-bg: #1e1f22;--cm-gutter-bg: #1e1f22;--cm-selection: #214283;--cm-active-line: rgba(255, 255, 255, .025);--cm-bracket-bg: rgba(255, 255, 255, .06);--console-bg: #1a1c1f;--console-line-divider: #26282c}body.theme-light{--bg: #ffffff;--bg-elev: #f2f2f2;--bg-topbar: #dfe1e5;--bg-pane: #ffffff;--bg-pane-header: #f2f2f2;--fg: #1a1a1a;--fg-dim: #5e6266;--fg-strong: #000000;--border: #c9ccd6;--border-soft: #e2e3e6;--accent: #cf5b00;--accent-soft: rgba(207, 91, 0, .12);--link: #1750eb;--danger: #c7222d;--warn: #a35b00;--ok: #067d17;--tok-keyword: #0033b3;--tok-type: #871094;--tok-string: #067d17;--tok-number: #1750eb;--tok-comment: #8c8c8c;--tok-annotation: #9e880d;--tok-function: #00627a;--tok-operator: #1a1a1a;--tok-punct: #1a1a1a;--cm-bg: #ffffff;--cm-gutter-bg: #fafafa;--cm-selection: #cfdfff;--cm-active-line: rgba(0, 0, 0, .03);--cm-bracket-bg: rgba(0, 0, 0, .05);--console-bg: #fafafa;--console-line-divider: #ececec}html,body{height:100%;margin:0;padding:0}body{background:var(--bg);color:var(--fg);font:14px/1.55 Inter,Segoe UI,-apple-system,system-ui,sans-serif;overflow:hidden}*{box-sizing:border-box}#app{display:grid;grid-template-areas:"topbar" "main";grid-template-rows:auto 1fr;height:100vh;min-height:0}#app.has-banner{grid-template-areas:"banner" "topbar" "main";grid-template-rows:auto auto 1fr}.playground-main{grid-area:main;display:grid;grid-template-rows:minmax(0,1fr) 240px;min-height:0;background:var(--bg)}.editor-region{display:grid;min-height:0;border-bottom:1px solid var(--border)}.playground-main[data-mode=repl] .editor-region{grid-template-columns:minmax(0,1fr)}.playground-main[data-mode=converter] .editor-region{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.converter-grid{display:contents}@media (max-width: 900px){body{overflow:auto}#app{height:auto;min-height:100vh}.playground-main{grid-template-rows:auto;min-height:0}.editor-region{grid-template-columns:minmax(0,1fr)!important}.playground-main[data-mode=repl] .pane-editor,.playground-main[data-mode=converter] .pane-input,.playground-main[data-mode=converter] .pane-output{min-height:320px}.console-pane{min-height:240px}}.donate-banner{grid-area:banner;display:flex;align-items:center;gap:16px;padding:10px 16px;background:var(--accent);color:#fff;border-bottom:1px solid rgba(0,0,0,.25);z-index:20}.donate-banner__text{flex:1 1 auto;margin:0;font-size:13px;font-weight:500;line-height:1.45}.donate-banner__text a{font-weight:700;color:#7c4110}.donate-banner__actions{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px}.donate-banner__donate{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:7px;background:#fff;color:var(--accent);font-size:12.5px;font-weight:700;text-decoration:none;border:1px solid rgba(0,0,0,.12);white-space:nowrap}.donate-banner__donate:hover{filter:brightness(.96)}.donate-banner__donate:active{transform:translateY(1px)}.donate-banner__heart{font-size:13px;line-height:1}.donate-banner__close{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;border:1px solid rgba(255,255,255,.5);background:transparent;color:#fff;font-size:13px;line-height:1;cursor:pointer}.donate-banner__close:hover{background:#ffffff2e}.donate-banner__close:active{transform:translateY(1px)}@media (max-width: 720px){.donate-banner{flex-wrap:wrap;gap:10px;padding:10px 12px}.donate-banner__text{flex:1 1 100%;font-size:12.5px}}.topbar{grid-area:topbar;display:flex;align-items:center;gap:12px;padding:0 14px;height:52px;background:var(--bg-topbar);border-bottom:1px solid var(--border);flex-shrink:0;z-index:10}.brand{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--fg-strong);font-size:14px;margin-right:8px}.brand-mark{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:6px;background:var(--accent-soft);color:var(--accent);font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;font-weight:700;border:1px solid var(--border)}.brand-text{letter-spacing:.01em}.segmented{display:inline-flex;background:var(--bg-elev);border:1px solid var(--border);border-radius:7px;padding:2px;gap:2px}.segmented.dir-segmented{display:none}.segmented.dir-segmented.is-visible{display:inline-flex}.seg-btn{appearance:none;background:transparent;border:none;color:var(--fg-dim);font:inherit;padding:5px 12px;border-radius:5px;cursor:pointer;font-size:12.5px;font-weight:500;transition:background 80ms ease,color 80ms ease}.seg-btn:hover{color:var(--fg)}.seg-btn.is-active{background:var(--bg);color:var(--fg-strong);box-shadow:inset 0 0 0 1px var(--border)}.spacer{flex:1 1 auto}.theme-toggle{appearance:none;background:var(--bg-elev);border:1px solid var(--border);border-radius:7px;color:var(--fg);cursor:pointer;font:inherit;font-size:12.5px;padding:6px 10px;display:inline-flex;align-items:center;gap:6px}.theme-toggle:hover{color:var(--fg-strong);border-color:var(--accent)}.theme-icon{font-size:14px;line-height:1}.run-btn{appearance:none;background:var(--accent);color:#fff;border:1px solid var(--accent);border-radius:7px;cursor:pointer;font:inherit;font-size:12.5px;font-weight:600;padding:6px 12px;display:inline-flex;align-items:center;gap:8px}.run-btn:hover{filter:brightness(1.08)}.run-btn:active{transform:translateY(1px)}.run-icon{font-size:10px}.run-kbd{background:#00000038;color:#ffffffeb;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10.5px;padding:2px 6px;border-radius:4px;font-weight:500}@media (max-width: 720px){.topbar{flex-wrap:wrap;height:auto;padding:8px 10px;gap:8px}.brand-text,.run-kbd{display:none}.spacer{flex:1 1 100%;order:99;display:none}}.pane{display:flex;flex-direction:column;min-height:0;background:var(--bg-pane);border-right:1px solid var(--border-soft)}.pane:last-child{border-right:none}.pane-header{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg-pane-header);border-bottom:1px solid var(--border-soft);flex-shrink:0;font-size:12px;color:var(--fg-dim)}.pane-title{font-weight:600;color:var(--fg-strong);font-size:12.5px;letter-spacing:.02em}.pane-badge{display:inline-flex;align-items:center;padding:1px 6px;border-radius:4px;background:var(--accent-soft);color:var(--accent);font-family:JetBrains Mono,ui-monospace,monospace;font-size:10.5px;font-weight:600}.pane-hint{margin-left:auto;font-size:11px;color:var(--fg-dim);text-transform:uppercase;letter-spacing:.05em}.editor-host{flex:1 1 auto;min-height:0;display:flex}.editor-host>.cm-editor{width:100%;height:100%}.cm-editor{outline:none!important}.console-pane{display:flex;flex-direction:column;min-height:0;background:var(--console-bg);border-top:1px solid var(--border)}.console-header{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;background:var(--bg-pane-header);border-bottom:1px solid var(--border-soft);flex-shrink:0}.console-title{font-size:12px;font-weight:600;color:var(--fg-strong);letter-spacing:.04em;text-transform:uppercase}.console-clear{appearance:none;background:transparent;border:1px solid transparent;color:var(--fg-dim);cursor:pointer;font:inherit;font-size:11px;padding:2px 8px;border-radius:4px}.console-clear:hover{color:var(--fg);border-color:var(--border)}.console-body{flex:1 1 auto;min-height:0;overflow:auto;padding:8px 12px;font-family:Source Code Pro,Fira Code,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;line-height:1.6}.console-line{display:flex;align-items:flex-start;gap:10px;padding:2px 0;border-bottom:1px dashed var(--console-line-divider);white-space:pre-wrap;word-break:break-word}.console-line:last-child{border-bottom:none}.console-badge{display:inline-block;flex-shrink:0;width:56px;font-size:10.5px;font-weight:600;text-align:right;padding-top:2px;letter-spacing:.04em;color:var(--fg-dim)}.console-msg{flex:1 1 auto;color:var(--fg)}.console-level-log .console-badge{color:var(--fg-dim)}.console-level-info .console-badge{color:var(--link)}.console-level-warn .console-badge,.console-level-warn .console-msg{color:var(--warn)}.console-level-error .console-badge,.console-level-error .console-msg{color:var(--danger)}.console-level-system .console-badge{color:var(--accent)}.console-level-system .console-msg{color:var(--fg-dim);font-style:italic}.console-search{display:flex;align-items:center;gap:8px;padding:6px 12px;background:var(--bg-pane-header);border-bottom:1px solid var(--border-soft);flex-shrink:0}.console-search[hidden]{display:none}.console-search-icon{font-size:12px;opacity:.7}.console-search-input{flex:1 1 auto;min-width:0;background:var(--bg);color:var(--fg);border:1px solid var(--border);border-radius:4px;padding:4px 8px;font:inherit;font-size:12.5px}.console-search-input:focus{outline:none;border-color:var(--accent)}.console-search-counter{color:var(--fg-dim);font-size:11px;font-family:JetBrains Mono,ui-monospace,monospace;min-width:36px;text-align:center}.console-search-btn{appearance:none;background:var(--bg-elev);border:1px solid var(--border);color:var(--fg);font:inherit;font-size:11px;padding:3px 8px;border-radius:4px;cursor:pointer;line-height:1.2}.console-search-btn:hover{border-color:var(--accent);color:var(--fg-strong)}.console-search-close{background:transparent;border-color:transparent;color:var(--fg-dim);padding:3px 6px;font-size:13px}.console-search-close:hover{color:var(--danger);border-color:transparent}mark.console-match{background:#ffc66d4d;color:inherit;border-radius:2px;padding:0 1px;outline:1px solid var(--tok-type)}mark.console-match.current{background:var(--tok-type);color:#1e1f22;outline:1px solid var(--tok-type)}body.theme-light mark.console-match.current{color:#fff}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--fg-dim)}
