:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--font-sans:Inter, "SF Pro Text", Roboto, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;--font-mono:"Roboto Mono", "SFMono-Regular", Menlo, "Segoe UI Mono", Consolas, monospace;--gray-20:#edf0f2;--gray-30:#cdcdd6;--gray-40:#979aad;--gray-60:#696b7d;--gray-70:#3c3d4e;--gray-80:#232538;--gray-90:#14162c;--gray-100:#0b0d22;--white:#fff;--fire:#e6484f;--fire-70:#c3373d;--sky-70:#2258c3;--orange:#dd8c1b;--orange-dark:#d59b74;--orange-15:#e0ac0026;--berry-dark-50:#b984db;--water-dark:#637cc1;--turtle-dark:#388b72;--ocean-dark:#8aaec8;--playground-bg:var(--gray-100);--playground-panel:var(--gray-100);--playground-input-bg:var(--gray-90);--playground-divider:#3c3d4e7a;--playground-text-primary:var(--gray-20);--playground-text-secondary:var(--gray-40);--playground-border:var(--gray-60);--playground-border-soft:#696b7d47;--playground-hover:var(--gray-80);--playground-scrollbar-track:var(--gray-100);--playground-scrollbar-thumb:var(--gray-70);--playground-scrollbar-thumb-hover:var(--gray-60);font-family:var(--font-sans);background:var(--playground-bg);color:var(--playground-text-secondary)}*{box-sizing:border-box}body{background:var(--playground-bg);min-width:320px;height:100vh;margin:0;overflow:hidden}button,select,input,textarea{font:inherit}button{cursor:pointer}.app-shell{background:var(--playground-bg);height:100vh;color:var(--playground-text-secondary);grid-template-rows:auto minmax(0,1fr);font-size:14px;display:grid;overflow:hidden}.topbar{background:var(--playground-panel);justify-content:space-between;align-items:center;gap:18px;min-height:56px;padding:12px 44px;display:flex}.topbar h1{color:var(--playground-text-primary);letter-spacing:0;margin:0;font-size:18px;font-weight:700;line-height:1.25}.status{max-width:46vw;min-height:30px;color:var(--turtle-dark);text-overflow:ellipsis;white-space:nowrap;background:#388b721a;border:1px solid #388b7273;border-radius:4px;flex:0 auto;align-items:center;padding:5px 10px;font-size:12px;font-weight:600;display:inline-flex;overflow:hidden}.status-busy{color:var(--orange);background:var(--orange-15);border-color:#dd8c1b73}.status-error{color:var(--fire);background:#e6484f1f;border-color:#e6484f8c}.workspace{grid-template-columns:minmax(360px,1fr) 8px minmax(420px,1fr);min-height:0;display:grid;overflow:hidden}.source-column,.result-column{grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;display:grid}.source-column{grid-column:1}.result-column{grid-column:3}.workspace:before{content:"";background:var(--playground-divider);opacity:.36;grid-area:1/2/-1}.column-header{border-top:1px solid var(--playground-border-soft);border-bottom:1px solid var(--playground-border-soft);background:var(--playground-panel);justify-content:space-between;align-items:center;gap:14px;min-height:48px;padding:8px 44px;display:flex}.column-header h2{color:var(--playground-text-primary);letter-spacing:0;margin:0;font-size:14px;font-weight:700;line-height:1.25}.actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.secondary-action{border:1px solid var(--playground-border);min-height:32px;color:var(--playground-text-primary);background:var(--playground-panel);border-radius:4px;padding:0 12px;font-size:13px;font-weight:600}.secondary-action:hover,.tab-button:hover{background:var(--playground-hover)}.editor-shell{--gutter-width:56px;--editor-padding-y:18px;--editor-padding-x:18px;--editor-line-height:22px;grid-template-columns:var(--gutter-width) minmax(0, 1fr);background:var(--playground-panel);grid-template-rows:minmax(0,1fr);min-width:0;min-height:0;display:grid;position:relative;overflow:hidden}.active-line{z-index:0;top:var(--active-line-top,18px);left:var(--gutter-width);height:var(--editor-line-height);pointer-events:none;background:#ffffff09;border-top:1px solid #ffffff05;border-bottom:1px solid #ffffff05;position:absolute;right:0}.line-number-gutter{z-index:1;border-right:1px solid var(--playground-border-soft);background:#14162c6b;grid-area:1/1;min-width:0;min-height:0;position:relative;overflow:hidden}.line-numbers{padding:var(--editor-padding-y) 12px var(--editor-padding-y) 0;color:var(--gray-60);font-family:var(--font-mono);font-size:13px;line-height:var(--editor-line-height);text-align:right;-webkit-user-select:none;user-select:none;transform:translateY(var(--editor-scroll-y,0px));margin:0}.syntax-layer{z-index:1;width:max-content;min-width:100%;height:max-content;min-height:max-content;padding:var(--editor-padding-y) var(--editor-padding-x);white-space:pre;color:var(--gray-30);font-family:var(--font-mono);font-size:14px;line-height:var(--editor-line-height);tab-size:2;pointer-events:none;transform:translate(var(--editor-scroll-x,0px), var(--editor-scroll-y,0px));background:0 0;grid-area:1/2;align-self:start;margin:0;position:relative;overflow:visible}.syntax-token{color:var(--gray-30)}.syntax-keyword{color:var(--berry-dark-50);font-weight:600}.syntax-builtin{color:var(--orange-dark)}.syntax-constructor{color:var(--orange)}.syntax-string{color:var(--turtle-dark)}.syntax-number{color:var(--ocean-dark)}.syntax-comment{color:var(--gray-60);font-style:italic}.syntax-attribute{color:#bcc9ab}.syntax-operator{color:var(--water-dark)}.editor{z-index:1;resize:none;width:100%;height:100%;min-height:0;padding:var(--editor-padding-y) var(--editor-padding-x);color:#0000;-webkit-text-fill-color:transparent;font-family:var(--font-mono);font-size:14px;line-height:var(--editor-line-height);tab-size:2;caret-color:var(--orange);white-space:pre;overflow-wrap:normal;scrollbar-width:thin;scrollbar-color:var(--playground-scrollbar-thumb) var(--playground-scrollbar-track);background:0 0;border:0;outline:0;grid-area:1/2;position:relative;overflow:auto}.editor::selection{background:#fff3}.output::selection{background:#fff3}.problems-output::selection{background:#fff3}.tabs{border-top:1px solid var(--playground-border-soft);border-bottom:1px solid var(--playground-border-soft);background:var(--playground-panel);scrollbar-width:thin;scrollbar-color:var(--playground-scrollbar-thumb) var(--playground-scrollbar-track);align-items:stretch;min-height:48px;display:flex;overflow-x:auto}.tab-button{min-width:88px;color:var(--playground-text-secondary);background:var(--playground-panel);letter-spacing:0;border:0;border-top:4px solid #0000;flex:1 0 auto;padding:12px 16px;font-size:14px;font-weight:500}.tab-button-active{color:var(--white);border-top-color:var(--sky-70)}.output-panel{background:var(--playground-panel);grid-template-rows:auto minmax(0,1fr) minmax(116px,22vh);min-height:0;display:grid;overflow:hidden}.result-meta{border-bottom:1px solid var(--playground-border-soft);min-height:36px;color:var(--playground-text-secondary);padding:9px 16px;font-size:12px;font-weight:500}.output,.problems-output{white-space:pre;font-family:var(--font-mono);tab-size:2;margin:0;font-size:13px;line-height:1.55}.output-shell{background:var(--playground-panel);scrollbar-width:thin;scrollbar-color:var(--playground-scrollbar-thumb) var(--playground-scrollbar-track);min-width:0;min-height:0;overflow:auto}.output{width:max-content;min-width:100%;min-height:100%;color:var(--playground-text-primary);background:var(--playground-panel);padding:18px}.problems{border-top:1px solid var(--playground-border-soft);background:var(--playground-panel);grid-template-rows:auto minmax(0,1fr);min-height:0;display:grid}.problems-title{color:var(--playground-text-primary);padding:9px 16px;font-size:12px;font-weight:700}.problems-output{color:var(--playground-text-secondary);scrollbar-width:thin;scrollbar-color:var(--playground-scrollbar-thumb) var(--playground-scrollbar-track);padding:0 16px 16px;overflow:auto}.settings-panel{background:var(--playground-panel);scrollbar-width:thin;scrollbar-color:var(--playground-scrollbar-thumb) var(--playground-scrollbar-track);min-height:0;padding:28px 44px;overflow:auto}.settings-section{border-bottom:1px solid var(--playground-border-soft);grid-template-columns:minmax(150px,210px) minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px 0;display:grid}.setting-row{grid-template-columns:auto minmax(0,1fr);justify-content:start}.setting-label{color:var(--playground-text-primary);font-size:13px;font-weight:700}.setting-value{color:var(--playground-text-primary);font-family:var(--font-mono);overflow-wrap:anywhere;font-size:13px}select,input{border:1px solid var(--playground-border);background:var(--playground-input-bg);min-width:0;min-height:34px;color:var(--playground-text-primary);border-radius:4px;outline:0;padding:0 10px}select:focus,input:focus,textarea:focus{border-color:var(--playground-text-primary)}input[type=checkbox]{width:17px;height:17px;min-height:17px;accent-color:var(--fire);padding:0}.hidden-panel{display:none}.toast{z-index:20;max-width:min(320px,100vw - 32px);min-height:38px;color:var(--playground-text-primary);opacity:0;pointer-events:none;background:#171a31;border:1px solid #388b7273;border-radius:4px;align-items:center;padding:9px 13px;font-size:13px;font-weight:600;transition:opacity .14s,transform .14s;display:inline-flex;position:fixed;bottom:24px;right:24px;transform:translateY(8px);box-shadow:0 14px 36px #00000052}.toast-visible{opacity:1;transform:translateY(0)}.editor::-webkit-scrollbar{width:.65rem;height:.65rem}.output-shell::-webkit-scrollbar{width:.65rem;height:.65rem}.problems-output::-webkit-scrollbar{width:.65rem;height:.65rem}.settings-panel::-webkit-scrollbar{width:.65rem;height:.65rem}.tabs::-webkit-scrollbar{width:.65rem;height:.65rem}.editor::-webkit-scrollbar-track{background:var(--playground-scrollbar-track)}.output-shell::-webkit-scrollbar-track{background:var(--playground-scrollbar-track)}.problems-output::-webkit-scrollbar-track{background:var(--playground-scrollbar-track)}.settings-panel::-webkit-scrollbar-track{background:var(--playground-scrollbar-track)}.tabs::-webkit-scrollbar-track{background:var(--playground-scrollbar-track)}.editor::-webkit-scrollbar-thumb{background-color:var(--playground-scrollbar-thumb);border:2px solid var(--playground-scrollbar-track);border-radius:9999px}.output-shell::-webkit-scrollbar-thumb{background-color:var(--playground-scrollbar-thumb);border:2px solid var(--playground-scrollbar-track);border-radius:9999px}.problems-output::-webkit-scrollbar-thumb{background-color:var(--playground-scrollbar-thumb);border:2px solid var(--playground-scrollbar-track);border-radius:9999px}.settings-panel::-webkit-scrollbar-thumb{background-color:var(--playground-scrollbar-thumb);border:2px solid var(--playground-scrollbar-track);border-radius:9999px}.tabs::-webkit-scrollbar-thumb{background-color:var(--playground-scrollbar-thumb);border:2px solid var(--playground-scrollbar-track);border-radius:9999px}.editor::-webkit-scrollbar-thumb:hover{background-color:var(--playground-scrollbar-thumb-hover)}.output-shell::-webkit-scrollbar-thumb:hover{background-color:var(--playground-scrollbar-thumb-hover)}.problems-output::-webkit-scrollbar-thumb:hover{background-color:var(--playground-scrollbar-thumb-hover)}.settings-panel::-webkit-scrollbar-thumb:hover{background-color:var(--playground-scrollbar-thumb-hover)}.tabs::-webkit-scrollbar-thumb:hover{background-color:var(--playground-scrollbar-thumb-hover)}@media (width<=900px){.topbar{flex-direction:column;align-items:flex-start;padding:12px 18px}.status{max-width:100%}.workspace{grid-template-rows:minmax(44vh,1fr) 8px minmax(46vh,1fr);grid-template-columns:1fr}.source-column{grid-area:1/1}.result-column{grid-area:3/1}.workspace:before{grid-area:2/1}.column-header,.settings-panel{padding-left:18px;padding-right:18px}.editor-shell{--editor-padding-x:18px;--gutter-width:48px}.settings-section{grid-template-columns:1fr}.toast{bottom:16px;right:16px}}