@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Outfit:wght@400;500;600;700;800&display=swap";
:root{--ink:#172332;--muted:#697685;--paper:#f7f5ef;--violet:#6751dc;--purple:#9178ff;--coral:#ff755d;--lime:#d9f26c;--line:#e5e5e1}*{box-sizing:border-box}body{background:var(--paper);color:var(--ink);margin:0;font-family:Outfit,Arial,sans-serif}button,input{font:inherit}button{cursor:pointer}.gate{background:radial-gradient(circle at 80% 15%,#ded5ff,#0000 27%),radial-gradient(circle at 12% 78%,#d9f26c77,#0000 25%),#f8f5ef;place-items:center;min-height:100vh;padding:24px;display:grid}.brand{color:var(--violet);font-size:20px;font-weight:800;position:fixed;top:30px;left:6%}.brand span{color:var(--ink)}.pin-card{text-align:center;background:#fff;border-radius:28px;width:min(470px,100%);padding:46px;box-shadow:0 24px 80px #26225c19}.orb{background:var(--violet);color:#fff;border-radius:18px;place-items:center;width:58px;height:58px;margin:0 auto 20px;font-size:27px;display:grid;transform:rotate(-8deg)}.eyebrow,.direction{letter-spacing:.11em;color:var(--violet);margin:0 0 12px;font:500 11px DM Mono,monospace}.pin-card h1,.hero h1{margin:0 0 14px;font-size:clamp(32px,5vw,51px);line-height:1.02}.pin-card>p:not(.eyebrow):not(.error):not(.celebrate){color:var(--muted);line-height:1.5}.pin-card input{text-align:center;border:2px solid var(--line);letter-spacing:.3em;border-radius:12px;outline:0;width:100%;margin:27px 0 12px;padding:16px;font-size:22px;display:block}.pin-card input:focus{border-color:var(--violet)}.primary{background:var(--violet);color:#fff;border:0;border-radius:12px;padding:15px 22px;font-weight:700;transition:all .15s;box-shadow:0 7px #4a36ad}.primary:hover{transform:translateY(-2px)}.error{color:#bd3d35;font-weight:600}.app{max-width:1160px;margin:auto;padding:0 30px 56px}header{justify-content:space-between;align-items:center;height:83px;display:flex}.wordmark,.text-button{color:var(--ink);background:0 0;border:0;padding:0;font-weight:700}.wordmark{font-size:20px}.wordmark b{color:var(--violet)}.stats{gap:10px;display:flex}.stats span{border:1px solid var(--line);background:#fff;border-radius:50px;padding:9px 12px;font:500 12px DM Mono,monospace}.hero{color:#fff;background:linear-gradient(115deg,#6751dc,#8968e8);border-radius:28px;justify-content:space-between;align-items:center;padding:45px 52px;display:flex;position:relative;overflow:hidden}.hero:after{content:"¡HOLA!";color:#ffffff12;font-size:122px;font-weight:800;position:absolute;bottom:-30px;right:-10px}.hero>div{z-index:1}.hero p{color:#ebe7ff;margin:0}.goal{background:#ffffff1c;border:1px solid #ffffff42;border-radius:17px;width:220px;padding:18px}.goal span,.dates span{letter-spacing:.09em;font:500 10px DM Mono,monospace;display:block}.goal b{margin:7px 0;font-size:28px;display:block}.progress{background:#fff3;border-radius:8px;height:7px;overflow:hidden}.progress i,.meter i{border-radius:inherit;background:var(--lime);height:100%;display:block}.dates{gap:12px;margin:18px 0;display:flex}.dates div{border:1px solid var(--line);background:#fff;border-radius:14px;flex:1;padding:16px 20px}.dates b{margin-top:6px;font-size:15px;display:block}.map h2{margin:31px 0 17px;font-size:25px}.level-grid{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.level{border:1px solid var(--line);background:#fff;border-radius:18px;min-height:215px;padding:22px;transition:all .15s;position:relative}.level:hover:not(.locked){transform:translateY(-3px);box-shadow:0 10px 20px #1a23410b}.level-number{width:35px;height:35px;color:var(--violet);background:#f0edff;border-radius:10px;place-items:center;font-weight:800;display:grid}.level.done .level-number{background:var(--lime);color:var(--ink)}.level>p{color:var(--violet);margin:15px 0 5px;font:500 10px DM Mono,monospace}.level h3{margin:0 0 3px;font-size:21px}.level>span,.level small{color:var(--muted);font-size:14px}.level small{margin-top:19px;display:block}.level button{color:var(--violet);background:0 0;border:0;margin-top:15px;padding:0;font-weight:700}.locked{opacity:.52}.study-head{text-align:center;padding:30px 0}.study-head h1{margin:8px 0;font-size:42px}.study-head>p:not(.eyebrow){color:var(--muted);margin:0 0 22px}.study-head .text-button{display:block}.cards{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.flashcard{border:1px solid var(--line);background:#fff;border-radius:16px;min-height:146px;padding:17px;position:relative}.flashcard>span{color:#9aa2a9;font:500 10px DM Mono,monospace}.flashcard h2{margin:24px 0 4px;font-size:20px}.flashcard p{color:var(--muted);margin:0;font-size:14px}.sound{color:var(--violet);background:#f0edff;border:0;border-radius:10px;padding:8px;position:absolute;top:13px;right:13px}.quiz-page{background:linear-gradient(145deg,#f8f5ef,#eeebff);min-height:100vh;padding:30px}.quiz-top{align-items:center;gap:20px;max-width:850px;margin:auto;font:500 12px DM Mono,monospace;display:flex}.meter{background:#ddd8ed;border-radius:10px;flex:1;height:8px;overflow:hidden}.quiz-card{text-align:center;background:#fff;border-radius:28px;width:min(650px,100%);margin:10vh auto 0;padding:46px;box-shadow:0 20px 50px #28216613}.question{margin:24px 0 30px;font-size:36px;font-weight:700}.options{text-align:left;gap:10px;display:grid}.options button{text-align:left;border:2px solid var(--line);background:#fff;border-radius:12px;padding:15px 18px;font-weight:600}.options button:hover{border-color:var(--purple)}.options button.correct{background:#effbd9;border-color:#63a424}.options button.wrong{background:#fff0ed;border-color:#e85d54}.feedback{margin:22px;font-weight:700}.good{color:#579522}.bad{color:#ca4c43}.score b{color:var(--violet);font-size:65px;line-height:1;display:block}.score span{color:var(--muted)}.celebrate{color:var(--violet);background:#f0edff;border-radius:12px;padding:13px;font-weight:700;margin:20px 0!important}@media (max-width:700px){.app{padding:0 16px 35px}.hero{padding:30px;display:block}.goal{width:100%;margin-top:25px}.level-grid,.cards{grid-template-columns:1fr 1fr}.quiz-card{margin-top:8vh;padding:28px 20px}.question{font-size:28px}.brand{position:absolute;top:18px;left:24px}.gate{padding-top:60px}}@media (max-width:430px){.level-grid{grid-template-columns:1fr}.stats span:last-child{display:none}.cards{grid-template-columns:1fr}.dates{display:block}.dates div+div{margin-top:10px}}