@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap";:root{--blue:#0a5b85;--blue-deep:#043a58;--blue-soft:#e4edf2;--gray:#3d4348;--gray-soft:#e8e9eb;--paper:#faf7f1;--white:#fff;--green:#3f7a5c;--amber:#c9a227;--red:#a8433c;--font-display:"Space Grotesk", sans-serif;--font-body:"Inter", sans-serif}*{box-sizing:border-box}body{background:radial-gradient(ellipse 900px 500px at 15% -10%, #ffffff12, transparent 60%), radial-gradient(ellipse 700px 500px at 100% 10%, #ffffff0d, transparent 55%), var(--blue);color:var(--paper);font-family:var(--font-body);margin:0;line-height:1.5;position:relative}body:before{content:"";pointer-events:none;z-index:0;opacity:.5;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}#root{z-index:1;min-height:100svh;position:relative}h1,h2,h3,.display{font-family:var(--font-display);letter-spacing:-.01em;color:var(--paper);font-weight:600;line-height:1.15}h1.display{margin:0 0 12px;font-size:clamp(2rem,4vw,2.75rem)}a{color:var(--paper)}.app-shell{z-index:1;flex-direction:column;min-height:100vh;display:flex;position:relative}.topbar{-webkit-backdrop-filter:blur(10px);color:var(--paper);background:#043a58bf;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding:18px 32px;display:flex}.topbar-spanish2{border-bottom:3px solid var(--amber)}.topbar strong{font-family:var(--font-display);letter-spacing:-.01em;font-weight:600}.topbar nav{align-items:center;gap:28px;display:flex}.topbar a{color:var(--paper);opacity:.85;font-size:14.5px;font-weight:500;text-decoration:none;transition:opacity .15s}.topbar a:hover{opacity:1}.container{width:100%;max-width:760px;margin:0 auto;padding:56px 24px 96px}.container p{color:#faf7f1bf}.btn{font-family:var(--font-body);cursor:pointer;border:none;border-radius:12px;padding:13px 22px;font-size:15px;font-weight:600;transition:transform .12s,background .15s,box-shadow .15s}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--paper);color:var(--blue-deep);box-shadow:0 4px 14px #0000002e}.btn-primary:hover{background:var(--white);box-shadow:0 6px 18px #00000038}.btn-ghost{color:var(--paper);background:#ffffff0f;border:1px solid #ffffff40}.btn-ghost:hover{background:#ffffff1f}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.field{text-align:left;flex-direction:column;gap:8px;margin-bottom:22px;display:flex}.field label{color:var(--paper);letter-spacing:.01em;font-size:13.5px;font-weight:600}.field input,.field select{font-size:15px;font-family:var(--font-body);color:var(--gray);background:#faf7f1f7;border:1px solid #ffffff26;border-radius:10px;padding:13px 14px}.field input:focus,.field select:focus{border-color:var(--paper);outline:none;box-shadow:0 0 0 3px #ffffff26}.card-flip-scene{perspective:1400px;margin-top:12px}.card-flip{width:100%;min-height:320px;transform-style:preserve-3d;cursor:pointer;transition:transform .5s cubic-bezier(.4,.1,.2,1);position:relative}.card-flip.flipped{transform:rotateY(180deg)}.card-face{backface-visibility:hidden;background:var(--paper);text-align:center;font-family:var(--font-display);color:var(--blue-deep);border-radius:8px;justify-content:center;align-items:center;padding:32px;font-size:24px;font-weight:600;display:flex;position:absolute;inset:0;box-shadow:0 12px 32px #00000038}.card-face.back{background:var(--white);transform:rotateY(180deg)}.grade-row{gap:14px;margin-top:28px;display:flex}.grade-btn{cursor:pointer;color:var(--white);border:none;border-radius:12px;flex:1;padding:16px;font-size:15px;font-weight:700;transition:transform .12s;box-shadow:0 4px 14px #0000002e}.grade-btn:active{transform:translateY(1px)}.grade-dificil{background:var(--red)}.grade-medio{background:var(--amber)}.grade-facil{background:var(--green)}.chapter-list{flex-direction:column;gap:14px;margin-top:28px;display:flex}.chapter-item{background:var(--paper);color:var(--gray);border-radius:16px;justify-content:space-between;align-items:center;padding:22px 26px;font-weight:500;text-decoration:none;transition:transform .15s,box-shadow .15s;display:flex;box-shadow:0 6px 20px #00000026}.chapter-item:not(.locked):hover{transform:translateY(-2px);box-shadow:0 10px 26px #0003}.chapter-item.locked{opacity:.45;pointer-events:none;box-shadow:none}.rank-table{border-collapse:collapse;background:var(--paper);width:100%;color:var(--gray);border-radius:16px;overflow:hidden;box-shadow:0 6px 20px #00000026}.rank-table th,.rank-table td{text-align:left;border-bottom:1px solid var(--gray-soft);padding:14px 18px}.rank-table th{background:var(--blue-soft);color:var(--blue-deep);letter-spacing:.04em;text-transform:uppercase;font-size:12px;font-weight:700}.rank-table tr:last-child td{border-bottom:none}.rank-table tr:first-child td{color:var(--amber);font-weight:700}.rank-row-me td{background:var(--blue-soft);font-weight:700}.rank-row-gap td{text-align:center;color:var(--gray-soft);padding:6px}