:root{--bg:#eef2f7;--surface:#fff;--line:#d9e2ec;--line-strong:#cbd5e1;--text:#334155;--text-muted:#64748b;--text-strong:#0f172a;--shadow:0 18px 50px #0f172a14;--sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--mono:"SFMono-Regular", "Cascadia Code", "Roboto Mono", Consolas, "Liberation Mono", monospace;color:var(--text);background:var(--bg);font-family:var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:1.5}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}#root{min-height:100vh}.workspace{grid-template-rows:auto auto auto minmax(0,1fr);gap:14px;width:min(1500px,100%);min-height:100svh;margin:0 auto;padding:22px;display:grid}.topbar{border:1px solid var(--line);min-height:70px;box-shadow:var(--shadow);background:#ffffffc7;border-radius:8px;justify-content:space-between;align-items:center;gap:20px;padding:14px 16px;display:flex}.brand-block{align-items:center;gap:14px;min-width:0;display:flex}.brand-mark{color:#f8fafc;width:46px;height:46px;font-family:var(--mono);background:linear-gradient(145deg,#2563eb,#0f766e);border-radius:8px;flex:none;place-items:center;font-size:17px;font-weight:750;display:grid;box-shadow:inset 0 -10px #0f172a24}.brand-block h1{color:var(--text-strong);margin:0;font-size:24px;font-weight:760;line-height:1.08}.brand-block p,.panel-header p{color:var(--text-muted);margin:5px 0 0;font-size:13px}.runtime-strip{border:1px solid var(--line);min-height:38px;color:var(--text-muted);white-space:nowrap;background:#f8fafc;border-radius:999px;align-items:center;gap:9px;padding:0 14px;font-size:13px;display:flex}.runtime-strip strong{color:var(--text-strong);font-weight:700}.status-dot{background:#d97706;border-radius:50%;width:9px;height:9px;box-shadow:0 0 0 4px #d9770621}.status-dot.loading,.status-dot.running{background:#2563eb;box-shadow:0 0 0 4px #2563eb21}.status-dot.ready{background:#059669;box-shadow:0 0 0 4px #05966921}.status-dot.error{background:#dc2626;box-shadow:0 0 0 4px #dc262621}.status-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.status-card{border:1px solid var(--line);background:#ffffffb8;border-radius:8px;min-width:0;padding:14px 15px}.status-grid span,.editor-actions span{color:var(--text-muted);font-size:12px;line-height:1.35;display:block}.status-grid strong{color:var(--text-strong);text-overflow:ellipsis;white-space:nowrap;margin-top:5px;font-size:14px;font-weight:700;line-height:1.25;display:block;overflow:hidden}.quick-start{grid-template-columns:220px minmax(0,1fr);align-items:stretch;gap:12px;display:grid}.quick-start-heading{border:1px solid var(--line);background:#0f172a;border-radius:8px;flex-direction:column;justify-content:center;min-width:0;padding:13px 15px;display:flex}.quick-start-heading span{color:#93c5fd;font-size:12px;font-weight:700}.quick-start-heading strong{color:#f8fafc;margin-top:5px;font-size:14px;line-height:1.35}.template-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.template-button{border-color:var(--line);text-align:left;background:#fffc;flex-direction:column;justify-content:center;align-items:flex-start;min-width:0;min-height:64px;padding:12px 14px;display:flex}.template-button span{color:var(--text-strong);font-size:13px;font-weight:730}.template-button small{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;max-width:100%;margin-top:5px;font-size:12px;line-height:1.35;overflow:hidden}.template-button:hover{background:#fff;border-color:#2563eb}.tool-grid{grid-template-columns:minmax(360px,.92fr) minmax(500px,1.08fr);align-items:stretch;gap:14px;min-height:0;display:grid}.terminal-panel,.editor-panel{border:1px solid var(--line);background:var(--surface);min-width:0;box-shadow:var(--shadow);border-radius:8px;overflow:hidden}.terminal-panel{flex-direction:column;min-height:0;display:flex}.editor-panel{grid-template-rows:auto minmax(0,1fr) auto minmax(120px,.42fr);min-height:0;display:grid}.panel-header{border-bottom:1px solid var(--line);background:#fff;justify-content:space-between;align-items:center;gap:16px;min-height:70px;padding:15px 16px;display:flex}.panel-header h2{color:var(--text-strong);margin:0;font-size:16px;font-weight:740;line-height:1.2}button{border:1px solid var(--line-strong);min-height:34px;color:var(--text-strong);font:inherit;cursor:pointer;background:#fff;border-radius:7px;justify-content:center;align-items:center;padding:0 12px;font-size:13px;font-weight:650;transition:border-color .15s,background .15s,color .15s,box-shadow .15s;display:inline-flex}button:hover{background:#f8fafc;border-color:#94a3b8}button:disabled,input:disabled{cursor:not-allowed;opacity:.62}button:focus-visible,input:focus-visible,textarea:focus-visible{outline-offset:2px;outline:2px solid #2563eb}.terminal-window{color:#dbeafe;font-family:var(--mono);background:linear-gradient(#0f172aeb,#0f172a),#0f172a;flex:1;padding:16px;font-size:13px;line-height:1.6;overflow:auto}.console-line{white-space:pre-wrap;word-break:break-word;grid-template-columns:42px minmax(0,1fr);gap:10px;min-height:22px;display:grid}.console-line.input{color:#bfdbfe}.console-line.output{color:#bbf7d0}.console-line.error{color:#fecaca}.console-line.system{color:#cbd5e1}.console-prefix{color:#64748b;-webkit-user-select:none;user-select:none}.prompt-row{color:#93c5fd;font-family:var(--mono);background:#111827;border-top:1px solid #243047;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;display:grid}.prompt-row input{color:#e5e7eb;min-width:0;height:36px;font:inherit;background:#0b1220;border:1px solid #334155;border-radius:7px;padding:0 11px}.prompt-row button{color:#eff6ff;background:#1d4ed8;border-color:#2563eb}.prompt-row button:hover{background:#2563eb;border-color:#1d4ed8}.example-row{border-top:1px solid var(--line);background:#fff;flex-wrap:wrap;align-items:center;gap:8px;padding:12px;display:flex}.example-row span{color:var(--text-muted);font-size:12px;font-weight:700}.example-row button{color:#334155;min-height:30px;font-family:var(--mono);background:#f8fafc;padding:0 10px;font-size:12px;font-weight:550}.editor-summary{flex:none;align-items:center;gap:8px;display:inline-flex}.editor-summary span{border:1px solid var(--line);min-height:28px;color:var(--text-muted);background:#f8fafc;border-radius:999px;align-items:center;padding:0 10px;font-size:12px;font-weight:700;display:inline-flex}.editor-shell{background:#fbfdff;grid-template-columns:48px minmax(0,1fr);min-height:0;display:grid;overflow:hidden}.line-gutter{border-right:1px solid var(--line);color:#94a3b8;font-family:var(--mono);text-align:right;background:#f1f5f9;padding:15px 0;font-size:13px;line-height:1.58;overflow:hidden}.line-gutter span{padding-right:12px;display:block}textarea{resize:none;color:#111827;width:100%;min-height:100%;font-family:var(--mono);tab-size:4;box-sizing:border-box;background:#fbfdff;border:0;padding:15px 16px;font-size:13px;line-height:1.58}.editor-actions{border-top:1px solid var(--line);background:#fff;align-items:center;gap:9px;padding:12px 16px;display:flex}.primary-action{color:#f0fdf4;background:#059669;border-color:#047857;box-shadow:0 8px 18px #0596692e}.primary-action:hover{background:#047857;border-color:#065f46}.editor-actions span{margin-left:auto}.output-panel{border-top:1px solid var(--line);background:#0f172a;flex-direction:column;min-height:0;display:flex;overflow:hidden}.output-header{color:#cbd5e1;border-bottom:1px solid #243047;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;font-size:12px;display:flex}.output-header>div:first-child{align-items:baseline;gap:8px;min-width:0;display:flex}.output-header span{color:#e2e8f0;font-weight:750}.output-header strong{color:#94a3b8;font-size:12px;font-weight:550}.output-actions{flex:none;gap:7px;display:flex}.output-actions button{color:#cbd5e1;background:#111827;border-color:#334155;min-height:28px;font-size:12px}.output-actions button:hover{color:#f8fafc;background:#1e293b;border-color:#475569}pre{color:#bbf7d0;min-height:0;font-family:var(--mono);white-space:pre-wrap;flex:1;margin:0;padding:14px;font-size:13px;line-height:1.58;overflow:auto}.error-output{color:#fecaca}@media (width<=1100px){.workspace{padding:16px}.tool-grid,.status-grid,.quick-start{grid-template-columns:1fr}.template-row{grid-template-columns:repeat(3,minmax(0,1fr))}.terminal-panel,.editor-panel{min-height:580px}}@media (width<=720px){.workspace{padding:12px}.topbar,.panel-header,.editor-actions{flex-direction:column;align-items:stretch}.runtime-strip,.editor-actions button,.panel-header button{width:100%}.brand-block{align-items:flex-start}.brand-block h1{font-size:20px}.template-row{grid-template-columns:1fr}.prompt-row{grid-template-columns:auto minmax(0,1fr)}.prompt-row button{grid-column:1/-1}.editor-summary{grid-template-columns:1fr 1fr;display:grid}.editor-actions span{margin-left:0}.output-header{flex-direction:column;align-items:stretch}.output-actions{grid-template-columns:1fr 1fr;display:grid}}
