:root{--bg:#0f1420;--bg-panel:#161d2e;--bg-panel-raised:#1c2440;--bg-editor:#0c1019;--border:#2a3350;--border-soft:#232b44;--text:#e7e9f2;--text-dim:#9198b3;--text-faint:#5b6482;--accent-amber:#e8a33d;--accent-amber-dim:#a97b30;--accent-teal:#4fd1ae;--accent-teal-dim:#2f8a70;--accent-rose:#e8607a;--accent-rose-dim:#a94456;--accent-violet:#a78bfa;--font-display:"Fraunces", "Iowan Old Style", Georgia, serif;--font-body:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"IBM Plex Mono", "SFMono-Regular", Consolas, monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased}#root{min-height:100vh}button{cursor:pointer;font-family:inherit}textarea{font-family:inherit}a{color:var(--accent-amber)}::selection{background:var(--accent-amber-dim);color:#0f1420}:focus-visible{outline:2px solid var(--accent-amber);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}}.app-shell{min-height:100vh;display:flex}.sidebar{background:var(--bg-panel);border-right:1px solid var(--border-soft);flex-shrink:0;width:280px;height:100vh;padding:20px 0 40px;position:sticky;top:0;overflow-y:auto}.sidebar-header{border-bottom:1px solid var(--border-soft);align-items:center;gap:12px;margin-bottom:8px;padding:0 20px 20px;display:flex}.brand-mark{font-family:var(--font-display);color:var(--accent-amber);font-size:26px;font-style:italic;line-height:1}.brand-title{font-family:var(--font-mono);letter-spacing:-.02em;font-size:14px}.brand-progress{color:var(--text-faint);font-size:11px;font-family:var(--font-mono);margin-top:2px}.nav-module{padding:14px 20px 6px}.nav-module-title{text-transform:uppercase;letter-spacing:.08em;color:var(--text-faint);align-items:baseline;gap:8px;margin-bottom:6px;font-size:11px;display:flex}.module-index{font-family:var(--font-mono);color:var(--accent-amber-dim)}.nav-module-name{min-width:0}.extra-mile-badge{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--accent-violet);border:1px solid var(--accent-violet);white-space:nowrap;border-radius:999px;margin:3px 0 6px;padding:1px 7px;font-size:9.5px;line-height:1.5;display:inline-block}.dataset-toggle{background:var(--bg-editor);border:1px solid var(--border-soft);border-radius:9px;gap:4px;margin:16px 20px 14px;padding:3px;display:flex}.dataset-toggle-btn{color:var(--text-faint);background:0 0;border:none;border-radius:6px;flex:1;padding:7px 8px;font-size:12px;font-weight:600;transition:background .12s,color .12s}.dataset-toggle-btn:hover{color:var(--text-dim)}.dataset-toggle-btn.active{background:var(--bg-panel-raised);color:var(--accent-amber)}.certificate-nav-button{border:1px solid var(--accent-violet);width:calc(100% - 40px);color:var(--accent-violet);text-align:left;background:#a78bfa1a;border-radius:8px;margin:0 20px 16px;padding:9px 12px;font-size:12.5px;font-weight:600;transition:background .12s;display:block}.certificate-nav-button:hover{background:#a78bfa2e}.nav-module ul{margin:0;padding:0;list-style:none}.nav-item{text-align:left;width:100%;color:var(--text-dim);background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;padding:6px 8px;font-size:13.5px;transition:background .12s,color .12s;display:flex}.nav-item:hover{background:var(--bg-panel-raised);color:var(--text)}.nav-item.active{background:var(--bg-panel-raised);color:var(--accent-amber);font-weight:600}.nav-item.done .nav-item-dot{color:var(--accent-teal)}.nav-item-dot{font-family:var(--font-mono);color:var(--text-faint);flex-shrink:0;width:12px}.main-column{flex:1;min-width:0;max-width:900px;padding:28px 40px 80px}.loading-state{color:var(--text-dim);font-family:var(--font-mono);font-size:13px}.schema-strip{background:var(--bg-panel);border:1px solid var(--border-soft);border-radius:12px;margin-bottom:32px;padding:18px 22px 8px}.schema-strip-label{font-family:var(--font-display);align-items:baseline;gap:10px;font-size:22px;font-style:italic;display:flex}.schema-strip-blurb{color:var(--text-dim);max-width:62ch;margin:6px 0 4px;font-size:13.5px;line-height:1.5}.schema-diagram{width:100%;height:auto;margin-top:4px;display:block}.schema-diagram .table-node rect:first-child{fill:var(--bg-editor);stroke:var(--border);stroke-width:1px}.schema-diagram .table-head-bg{fill:var(--border-soft)}.schema-diagram .table-name{fill:var(--text-faint);font-family:var(--font-mono);font-size:12px;font-weight:600}.schema-diagram .table-nickname{fill:var(--text-faint);font-family:var(--font-display);font-style:italic}.schema-diagram .table-nickname-sub{opacity:.8;font-size:10px}.schema-diagram .col-row{fill:var(--text-faint);font-family:var(--font-mono);font-size:10.5px}.schema-diagram .col-type{fill:var(--text-faint);opacity:.55}.schema-diagram .table-node.active rect:first-child{stroke:var(--accent-amber-dim)}.schema-diagram .table-node.active .table-head-bg{fill:var(--accent-amber-dim);opacity:.35}.schema-diagram .table-node.active .table-name{fill:var(--accent-amber)}.schema-diagram .table-node.active .col-row{fill:var(--text-dim)}.schema-diagram .rel path{stroke:var(--border);stroke-width:1.25px}.schema-diagram .rel-label-bg{fill:var(--bg-panel)}.schema-diagram .rel text{fill:var(--text-faint);font-family:var(--font-mono);font-size:9.5px}.schema-diagram .rel.active path{stroke:var(--accent-amber-dim);stroke-width:1.75px}.schema-diagram .rel.active .rel-label-bg{fill:var(--bg-panel-raised)}.schema-diagram .rel.active text{fill:var(--accent-amber)}.exercise-panel{animation:.25s rise}@keyframes rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.exercise-header{align-items:baseline;gap:14px;margin-bottom:10px;display:flex}.exercise-eyebrow{font-family:var(--font-mono);color:var(--accent-amber-dim);font-size:13px}.exercise-header h1{font-family:var(--font-display);margin:0;font-size:30px;font-weight:500}.exercise-prompt{color:var(--text-dim);max-width:68ch;margin:0 0 16px;font-size:15px;line-height:1.65}.prompt-snippet{background:var(--bg-editor);border:1px solid var(--border);font-family:var(--font-mono);color:var(--text-dim);white-space:pre;border-radius:8px;max-width:68ch;margin:0 0 24px;padding:12px 14px;font-size:12.5px;line-height:1.6;overflow-x:auto}.editor-block{background:var(--bg-panel);border:1px solid var(--border-soft);border-radius:12px;margin-bottom:20px;padding:16px}.editor-label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);justify-content:space-between;align-items:center;margin-bottom:8px;font-size:11px;display:flex}.editor-hint-key{text-transform:none;letter-spacing:0;opacity:.8}.sql-editor{background:var(--bg-editor);border:1px solid var(--border);width:100%;color:var(--accent-amber);font-family:var(--font-mono);resize:vertical;border-radius:8px;min-height:110px;padding:12px 14px;font-size:14px;line-height:1.6}.sql-editor::placeholder{color:var(--text-faint)}.sql-editor:focus{border-color:var(--accent-amber-dim);outline:none}.editor-actions{gap:10px;margin-top:12px;display:flex}.btn-run{background:var(--accent-amber);color:#1a1305;border:none;border-radius:7px;padding:9px 18px;font-size:13.5px;font-weight:600;transition:transform 80ms,background .12s}.btn-run:hover{background:#f0b45a}.btn-run:active{transform:scale(.98)}.btn-ghost{border:1px solid var(--border);color:var(--text-dim);background:0 0;border-radius:7px;padding:8px 14px;font-size:13px;transition:border-color .12s,color .12s}.btn-ghost:hover{border-color:var(--text-faint);color:var(--text)}.hint-box{background:var(--bg-panel-raised);border-left:2px solid var(--accent-amber-dim);color:var(--text-dim);font-size:13.5px;font-family:var(--font-mono);border-radius:0 6px 6px 0;margin:12px 0 0;padding:10px 14px}.solution-box{background:var(--bg-editor);border:1px solid var(--border);font-family:var(--font-mono);color:var(--accent-teal);white-space:pre;border-radius:6px;margin:12px 0 0;padding:10px 14px;font-size:13px;overflow-x:auto}.verdict{font-family:var(--font-mono);border-radius:8px;margin-bottom:20px;padding:10px 14px;font-size:13.5px;animation:.18s pop}@keyframes pop{0%{opacity:.5;transform:scale(.97)}to{opacity:1;transform:scale(1)}}.verdict-correct{color:var(--accent-teal);border:1px solid var(--accent-teal-dim);background:#4fd1ae1f}.verdict-incorrect{color:var(--accent-rose);border:1px solid var(--accent-rose-dim);background:#e8607a1a}.verdict-error{color:var(--accent-rose);border:1px solid var(--accent-rose-dim);font-family:var(--font-mono);white-space:pre-wrap;background:#e8607a1a}.result-block{background:var(--bg-panel);border:1px solid var(--border-soft);border-radius:12px;padding:16px}.result-empty{color:var(--text-faint);font-family:var(--font-mono);margin:4px 0;font-size:13px}.result-table-wrap{border:1px solid var(--border);border-radius:8px;overflow-x:auto}.result-table{border-collapse:collapse;width:100%;font-family:var(--font-mono);white-space:nowrap;font-size:12.5px}.result-table th{text-align:left;background:var(--bg-panel-raised);color:var(--text-dim);border-bottom:1px solid var(--border);padding:8px 12px;font-weight:600;position:sticky;top:0}.result-table td{border-bottom:1px solid var(--border-soft);color:var(--text);padding:7px 12px}.result-table tr:last-child td{border-bottom:none}.cell-null{color:var(--text-faint);font-style:italic}.certificate-overlay{z-index:100;background:#06080ec7;justify-content:center;align-items:center;padding:24px;animation:.2s pop;display:flex;position:fixed;inset:0}.certificate-card{background:var(--bg-panel);border:1px solid var(--accent-violet);text-align:center;border-radius:16px;width:100%;max-width:560px;padding:48px 44px 36px;position:relative;box-shadow:0 24px 80px #00000080}.certificate-card:before{content:"";border:1px solid var(--border);pointer-events:none;border-radius:10px;position:absolute;inset:10px}.certificate-seal{border:2px solid var(--accent-amber);width:56px;height:56px;color:var(--accent-amber);font-family:var(--font-mono);letter-spacing:.04em;border-radius:999px;justify-content:center;align-items:center;margin:0 auto 18px;font-size:13px;font-weight:600;display:flex}.certificate-eyebrow{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.12em;color:var(--accent-violet);margin:0 0 6px;font-size:11px}.certificate-title{font-family:var(--font-display);margin:0 0 24px;font-size:36px;font-style:italic;font-weight:500}.certificate-name-field{flex-direction:column;align-items:center;gap:6px;margin:0 0 4px;display:flex}.certificate-name-field span{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--text-faint);font-size:10.5px}.certificate-name-field input{background:var(--bg-editor);border:1px solid var(--border);width:260px;max-width:100%;color:var(--text);font-family:var(--font-body);text-align:center;border-radius:7px;padding:8px 12px;font-size:14px}.certificate-name-field input:focus{border-color:var(--accent-violet);outline:none}.certificate-recipient{font-family:var(--font-display);color:var(--accent-amber);margin:2px 0 18px;font-size:20px;font-style:italic}.certificate-body{color:var(--text-dim);max-width:42ch;margin:0 auto 22px;font-size:14.5px;line-height:1.7}.certificate-body strong{color:var(--text)}.certificate-date{font-family:var(--font-mono);color:var(--text-faint);margin:0 0 4px;font-size:12px}.certificate-signature{font-family:var(--font-display);color:var(--accent-amber);margin:0 0 28px;font-size:18px;font-style:italic}.certificate-actions{justify-content:center;gap:10px;display:flex}@media print{.sidebar,.schema-strip,.exercise-panel,.loading-state,.certificate-actions,.certificate-name-field{display:none!important}.certificate-overlay{background:#fff;padding:0;position:static}.certificate-card{box-shadow:none;color:#000;border-color:#000}.certificate-card:before{border-color:#000}.certificate-body,.certificate-date{color:#000}}@media (width<=860px){.app-shell{flex-direction:column}.sidebar{width:100%;height:auto;max-height:40vh;position:relative}.main-column{max-width:100%;padding:20px 18px 60px}.exercise-header h1{font-size:24px}}