.aprende-sql{--paper:#f5efe4;--paper-soft:#ede5d4;--surface:#fbf8f1;--ink:#1f1d29;--ink-soft:#4a4658;--ink-faint:#8b8478;--rule:#d8cfbe;--accent:#b9482a;--accent-soft:#e8a892;--accent-deep:#8c2f1a;--leaf:#4a6b54;--leaf-soft:#d3deca;--gold:#b88a3a;--terminal-bg:#1a1925;--terminal-text:#efe9d9;--terminal-accent:#f0b878;--error:#a83232;--success:#4a6b54}.aprende-sql *{box-sizing:border-box;margin:0;padding:0}.aprende-sql{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;width:100%;min-height:100vh;font-family:Newsreader,Georgia,serif;font-size:17px;line-height:1.65;position:relative}.aprende-sql:before{content:"";pointer-events:none;opacity:.4;z-index:0;background-image:radial-gradient(circle at 20% 30%,#b88a3a0a 0,#0000 50%),radial-gradient(circle at 80% 70%,#b9482a08 0,#0000 50%);position:fixed;inset:0}.aprende-sql h1,.aprende-sql h2,.aprende-sql h3,.aprende-sql h4{letter-spacing:-.01em;color:var(--ink);font-family:Fraunces,Times New Roman,serif;font-weight:600}.aprende-sql code,.aprende-sql pre,.aprende-sql .mono{font-family:JetBrains Mono,Courier New,monospace}.aprende-sql a{color:var(--accent-deep);text-underline-offset:3px;text-decoration:underline;text-decoration-thickness:1px}.aprende-sql a:hover{color:var(--accent)}.aprende-sql header.top{z-index:50;background:var(--paper);border-bottom:1px solid var(--rule);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);position:sticky;top:0}.aprende-sql .top-inner{align-items:center;gap:24px;max-width:1400px;margin:0 auto;padding:14px 28px;display:flex}.aprende-sql .brand{align-items:baseline;gap:10px;display:flex}.aprende-sql .brand-mark{color:var(--accent);letter-spacing:-.02em;font-family:Fraunces,serif;font-size:26px;font-style:italic;font-weight:800}.aprende-sql .brand-sub{color:var(--ink-faint);letter-spacing:.02em;font-family:Newsreader,serif;font-size:14px;font-style:italic}.aprende-sql .top-progress{color:var(--ink-soft);align-items:center;gap:14px;margin-left:auto;font-size:13px;display:flex}.aprende-sql .progress-bar{background:var(--paper-soft);border:1px solid var(--rule);border-radius:999px;width:180px;height:6px;overflow:hidden}.aprende-sql .progress-fill{background:linear-gradient(90deg, var(--accent), var(--gold));width:0%;height:100%;transition:width .5s cubic-bezier(.2,.8,.2,1)}.aprende-sql .top-actions{gap:8px;display:flex}.aprende-sql .icon-btn{border:1px solid var(--rule);color:var(--ink-soft);cursor:pointer;background:0 0;border-radius:4px;padding:7px 12px;font-family:inherit;font-size:13px;transition:all .18s}.aprende-sql .icon-btn:hover{background:var(--paper-soft);border-color:var(--ink-soft);color:var(--ink)}.aprende-sql .icon-btn:focus-visible,.aprende-sql .run-btn:focus-visible,.aprende-sql .ex-btn:focus-visible,.aprende-sql .nav-btn:focus-visible,.aprende-sql .start-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.aprende-sql .layout{z-index:1;grid-template-columns:280px minmax(0,1fr);max-width:1400px;margin:0 auto;display:grid;position:relative}.aprende-sql .sidebar-overlay{grid-column:none;position:fixed}.aprende-sql aside.sidebar{border-right:1px solid var(--rule);height:calc(100vh - 65px);padding:32px 0 60px;position:sticky;top:65px;overflow-y:auto}.aprende-sql .toc-label{color:var(--ink-faint);letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--rule);margin-bottom:14px;padding:0 28px 14px;font-family:Fraunces,serif;font-size:13px;font-style:italic}.aprende-sql .toc-section{color:var(--ink-faint);letter-spacing:.05em;padding:18px 28px 6px;font-family:Fraunces,serif;font-size:12px;font-style:italic}.aprende-sql .toc-item{cursor:pointer;color:var(--ink-soft);-webkit-user-select:none;user-select:none;border-left:2px solid #0000;align-items:baseline;gap:12px;padding:8px 28px;font-size:15px;line-height:1.4;transition:color .15s,background .15s;display:flex}.aprende-sql .toc-item:hover{color:var(--ink);background:var(--paper-soft)}.aprende-sql .toc-item.active{color:var(--accent-deep);background:var(--paper-soft);border-left-color:var(--accent);font-weight:500}.aprende-sql .toc-num{color:var(--ink-faint);text-align:right;min-width:22px;font-family:JetBrains Mono,monospace;font-size:11px}.aprende-sql .toc-item.active .toc-num{color:var(--accent)}.aprende-sql .toc-check{border:1px solid var(--rule);border-radius:50%;flex-shrink:0;width:14px;height:14px;margin-top:4px;display:inline-block;position:relative}.aprende-sql .toc-item.completed .toc-check{background:var(--leaf);border-color:var(--leaf)}.aprende-sql .toc-item.completed .toc-check:after{content:"";border:solid var(--surface);border-width:0 1.5px 1.5px 0;width:4px;height:8px;position:absolute;top:1px;left:3px;transform:rotate(45deg)}.aprende-sql main{width:100%;max-width:920px;padding:48px 60px 100px}.aprende-sql .lesson-eyebrow{color:var(--accent);letter-spacing:.06em;margin-bottom:8px;font-family:Fraunces,serif;font-size:14px;font-style:italic}.aprende-sql .lesson-title{letter-spacing:-.025em;margin-bottom:12px;font-family:Fraunces,serif;font-size:clamp(36px,5vw,54px);font-weight:600;line-height:1.05}.aprende-sql .lesson-title em{color:var(--accent);font-style:italic;font-weight:500}.aprende-sql .lesson-deck{color:var(--ink-soft);border-bottom:1px solid var(--rule);max-width:640px;margin-bottom:36px;padding-bottom:28px;font-family:Newsreader,serif;font-size:19px;font-style:italic;line-height:1.5}.aprende-sql .lesson-body p{max-width:680px;margin-bottom:18px}.aprende-sql .lesson-body h3{letter-spacing:-.015em;margin:36px 0 14px;font-family:Fraunces,serif;font-size:24px;font-weight:600}.aprende-sql .lesson-body h3:before{content:"§ ";color:var(--accent);font-style:italic;font-weight:400}.aprende-sql .lesson-body code:not(pre code){background:var(--paper-soft);color:var(--accent-deep);border:1px solid var(--rule);border-radius:3px;padding:2px 6px;font-size:.88em}.aprende-sql .lesson-body strong{color:var(--ink);font-weight:600}.aprende-sql .lesson-body ul,.aprende-sql .lesson-body ol{max-width:680px;margin:16px 0 22px 22px}.aprende-sql .lesson-body li{margin-bottom:8px;padding-left:4px}.aprende-sql .lesson-body ul li::marker{color:var(--accent);content:"— "}.aprende-sql .callout{background:var(--surface);border:1px solid var(--rule);border-left:3px solid var(--gold);border-radius:2px;max-width:680px;margin:24px 0;padding:16px 22px}.aprende-sql .callout-label{color:var(--gold);letter-spacing:.04em;margin-bottom:4px;font-family:Fraunces,serif;font-size:13px;font-style:italic}.aprende-sql .callout p{margin-bottom:0;font-size:15px}.aprende-sql pre.code-block{background:var(--terminal-bg);color:var(--terminal-text);border:1px solid #2a2738;border-radius:4px;margin:18px 0;padding:18px 22px;font-size:13.5px;line-height:1.6;position:relative;overflow-x:auto}.aprende-sql pre.code-block .kw{color:var(--terminal-accent);font-weight:600}.aprende-sql pre.code-block .str{color:#b9d49a}.aprende-sql pre.code-block .num{color:#d4a8e0}.aprende-sql pre.code-block .com{color:#6c6982;font-style:italic}.aprende-sql pre.code-block .fn{color:#8cc8e8}.aprende-sql .try-this{margin-top:-10px;margin-bottom:18px}.aprende-sql .try-btn{background:var(--accent);color:var(--surface);letter-spacing:.02em;cursor:pointer;border:none;border-radius:3px;padding:9px 18px;font-family:Fraunces,serif;font-size:14px;font-style:italic;transition:all .18s}.aprende-sql .try-btn:hover{background:var(--accent-deep);transform:translateY(-1px);box-shadow:0 2px 8px #8c2f1a40}.aprende-sql .try-btn:before{content:"↓ "}.aprende-sql .playground{background:var(--surface);border:1px solid var(--rule);border-radius:4px;margin:36px 0;overflow:hidden}.aprende-sql .playground-header{background:var(--paper-soft);border-bottom:1px solid var(--rule);color:var(--ink-soft);justify-content:space-between;align-items:center;padding:10px 16px;font-family:Fraunces,serif;font-size:14px;font-style:italic;display:flex}.aprende-sql .playground-header .dots{gap:6px;display:flex}.aprende-sql .playground-header .dot{background:var(--rule);border-radius:50%;width:10px;height:10px}.aprende-sql .playground-header .dot.r{background:#d68a82}.aprende-sql .playground-header .dot.y{background:#e0c684}.aprende-sql .playground-header .dot.g{background:#a8c098}.aprende-sql .editor-wrap{position:relative}.aprende-sql textarea.sql-editor{background:var(--terminal-bg);width:100%;min-height:110px;color:var(--terminal-text);resize:vertical;tab-size:2;border:none;outline:none;padding:16px 20px;font-family:JetBrains Mono,monospace;font-size:14px;line-height:1.6}.aprende-sql textarea.sql-editor::placeholder{color:#6c6982;font-style:italic}.aprende-sql .editor-actions{background:var(--paper-soft);border-top:1px solid var(--rule);align-items:center;gap:8px;padding:10px 14px;display:flex}.aprende-sql .run-btn{background:var(--ink);color:var(--surface);cursor:pointer;letter-spacing:.02em;border:none;border-radius:3px;padding:8px 18px;font-family:JetBrains Mono,monospace;font-size:13px;transition:all .18s}.aprende-sql .run-btn:hover{background:var(--accent)}.aprende-sql .run-btn:before{content:"▶ ";font-size:10px}.aprende-sql .editor-hint{color:var(--ink-faint);margin-left:auto;font-size:12px;font-style:italic}.aprende-sql .results{border-top:1px solid var(--rule);background:var(--surface)}.aprende-sql .results-empty{color:var(--ink-faint);padding:18px 20px;font-family:Fraunces,serif;font-size:14px;font-style:italic}.aprende-sql .results-meta{background:var(--paper-soft);color:var(--ink-soft);border-bottom:1px solid var(--rule);justify-content:space-between;padding:10px 18px;font-size:12px;display:flex}.aprende-sql .results-table-wrap{max-height:360px;overflow:auto}.aprende-sql table.results-table{border-collapse:collapse;width:100%;font-family:JetBrains Mono,monospace;font-size:13px}.aprende-sql table.results-table th{background:var(--paper-soft);color:var(--ink);text-align:left;border-bottom:1px solid var(--rule);letter-spacing:.03em;padding:8px 14px;font-size:12px;font-weight:600;position:sticky;top:0}.aprende-sql table.results-table td{border-bottom:1px solid var(--paper-soft);color:var(--ink-soft);padding:7px 14px}.aprende-sql table.results-table tr:nth-child(2n) td{background:#d8cfbe2e}.aprende-sql table.results-table tr:hover td{background:#b88a3a14}.aprende-sql td.null-cell{color:var(--ink-faint);font-style:italic}.aprende-sql .err{color:var(--accent-deep);border-left:3px solid var(--accent);background:#fbeae5;padding:14px 20px;font-family:JetBrains Mono,monospace;font-size:13px}.aprende-sql .exercise{background:var(--paper-soft);border:1px solid var(--rule);border-radius:4px;margin:48px 0;padding:28px 32px;position:relative}.aprende-sql .exercise:before{content:"Ejercicio";background:var(--accent);color:var(--surface);letter-spacing:.04em;border-radius:2px;padding:4px 14px;font-family:Fraunces,serif;font-size:13px;font-style:italic;position:absolute;top:-12px;left:24px}.aprende-sql .exercise-prompt{margin-top:6px;margin-bottom:16px;font-family:Newsreader,serif;font-size:18px;line-height:1.55}.aprende-sql .exercise-prompt code{background:var(--surface);color:var(--accent-deep);border:1px solid var(--rule);border-radius:3px;padding:2px 6px;font-size:.85em}.aprende-sql .ex-controls{flex-wrap:wrap;gap:10px;margin-top:14px;display:flex}.aprende-sql .ex-btn{border:1px solid var(--ink-soft);color:var(--ink);cursor:pointer;background:0 0;border-radius:3px;padding:7px 16px;font-family:Fraunces,serif;font-size:14px;font-style:italic;transition:all .18s}.aprende-sql .ex-btn:hover{background:var(--ink);color:var(--surface)}.aprende-sql .ex-btn.primary{background:var(--leaf);border-color:var(--leaf);color:var(--surface)}.aprende-sql .ex-btn.primary:hover{background:#3a5642}.aprende-sql .feedback{border-radius:3px;margin-top:18px;padding:14px 18px;font-size:15px}.aprende-sql .feedback.ok{background:var(--leaf-soft);color:#2d4434;border-left:3px solid var(--leaf)}.aprende-sql .feedback.err{color:var(--accent-deep);border-left:3px solid var(--accent);background:#fbeae5}.aprende-sql .feedback.info{background:var(--surface);color:var(--ink-soft);border-left:3px solid var(--gold)}.aprende-sql .feedback strong{margin-bottom:4px;display:block}.aprende-sql .lesson-nav{border-top:1px solid var(--rule);justify-content:space-between;gap:12px;margin-top:60px;padding-top:28px;display:flex}.aprende-sql .nav-btn{border:1px solid var(--rule);color:var(--ink);cursor:pointer;text-align:left;background:0 0;border-radius:3px;min-width:220px;padding:12px 20px;font-family:Fraunces,serif;font-size:16px;font-style:italic;line-height:1.3;transition:all .18s}.aprende-sql .nav-btn:hover:not(:disabled){background:var(--surface);border-color:var(--ink-soft);transform:translateY(-1px)}.aprende-sql .nav-btn:disabled{opacity:.3;cursor:not-allowed}.aprende-sql .nav-btn .nav-dir{color:var(--ink-faint);font-size:12px;display:block}.aprende-sql .nav-btn.next{text-align:right}.aprende-sql .schema-modal{z-index:100;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#1f1d2999;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.aprende-sql .schema-modal.open{display:flex}.aprende-sql .schema-card{background:var(--paper);border:1px solid var(--rule);border-radius:4px;width:90%;max-width:760px;max-height:85vh;padding:32px;position:relative;overflow-y:auto}.aprende-sql .schema-close{cursor:pointer;color:var(--ink-faint);background:0 0;border:none;font-family:serif;font-size:24px;position:absolute;top:16px;right:18px}.aprende-sql .schema-close:hover{color:var(--accent)}.aprende-sql .schema-title{margin-bottom:6px;font-family:Fraunces,serif;font-size:28px;font-weight:600}.aprende-sql .schema-sub{color:var(--ink-soft);margin-bottom:24px;font-style:italic}.aprende-sql .schema-table{border:1px solid var(--rule);border-radius:3px;margin-bottom:22px;overflow:hidden}.aprende-sql .schema-table-name{background:var(--paper-soft);color:var(--accent-deep);border-bottom:1px solid var(--rule);padding:8px 14px;font-family:JetBrains Mono,monospace;font-size:14px;font-weight:600}.aprende-sql .schema-cols{background:var(--surface);padding:10px 14px;font-family:JetBrains Mono,monospace;font-size:12.5px;line-height:1.9}.aprende-sql .schema-cols .col-name{color:var(--ink)}.aprende-sql .schema-cols .col-type{color:var(--ink-faint);margin-left:10px}.aprende-sql .schema-cols .col-pk{color:var(--gold);margin-left:8px;font-style:italic}.aprende-sql .schema-cols .col-fk{color:var(--leaf);margin-left:8px;font-style:italic}.aprende-sql .loader{background:var(--paper);z-index:1000;flex-direction:column;justify-content:center;align-items:center;transition:opacity .4s;display:flex;position:fixed;inset:0}.aprende-sql .loader.hidden{opacity:0;pointer-events:none}.aprende-sql .loader-mark{color:var(--accent);letter-spacing:-.03em;font-family:Fraunces,serif;font-size:48px;font-style:italic;font-weight:800}.aprende-sql .loader-text{color:var(--ink-soft);margin-top:14px;font-family:Fraunces,serif;font-size:16px;font-style:italic}.aprende-sql .loader-dots:after{text-align:left;content:"";width:24px;animation:1.4s steps(4,end) infinite aprende-sql-dots;display:inline-block}@keyframes aprende-sql-dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}.aprende-sql .welcome-hero{border-bottom:1px solid var(--rule);margin:20px 0 60px;padding:48px 0}.aprende-sql .welcome-kicker{color:var(--accent);letter-spacing:.04em;margin-bottom:16px;font-family:Fraunces,serif;font-size:16px;font-style:italic}.aprende-sql .welcome-title{letter-spacing:-.035em;margin-bottom:24px;font-family:Fraunces,serif;font-size:clamp(48px,7vw,88px);font-weight:800;line-height:.95}.aprende-sql .welcome-title em{color:var(--accent);font-style:italic;font-weight:500}.aprende-sql .welcome-lede{color:var(--ink-soft);max-width:580px;font-family:Newsreader,serif;font-size:22px;font-style:italic;line-height:1.45}.aprende-sql .welcome-meta{color:var(--ink-soft);flex-wrap:wrap;gap:36px;margin-top:36px;font-size:14px;display:flex}.aprende-sql .welcome-meta div{border-left:2px solid var(--accent);padding-left:14px}.aprende-sql .welcome-meta strong{color:var(--ink);font-family:Fraunces,serif;font-size:18px;font-style:italic;font-weight:600;display:block}.aprende-sql .start-btn{background:var(--ink);color:var(--paper);cursor:pointer;letter-spacing:.01em;border:none;border-radius:3px;margin-top:32px;padding:16px 32px;font-family:Fraunces,serif;font-size:18px;font-style:italic;transition:all .2s}.aprende-sql .start-btn:hover{background:var(--accent);transform:translateY(-2px);box-shadow:0 4px 16px #b9482a4d}.aprende-sql .cheatsheet-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin:24px 0;display:grid}.aprende-sql .cheat-card{background:var(--surface);border:1px solid var(--rule);border-radius:3px;padding:18px}.aprende-sql .cheat-card h4{color:var(--accent-deep);margin-bottom:8px;font-family:Fraunces,serif;font-size:17px;font-style:italic}.aprende-sql .cheat-card pre{background:var(--terminal-bg);color:var(--terminal-text);border-radius:3px;margin-top:8px;padding:10px 12px;font-size:12px;overflow-x:auto}.aprende-sql .cheat-card p{color:var(--ink-soft);margin:0;font-size:14px}.aprende-sql .schema-mini{border:1px dashed var(--rule);background:var(--surface);color:var(--ink-soft);border-radius:3px;margin:16px 0;padding:12px 16px;font-family:JetBrains Mono,monospace;font-size:13px}.aprende-sql .mobile-menu-btn{display:none!important}.aprende-sql .mobile-actions{border-top:1px solid var(--rule);background:var(--paper-soft);gap:6px;padding:14px 18px;display:none}.aprende-sql .mobile-actions .icon-btn{text-align:center;flex:1;padding:10px 6px;font-size:12px}@media (max-width:900px){.aprende-sql .mobile-menu-btn{display:flex!important}.aprende-sql .layout{grid-template-columns:1fr}.aprende-sql aside.sidebar{z-index:60;background:var(--paper);border-right:1px solid var(--rule);width:280px;height:100vh;padding-top:20px;transition:left .28s cubic-bezier(.2,0,0,1);position:fixed;top:0;left:-100%}.aprende-sql aside.sidebar.open{left:0}.aprende-sql .sidebar-overlay{z-index:55;background:#0000004d;display:none;position:fixed;inset:0}.aprende-sql .sidebar-overlay.open{display:block}.aprende-sql main{padding:28px 18px 60px}.aprende-sql .welcome-meta{gap:16px}.aprende-sql .top-progress{flex:1;margin-left:0;display:flex}.aprende-sql .top-progress .progress-bar{flex:1;width:auto}.aprende-sql .top-actions{display:none}.aprende-sql .mobile-actions{display:flex!important}.aprende-sql .brand-sub{display:none}.aprende-sql .top-inner{gap:12px}.aprende-sql .lesson-title{font-size:clamp(28px,5vw,54px)!important}.aprende-sql .playground{border-radius:0;margin:24px -18px 0}.aprende-sql .exercise{border-radius:0;margin:18px -18px 0;padding:24px 18px}.aprende-sql .lesson-nav{flex-direction:column}.aprende-sql .lesson-nav .nav-btn{width:100%}}@media (max-width:500px){.aprende-sql .top-progress span{display:none}.aprende-sql .top-progress .progress-bar{width:100%}.aprende-sql .results-table{font-size:12px}}.aprende-sql .hidden{display:none!important}.aprende-sql .fade-in{animation:.5s aprende-sql-fadeIn}@keyframes aprende-sql-fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.aprende-sql .confetti-piece{z-index:9999;pointer-events:none;width:8px;height:14px;animation:linear forwards aprende-sql-fall;position:fixed;top:-20px}@keyframes aprende-sql-fall{to{opacity:.6;transform:translateY(110vh)rotate(540deg)}}
