:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{width:100%;margin:0;padding:0;text-align:initial}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}body,html,#root,.app-container{height:100%;margin:0}.app-container{display:flex;flex-direction:column;font-family:system-ui,sans-serif;color:#1d1f21;background:#f7f9fb}.app-header{padding:1rem 1.25rem;background:#14213d;color:#fff;box-shadow:0 2px 4px #00000026}.app-header h1{margin:0 0 .25rem;font-size:1.4rem}.tagline{margin:0;font-size:.85rem;opacity:.8}.app-footer{padding:.35rem .75rem;font-size:.55rem;text-align:center;background:#14213d;color:#fff;margin-top:auto;opacity:.7;letter-spacing:.5px}.sql-playground.layout{flex:1;display:grid;grid-template-columns:260px 1fr;gap:0;min-height:0}.sidebar{background:#fff;border-right:1px solid #d0d7de;padding:.75rem .75rem 1rem;overflow:auto}.main-panel{overflow:auto;padding:0;display:grid;grid-template-columns:1fr 300px;grid-template-rows:auto 1fr;grid-template-areas:"editor schema" "result schema";gap:0}.editor-section{grid-area:editor;padding:.75rem .75rem .25rem;border-bottom:1px solid #e2e8f0}.result-section{grid-area:result;padding:.75rem;overflow:auto}.schema-section{grid-area:schema;padding:.75rem;background:#fafbfc;border-left:1px solid #d0d7de;overflow:auto}.challenge-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.25rem}.challenge-list li button{width:100%;text-align:left;background:transparent;border:1px solid transparent;border-radius:4px;padding:.4rem .5rem;cursor:pointer;font-size:.8rem}.challenge-list li.active button,.challenge-list li button:hover{background:#eef5ff;border-color:#aac8ff}.challenge-details h3{margin:.5rem 0 .25rem;font-size:.95rem}.challenge-details p{margin:0 0 .5rem;font-size:.75rem;line-height:1.2}.challenge-actions{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem}.challenge-actions button{font-size:.65rem;padding:.35rem .55rem;border:1px solid #143d75;background:#1d4ed8;color:#fff;border-radius:4px;cursor:pointer}.challenge-actions button:hover{background:#1e40af}.challenge-status{margin-top:.5rem;font-size:.7rem;padding:.4rem .5rem;border-radius:4px}.challenge-status.pass{background:#dcfce7;color:#166534}.challenge-status.fail{background:#fee2e2;color:#991b1b}.editor-header{display:flex;align-items:baseline;justify-content:space-between}.sql-editor{width:100%;min-height:140px;font-family:JetBrains Mono,monospace;font-size:.8rem;border:1px solid #cbd5e1;border-radius:4px;padding:.5rem;resize:vertical;background:#fff}.sql-editor:focus{outline:2px solid #2563eb33}.error-box{margin-top:.5rem;background:#fff5f5;border:1px solid #fecaca;color:#b91c1c;padding:.4rem .6rem;font-size:.7rem;border-radius:4px;white-space:pre-wrap}.result-table-wrapper{overflow:auto;max-height:340px;border:1px solid #d0d7de;border-radius:4px;background:#fff}.data-explorer{margin-top:1rem;border:1px solid #d0d7de;border-radius:6px;background:#fff}.collapse-toggle{all:unset;cursor:pointer;display:block;width:100%;padding:.4rem .55rem;font-size:.65rem;font-weight:600;background:#f1f5f9;border-bottom:1px solid #d0d7de}.collapse-toggle:hover{background:#e2e8f0}.explorer-content{padding:.4rem .5rem .6rem;max-height:320px;overflow:auto}.explorer-table-block{margin-bottom:.75rem}.explorer-table-header{display:flex;justify-content:space-between;font-size:.6rem;margin-bottom:.25rem}.explorer-table-wrapper{border:1px solid #e5e7eb;border-radius:4px;overflow:auto;max-height:160px}.explorer-table-wrapper table{font-size:.6rem}.hl-row{background:#fff3c4!important}table{border-collapse:collapse;width:100%;font-size:.7rem}th,td{padding:.35rem .5rem;border:1px solid #e5e7eb;text-align:left}th{position:sticky;top:0;background:#f1f5f9;font-weight:600}tbody tr:hover{background:#fef9c3}.placeholder{font-size:.75rem;color:#64748b}.result-header{display:flex;align-items:baseline;gap:.5rem}.schema-block{margin-bottom:1rem}.schema-block h3{margin:.5rem 0 .3rem;font-size:.8rem;color:#0f172a}.schema-table,.preview-table{margin-bottom:.4rem}.schema-table th,.schema-table td{background:#fff}.schema-block details{font-size:.65rem}@media (max-width: 1100px){.sql-playground.layout{grid-template-columns:210px 1fr}.main-panel{grid-template-columns:1fr;grid-template-areas:"editor" "result" "schema"}.schema-section{border-left:none;border-top:1px solid #d0d7de}}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}@media (prefers-color-scheme: dark){.app-container{color:#e5e7eb;background:#0b1220}.app-header,.app-footer{background:#0b1020;color:#e5e7eb}.sidebar{background:#0f172a;border-right:1px solid #334155}.main-panel{background:#0b1220}.editor-section{border-bottom:1px solid #334155}.result-section{color:#e5e7eb}.schema-section{background:#0b1220;border-left:1px solid #334155}.challenge-list li.active button,.challenge-list li button:hover{background:#0b2942;border-color:#1e40af}.challenge-details h3{color:#e5e7eb}.challenge-details p{color:#cbd5e1}.challenge-status.pass{background:#064e3b;color:#d1fae5}.challenge-status.fail{background:#7f1d1d;color:#fecaca}.sql-editor{border:1px solid #334155;background:#0b182a;color:#e5e7eb}.error-box{background:#3a1f1f;border:1px solid #7f1d1d;color:#fecaca}.result-table-wrapper,.data-explorer{border:1px solid #334155;background:#0f172a}.collapse-toggle{background:#111827;border-bottom:1px solid #334155;color:#e5e7eb}.explorer-table-wrapper{border:1px solid #334155}.explorer-table-wrapper table{color:#e5e7eb}.hl-row{background:#3a2e12!important}table{color:#e5e7eb;background:transparent}th,td{border:1px solid #374151}th{background:#111827;color:#e5e7eb}tbody tr:hover{background:#1f2937}.schema-block h3{color:#e5e7eb}.schema-table th,.schema-table td{background:#0f172a}.placeholder{color:#94a3b8}}
