body{background:var(--sandbox-bg);min-height:100vh;color:var(--sandbox-text);font-family:var(--font-sans);transition:background var(--transition-base), color var(--transition-base);margin:0}:root{--sandbox-bg:#f8fafc;--sandbox-surface:#fff;--sandbox-text:#0f172a;--sandbox-muted:#64748b;--sandbox-border:#e2e8f0}body.dark{--sandbox-bg:#0a0f1a;--sandbox-surface:#0f172ab8;--sandbox-text:#e2e8f0;--sandbox-muted:#94a3b8;--sandbox-border:#ffffff1a}.sandbox-page{max-width:1400px;min-height:100vh;padding:120px var(--spacing-6) var(--spacing-12);margin:0 auto}.sandbox-heading{margin-bottom:var(--spacing-8)}.sandbox-eyebrow{margin:0 0 var(--spacing-2);color:var(--color-brand-500);font-family:var(--font-mono);font-size:var(--font-size-xs);letter-spacing:1px;text-transform:uppercase}.sandbox-heading h1{margin:0 0 var(--spacing-3);color:var(--sandbox-text);font-size:clamp(2.25rem,5vw,3.5rem)}.sandbox-heading p:last-child{color:var(--sandbox-muted);font-size:var(--font-size-lg);margin:0}.sandbox-card{margin-bottom:var(--spacing-4);padding:var(--spacing-8);border:1px solid var(--sandbox-border);border-radius:var(--radius-xl);background:var(--sandbox-surface)}.toolbar,.toolbar-actions,.editor-footer{align-items:center;gap:var(--spacing-3);display:flex}.toolbar{margin-bottom:var(--spacing-4);justify-content:space-between}.database-select{gap:var(--spacing-2);color:var(--sandbox-muted);font-size:var(--font-size-xs);display:grid}.database-select select,.secondary-button,.primary-button{border:1px solid var(--sandbox-border);border-radius:var(--radius-md);min-height:42px;color:var(--sandbox-text);cursor:pointer;font:inherit;font-size:var(--font-size-sm);background:0 0;padding:9px 12px}.database-select select{background:var(--sandbox-surface);min-width:180px}.primary-button{border-color:var(--color-brand-500);background:var(--color-brand-500);color:#fff;font-weight:600}.primary-button:hover{background:var(--color-brand-600)}.secondary-button:hover{border-color:var(--color-brand-500);color:var(--color-brand-500)}.editor-layout{gap:var(--spacing-4);display:flex}#editor{border:1px solid var(--sandbox-border);border-radius:var(--radius-md);flex:1;min-width:0;overflow:hidden}#editor .cm-editor{min-height:300px}.schema-panel{width:260px;padding:var(--spacing-4);border:1px solid var(--sandbox-border);border-radius:var(--radius-md);color:var(--sandbox-muted);font-size:var(--font-size-sm);flex:0 0 260px;overflow:auto}.schema-panel[style*="display: none"]{display:none!important}.schema-panel h3{margin:0 0 var(--spacing-3);color:var(--sandbox-text);font-size:var(--font-size-base)}.schema-table{border-bottom:1px solid var(--sandbox-border);cursor:pointer;padding:6px 0}.schema-table ul{margin:6px 0 0;padding-left:18px;list-style:none}.schema-table li{font-family:var(--font-mono);font-size:var(--font-size-xs);padding:2px 0}.editor-footer{margin-top:var(--spacing-4);color:var(--sandbox-muted);font-size:var(--font-size-xs);justify-content:space-between}#execution-time{font-style:normal}.result-card{overflow-x:auto}#output table{border-collapse:collapse;width:100%;color:var(--sandbox-text);font-size:var(--font-size-sm)}#output th,#output td{padding:var(--spacing-3) var(--spacing-4);border-bottom:1px solid var(--sandbox-border);text-align:left;vertical-align:top}#output th{color:var(--sandbox-muted);font-size:var(--font-size-xs);text-transform:uppercase;font-weight:600}.error{color:var(--color-error)}#load-more{margin-top:var(--spacing-4)}@media (width<=900px){.editor-layout{flex-direction:column}.schema-panel{flex:auto;width:auto}}@media (width<=600px){.sandbox-page{padding:104px var(--spacing-4) var(--spacing-8)}.sandbox-card{padding:var(--spacing-5)}.toolbar,.editor-footer{flex-direction:column;align-items:flex-start}.toolbar-actions{flex-wrap:wrap;width:100%}}