@import"https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Fira+Code:wght@300;400;600&family=Unbounded:wght@400;700;900&display=swap";.sandbox-page{position:relative;height:100vh;display:flex;flex-direction:column;overflow:hidden;background:#020617;color:#e2e8f0;font-family:Space Mono,monospace}.noise-overlay{position:fixed;inset:0;pointer-events:none;opacity:.2;background-image:radial-gradient(rgba(255,255,255,.04) .75px,transparent .75px);background-size:18px 18px;z-index:0}.sandbox-grid-bg{position:fixed;inset:0;background-image:linear-gradient(rgba(56,189,248,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(56,189,248,.035) 1px,transparent 1px);background-size:42px 42px;pointer-events:none;z-index:0}.sandbox-header{position:relative;z-index:10;display:flex;align-items:center;gap:14px;min-height:56px;padding:0 14px;background:#020617f5;border-bottom:1px solid #1e293b}.sandbox-header-left,.sandbox-header-right{display:flex;align-items:center;gap:10px;flex-shrink:0}.sandbox-back-btn{border:1px solid #1e293b;border-radius:8px;padding:6px 10px;background:transparent;color:#cbd5e1;font:inherit;font-family:Fira Code,monospace;font-size:11px;cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease}.sandbox-back-btn:hover{border-color:#38bdf8;color:#38bdf8;background:#38bdf814}.sandbox-logo{display:flex;align-items:center;gap:8px}.sandbox-logo-icon{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;background:linear-gradient(135deg,#38bdf8,#f97316);color:#fff;font-family:Unbounded,sans-serif;font-size:9px;font-weight:700}.sandbox-logo-text{color:#f8fafc;font-family:Unbounded,sans-serif;font-size:12px;font-weight:700}.template-tabs{display:flex;align-items:center;gap:4px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}.template-tabs::-webkit-scrollbar{display:none}.template-tab{display:flex;align-items:center;gap:6px;white-space:nowrap;border:1px solid transparent;border-radius:8px;padding:5px 10px;background:transparent;color:#94a3b8;font-family:Fira Code,monospace;font-size:11px;cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease}.template-tab:hover{color:#f8fafc;background:#38bdf814}.template-tab.active{color:#38bdf8;border-color:#38bdf866;background:#38bdf81a}.challenge-tab.active{color:#f59e0b;border-color:#f59e0b6b;background:#f59e0b1a}.template-tab-icon{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:18px;border-radius:999px;background:#0f172ae6;font-size:10px}.template-tabs-divider{width:1px;height:22px;background:#1e293b;flex-shrink:0;margin:0 4px}.sandbox-timer-pill{display:flex;align-items:center;gap:8px;border:1px solid rgba(71,85,105,.6);border-radius:999px;padding:6px 10px;background:#0f172ac7;color:#94a3b8;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.sandbox-timer-pill strong{color:#f8fafc;font-size:11px}.sandbox-timer-pill.active{border-color:#38bdf86b;color:#38bdf8}.sandbox-active-label{color:#64748b;font-size:10px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.challenge-hint-bar{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 14px;border-bottom:1px solid #1e293b;background:#0f172af5}.hint-content{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.hint-chip{flex-shrink:0;border:1px solid rgba(56,189,248,.4);border-radius:999px;padding:3px 8px;color:#38bdf8;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.challenge-hint-bar p{margin:0;color:#cbd5e1;font-size:12px;line-height:1.5}.unlock-btn{flex-shrink:0;border:1px solid rgba(245,158,11,.4);border-radius:10px;padding:8px 12px;background:#f59e0b1a;color:#fbbf24;font-family:Fira Code,monospace;font-size:11px;cursor:pointer}.unlock-btn:disabled{opacity:.65;cursor:default}.sandbox-workbench{position:relative;z-index:10;flex:1;min-height:0}.sandbox-shell{height:100%;display:flex;flex-direction:column}.sandbox-ide-grid{flex:1;min-height:0;display:grid;grid-template-columns:56px 328px minmax(0,1fr);background:#020617}.activity-rail{display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:14px 0 10px;background:#02040a;border-right:1px solid #111827}.activity-rail-top{display:grid;gap:8px}.activity-rail-btn{width:38px;height:38px;border:1px solid transparent;border-radius:12px;background:transparent;color:#94a3b8;font-family:Fira Code,monospace;font-size:11px;cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease}.activity-rail-btn:hover,.activity-rail-btn.active{color:#f8fafc;border-color:#38bdf857;background:#38bdf81f}.activity-rail-indicator{color:#475569;font-family:Fira Code,monospace;font-size:11px}.activity-rail-indicator.active{color:#38bdf8}.ide-sidebar{min-height:0;display:flex;flex-direction:column;border-right:1px solid #1e293b;background:linear-gradient(180deg,#030712fa,#080f1efa)}.sidebar-panel-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 14px 12px;border-bottom:1px solid #1e293b}.sidebar-panel-kicker{margin:0 0 4px;color:#64748b;font-size:10px;letter-spacing:.09em;text-transform:uppercase}.sidebar-panel-header h2{margin:0;color:#f8fafc;font-family:Unbounded,sans-serif;font-size:12px;font-weight:700}.sidebar-panel-actions{display:flex;gap:6px}.sidebar-icon-btn,.explorer-primary-btn,.explorer-secondary-btn,.preview-refresh-btn,.terminal-clear-btn,.explorer-inline-action{border:1px solid #24314a;border-radius:8px;background:#0f172ae6;color:#cbd5e1;font-family:Fira Code,monospace;font-size:11px;cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease}.sidebar-icon-btn:hover,.explorer-primary-btn:hover,.explorer-secondary-btn:hover,.preview-refresh-btn:hover,.terminal-clear-btn:hover,.explorer-inline-action:hover{border-color:#38bdf86b;color:#38bdf8}.sidebar-icon-btn{min-width:38px;height:32px}.sidebar-scroll{flex:1;min-height:0;display:flex;flex-direction:column;gap:12px;overflow:auto;padding:12px}.sidebar-section{overflow:hidden;border:1px solid rgba(36,49,74,.86);border-radius:16px;background:#0f172ac7}.sidebar-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-bottom:1px solid rgba(36,49,74,.72);color:#94a3b8;font-size:10px;letter-spacing:.09em;text-transform:uppercase}.sidebar-empty-copy{margin:0;padding:12px;color:#64748b;font-size:11px;line-height:1.6}.explorer-composer{border:1px solid rgba(56,189,248,.28);border-radius:16px;background:#0a1323eb;padding:12px}.explorer-composer-label{display:block;margin-bottom:6px;color:#38bdf8;font-size:10px;letter-spacing:.09em;text-transform:uppercase}.explorer-target-copy{margin:0 0 10px;color:#94a3b8;font-size:11px;line-height:1.5}.explorer-composer-input,.terminal-input{width:100%;border:1px solid #24314a;border-radius:10px;background:#0f172a;color:#f8fafc;padding:10px 12px;font-family:Fira Code,monospace;font-size:12px;outline:none}.explorer-composer-input:focus,.terminal-input:focus{border-color:#38bdf86b}.explorer-composer-actions{display:flex;gap:8px;margin-top:10px}.explorer-primary-btn,.explorer-secondary-btn,.preview-refresh-btn,.terminal-clear-btn{padding:8px 10px}.explorer-primary-btn{color:#38bdf8}.open-editors-list,.explorer-tree{display:grid}.open-editor-row,.explorer-file-node,.explorer-folder-node{display:flex;align-items:center;gap:8px;min-width:0}.open-editor-row{border-top:1px solid rgba(36,49,74,.45)}.open-editor-row:first-child,.explorer-tree-group:first-child{border-top:none}.open-editor-row.active,.explorer-file-node.active{background:#38bdf814}.open-editor-trigger,.open-editor-close,.explorer-file-trigger,.explorer-file-delete,.editor-tab-trigger,.editor-tab-close,.explorer-folder-trigger{border:none;background:transparent;color:inherit;cursor:pointer;font-family:inherit}.open-editor-trigger,.explorer-file-trigger,.explorer-folder-trigger{flex:1;min-width:0;display:flex;align-items:center;gap:8px;padding:9px 12px}.explorer-folder-node{padding-right:12px}.open-editor-trigger:hover,.explorer-file-trigger:hover,.explorer-folder-trigger:hover,.editor-tab-trigger:hover,.editor-tab-close:hover{background:#ffffff08}.open-editor-icon,.explorer-node-icon,.editor-tab-icon{width:26px;flex-shrink:0;text-align:center;color:#38bdf8;font-size:11px}.open-editor-name,.explorer-node-name,.editor-tab-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#cbd5e1;font-size:12px}.open-editor-close,.explorer-file-delete,.editor-tab-close{width:34px;align-self:stretch;color:#64748b}.open-editor-close:hover,.explorer-file-delete:hover,.editor-tab-close:hover{color:#ef4444}.explorer-tree-group{border-top:1px solid rgba(36,49,74,.28)}.explorer-node{width:100%;min-width:0;color:#cbd5e1}.explorer-node-actions{display:flex;gap:6px;margin-left:auto}.explorer-inline-action{min-width:34px;height:28px}.explorer-chevron{width:14px;flex-shrink:0;color:#64748b;text-align:center}.explorer-spacer{visibility:hidden}.explorer-file-badge{width:34px;font-size:10px;letter-spacing:-.02em}.explorer-node-meta,.explorer-node-trailing{margin-left:auto;color:#64748b;font-size:10px;letter-spacing:.07em;text-transform:uppercase}.workbench-main{min-width:0;min-height:0;display:flex;flex-direction:column;background:#0f172a}.workspace-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;padding:0 14px;border-bottom:1px solid #1e293b;background:#0f172af2}.workspace-breadcrumbs,.workspace-toolbar-meta,.statusbar-group,.preview-topbar-meta,.terminal-meta{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}.workspace-breadcrumb-root,.workspace-breadcrumb,.workspace-metric-chip,.workspace-live-chip,.statusbar-item,.preview-status-badge,.preview-entry-label,.terminal-pill{border-radius:999px;padding:4px 8px;font-family:Fira Code,monospace;font-size:10px;letter-spacing:.05em}.workspace-breadcrumb-root{background:#38bdf829;color:#38bdf8}.workspace-breadcrumb{background:#1e293bd1;color:#94a3b8}.workspace-live-chip,.workspace-metric-chip,.preview-entry-label,.terminal-pill{border:1px solid rgba(36,49,74,.82);background:#0f172ae6;color:#94a3b8}.workspace-live-chip.active{border-color:#38bdf86b;color:#38bdf8}.workspace-metric-chip.preview-error{border-color:#f8717159;color:#fca5a5}.workspace-metric-chip.preview-running{border-color:#f59e0b57;color:#f59e0b}.sandbox-layout{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(420px,.95fr);background:#0f172a}.editor-shell,.preview-shell{min-width:0;min-height:0;display:flex;flex-direction:column}.editor-shell{border-right:1px solid #24314a;background:#111827}.editor-tabs,.preview-topbar,.terminal-topbar{display:flex;align-items:center;gap:6px;min-height:42px;padding:0 10px;border-bottom:1px solid #24314a;background:#1f2937}.preview-topbar,.terminal-topbar{justify-content:space-between}.editor-tabs{overflow-x:auto;scrollbar-width:none}.editor-tabs::-webkit-scrollbar{display:none}.editor-tab{display:flex;align-items:stretch;min-width:0;border:1px solid transparent;border-bottom:none;border-radius:10px 10px 0 0;color:#94a3b8}.editor-tab.active{border-color:#38bdf83d;background:#020617c7;color:#f8fafc}.editor-tab-trigger{min-width:0;display:flex;align-items:center;gap:8px;padding:10px 12px}.editor-pane{flex:1;min-height:0;display:grid;grid-template-columns:58px minmax(0,1fr);background:#111827}.editor-gutter{overflow:hidden;padding:14px 0;border-right:1px solid #1f2937;background:#0d1420;text-align:right}.editor-line-number{padding:0 12px;color:#475569;font-family:Fira Code,monospace;font-size:12px;line-height:1.75}.editor-textarea{width:100%;height:100%;resize:none;border:none;outline:none;background:#111827;color:#f8fafc;padding:14px 16px;font-family:Fira Code,monospace;font-size:13px;line-height:1.75;white-space:pre;overflow:auto;tab-size:2}.editor-empty{height:100%;display:grid;place-items:center;color:#64748b;font-size:13px}.preview-shell{display:grid;grid-template-rows:auto minmax(0,1fr) auto minmax(220px,.55fr);background:#111827}.preview-status-badge{border:1px solid rgba(36,49,74,.82);background:#0f172ae6;color:#cbd5e1}.preview-status-badge.status-ready{border-color:#4ade8059;color:#4ade80}.preview-status-badge.status-running,.preview-status-badge.status-initial{border-color:#f59e0b57;color:#f59e0b}.preview-status-badge.status-error{border-color:#f8717159;color:#fca5a5}.preview-frame{width:100%;min-height:0;border:none;background:#fff}.preview-caption{padding:10px 12px;border-top:1px solid #24314a;background:#0f172a;color:#94a3b8;font-family:Fira Code,monospace;font-size:11px;line-height:1.5}.terminal-shell{min-height:0;display:flex;flex-direction:column;border-top:1px solid #24314a;background:#020617}.terminal-pill.ready{border-color:#4ade8059;color:#4ade80}.terminal-pill.waiting{border-color:#f59e0b57;color:#f59e0b}.terminal-caption{color:#64748b;font-family:Fira Code,monospace;font-size:11px}.terminal-output{flex:1;min-height:0;overflow:auto;padding:12px;background:radial-gradient(circle at top left,rgba(56,189,248,.06),transparent 30%),#020617}.terminal-empty{margin:0;color:#64748b;font-family:Fira Code,monospace;font-size:12px}.terminal-line{display:grid;grid-template-columns:18px minmax(0,1fr);gap:8px;align-items:flex-start;margin-bottom:8px;color:#cbd5e1;font-family:Fira Code,monospace;font-size:12px}.terminal-line.kind-command{color:#38bdf8}.terminal-line.kind-error{color:#fca5a5}.terminal-line.kind-warn{color:#fbbf24}.terminal-line.kind-result{color:#e2e8f0}.terminal-line.kind-system{color:#94a3b8}.terminal-line-prefix{opacity:.8}.terminal-line-text{margin:0;white-space:pre-wrap;word-break:break-word;font:inherit}.terminal-form{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;padding:10px 12px;border-top:1px solid #24314a;background:#020617}.terminal-prompt{color:#38bdf8;font-family:Fira Code,monospace;font-size:12px}.terminal-input{padding:9px 12px}.focus-cards{display:grid;gap:10px}.focus-card,.focus-summary{border:1px solid rgba(36,49,74,.82);border-radius:16px;background:#0f172ac7}.focus-card{padding:14px}.focus-card span,.focus-summary-row span{color:#94a3b8;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.focus-card strong{display:block;margin:10px 0 6px;color:#f8fafc;font-size:20px}.focus-card p,.focus-footnote{margin:0;color:#64748b;font-size:11px;line-height:1.6}.focus-summary{overflow:hidden}.focus-summary-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-top:1px solid rgba(36,49,74,.72)}.focus-summary-row:first-child{border-top:none}.focus-summary-row strong{color:#f8fafc;font-size:12px}.sandbox-statusbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:8px 12px;border-top:1px solid #1e293b;background:#02040a}.statusbar-item{border:1px solid rgba(36,49,74,.82);background:#0f172adb;color:#cbd5e1}.statusbar-item.strong{color:#38bdf8}.sandbox-workbench ::-webkit-scrollbar{width:8px;height:8px}.sandbox-workbench ::-webkit-scrollbar-track{background:#020617}.sandbox-workbench ::-webkit-scrollbar-thumb{border-radius:999px;background:#334155}@media(max-width:1320px){.sandbox-ide-grid{grid-template-columns:56px 292px minmax(0,1fr)}.sandbox-layout{grid-template-columns:minmax(0,1fr) minmax(360px,.92fr)}}@media(max-width:980px){.sandbox-ide-grid{grid-template-columns:1fr;grid-template-rows:auto auto 1fr}.activity-rail{flex-direction:row;justify-content:space-between;padding:10px 12px;border-right:none;border-bottom:1px solid #111827}.activity-rail-top{display:flex}.ide-sidebar{max-height:360px;border-right:none;border-bottom:1px solid #1e293b}.sandbox-layout{grid-template-columns:1fr}.editor-shell{border-right:none;border-bottom:1px solid #24314a}.template-tabs{display:none}.challenge-hint-bar{flex-direction:column;align-items:flex-start}}@media(max-width:720px){.sandbox-header{flex-wrap:wrap;padding:10px 12px}.sandbox-header-right,.workspace-toolbar,.sandbox-statusbar{width:100%}.workspace-toolbar,.sandbox-statusbar,.preview-topbar,.terminal-topbar{justify-content:flex-start}.editor-pane{grid-template-columns:44px minmax(0,1fr)}.editor-textarea{padding:12px;font-size:12px}.preview-shell{grid-template-rows:auto minmax(320px,1fr) auto 220px}}
