@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{color:#ecf1f8;font-synthesis:none;text-rendering:optimizelegibility;background:#080a0f;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 12% 0,#5448ff21,#0000 31%),radial-gradient(circle at 100% 12%,#20c5a014,#0000 26%),#080a0f;min-width:320px;min-height:100vh;margin:0}button,input,textarea,select{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:2px;outline:2px solid #7bebc6ad}.app-shell{min-height:100vh}.topbar{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);z-index:10;background:#080a0fc2;border-bottom:1px solid #ffffff12;justify-content:space-between;align-items:center;gap:20px;min-height:76px;padding:14px clamp(18px,3vw,42px);display:flex;position:sticky;top:0}.brand{align-items:center;gap:12px;display:flex}.brand-icon{color:#08100e;background:linear-gradient(135deg,#b8ffe4,#5ce0bb);border-radius:12px;place-items:center;width:42px;height:42px;display:grid;box-shadow:0 8px 26px #4ddfb533}.brand-name{letter-spacing:-.02em;font-size:18px;font-weight:700}.brand-subtitle{color:#778297;margin-top:1px;font-size:12px}.top-actions{align-items:center;gap:8px;display:flex}.button{cursor:pointer;white-space:nowrap;border:0;border-radius:10px;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:0 14px;font-weight:600;transition:transform .16s,border-color .16s,background .16s,opacity .16s;display:inline-flex}.button:hover{transform:translateY(-1px)}.button:disabled{opacity:.5;cursor:not-allowed;transform:none}.button.ghost{color:#cad2df;background:#ffffff0b;border:1px solid #ffffff14}.button.ghost:hover{background:#ffffff13}.button.primary{color:#07100d;background:#86f0c8;box-shadow:0 7px 24px #49d8ab2b}.button.run{color:#07100d;background:#86f0c8;min-height:36px}.button.stop{color:#ff9ba5;background:#ff637221;border:1px solid #ff637238;min-height:36px}.button.subtle{color:#bcc6d6;background:#ffffff0c;border:1px solid #ffffff13;min-height:36px}.button.layered{color:#c9c4ff;background:#7669ff21;border:1px solid #877cff3d;min-height:36px}.button.mini{min-height:31px;padding:0 10px;font-size:11.5px}.button.danger,.icon-button.danger{color:#ff9ba5;background:#ff637214;border:1px solid #ff637229}.workspace{grid-template-columns:minmax(430px,.82fr) minmax(600px,1.18fr);align-items:start;gap:22px;width:min(1700px,100%);margin:0 auto;padding:28px clamp(16px,2.5vw,38px) 42px;display:grid}.panel{background:#0f121ae0;border:1px solid #ffffff13;border-radius:17px;overflow:hidden;box-shadow:0 24px 60px #0000002b}.editor-panel{padding:14px}.mode-tabs{background:#0a0c12;border:1px solid #ffffff0e;border-radius:12px;grid-template-columns:repeat(3,1fr);gap:5px;padding:5px;display:grid}.mode-tab{color:#79869a;cursor:pointer;background:0 0;border:0;border-radius:8px;justify-content:center;align-items:center;gap:7px;min-height:39px;font-weight:650;display:inline-flex}.mode-tab:hover{color:#c7d0df;background:#ffffff09}.mode-tab.active{color:#eaf9f3;background:#6ee8c11b;box-shadow:inset 0 0 0 1px #6febc329}.panel-heading{justify-content:space-between;align-items:center;gap:16px;min-height:88px;padding:18px 4px 12px;display:flex}.panel-heading h2,.preview-heading h2{letter-spacing:-.015em;margin:0;font-size:17px}.panel-heading p{color:#778398;max-width:520px;margin:5px 0 0;font-size:12px;line-height:1.45}.code-editor,.stdin-wrap textarea,.compact-field input{color:#dce4f1;background:#0a0d13;border:1px solid #ffffff13;outline:none;width:100%}.code-editor,.stdin-wrap textarea{resize:vertical;tab-size:4;border-radius:11px;font-family:JetBrains Mono,Consolas,monospace;line-height:1.62}.code-editor:focus,.stdin-wrap textarea:focus,.compact-field input:focus{border-color:#6febc373;box-shadow:0 0 0 3px #53d7ad12}.code-editor{min-height:340px;padding:15px 16px;font-size:13.5px}.code-editor.sql-editor{min-height:300px}.output-editor{min-height:420px}.source-row{grid-template-columns:minmax(180px,1fr) auto;align-items:end;gap:10px;margin-bottom:10px;display:grid}.compact-field{min-width:0;display:block}.compact-field>span{color:#8793a7;margin-bottom:6px;font-size:11px;font-weight:650;display:block}.compact-field input{border-radius:9px;height:38px;padding:0 11px}.compact-field.grow{flex:260px}.filename-field{flex:0 210px}.stdin-wrap{margin-top:12px;display:block}.stdin-wrap>span,.field>span,.field.wide>span{color:#99a4b7;margin:0 0 7px;font-size:12px;font-weight:600;display:block}.stdin-wrap small{color:#626e82;font-weight:500}.stdin-wrap textarea{min-height:108px;padding:11px 13px;font-size:12.5px}.input-fix-note{color:#91a0b5;background:#63e7bd0b;border:1px solid #63e7bd17;border-radius:9px;margin-top:9px;padding:9px 11px;font-size:11.5px;line-height:1.5}.input-fix-note code{color:#9ef0d0;font-family:JetBrains Mono,monospace}.run-status{opacity:0;color:#8d99ad;align-items:center;gap:7px;height:0;font-size:12px;transition:all .2s;display:flex;overflow:hidden}.run-status.visible{opacity:1;height:31px;padding-top:9px}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.sql-session-banner{background:linear-gradient(135deg,#6ee8c116,#594de00e);border:1px solid #70e3c121;border-radius:11px;justify-content:space-between;align-items:center;gap:12px;margin-bottom:11px;padding:10px 11px;display:flex}.sql-session-banner>div{align-items:center;gap:9px;min-width:0;display:flex}.sql-session-banner strong{color:#d9f6eb;font-size:12.5px;display:block}.sql-session-banner small{color:#7e8ca1;white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:10.5px;display:block;overflow:hidden}.sql-step-strip{scrollbar-width:thin;align-items:stretch;gap:6px;padding:2px 1px 10px;display:flex;overflow-x:auto}.sql-step-tab{color:#8c98ab;cursor:pointer;text-align:left;background:#0b0e15;border:1px solid #ffffff12;border-radius:10px;flex:0 0 min(185px,38vw);grid-template-columns:25px minmax(0,1fr) 8px;align-items:center;gap:7px;min-width:125px;height:48px;padding:0 10px;display:grid}.sql-step-tab:hover{color:#c5cfdd;border-color:#ffffff21}.sql-step-tab.active{color:#e2dfff;background:#786aff1c;border-color:#8b80ff40}.sql-step-tab span{background:#ffffff0e;border-radius:7px;place-items:center;width:24px;height:24px;font-size:11px;font-weight:700;display:grid}.sql-step-tab em{white-space:nowrap;text-overflow:ellipsis;font-size:11.5px;font-style:normal;font-weight:650;overflow:hidden}.sql-step-tab i{background:#6de0b8;border-radius:50%;width:7px;height:7px;box-shadow:0 0 8px #6de0b873}.sql-add-step{color:#8d99ad;cursor:pointer;background:#ffffff06;border:1px dashed #ffffff21;border-radius:10px;flex:0 0 48px}.sql-add-step:hover{color:#d9e1ed;border-color:#6febc34d}.sql-step-meta{align-items:end;gap:9px;margin:2px 0 10px;display:flex}.icon-button{cursor:pointer;border-radius:9px;flex:0 0 38px;place-items:center;height:38px;display:grid}.icon-button:disabled{opacity:.35;cursor:not-allowed}.sql-run-actions{flex-wrap:wrap;gap:8px;margin-top:11px;display:flex}.sql-help{color:#707d91;margin:10px 2px 0;font-size:11.5px;line-height:1.55}.sql-help strong{color:#9faabd}.settings-toggle{cursor:pointer;color:#cfd7e5;background:0 0;border:0;border-top:1px solid #fff1;justify-content:space-between;align-items:center;width:100%;margin-top:14px;padding:14px 3px 10px;font-weight:650;display:flex}.settings-toggle span{align-items:center;gap:8px;display:inline-flex}.settings-toggle svg{transition:transform .2s}.settings-toggle svg.rotated{transform:rotate(180deg)}.settings-grid{grid-template-columns:1fr 1fr;gap:14px 12px;padding:7px 2px 3px;display:grid}.field{min-width:0;position:relative}.field.wide,.wide{grid-column:1/-1}.field input:not([type=range]),.field select{color:#e1e8f3;background:#0b0e14;border:1px solid #ffffff13;border-radius:9px;outline:none;width:100%;height:39px;padding:0 11px}.field select{appearance:none;background-image:linear-gradient(45deg,#0000 50%,#7f899b 50%),linear-gradient(135deg,#7f899b 50%,#0000 50%);background-position:calc(100% - 16px) 16px,calc(100% - 11px) 16px;background-repeat:no-repeat;background-size:5px 5px}.field input[type=range]{accent-color:#77e4bd;width:calc(100% - 46px)}.field output{color:#778397;font-size:12px;position:absolute;bottom:2px;right:0}.swatches{flex-wrap:wrap;gap:9px;display:flex}.swatch{cursor:pointer;border:2px solid #0000;border-radius:10px;width:34px;height:34px;box-shadow:inset 0 0 0 1px #ffffff1f}.swatch.selected{border-color:#dffcf2;box-shadow:0 0 0 2px #53dcb13b}.transparent-swatch{background-color:#fff!important;background-image:linear-gradient(45deg,#d7d7d7 25%,#0000 25%),linear-gradient(-45deg,#d7d7d7 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#d7d7d7 75%),linear-gradient(-45deg,#0000 75%,#d7d7d7 75%)!important;background-position:0 0,0 6px,6px -6px,-6px 0!important;background-size:12px 12px!important}.glass-preset{color:#d9f8ec;cursor:pointer;background:linear-gradient(135deg,#86f0c81a,#ffffff09);border:1px solid #86f0c833;border-radius:10px;justify-content:center;align-items:center;gap:8px;min-height:42px;font-weight:650;display:flex}.glass-preset:hover{background:linear-gradient(135deg,#86f0c829,#ffffff0e)}.toggle-list{flex-wrap:wrap;gap:8px 18px;padding-top:2px;display:flex}.toggle-row{color:#a8b2c3;cursor:pointer;align-items:center;gap:8px;font-size:12.5px;display:flex}.toggle-row input{accent-color:#72e3ba}.preview-panel{position:sticky;top:98px}.preview-heading{border-bottom:1px solid #fff1;justify-content:space-between;align-items:center;gap:16px;min-height:78px;padding:14px 20px;display:flex}.eyebrow{color:#6f7b8f;letter-spacing:.12em;text-transform:uppercase;margin-bottom:5px;font-size:10.5px;font-weight:700;display:block}.preview-heading-actions{align-items:center;gap:9px;display:flex}.preview-kind-switch{background:#090b10;border:1px solid #fff1;border-radius:9px;align-items:center;padding:3px;display:flex}.preview-kind-switch button{color:#758196;cursor:pointer;background:0 0;border:0;border-radius:7px;align-items:center;gap:6px;height:31px;padding:0 10px;font-size:11.5px;font-weight:650;display:inline-flex}.preview-kind-switch button.active{color:#dff7ef;background:#74e8c31b}.resolution-pill{color:#8d99ac;background:#0a0c11;border:1px solid #ffffff14;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:700}.preview-scroller{background:#090b10;max-height:calc(100vh - 210px);padding:22px;overflow:auto}.preview-scroller.show-transparency{background-color:#171717;background-image:linear-gradient(45deg,#252525 25%,#0000 25%),linear-gradient(-45deg,#252525 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#252525 75%),linear-gradient(-45deg,#0000 75%,#252525 75%);background-position:0 0,0 14px,14px -14px,-14px 0;background-size:28px 28px}.capture-canvas{justify-content:center;align-items:center;min-height:420px;margin:auto;display:flex}.terminal-window{border-radius:var(--terminal-radius);background:var(--terminal-bg);width:100%;-webkit-backdrop-filter:var(--terminal-blur);color:var(--terminal-text);overflow:hidden}.terminal-window.with-shadow,.code-window.with-shadow{box-shadow:0 3px 40px -15px #14191f2b}.terminal-titlebar{min-height:var(--titlebar-height);border-bottom:1px solid var(--titlebar-divider);grid-template-columns:112px 1fr 112px;align-items:center;padding:0 23px;display:grid}.window-controls{align-items:center;gap:9px;display:flex}.dot{border-radius:50%;width:14px;height:14px}.dot.red,.dot.yellow,.dot.green{background:#abadb0}.terminal-title{text-align:center;color:var(--terminal-muted);white-space:nowrap;text-overflow:ellipsis;font-family:DM Sans,sans-serif;font-size:14px;font-weight:600;overflow:hidden}.terminal-body{min-height:260px;padding:24px 25px 27px;overflow:visible}.command-line{font-family:JetBrains Mono,Consolas,monospace;font-size:var(--terminal-font-size);white-space:pre;align-items:baseline;gap:9px;margin-bottom:12px;line-height:1.65;display:flex}.prompt{color:var(--terminal-accent);font-weight:600}.terminal-body pre{white-space:pre;overflow-wrap:normal;color:var(--terminal-text);font-family:JetBrains Mono,Consolas,monospace;font-size:var(--terminal-font-size);tab-size:4;margin:0;line-height:1.65}.terminal-body pre.placeholder-output{color:var(--terminal-muted)}.preview-footer{color:#677286;border-top:1px solid #ffffff0f;padding:12px 20px 14px;font-size:11.5px;line-height:1.45}.code-window{border-radius:var(--terminal-radius,30px);color:#222831;background:#fff;border:1px solid #c8c8c5;width:100%;overflow:hidden}.candy-window{color:#222831;background:#fff}.code-titlebar{min-height:var(--titlebar-height,54px);border-bottom:1px solid #d6d4cf;grid-template-columns:112px minmax(0,1fr) 112px;align-items:center;padding:0 23px;display:grid}.code-title{text-align:center;color:#8b8d91;white-space:nowrap;text-overflow:ellipsis;min-width:0;font-family:DM Sans,system-ui,sans-serif;font-size:14px;font-weight:600;overflow:hidden}.code-body{background:#fff;min-height:260px;padding:25px 25px 29px;overflow:visible}.code-line{min-height:calc(var(--code-font-size) * 1.65);font-family:JetBrains Mono,Consolas,monospace;font-size:var(--code-font-size);white-space:pre;padding:0;line-height:1.65;display:block}.code-line code{color:#2b3139}.token-comment{color:#8b9098;font-style:italic}.token-string{color:#b16b00}.token-number{color:#6555e8}.token-keyword{color:#f00062;font-weight:500}.token-builtin{color:#008fb5}.token-function{color:#00a33d}.token-plain{color:inherit}@media (width<=1160px){.workspace{grid-template-columns:1fr}.preview-panel{position:static}.preview-scroller{max-height:none}}@media (width<=760px){.topbar{align-items:flex-start}.brand-subtitle,.top-actions .ghost{display:none}.top-actions .primary{padding:0 11px;font-size:12px}.workspace{padding-top:16px}.editor-panel{padding:12px}.mode-tab{font-size:12px}.settings-grid{grid-template-columns:1fr}.field.wide,.wide{grid-column:auto}.preview-scroller{padding:12px}.preview-heading{align-items:flex-start}.preview-heading-actions{flex-direction:column-reverse;align-items:flex-end}.resolution-pill{display:none}.source-row{grid-template-columns:1fr}.source-row .button{width:100%}.sql-step-meta{flex-wrap:wrap}.filename-field{flex:180px}.sql-session-banner{align-items:flex-start}.sql-session-banner small{white-space:normal}}.login-page{background:radial-gradient(circle at top,#fff 0%,#eef1f5 48%,#dfe4ea 100%);place-items:center;min-height:100vh;padding:24px;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:grid}.login-window{background:#fff;border:1px solid #c8c8c5;border-radius:22px;width:min(440px,100%);overflow:hidden;box-shadow:0 30px 70px #171e282e,0 8px 22px #171e281a}.login-titlebar{background:#f3f2ef;border-bottom:1px solid #d3d3d0;grid-template-columns:1fr auto 1fr;align-items:center;height:58px;padding:0 20px;display:grid;position:relative}.login-titlebar .window-controls{align-items:center;gap:9px;display:flex}.login-titlebar .dot{border:1px solid #0000001f;border-radius:50%;width:14px;height:14px;display:block}.login-titlebar .dot.red{background:#ff5f57}.login-titlebar .dot.yellow{background:#febc2e}.login-titlebar .dot.green{background:#28c840}.login-title{color:#74767b;font-size:15px;font-weight:650}.login-body{padding:38px}.login-icon{color:#00875a;background:#eaf8f1;border:1px solid #c9ebdc;border-radius:16px;place-items:center;width:58px;height:58px;margin-bottom:24px;font-family:JetBrains Mono,Cascadia Code,monospace;font-size:22px;font-weight:700;display:grid}.login-body h1{color:#222831;margin:0 0 8px;font-size:28px;line-height:1.2}.login-body p{color:#777b82;margin:0 0 28px;font-size:15px}.login-body label{color:#343940;margin-bottom:8px;font-size:13px;font-weight:700;display:block}.login-body input{box-sizing:border-box;color:#222831;width:100%;height:48px;font:inherit;background:#fff;border:1px solid #cfd2d6;border-radius:11px;outline:none;padding:0 15px;transition:border-color .15s,box-shadow .15s}.login-body input:focus{border-color:#00875a;box-shadow:0 0 0 4px #00875a1f}.login-body button{color:#fff;cursor:pointer;width:100%;height:48px;font:inherit;background:#00875a;border:0;border-radius:11px;margin-top:20px;font-weight:750;transition:transform .12s,background .12s}.login-body button:hover:not(:disabled){background:#00754e}.login-body button:active:not(:disabled){transform:scale(.985)}.login-body button:disabled{cursor:not-allowed;opacity:.45}.login-error{color:#d92d20;margin-top:10px;font-size:13px;font-weight:650}