:root{--font-heading: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-body: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-code: "JetBrains Mono", "Fira Code", "Consolas", monospace;--font-sidebar: "Space Grotesk", sans-serif;--bg-primary: #0c0c14;--bg-secondary: #12121e;--bg-elevated: #1a1a2e;--bg-surface: rgba(255, 255, 255, .03);--bg-surface-hover: rgba(255, 255, 255, .06);--text-primary: #f0eef6;--text-secondary: #a8a3b8;--text-tertiary: #7a7490;--accent-primary: #7c6cf0;--accent-primary-hover: #8b7df5;--accent-secondary: #a78bfa;--accent-gradient: linear-gradient(135deg, #7c6cf0 0%, #a78bfa 100%);--accent-glow: rgba(124, 108, 240, .3);--success: #10b981;--warning: #f59e0b;--danger: #ef4444;--info: #3b82f6;--border-subtle: rgba(255, 255, 255, .06);--border-default: rgba(255, 255, 255, .1);--border-accent: rgba(124, 108, 240, .3);--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--space-3xl: 4rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 9999px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .2);--shadow-md: 0 8px 24px rgba(0, 0, 0, .3);--shadow-lg: 0 16px 40px rgba(0, 0, 0, .4);--shadow-accent: 0 4px 20px rgba(124, 108, 240, .25);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}html,body,#root{width:100%;min-height:100vh;margin:0;padding:0;background-color:var(--bg-primary);overflow-x:hidden}body{font-family:var(--font-body);font-weight:400;line-height:1.6;color:var(--text-primary)}#root{overflow-y:auto}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);line-height:1.2}code,pre,kbd,samp{font-family:var(--font-code)}a{font-weight:500;color:var(--accent-primary);text-decoration:inherit;transition:color var(--transition-fast)}a:hover{color:var(--accent-primary-hover)}button{border-radius:var(--radius-md);border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:var(--font-body);background-color:transparent;cursor:pointer;transition:all var(--transition-base)}button:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}button:active{transform:scale(.97)}input,textarea,select{font-family:var(--font-body)}select option{background:#1a1a2e;color:#f0eef6}input::placeholder,textarea::placeholder{color:var(--text-tertiary)}input:focus,textarea:focus,select:focus{border-color:var(--accent-primary)!important;outline:none;box-shadow:0 0 0 3px #7c6cf026}::selection{background:#7c6cf04d;color:var(--text-primary)}:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--bg-elevated);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes pulse-glow{0%,to{opacity:.4;transform:scale(1)}50%{opacity:.6;transform:scale(1.05)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@media(max-width:768px){body{font-size:16px}button,a,input,select,textarea{min-height:44px}}#root{width:100%;min-height:100vh;margin:0;padding:0}.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)}@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}body{margin:0;font-family:monospace;background:linear-gradient(135deg,#1e3a8a,#7e22ce);color:#fff}.dropdown-container{background:linear-gradient(135deg,#3b82f6,#9333ea);padding:2rem;border-radius:1rem;max-width:600px;margin:2rem auto}.sql-preview{position:sticky;top:1rem;z-index:10;background-color:#000000b3;padding:1rem;border-radius:.5rem;max-width:600px;margin:1rem auto;word-wrap:break-word}.table-container{position:fixed;top:1rem;left:1rem;background-color:#000000f2;padding:1rem;border-radius:.5rem;z-index:1000;max-height:90vh;overflow:auto;min-width:300px;max-width:90vw;width:auto;box-shadow:0 0 10px #000000b3;transition:all .3s ease}.table-container table{border-collapse:collapse;width:max-content;min-width:100%;table-layout:auto}.table-container th,.table-container td{padding:.5rem;border:1px solid #444;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table-container th{position:sticky;top:0;background-color:#1f2937;color:#fff;font-weight:700;z-index:2;text-align:left}.table-container .table-wrapper{overflow-x:auto;width:100%}@media screen and (max-width:640px){.table-container{width:95%;left:50%;transform:translate(-50%);top:5rem}.table-container table{display:block;overflow-x:auto;white-space:nowrap}.table-container th,.table-container td{font-size:.8rem;padding:.3rem .5rem}}.pay-btn{background-color:#3b82f6;color:#fff;border:none;padding:.8rem 1.6rem;border-radius:.5rem;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease}.pay-btn:hover{background-color:#2563eb;transform:scale(1.03)}.sidenav{position:fixed;top:0;right:-400px;width:300px;height:100%;background-color:#000000e6;padding:1rem;transition:right .3s ease;z-index:1000}.sidenav-close{background:none;border:none;color:#fff;right:-10;font-size:1.5rem;cursor:pointer}.sidenav-btn{display:block;width:100%;padding:.8rem;margin-bottom:.5rem;background-color:#3b82f6;color:#fff;border:none;border-radius:.5rem;cursor:pointer;font-size:1rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1001}.modal-content{background-color:#000000e6;padding:2rem;border-radius:.5rem;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;color:#fff}.modal-content h3{margin-top:0;color:#fff}.modal-close{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;float:right}.progress-list{margin-top:1rem}.progress-btn{display:block;width:100%;padding:.5rem;margin-bottom:.5rem;border:none;border-radius:.5rem;cursor:pointer;font-size:.9rem;text-align:left}.unlocked{background-color:#22c55e;color:#fff}.locked{background-color:#6b7280;color:#fff;cursor:not-allowed}.sql-code{background-color:#1f2937;padding:1rem;border-radius:.5rem;font-family:monospace;white-space:pre-wrap;word-break:break-word}.menu-btn{position:fixed;top:1rem;right:1rem;background-color:#3a3d55;color:#f5f5f5;padding:.5rem 1rem;border-radius:.25rem;border:none;cursor:pointer;font-weight:700;z-index:1010;transition:all .3s ease}.menu-btn:hover{background-color:#505272;transform:scale(1.05)}.sidenav-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:999}.sidenav{position:fixed;top:0;right:-400px;width:300px;height:100%;background-color:#000000e6;padding:1rem;transition:right .3s ease;z-index:1000;overflow-y:auto}.sidenav-open{right:0}.sidenav-close{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;margin-bottom:1rem}.sidenav h3{color:#fff;margin-bottom:1rem}.sidenav-btn{display:block;width:100%;padding:.8rem;margin-bottom:.5rem;background-color:#3b82f6;color:#fff;border:none;border-radius:.5rem;cursor:pointer;font-size:1rem;transition:background .2s}.sidenav-btn:hover{background-color:#2563eb}body{margin:0;font-family:Fira Code,monospace;background-color:#1e1e2f;color:#cdd6f4}#root{display:flex;flex-direction:row;height:100vh;overflow:hidden}.sidenav{width:250px;background-color:#2a2a3f;padding:1rem;display:flex;flex-direction:column;overflow-y:auto;transition:transform .3s ease;z-index:1000}.sidenav-open{transform:translate(0)}.sidenav-close{align-self:flex-end;background:none;border:none;color:#f5f5f5;font-size:1.2rem;cursor:pointer}.sidenav h3{margin-top:0;color:#f5f5f5}.sidenav-btn{padding:.5rem 1rem;margin:.25rem 0;background-color:#3a3d55;border-radius:.25rem;border:none;color:#f5f5f5;text-align:left;cursor:pointer;font-size:.9rem;transition:background .2s}.sidenav-btn:hover{background-color:#505272}.logout-btn{background-color:#ef4444}.logout-btn:hover{background-color:#dc2626}.editor-container{flex:1;display:flex;flex-direction:column;padding:1rem;gap:1rem}.sql-preview{background-color:#1e1e2f;padding:1rem;border-radius:.5rem;font-family:Fira Code,monospace;border:1px solid #333;max-height:120px;overflow-x:auto}.dropdown-container select{width:100%;padding:.5rem;border-radius:.25rem;border:1px solid #555;background-color:#2a2a3f;color:#f5f5f5;font-family:Fira Code,monospace;font-size:.9rem}.dropdown-container select:disabled{opacity:.6;cursor:not-allowed}button{font-family:Fira Code,monospace;font-weight:700;transition:background .2s,transform .2s}button:hover{transform:scale(1.02)}.table-container{position:fixed;top:1rem;right:1rem;background-color:#000000f2;padding:1rem;border-radius:.5rem;z-index:1000;max-height:90vh;overflow:auto;width:430px;box-shadow:0 0 10px #000000b3;transition:all .3s ease}.table-container table{border-collapse:collapse;width:100%;table-layout:fixed}.table-container th,.table-container td{padding:.5rem;border:1px solid #444;word-wrap:break-word;transition:background-color .3s,color .3s}.table-container th{position:sticky;top:0;background-color:#1f2937;color:#fff;font-weight:700;z-index:2}.table-container tbody tr:nth-child(2n){background-color:#ffffff0d}.table-container tbody tr:hover{background-color:#ffffff26}.table-container th.selected,.table-container td.selected{background-color:#22c55e!important;color:#fff;font-weight:700}.table-container td.placeholder{color:#999;text-align:center}@media screen and (max-width:640px){.table-container{width:90%;left:50%;transform:translate(-50%);top:5rem}.table-container table{display:block;overflow-x:auto;white-space:nowrap}}.modal-overlay{background-color:#1e1e2ff2}.modal-content{background-color:#2a2a3f;border-radius:.5rem;padding:1rem;max-width:500px;color:#f5f5f5}.modal-close{color:#f5f5f5;cursor:pointer;font-size:1.2rem}.menu-btn{position:fixed;top:1rem;right:1rem;background-color:#3a3d55;color:#f5f5f5;padding:.5rem 1rem;border-radius:.25rem}.show-table-btn{position:fixed;top:1rem;left:1rem;padding:.5rem 1rem;background-color:#facc15;border:none;border-radius:.5rem;cursor:pointer;font-weight:700;z-index:1010;transition:all .3s ease}.show-table-btn:hover{background-color:#eab308;transform:scale(1.05)}.show-table-btn.active{background-color:#22c55e}.leaderboard-table-container{margin-top:1rem;max-height:400px;overflow-y:auto;border-radius:.5rem;border:1px solid #444}.leaderboard-table{width:100%;border-collapse:collapse;background-color:#000000e6;color:#fff;font-family:monospace}.leaderboard-table th,.leaderboard-table td{padding:.8rem;text-align:left;border-bottom:1px solid #444}.leaderboard-table th{background-color:#1f2937;font-weight:700;position:sticky;top:0;z-index:1}.leaderboard-table tr:hover{background-color:#ffffff1a}.leaderboard-table td:first-child{font-weight:700;color:#f59e0b;width:80px}.leaderboard-table td:nth-child(3){color:#22c55e;text-align:center;width:120px}.donation-modal-scroll::-webkit-scrollbar{width:6px}.donation-modal-scroll::-webkit-scrollbar-track{background:transparent}.donation-modal-scroll::-webkit-scrollbar-thumb{background:#f59e0b80;border-radius:3px}.donation-modal-scroll::-webkit-scrollbar-thumb:hover{background:#f59e0bd9}