:root{--code-font:"Sarasa Mono SC","JetBrains Mono","Fira Code","Consolas","Liberation Mono","Menlo","Courier",monospace;-webkit-user-select:none;user-select:none;--lightningcss-light:initial;--lightningcss-dark: ;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root,:root[data-theme=light]{--bg-primary:#fff;--bg-secondary:#eee;--bg-tertiary:#fff;--text-primary:#333;--text-secondary:#666;--border-color:#ddd;--accent-color:#007acc;--accent-hover:#17b;--success-color:#369481;--error-color:#d23d3d;--warning-color:#c39c00}@media (prefers-color-scheme:dark){:root{--bg-primary:#1e1e1e;--bg-secondary:#2d2d30;--bg-tertiary:#383838;--text-primary:#ccc;--text-secondary:#969696;--border-color:#3e3e42;--accent-color:#007acc;--accent-hover:#17b;--success-color:#4ec9b0;--error-color:#f44747;--warning-color:#ffcc02}}:root[data-theme=dark]{--bg-primary:#1e1e1e;--bg-secondary:#2d2d30;--bg-tertiary:#383838;--text-primary:#ccc;--text-secondary:#969696;--border-color:#3e3e42;--accent-color:#007acc;--accent-hover:#17b;--success-color:#4ec9b0;--error-color:#f44747;--warning-color:#ffcc02}body{contain:strict;background-color:var(--bg-primary);width:100vw;height:100vh;color:var(--text-primary);margin:0}body .monaco-editor{--monaco-monospace-font:var(--code-font,monospace)}body>.playground{contain:strict;grid-template-rows:auto 1fr;grid-template-columns:1fr;height:100vh;display:grid}body>.playground *{box-sizing:border-box}body>.playground [hidden]{display:none!important}body>.playground .header{contain:content;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-color);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 20px;padding:12px 16px;display:flex}body>.playground .header .header-left{margin-right:auto}body>.playground .header .header-left h1{white-space:nowrap;text-align:left;margin:0;font-size:18px;font-weight:600}body>.playground .header .header-controls{justify-content:right;align-items:center;gap:20px;margin-left:auto;display:flex}body>.playground .header .control-group{align-items:center;gap:8px;display:flex}body>.playground .header .control-group label{color:var(--text-secondary);font-size:13px}body>.playground .header .control-group select{background-color:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);-webkit-user-select:none;user-select:none;border-radius:4px;min-width:120px;padding:6px 10px;font-size:13px}body>.playground .header .control-group select:focus{border-color:var(--accent-color);outline:none}body>.playground .header .run-button{background-color:var(--accent-color);color:#fff;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;padding:8px 16px;font-size:13px;font-weight:500;transition:background-color .2s;position:relative}body>.playground .header .run-button:hover{background-color:var(--accent-hover)}body>.playground .header .run-button:disabled{opacity:.5;cursor:not-allowed;color:#0000}body>.playground .header .run-button:disabled:after{content:"Running...";color:#fff;place-content:center;place-items:center;margin:auto;display:flex;position:absolute;inset:0}body>.playground .main-content{contain:strict;grid-template:"editor-header output-header""editor-content output-content"1fr/1fr 1fr;display:grid;overflow:hidden}body>.playground .editor-panel,body>.playground .output-panel{display:contents}body>.playground .panel-header{contain:content;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-color);align-items:center;padding:0 16px;display:flex}body>.playground .editor-panel>*{border-right:1px solid var(--border-color)}body>.playground .editor-panel .panel-header{grid-area:editor-header}body>.playground .output-panel .panel-header{grid-area:output-header}body>.playground .panel-header h3{margin:0 auto 0 0;padding:12px 0;font-size:14px;font-weight:600}body>.playground .output-tabs{contain:content;grid-auto-columns:1fr;grid-auto-flow:column;gap:4px;display:grid}body>.playground .tab-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:3px;padding:8px 12px;font-size:12px;transition:all .2s}body>.playground .tab-btn:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}body>.playground .tab-btn.active{background-color:var(--accent-color);color:#fff}body>.playground #editor{contain:strict;grid-area:editor-content}body>.playground .tab-content{contain:strict;-webkit-user-select:text;user-select:text;grid-area:output-content;overflow:hidden}body>.playground .tab-pane{height:100%;font-family:var(--code-font),monospace;background-color:var(--bg-primary);padding:16px;font-size:13px;line-height:1.4;display:none;overflow:auto}body>.playground .tab-pane.active{display:block}body>.playground .console-entry{gap:8px;margin-bottom:8px;line-height:1.5em;display:flex}body>.playground .console-entry.error{color:var(--error-color)}body>.playground .console-entry.warn{color:var(--warning-color)}body>.playground .console-entry.info{color:var(--success-color)}body>.playground .console-time{-webkit-user-select:none;user-select:none;white-space:nowrap;color:var(--text-secondary);display:inline-block}body>.playground .console-time:before{content:"["}body>.playground .console-time:after{content:"]"}body>.playground .console-message{white-space:pre-wrap;word-break:break-word}body>.playground .compiled-code,body>.playground .result-success,body>.playground .result-error{white-space:pre-wrap;word-break:break-word;border:1px solid #0000;border-radius:4px;padding:12px;overflow:auto}:is(body>.playground .compiled-code,body>.playground .result-success,body>.playground .result-error).html{background:var(--bg-primary);place-self:stretch stretch;height:calc(100% - 32px);min-height:320px;padding:0;display:block}body>.playground .compiled-code{background-color:var(--bg-secondary);border-color:var(--border-color)}body>.playground .result-success{background-color:var(--bg-secondary);border-color:var(--success-color);color:var(--success-color)}body>.playground .result-error{background-color:var(--bg-secondary);border-color:var(--error-color);color:var(--error-color)}body>.playground .section-title{color:var(--text-primary);border-bottom:1px solid var(--border-color);-webkit-user-select:none;user-select:none;margin-bottom:8px;padding-bottom:4px;font-family:Arial,Helvetica,sans-serif;font-weight:600}@media (max-width:768px){body>.playground .header-controls{flex-wrap:wrap;gap:12px;display:flex}body>.playground .main-content{grid-template:"editor-header""editor-content"1fr"output-header""output-content"1fr/1fr}body>.playground .editor-panel>*{border-right:none}}body>.toast{pointer-events:none;visibility:visible;background-color:var(--bg-secondary);color:var(--text-primary);z-index:1000;border-radius:4px;padding:12px 16px;transition:opacity .3s ease-in-out,visibility .3s ease-in-out;display:block;position:fixed;bottom:48px;left:50%;transform:translate(-50%);box-shadow:0 2px 10px #0003}body>.toast[hidden]{visibility:hidden;opacity:0}