:root{
  --ink:#11163d;
  --muted:#667085;
  --line:#e9e8f2;
  --surface:#ffffff;
  --soft:#f7f5ff;
  --purple:#6d4aff;
  --purple-dark:#4c27d8;
  --pink:#ff3c96;
  --orange:#ff7a3d;
  --blue:#1a9ff2;
  --green:#20b77a;
  --shadow:0 24px 70px rgba(55,35,128,.14);
  --font-body:'DM Sans',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-display:'Nunito',var(--font-body);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:#fff;font-family:var(--font-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
button,input,select{font:inherit}
button,a{cursor:pointer}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button{border:0}
.container{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.section-pad{padding:110px 0}
.page-noise{position:fixed;inset:0;pointer-events:none;opacity:.025;z-index:99;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E")}
.site-header{position:fixed;inset:0 0 auto;z-index:50;border-bottom:1px solid transparent;transition:.25s ease;background:rgba(255,255,255,.72);backdrop-filter:blur(18px)}
.site-header.scrolled{border-color:rgba(37,26,90,.08);box-shadow:0 10px 35px rgba(38,27,91,.06);background:rgba(255,255,255,.93)}
.nav-shell{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{width:152px;display:flex;align-items:center}
.brand img{width:100%;height:52px;object-fit:contain}
.desktop-nav{display:flex;align-items:center;gap:32px;font-size:14px;font-weight:700;color:#42465f}
.desktop-nav a{transition:.2s ease;position:relative}
.desktop-nav a:after{content:"";position:absolute;left:0;bottom:-9px;width:0;height:2px;background:linear-gradient(90deg,var(--pink),var(--purple));transition:.2s}
.desktop-nav a:hover{color:var(--purple)}
.desktop-nav a:hover:after{width:100%}
.nav-actions{display:flex;align-items:center;gap:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:14px;padding:12px 18px;font-weight:800;transition:.22s ease;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btn-primary{color:#fff;background:linear-gradient(135deg,#7b54ff,#5b35ea 65%,#4e2ace);box-shadow:0 12px 30px rgba(91,53,234,.28)}
.btn-primary:hover{box-shadow:0 16px 38px rgba(91,53,234,.34)}
.btn-ghost{background:transparent;color:#343850}
.btn-ghost:hover{background:#f3efff}
.btn-soft{background:#f3efff;color:#5a36d8;border:1px solid #e5dcff}
.btn-white{background:#fff;color:#5635d0;box-shadow:0 14px 35px rgba(30,21,76,.18)}
.btn-large{padding:15px 22px;border-radius:16px;font-size:16px}
.full{width:100%}
.menu-btn{width:42px;height:42px;border-radius:12px;background:#f4f1ff;display:none;align-items:center;justify-content:center;flex-direction:column;gap:4px}
.menu-btn span{width:18px;height:2px;background:#46358a;border-radius:10px}
.mobile-menu{display:none}
.hero{padding-top:155px;min-height:820px;position:relative;background:radial-gradient(circle at 75% 25%,rgba(170,133,255,.13),transparent 30%),radial-gradient(circle at 10% 60%,rgba(255,133,184,.09),transparent 28%),linear-gradient(180deg,#fff 0%,#fcfaff 100%);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:70px}
.hero-copy{position:relative;z-index:2}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.11em;color:#5f44d7;background:#f1ecff;border:1px solid #e1d8ff;padding:9px 12px;border-radius:999px}
.eyebrow.purple{color:#6a45e7;background:#f3efff}
.eyebrow.light{color:#fff;background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.2)}
.pulse-dot{width:9px;height:9px;border-radius:50%;background:linear-gradient(135deg,var(--pink),var(--orange));box-shadow:0 0 0 0 rgba(255,60,150,.55);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(255,60,150,0)}100%{box-shadow:0 0 0 0 rgba(255,60,150,0)}}
.hero h1{font-family:var(--font-display);font-weight:900;font-size:clamp(52px,6vw,82px);line-height:.99;letter-spacing:-.05em;margin:24px 0 25px;max-width:700px}
.gradient-text{background:linear-gradient(90deg,var(--pink),var(--orange) 28%,#c13ee0 58%,var(--purple) 78%,var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent;background-size:150% 100%;animation:gradientShift 7s ease-in-out infinite alternate}
@keyframes gradientShift{to{background-position:100% 0}}
.hero-lead{font-size:19px;line-height:1.72;color:#5d627b;max-width:610px;margin:0}
.hero-actions{display:flex;gap:12px;margin:34px 0 30px;flex-wrap:wrap}
.play-dot{width:27px;height:27px;border-radius:50%;background:#fff;color:#673fe8;display:grid;place-items:center;font-size:10px;box-shadow:0 5px 14px rgba(71,47,150,.12)}
.social-proof{display:flex;align-items:center;gap:14px;color:#646980;font-size:13px}
.social-proof strong{font-size:15px;color:#242844}
.avatar-stack{display:flex}
.avatar-stack span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:10px;font-weight:800;border:3px solid #fff;margin-left:-8px;background:linear-gradient(135deg,#ff8f59,#ff3d96)}
.avatar-stack span:first-child{margin-left:0;background:linear-gradient(135deg,#6e4bff,#3b8df4)}
.avatar-stack span:nth-child(3){background:linear-gradient(135deg,#23bb8a,#4ed0b4)}
.avatar-stack span:nth-child(4){background:linear-gradient(135deg,#ffbe45,#ff7a3d)}
.stars{color:#ffb833;letter-spacing:1px}
.hero-stage{position:relative;min-height:615px;display:grid;place-items:center;perspective:1100px;z-index:1}
.hero-glow{position:absolute;border-radius:50%;filter:blur(70px);opacity:.2;pointer-events:none}
.glow-one{width:260px;height:260px;background:#ff58a6;left:-100px;top:260px}
.glow-two{width:380px;height:380px;background:#6d4aff;right:-130px;top:110px}
.lesson-phone{width:368px;min-height:585px;background:rgba(255,255,255,.94);border:1px solid rgba(117,80,223,.13);border-radius:34px;box-shadow:0 35px 90px rgba(73,46,157,.22),inset 0 1px 0 rgba(255,255,255,.8);padding:24px;transform:rotateY(-7deg) rotateX(2deg);transition:transform .18s ease;backdrop-filter:blur(20px);position:relative;z-index:2}
.lesson-phone:before{content:"";position:absolute;inset:-1px;border-radius:34px;padding:1px;background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(125,81,255,.16),rgba(255,61,150,.12));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.phone-top,.lesson-status,.beat-meta,.response-row{display:flex;align-items:center;justify-content:space-between}
.mini-brand{font-family:var(--font-display);font-size:21px;font-weight:900;background:linear-gradient(90deg,var(--pink),var(--purple),var(--blue));-webkit-background-clip:text;color:transparent}
.streak-pill{font-size:13px;font-weight:800;background:#fff3eb;padding:7px 10px;border-radius:999px;color:#9e4c1e}
.lesson-status{font-size:12px;color:#787d92;margin-top:24px}
.progress-track,.song-progress,.mini-progress,.path-progress{height:7px;background:#eeebf7;border-radius:20px;overflow:hidden}
.progress-track{margin:8px 0 22px}
.progress-track span,.song-progress span,.mini-progress span,.path-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--pink),var(--orange),var(--purple))}
.phrase-card{border:1px solid #e8e3f7;border-radius:24px;padding:28px 20px 22px;text-align:center;position:relative;background:linear-gradient(180deg,#fff,#fbf9ff);box-shadow:0 15px 35px rgba(73,50,140,.08)}
.language-chip{position:absolute;left:15px;top:15px;background:#fff1e8;color:#bc5a24;font-size:10px;font-weight:900;padding:6px 8px;border-radius:9px}
.phrase-word{font-family:var(--font-display);font-size:35px;font-weight:900;margin-top:18px}
.phrase-meaning{color:#7a7e91;margin-top:5px}
.round-sound{width:45px;height:45px;border-radius:50%;display:grid;place-items:center;background:#f0eaff;margin:20px auto 0;font-size:18px;transition:.2s}
.round-sound:hover{transform:scale(1.08);background:#e7ddff}
.beat-player{margin-top:18px;background:linear-gradient(135deg,#6e45e8,#943de5 70%,#b944cf);border-radius:22px;padding:20px;color:#fff;position:relative;overflow:hidden}
.beat-player:after{content:"";position:absolute;width:160px;height:160px;border:24px solid rgba(255,255,255,.07);border-radius:50%;right:-75px;top:-80px}
.beat-label{text-transform:uppercase;letter-spacing:.12em;font-weight:800;font-size:10px;opacity:.8}
.equalizer{height:48px;display:flex;align-items:center;justify-content:center;gap:5px;margin-top:3px}
.equalizer i,.visual-bars i,.lesson-eq i,.featured-wave i{width:4px;border-radius:10px;background:rgba(255,255,255,.82);height:12px;animation:eq 1.1s ease-in-out infinite alternate;transform-origin:center}
.equalizer i:nth-child(2),.visual-bars i:nth-child(2),.lesson-eq i:nth-child(2),.featured-wave i:nth-child(2){height:27px;animation-delay:-.2s}
.equalizer i:nth-child(3),.visual-bars i:nth-child(3),.lesson-eq i:nth-child(3),.featured-wave i:nth-child(3){height:41px;animation-delay:-.4s}
.equalizer i:nth-child(4),.visual-bars i:nth-child(4),.lesson-eq i:nth-child(4),.featured-wave i:nth-child(4){height:24px;animation-delay:-.1s}
.equalizer i:nth-child(5),.visual-bars i:nth-child(5),.lesson-eq i:nth-child(5),.featured-wave i:nth-child(5){height:37px;animation-delay:-.5s}
.equalizer i:nth-child(6),.visual-bars i:nth-child(6),.lesson-eq i:nth-child(6),.featured-wave i:nth-child(6){height:18px;animation-delay:-.25s}
.equalizer i:nth-child(7),.visual-bars i:nth-child(7),.lesson-eq i:nth-child(7),.featured-wave i:nth-child(7){height:31px;animation-delay:-.7s}
.equalizer i:nth-child(8),.featured-wave i:nth-child(8){height:20px;animation-delay:-.32s}
.equalizer i:nth-child(9),.featured-wave i:nth-child(9){height:12px;animation-delay:-.6s}
@keyframes eq{0%{transform:scaleY(.45)}100%{transform:scaleY(1)}}
.main-play,.song-play,.chorus-play{width:60px;height:60px;border-radius:50%;background:#fff;color:#643ddd;display:grid;place-items:center;margin:3px auto 8px;font-size:20px;box-shadow:0 12px 28px rgba(36,17,97,.25);transition:.2s}
.main-play:hover,.song-play:hover,.chorus-play:hover{transform:scale(1.06)}
.beat-meta{font-size:11px;opacity:.8;position:relative;z-index:2}
.response-row{gap:10px;margin-top:18px}
.response-btn{flex:1;border-radius:13px;padding:11px;background:#f3f1f9;color:#74788d;font-weight:700}
.response-btn.active{background:#ecfff7;color:#178158;border:1px solid #c9f2e1}
.floating-note{position:absolute;font-family:var(--font-display);font-weight:900;z-index:4;animation:floatNote 4.5s ease-in-out infinite;color:var(--pink);filter:drop-shadow(0 10px 18px rgba(96,49,195,.17))}
.note-a{font-size:47px;left:22px;top:85px;transform:rotate(-14deg)}
.note-b{font-size:38px;right:10px;top:155px;color:var(--blue);animation-delay:-1.2s}
.note-c{font-size:42px;right:35px;bottom:95px;color:var(--purple);animation-delay:-2.1s}
@keyframes floatNote{50%{transform:translateY(-16px) rotate(8deg)}}
.mini-card{position:absolute;display:flex;align-items:center;gap:10px;padding:13px 16px;background:rgba(255,255,255,.92);border:1px solid rgba(104,76,181,.1);border-radius:18px;box-shadow:0 18px 45px rgba(61,37,134,.15);z-index:4;animation:cardFloat 4s ease-in-out infinite}
.mini-card-a{left:-8px;bottom:148px}
.mini-card-b{right:-15px;top:195px;animation-delay:-1.7s}
@keyframes cardFloat{50%{transform:translateY(-9px)}}
.mini-icon{width:35px;height:35px;border-radius:12px;background:#f3edff;display:grid;place-items:center}
.mini-card strong,.mini-card small{display:block}
.mini-card strong{font-size:13px}.mini-card small{font-size:10px;color:#8a8da0;margin-top:2px}
.language-strip{padding:19px 0;border-top:1px solid #eeeaf7;border-bottom:1px solid #eeeaf7;background:#fff;overflow:hidden}
.marquee-track{width:max-content;animation:marquee 28s linear infinite}
.marquee-content{display:flex;align-items:center;gap:34px;font-weight:800;color:#3f435d;white-space:nowrap}
.marquee-content i{width:4px;height:4px;border-radius:50%;background:#d7d1e8}
@keyframes marquee{to{transform:translateX(-50%)}}
.section-heading{max-width:730px;margin-bottom:56px}
.section-heading.centered{text-align:center;margin-left:auto;margin-right:auto}
.section-heading h2,.preview-copy h2,.showcase-copy h2{font-family:var(--font-display);font-size:clamp(38px,4.4vw,56px);line-height:1.06;letter-spacing:-.035em;margin:18px 0 16px}
.section-heading p,.preview-copy>p,.showcase-copy>p{font-size:18px;line-height:1.7;color:var(--muted)}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.step-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:24px 24px 30px;position:relative;overflow:hidden;transition:.3s;box-shadow:0 12px 35px rgba(39,27,91,.05)}
.step-card:hover{transform:translateY(-8px);box-shadow:0 24px 60px rgba(50,32,110,.12);border-color:#ded5ff}
.step-number{position:absolute;right:20px;top:20px;font-family:var(--font-display);font-size:42px;font-weight:900;color:#eeeaf8}
.step-art{height:205px;border-radius:21px;display:grid;place-items:center;position:relative;overflow:hidden;margin-bottom:24px}
.listen-art{background:linear-gradient(145deg,#fff0f7,#f9e8ff)}
.rhythm-art{background:linear-gradient(145deg,#f0eaff,#e9efff)}
.speak-art{background:linear-gradient(145deg,#eafff8,#e4f8ff)}
.headphones,.music-orb,.mic-orb{font-size:62px;filter:drop-shadow(0 15px 18px rgba(77,43,142,.16));position:relative;z-index:2}
.sound-wave{position:absolute;display:flex;gap:5px;align-items:center;bottom:35px}
.sound-wave i{width:4px;height:10px;border-radius:5px;background:#db4b9e;animation:eq .8s infinite alternate}
.sound-wave i:nth-child(2){height:24px}.sound-wave i:nth-child(3){height:36px}.sound-wave i:nth-child(4){height:23px}.sound-wave i:nth-child(5){height:12px}
.music-orb,.mic-orb{width:105px;height:105px;border-radius:50%;display:grid;place-items:center;background:#fff;font-size:50px}
.orbit{width:165px;height:165px;border:1px dashed rgba(106,68,231,.35);border-radius:50%;position:absolute;animation:spin 12s linear infinite}
.orbit:before,.orbit:after{content:"";width:14px;height:14px;border-radius:50%;position:absolute;background:#ff519f;top:14px;left:22px;box-shadow:0 0 0 7px rgba(255,81,159,.1)}
.orbit:after{background:#28a6ed;top:auto;left:auto;right:14px;bottom:26px}
@keyframes spin{to{transform:rotate(360deg)}}
.speech-rings i{position:absolute;inset:50%;border:2px solid rgba(34,180,124,.25);border-radius:50%;animation:ringOut 2.4s infinite}
.speech-rings i:nth-child(2){animation-delay:.8s}.speech-rings i:nth-child(3){animation-delay:1.6s}
@keyframes ringOut{0%{width:90px;height:90px;transform:translate(-50%,-50%);opacity:1}100%{width:190px;height:190px;transform:translate(-50%,-50%);opacity:0}}
.step-card h3{font-family:var(--font-display);font-size:23px;margin:0 0 8px}.step-card p{color:var(--muted);line-height:1.65;margin:0}
.showcase-section{background:linear-gradient(135deg,#17103c,#34206f 45%,#5625a2 100%);color:#fff;position:relative;overflow:hidden}
.showcase-section:before{content:"";position:absolute;width:520px;height:520px;border:90px solid rgba(255,255,255,.025);border-radius:50%;right:-120px;top:-150px}
.showcase-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:90px;align-items:center}
.showcase-copy p{color:rgba(255,255,255,.7)}
.feature-list{display:grid;gap:16px;margin:28px 0 34px}
.feature-list>div{display:flex;gap:13px;align-items:flex-start}
.feature-list span{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ff4f9d,#ff8152);font-size:13px;font-weight:900;flex:none}.feature-list p{margin:0;font-size:15px}.feature-list strong{color:#fff}
.album-stack{height:590px;position:relative;display:grid;place-items:center;perspective:1200px}
.album-card{position:absolute;border-radius:28px;padding:25px;box-shadow:0 35px 70px rgba(4,2,17,.35);border:1px solid rgba(255,255,255,.16)}
.album-card span,.album-card strong,.album-card small{display:block}
.album-back{width:345px;height:420px;background:linear-gradient(145deg,#1c7dd8,#5140cc);transform:translate(-100px,-15px) rotate(-10deg);opacity:.78}.album-middle{width:350px;height:430px;background:linear-gradient(145deg,#f45389,#b73ad5);transform:translate(95px,-10px) rotate(9deg);opacity:.88}.album-front{width:385px;min-height:500px;background:linear-gradient(160deg,#fff,#f7f1ff);color:var(--ink);z-index:3;transform:rotate(-1deg)}
.album-back strong,.album-middle strong{font-size:26px;margin-top:280px}.album-back small,.album-middle small{opacity:.75;margin-top:8px}
.album-head{display:flex;justify-content:space-between;font-weight:800;color:#7a5bd7}.album-art{height:270px;border-radius:20px;background:linear-gradient(180deg,#f9b75b,#ff6a6f 55%,#7a3fc8);margin:15px 0 20px;position:relative;overflow:hidden}.sun-disc{width:120px;height:120px;border-radius:50%;background:rgba(255,244,181,.78);position:absolute;left:50%;top:34px;transform:translateX(-50%);box-shadow:0 0 50px rgba(255,245,201,.55)}.city-line{position:absolute;bottom:0;left:0;right:0;height:82px;background:linear-gradient(90deg,#211943 6%,transparent 6% 9%,#211943 9% 16%,transparent 16% 18%,#211943 18% 24%,transparent 24% 27%,#211943 27% 43%,transparent 43% 47%,#211943 47% 57%,transparent 57% 60%,#211943 60% 73%,transparent 73% 76%,#211943 76% 83%,transparent 83% 87%,#211943 87%);clip-path:polygon(0 45%,6% 45%,6% 10%,12% 10%,12% 50%,21% 50%,21% 0,28% 0,28% 60%,38% 60%,38% 24%,48% 24%,48% 52%,62% 52%,62% 8%,69% 8%,69% 42%,80% 42%,80% 18%,88% 18%,88% 55%,100% 55%,100% 100%,0 100%)}.album-note{position:absolute;right:23px;top:22px;font-size:39px;color:#fff}.album-front h3{font-size:25px;margin:0 0 4px}.album-front p{color:#777b90;margin:0}.song-progress{margin:20px 0 15px;height:5px}.song-progress span{width:42%}.song-controls{display:flex;justify-content:center;align-items:center;gap:27px}.song-controls button{background:transparent;color:#675b80;font-size:18px}.song-controls .song-play{width:52px;height:52px;background:linear-gradient(135deg,#7b4dff,#5a33d8);color:#fff;margin:0}
.lesson-preview{background:#fbfaff}.preview-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:80px;align-items:center}.preview-panel{background:#fff;border:1px solid #e8e5f1;border-radius:28px;box-shadow:var(--shadow);padding:26px}.preview-top{display:flex;align-items:center;gap:14px;border-bottom:1px solid #efedf5;padding-bottom:19px}.flag-badge{width:50px;height:50px;border-radius:16px;background:#fff3e9;display:grid;place-items:center;font-size:24px}.preview-top div{flex:1}.preview-top small,.preview-top strong{display:block}.preview-top small{color:#8a8da1;font-size:11px;text-transform:uppercase;letter-spacing:.09em;font-weight:800}.preview-top strong{font-size:20px;margin-top:3px}.level-pill{font-size:11px;background:#e9f9ef;color:#238058;padding:7px 9px;border-radius:999px;font-weight:800}.phrase-list{padding:13px 0}.phrase-list button{width:100%;display:flex;align-items:center;gap:13px;padding:14px 10px;background:transparent;border-radius:15px;text-align:left;transition:.2s}.phrase-list button:hover{background:#f7f4ff;transform:translateX(4px)}.phrase-list button>span{width:42px;height:42px;border-radius:13px;background:#f4f1ff;display:grid;place-items:center}.phrase-list button div{flex:1}.phrase-list strong,.phrase-list small{display:block}.phrase-list strong{font-size:16px}.phrase-list small{color:#8a8da1;margin-top:3px}.phrase-list i{font-style:normal;width:34px;height:34px;border-radius:50%;background:#eee9ff;color:#6a43df;display:grid;place-items:center;font-size:11px}.lesson-footer{border-top:1px solid #efedf5;padding-top:18px;display:flex;align-items:center;gap:20px;color:#85889a;font-size:12px}.lesson-footer button{margin-left:auto;background:transparent;color:#6340da;font-weight:800}.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:34px}.stat-row div{background:#fff;border:1px solid #ebe8f3;border-radius:18px;padding:17px}.stat-row strong,.stat-row span{display:block}.stat-row strong{font-size:24px;font-family:var(--font-display)}.stat-row span{color:#85899d;font-size:11px;margin-top:4px}
.testimonials{background:linear-gradient(180deg,#fff,#f9f6ff)}.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.review-card{border:1px solid #e9e5f4;border-radius:25px;padding:27px;background:#fff;box-shadow:0 12px 35px rgba(50,31,103,.05)}.feature-review{transform:translateY(-13px);background:linear-gradient(155deg,#fff,#f7f2ff)}.review-stars{color:#ffb02e;letter-spacing:2px}.review-card>p{font-size:17px;line-height:1.75;color:#4d526b;min-height:120px}.reviewer{display:flex;align-items:center;gap:12px}.reviewer>span{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ff5d9e,#7b4bff);color:#fff;font-weight:800}.reviewer strong,.reviewer small{display:block}.reviewer small{font-size:11px;color:#8a8da1;margin-top:3px}
.pricing-section{background:#fff}.billing-switch{display:inline-flex;background:#f3f0fa;padding:4px;border-radius:13px;margin-top:20px}.billing-switch button{padding:9px 13px;border-radius:10px;background:transparent;color:#74788c;font-weight:800}.billing-switch button.active{background:#fff;color:#5c3ad3;box-shadow:0 5px 15px rgba(53,38,103,.1)}.billing-switch span{color:#189261;font-size:10px}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}.price-card{border:1px solid #e8e5f1;border-radius:28px;padding:30px;background:#fff;position:relative}.price-card.featured{border:2px solid #7450ed;box-shadow:0 25px 65px rgba(82,53,179,.16);transform:translateY(-12px);background:linear-gradient(180deg,#fff,#fbf9ff)}.popular-tag{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,#ff4a98,#7b4dff);color:#fff;padding:7px 13px;border-radius:999px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:900}.plan-label{color:#6c49dc;font-weight:900;font-size:13px;text-transform:uppercase;letter-spacing:.08em}.price-card h3{font-size:22px;margin:9px 0 18px}.price{display:flex;align-items:flex-end;gap:8px}.price strong{font-family:var(--font-display);font-size:50px;line-height:1}.price span{color:#85899d;margin-bottom:7px}.price-card ul{list-style:none;margin:25px 0;padding:0;display:grid;gap:13px;color:#555a71}.price-card li:before{content:"✓";color:#22a16f;font-weight:900;margin-right:9px}
.cta-section{padding:25px 0 100px}.cta-card{min-height:305px;border-radius:35px;background:linear-gradient(135deg,#6d46e9,#8a3ee5 55%,#cf3fb8);color:#fff;padding:55px;display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;overflow:hidden;box-shadow:0 30px 70px rgba(101,57,209,.22)}.cta-card:before,.cta-card:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%}.cta-card:before{width:320px;height:320px;right:-60px;top:-140px}.cta-card:after{width:190px;height:190px;right:25px;top:-70px}.cta-card h2{font-family:var(--font-display);font-size:44px;line-height:1.05;margin:15px 0 9px}.cta-card p{margin:0;color:rgba(255,255,255,.78);font-size:17px}.cta-card>.btn{position:relative;z-index:2}.cta-notes span{position:absolute;font-size:30px;color:rgba(255,255,255,.25);animation:floatNote 5s infinite}.cta-notes span:first-child{left:46%;top:25px}.cta-notes span:nth-child(2){left:58%;bottom:20px}.cta-notes span:nth-child(3){left:9%;bottom:25px}
.site-footer{border-top:1px solid #ece9f4;padding:70px 0 25px;background:#fbfaff}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:55px}.footer-brand img{width:160px;height:60px;object-fit:contain}.footer-brand p{max-width:320px;color:#7a7e91;line-height:1.6}.footer-brand>a{color:#633fd9;font-weight:800}.footer-grid>div:not(.footer-brand){display:flex;flex-direction:column;gap:13px}.footer-grid strong{margin-bottom:7px}.footer-grid>div:not(.footer-brand) a{color:#777b8f;font-size:14px}.footer-grid a:hover{color:#5f3cd6}.footer-bottom{border-top:1px solid #e9e6ef;margin-top:45px;padding-top:22px;display:flex;justify-content:space-between;color:#9093a4;font-size:12px}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1)}.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.12s}.delay-2{transition-delay:.22s}
.auth-modal,.lesson-modal,.practice-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;visibility:hidden;opacity:0;transition:.22s}.auth-modal.open,.lesson-modal.open,.practice-modal.open{visibility:visible;opacity:1}.auth-backdrop,.lesson-backdrop{position:absolute;inset:0;background:rgba(18,11,49,.55);backdrop-filter:blur(8px)}.auth-card{width:min(445px,calc(100% - 30px));background:#fff;border-radius:28px;padding:27px 32px 25px;position:relative;transform:translateY(18px) scale(.98);transition:.25s;box-shadow:0 35px 100px rgba(22,12,61,.35)}.auth-modal.open .auth-card,.lesson-modal.open .lesson-player,.practice-modal.open .practice-panel{transform:none}.auth-close{position:absolute;right:18px;top:16px;width:34px;height:34px;border-radius:50%;background:#f3f0f8;color:#6b6e80;font-size:23px}.auth-logo img{width:145px;height:53px;object-fit:contain;margin:auto}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:#f2eff8;padding:4px;border-radius:12px;margin:12px 0 22px}.auth-tabs button{padding:9px;border-radius:9px;background:transparent;color:#7b7f92;font-weight:800}.auth-tabs button.active{background:#fff;color:#5c39d2;box-shadow:0 5px 14px rgba(53,35,112,.1)}.auth-card h2{text-align:center;font-family:var(--font-display);font-size:29px;margin:0 0 4px}.auth-card>p{text-align:center;color:#7c8092;margin:0 0 19px}.social-login{width:100%;border:1px solid #e0deea;background:#fff;padding:12px;border-radius:13px;font-weight:800;color:#3d4158}.social-login span{font-weight:900;color:#4285f4;margin-right:8px}.divider{display:flex;align-items:center;gap:12px;color:#a0a3b2;font-size:11px;margin:19px 0}.divider:before,.divider:after{content:"";height:1px;background:#e8e5ee;flex:1}.auth-card form{display:grid;gap:13px}.auth-card label{display:grid;gap:6px;font-size:12px;font-weight:800;color:#55596e}.auth-card input{width:100%;border:1px solid #dedbe8;border-radius:12px;padding:12px 13px;outline:0;color:#2e324a}.auth-card input:focus{border-color:#8769e8;box-shadow:0 0 0 3px rgba(119,82,231,.1)}.form-row{display:flex;justify-content:space-between;align-items:center}.check-label{display:flex!important;grid-template-columns:auto 1fr;align-items:center;gap:7px!important;font-weight:600!important}.check-label input{width:auto}.form-row a{color:#6340da;font-size:11px;font-weight:800}.auth-foot{font-size:10px!important;margin:15px 0 0!important}.hidden{display:none!important}.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,25px);background:#171331;color:#fff;padding:12px 17px;border-radius:13px;font-weight:700;font-size:13px;opacity:0;pointer-events:none;transition:.25s;z-index:200;box-shadow:0 12px 30px rgba(26,18,68,.25)}.toast.show{opacity:1;transform:translate(-50%,0)}
/* App */
.app-body{background:#f7f7fb;min-height:100vh}.app-sidebar{position:fixed;inset:0 auto 0 0;width:244px;background:#fff;border-right:1px solid #e7e6ee;padding:19px 17px 17px;z-index:40;display:flex;flex-direction:column}.app-brand{width:145px;height:52px;margin:0 auto 24px}.app-brand img{width:100%;height:100%;object-fit:contain}.app-nav{display:grid;gap:6px}.app-nav button{display:flex;align-items:center;gap:13px;padding:12px 13px;border-radius:13px;background:transparent;color:#63677c;font-weight:700;text-align:left;transition:.2s}.app-nav button span{font-size:19px;width:23px;text-align:center}.app-nav button:hover{background:#f6f3ff;color:#5636cf}.app-nav button.active{background:linear-gradient(90deg,#f0eaff,#f7f3ff);color:#5c38d5;box-shadow:inset 3px 0 #704bea}.sidebar-promo{margin-top:auto;background:linear-gradient(145deg,#251258,#6e3bcf);color:#fff;border-radius:20px;padding:18px;position:relative;overflow:hidden}.sidebar-promo>span{font-size:26px}.sidebar-promo strong{display:block;margin:7px 0 5px}.sidebar-promo p{font-size:11px;color:rgba(255,255,255,.72);line-height:1.5;margin:0 0 12px}.sidebar-promo button{width:100%;background:#fff;color:#5c33cb;border-radius:10px;padding:9px;font-weight:800}.profile-mini{display:flex;align-items:center;gap:10px;background:transparent;border-top:1px solid #eceaf1;margin-top:15px;padding:15px 5px 0;text-align:left}.profile-avatar,.profile-top span{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ff5b9d,#704af0);color:#fff;font-size:11px;font-weight:900}.profile-mini>span:nth-child(2){flex:1}.profile-mini strong,.profile-mini small{display:block}.profile-mini strong{font-size:12px}.profile-mini small{font-size:9px;color:#8a8d9c;margin-top:2px}.profile-mini i{font-style:normal;color:#a2a4b1}.app-main{margin-left:244px;min-height:100vh}.app-topbar{height:76px;background:rgba(255,255,255,.9);border-bottom:1px solid #e7e6ee;backdrop-filter:blur(15px);display:flex;align-items:center;justify-content:space-between;padding:0 30px;position:sticky;top:0;z-index:30}.app-menu-btn{display:none;background:#f2effa;border-radius:10px;width:39px;height:39px}.topbar-search{width:min(450px,45vw);display:flex;align-items:center;gap:9px;background:#f5f4f8;border:1px solid #eeecf3;border-radius:13px;padding:0 13px}.topbar-search input{border:0;background:transparent;outline:0;width:100%;padding:11px 0;color:#363a4e}.topbar-search span{font-size:18px;color:#8c8e9c}.topbar-actions{display:flex;align-items:center;gap:13px}.icon-btn{width:40px;height:40px;border-radius:12px;background:#f5f3f9;position:relative}.icon-btn i{position:absolute;width:7px;height:7px;border-radius:50%;background:#ff476f;right:8px;top:8px;border:2px solid #fff}.streak-top{display:grid;grid-template-columns:auto auto;column-gap:6px;align-items:center;background:#fff6ed;border:1px solid #ffe8d5;border-radius:12px;padding:7px 11px;font-size:13px}.streak-top>span{grid-column:2;font-size:8px;color:#995d37;text-transform:uppercase;letter-spacing:.06em}.profile-top{display:flex;align-items:center;gap:7px;background:transparent}.profile-top i{font-style:normal;color:#848697}.app-content{padding:30px 31px 55px}.app-view{display:none;animation:viewIn .3s ease}.app-view.active{display:block}@keyframes viewIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.app-heading-row{display:flex;justify-content:space-between;align-items:flex-end;gap:25px;margin-bottom:24px}.app-heading-row.compact{align-items:center}.app-heading-row h1{font-family:var(--font-display);font-size:34px;letter-spacing:-.025em;margin:5px 0 2px}.app-heading-row p{margin:0;color:#7b7f91;font-size:14px}.app-kicker{font-size:10px;text-transform:uppercase;letter-spacing:.11em;color:#7652dc;font-weight:900}.home-grid{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:18px}.today-card{min-height:270px;border-radius:24px;background:linear-gradient(125deg,#663be0,#8a42e1 55%,#dd469f);color:#fff;padding:32px;display:flex;position:relative;overflow:hidden;box-shadow:0 18px 45px rgba(93,55,188,.2)}.today-card:before{content:"";position:absolute;width:250px;height:250px;border:45px solid rgba(255,255,255,.06);border-radius:50%;right:-60px;top:-60px}.today-copy{position:relative;z-index:2;max-width:530px}.today-label{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.17);padding:7px 10px;border-radius:999px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.today-card h2{font-family:var(--font-display);font-size:34px;margin:18px 0 8px}.today-card p{color:rgba(255,255,255,.8);line-height:1.55;max-width:475px;margin:0}.today-stats{display:flex;gap:17px;margin:18px 0;color:rgba(255,255,255,.8);font-size:11px}.today-visual{margin-left:auto;width:245px;display:grid;place-items:center;position:relative}.vinyl,.premium-vinyl{width:160px;height:160px;border-radius:50%;background:repeating-radial-gradient(circle at center,#221346 0 7px,#382060 8px 10px,#221346 11px 15px);display:grid;place-items:center;box-shadow:0 20px 45px rgba(24,8,65,.32);animation:spin 10s linear infinite}.vinyl:before,.premium-vinyl:before{content:"";width:55px;height:55px;border-radius:50%;background:linear-gradient(135deg,#ffbd46,#ff4f95)}.vinyl span,.premium-vinyl span{position:absolute;font-size:26px;color:#fff}.visual-bars{position:absolute;right:-6px;display:flex;gap:4px;align-items:center}.visual-bars i{background:rgba(255,255,255,.72)}.visual-note{position:absolute;font-size:28px;animation:floatNote 4s infinite}.visual-note.note-1{top:12px;right:44px}.visual-note.note-2{bottom:9px;left:20px;animation-delay:-1.5s}.week-progress-card,.dashboard-card{background:#fff;border:1px solid #e8e6ef;border-radius:22px;padding:20px;box-shadow:0 8px 25px rgba(41,29,83,.04)}.card-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.card-title-row span,.card-title-row strong{display:block}.card-title-row span{font-size:11px;color:#898c9c}.card-title-row strong{font-size:27px;font-family:var(--font-display)}.card-title-row button{background:transparent;color:#7653d9;font-size:11px;font-weight:800}.card-title-row h3{font-size:16px;margin:0 0 3px}.card-title-row p{font-size:11px;color:#8b8e9e;margin:0}.progress-ring{--progress:67;width:130px;height:130px;border-radius:50%;margin:15px auto;display:grid;place-items:center;background:conic-gradient(#6b46df calc(var(--progress)*1%),#eeeaf8 0);position:relative}.progress-ring:before{content:"";position:absolute;inset:11px;border-radius:50%;background:#fff}.progress-ring>div{position:relative;text-align:center}.progress-ring strong,.progress-ring span{display:block}.progress-ring strong{font-family:var(--font-display);font-size:27px}.progress-ring span{font-size:9px;color:#8a8d9b}.week-progress-card>p{text-align:center;font-size:11px;color:#858899}.mini-progress{height:5px}.dashboard-row{display:grid;grid-template-columns:1.25fr .85fr .72fr;gap:18px;margin-top:18px}.dashboard-card{padding:19px}.continue-lessons{display:grid;margin-top:10px}.continue-lessons article{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #efedf4;cursor:pointer}.continue-lessons article:last-child{border-bottom:0}.lesson-emoji{width:43px;height:43px;border-radius:13px;display:grid;place-items:center;font-size:20px;flex:none}.lesson-emoji.warm{background:#fff1e8}.lesson-emoji.violet{background:#f1ebff}.lesson-emoji.blue{background:#e8f5ff}.continue-lessons article>div{flex:1;min-width:0}.continue-lessons strong,.continue-lessons small{display:block}.continue-lessons strong{font-size:12px}.continue-lessons small{font-size:9px;color:#9294a2;margin-top:3px}.continue-lessons article>button{width:33px;height:33px;border-radius:50%;background:#f0ebff;color:#6040d4;font-size:10px}.tiny-track{height:4px;background:#efedf4;border-radius:10px;margin-top:7px}.tiny-track i{display:block;height:100%;border-radius:10px;background:linear-gradient(90deg,#ff4a96,#7449eb)}.bpm-pill{background:#eee8ff;color:#6b46dc;padding:6px 8px;border-radius:999px!important;font-size:9px!important;font-weight:900}.rhythm-card{background:linear-gradient(145deg,#6a43df,#8e3fe0);color:#fff;border:0}.rhythm-card .card-title-row p{color:rgba(255,255,255,.62)}.rhythm-card .bpm-pill{background:rgba(255,255,255,.14);color:#fff}.chorus-window{background:rgba(255,255,255,.1);border-radius:15px;margin-top:14px;padding:4px 12px}.chorus-line{display:flex;align-items:center;gap:9px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.11);opacity:.62}.chorus-line:last-child{border-bottom:0}.chorus-line.active{opacity:1}.chorus-line>span{font-size:17px}.chorus-line>div{flex:1}.chorus-line strong,.chorus-line small{display:block}.chorus-line strong{font-size:11px}.chorus-line small{font-size:8px;color:rgba(255,255,255,.66)}.line-wave{width:40px;height:14px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.45) 0 2px,transparent 2px 5px);clip-path:polygon(0 50%,10% 25%,20% 70%,30% 10%,40% 80%,50% 30%,60% 65%,70% 15%,80% 70%,90% 38%,100% 50%,100% 100%,0 100%)}.chorus-controls{display:flex;justify-content:center;align-items:center;gap:23px;margin-top:12px}.chorus-controls button{background:transparent;color:#fff}.chorus-play{width:47px;height:47px;margin:0;color:#673ed7}.practice-action{width:100%;display:flex;align-items:center;gap:10px;border:1px solid #efedf4;background:#fbfafd;border-radius:13px;padding:10px;margin-top:8px;text-align:left}.practice-action>span{width:34px;height:34px;border-radius:10px;background:#eee9ff;display:grid;place-items:center}.practice-action>div{flex:1}.practice-action strong,.practice-action small{display:block}.practice-action strong{font-size:11px}.practice-action small{font-size:8px;color:#9698a5;margin-top:2px}.practice-action i{font-style:normal;color:#9a9ca9}.bottom-dashboard-row{display:grid;grid-template-columns:1.1fr .95fr 1fr;gap:18px;margin-top:18px}.streak-days{display:flex;justify-content:space-between;margin-top:18px}.streak-days div{text-align:center}.streak-days span{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#fff0dc;color:#cf791c;font-size:10px;font-weight:900}.streak-days small{display:block;color:#a0a2af;font-size:8px;margin-top:6px}.streak-days .today span{background:linear-gradient(135deg,#ff823f,#ff4c83);color:#fff}.daily-phrase-card{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(145deg,#fff8ed,#fff0f7)}.small-chip{display:inline-block;background:#fff;border:1px solid #eee9f1;border-radius:999px;padding:5px 8px;font-size:8px;text-transform:uppercase;letter-spacing:.06em;font-weight:900;color:#8551d8}.daily-phrase-card h3{font-family:var(--font-display);font-size:22px;margin:9px 0 1px}.daily-phrase-card p{color:#8a8d9c;font-size:11px;margin:0}.daily-phrase-card .round-sound{margin:0}.xp-card{display:flex;align-items:center;gap:12px}.xp-icon{width:44px;height:44px;border-radius:14px;background:#eee9ff;display:grid;place-items:center}.xp-card span{font-size:9px;color:#9193a1}.xp-card h3{margin:2px 0;font-size:21px}.xp-card p{margin:0;font-size:8px;color:#9093a0}.xp-bars{height:58px;display:flex;align-items:flex-end;gap:4px;margin-left:auto}.xp-bars i{width:5px;background:linear-gradient(#ff4f9a,#754be9);border-radius:5px}
.filter-row{display:flex;gap:8px;align-items:center;margin-bottom:22px}.filter-row>button{background:#fff;border:1px solid #e5e3eb;border-radius:10px;padding:9px 12px;color:#74778a;font-size:11px;font-weight:800}.filter-row>button.active{background:#6b46dd;color:#fff;border-color:#6b46dd}.filter-row label{margin-left:auto;display:flex;align-items:center;gap:7px;background:#fff;border:1px solid #e5e3eb;border-radius:10px;padding:0 10px}.filter-row input{border:0;outline:0;background:transparent;padding:9px;width:170px}.lesson-path{position:relative;display:grid;gap:16px;max-width:910px}.path-line{position:absolute;left:28px;top:35px;bottom:40px;width:2px;background:#ddd8eb}.path-card{display:grid;grid-template-columns:58px minmax(0,1fr) 110px;gap:19px;background:#fff;border:1px solid #e7e5ed;border-radius:21px;padding:20px;position:relative}.path-card.current{border:2px solid #7650e9;box-shadow:0 15px 40px rgba(91,57,181,.12)}.path-card.locked{opacity:.65}.path-node{width:36px;height:36px;border-radius:50%;background:#6c47df;color:#fff;display:grid;place-items:center;font-weight:900;position:relative;z-index:2;margin-left:10px}.path-card.complete .path-node{background:#25aa77}.path-card.locked .path-node{background:#aaa6b5}.path-label{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#7651da;font-weight:900}.path-content h3{font-size:20px;margin:5px 0}.path-content p{font-size:12px;color:#7e8192;margin:0 0 12px}.path-meta{display:flex;gap:18px;color:#9294a1;font-size:9px}.path-progress{max-width:350px;height:5px;margin:10px 0 14px}.path-content .btn{padding:9px 12px;font-size:11px}.path-art{font-size:46px;display:grid;place-items:center;background:#f6f3ff;border-radius:17px}
.featured-song-app{min-height:280px;border-radius:24px;background:linear-gradient(125deg,#17103c,#422170 55%,#7132a5);color:#fff;padding:28px;display:grid;grid-template-columns:190px 1fr 230px;gap:25px;align-items:center;overflow:hidden;position:relative}.featured-cover{height:190px;border-radius:20px;background:linear-gradient(160deg,#ffcc5c,#ff6676 55%,#7541d7);display:grid;place-items:center;position:relative;overflow:hidden}.featured-cover>span{font-size:51px;position:relative;z-index:2}.cover-sun{position:absolute;width:110px;height:110px;border-radius:50%;background:rgba(255,249,205,.6);top:25px}.featured-song-copy h2{font-family:var(--font-display);font-size:34px;margin:12px 0 5px}.featured-song-copy p{color:rgba(255,255,255,.7);max-width:550px;font-size:12px;line-height:1.6}.song-tags{display:flex;gap:8px;margin:15px 0}.song-tags span{font-size:9px;background:rgba(255,255,255,.1);padding:6px 8px;border-radius:999px}.featured-wave{height:110px;display:flex;align-items:center;justify-content:center;gap:6px}.featured-wave i{width:5px;background:linear-gradient(#ff70a8,#7cc8ff)}.featured-wave i:nth-child(10){height:33px}.featured-wave i:nth-child(11){height:53px}.featured-wave i:nth-child(12){height:20px}.section-subhead{display:flex;justify-content:space-between;align-items:flex-end;margin:28px 0 14px}.section-subhead h2{font-size:20px;margin:0 0 3px}.section-subhead p{font-size:11px;color:#8b8e9d;margin:0}.carousel-buttons{display:flex;gap:7px}.carousel-buttons button{width:34px;height:34px;border-radius:10px;background:#fff;border:1px solid #e5e3eb}.song-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.song-tile{background:#fff;border:1px solid #e7e5ed;border-radius:18px;padding:12px}.song-cover{height:150px;border-radius:14px;display:grid;place-items:center;position:relative;color:#fff;font-size:38px;overflow:hidden}.song-cover:before{content:"";position:absolute;width:100px;height:100px;border-radius:50%;background:rgba(255,255,255,.2);top:20px}.song-cover span{position:relative}.song-cover button{position:absolute;right:10px;bottom:10px;width:38px;height:38px;border-radius:50%;background:#fff;color:#623cd5}.cover-a{background:linear-gradient(145deg,#ffb44e,#ff586f)}.cover-b{background:linear-gradient(145deg,#9d57e9,#5237d5)}.cover-c{background:linear-gradient(145deg,#29b5cf,#4357d7)}.cover-d{background:linear-gradient(145deg,#ff64aa,#9a3fd8)}.song-tile>span{display:inline-block;color:#7651da;background:#f1ecff;border-radius:999px;padding:4px 7px;font-size:8px;font-weight:900;margin-top:11px}.song-tile h3{font-size:14px;margin:7px 0 2px}.song-tile p{font-size:9px;color:#9193a0;margin:0}.mood-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.mood-grid button{background:#fff;border:1px solid #e7e5ed;border-radius:17px;padding:18px;text-align:left}.mood-grid span{font-size:24px}.mood-grid strong,.mood-grid small{display:block}.mood-grid strong{margin-top:10px}.mood-grid small{font-size:9px;color:#9698a5;margin-top:3px}
.period-select{border:1px solid #dedce6;background:#fff;border-radius:11px;padding:9px 12px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.metric-grid article{background:#fff;border:1px solid #e7e5ed;border-radius:18px;padding:18px}.metric-grid span,.metric-grid strong,.metric-grid small{display:block}.metric-grid span{font-size:10px;color:#858897}.metric-grid strong{font-family:var(--font-display);font-size:29px;margin:6px 0 3px}.metric-grid small{font-size:8px;color:#28a271}.progress-layout{display:grid;grid-template-columns:1.6fr .8fr;gap:16px;margin-top:16px}.progress-layout.lower{grid-template-columns:1fr 1fr}.legend{font-size:9px;color:#8f92a0;display:flex;align-items:center;gap:5px}.legend i{width:8px;height:8px;border-radius:50%;background:#7049e8}.bar-chart{height:230px;display:flex;align-items:flex-end;gap:12px;padding:20px 5px 0;border-bottom:1px solid #e8e6ed}.bar-chart>div{flex:1;height:100%;display:flex;align-items:flex-end;justify-content:flex-end;flex-direction:column}.bar-chart i{width:60%;max-width:28px;background:linear-gradient(180deg,#9c79f0,#6240dc);border-radius:7px 7px 2px 2px;display:block;margin:auto auto 8px;min-height:20px}.bar-chart span{font-size:8px;color:#9799a7;white-space:nowrap}.skill-card{display:flex;flex-direction:column}.skill-row{display:grid;grid-template-columns:66px 1fr 34px;align-items:center;gap:8px;margin-top:15px;font-size:10px}.skill-row>div{height:6px;background:#eeeaf5;border-radius:10px}.skill-row i{display:block;height:100%;border-radius:10px;background:linear-gradient(90deg,#ff5b9c,#6b46e0)}.skill-row strong{font-size:9px;text-align:right}.skill-card>.btn{margin-top:auto}.achievement-list{display:grid;margin-top:10px}.achievement-list>div{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #efedf3}.achievement-list>div:last-child{border-bottom:0}.achievement-list>div>span{width:38px;height:38px;border-radius:12px;background:#f3efff;display:grid;place-items:center}.achievement-list>div>div{flex:1}.achievement-list strong,.achievement-list small{display:block}.achievement-list strong{font-size:11px}.achievement-list small{font-size:8px;color:#9597a4;margin-top:2px}.achievement-list i{font-style:normal;font-size:8px;color:#7651da;font-weight:900}.word-review{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:13px}.word-review button{background:#faf9fc;border:1px solid #eceaf1;border-radius:12px;padding:11px;text-align:left;position:relative}.word-review strong,.word-review small{display:block}.word-review strong{font-size:11px}.word-review small{font-size:8px;color:#9698a5;margin-top:2px}.word-review span{position:absolute;right:8px;top:8px;font-size:7px;color:#7a55dd;background:#eee9ff;padding:3px 5px;border-radius:999px}
.premium-hero-app{min-height:330px;border-radius:25px;background:linear-gradient(125deg,#1a0f48,#5130a0 50%,#a63fbe);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:44px 65px;position:relative;overflow:hidden}.premium-hero-app>div:first-of-type{position:relative;z-index:2;max-width:620px}.premium-chip{display:inline-block;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.17);padding:7px 10px;border-radius:999px;font-size:10px;text-transform:uppercase;letter-spacing:.09em;font-weight:900}.premium-hero-app h1{font-family:var(--font-display);font-size:48px;margin:17px 0 7px}.premium-hero-app p{color:rgba(255,255,255,.72);font-size:15px;line-height:1.6}.premium-hero-app small{display:block;color:rgba(255,255,255,.55);font-size:9px;margin-top:10px}.premium-vinyl{width:210px;height:210px;background:repeating-radial-gradient(circle at center,#1d103e 0 8px,#3f256a 9px 13px,#1d103e 14px 19px);animation:spin 13s linear infinite;flex:none}.premium-vinyl:before{width:70px;height:70px}.premium-spark{position:absolute;font-size:32px;color:rgba(255,255,255,.35);animation:floatNote 4s infinite}.premium-spark.p1{left:45%;top:25px}.premium-spark.p2{right:27%;bottom:28px;animation-delay:-1.4s}.premium-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}.premium-feature-grid article{background:#fff;border:1px solid #e7e5ed;border-radius:18px;padding:20px}.premium-feature-grid article>span{width:42px;height:42px;border-radius:13px;background:#efeaff;color:#653fd8;display:grid;place-items:center;font-weight:900;font-size:18px}.premium-feature-grid h3{font-size:14px;margin:13px 0 5px}.premium-feature-grid p{font-size:10px;line-height:1.5;color:#888b9a;margin:0}.app-plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}.app-plan-grid article{background:#fff;border:1px solid #e7e5ed;border-radius:18px;padding:22px;text-align:center;position:relative}.app-plan-grid article.recommended{border:2px solid #744fe8}.app-plan-grid .recommended>div{position:absolute;left:50%;top:-11px;transform:translateX(-50%);background:#744fe8;color:#fff;border-radius:999px;padding:5px 9px;font-size:8px;text-transform:uppercase;font-weight:900}.app-plan-grid span{font-size:10px;color:#7651dc;font-weight:900;text-transform:uppercase}.app-plan-grid h3{font-family:var(--font-display);font-size:38px;margin:7px 0 0}.app-plan-grid p{color:#8b8e9d;font-size:9px;margin:0 0 16px}
.profile-layout{display:grid;grid-template-columns:300px 1fr;gap:16px;max-width:930px}.profile-summary{text-align:center;padding:30px}.large-avatar{width:90px;height:90px;border-radius:50%;background:linear-gradient(135deg,#ff5d9c,#7149ed);color:#fff;display:grid;place-items:center;margin:auto;font-size:25px;font-weight:900}.profile-summary h2{margin:15px 0 2px}.profile-summary>p{font-size:11px;color:#8d8f9d;margin:0}.level-badge{display:inline-block;background:#f1ecff;color:#6b46dc;border-radius:999px;padding:7px 10px;font-size:9px;font-weight:900;margin:15px 0}.profile-numbers{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #eceaf1;padding-top:17px;margin-top:7px}.profile-numbers div{border-right:1px solid #eceaf1}.profile-numbers div:last-child{border:0}.profile-numbers strong,.profile-numbers span{display:block}.profile-numbers strong{font-size:17px}.profile-numbers span{font-size:7px;color:#9698a5}.settings-card h3{margin-top:0}.settings-card>label:not(.setting-toggle){display:grid;gap:6px;font-size:10px;font-weight:800;margin-bottom:13px}.settings-card select{border:1px solid #dedce5;border-radius:10px;padding:10px;background:#fff}.setting-toggle{display:flex;align-items:center;gap:15px;border-top:1px solid #eceaf1;padding:13px 0;position:relative}.setting-toggle span{flex:1}.setting-toggle strong,.setting-toggle small{display:block}.setting-toggle strong{font-size:11px}.setting-toggle small{font-size:8px;color:#9698a5;margin-top:2px}.setting-toggle input{display:none}.setting-toggle i{width:40px;height:22px;border-radius:999px;background:#d7d3e0;position:relative;transition:.2s}.setting-toggle i:after{content:"";position:absolute;width:17px;height:17px;border-radius:50%;background:#fff;left:3px;top:2.5px;transition:.2s;box-shadow:0 2px 5px rgba(0,0,0,.15)}.setting-toggle input:checked+i{background:#6c47df}.setting-toggle input:checked+i:after{left:20px}
.lesson-player{width:min(700px,calc(100% - 30px));min-height:650px;background:#fff;border-radius:26px;position:relative;transform:translateY(20px) scale(.98);transition:.25s;overflow:hidden;display:flex;flex-direction:column}.lesson-player-head{height:77px;display:flex;align-items:center;padding:0 23px;border-bottom:1px solid #eceaf1}.lesson-player-head>button{width:34px;height:34px;border-radius:50%;background:#f1eff6;font-size:21px;margin-right:13px}.lesson-player-head>div:nth-child(2){flex:1}.lesson-player-head span,.lesson-player-head strong{display:block}.lesson-player-head span{font-size:8px;text-transform:uppercase;color:#8f91a0;letter-spacing:.08em}.lesson-player-head strong{font-size:13px;margin-top:3px}.lesson-xp{font-size:10px;color:#7550df;background:#f1ecff;padding:7px 10px;border-radius:999px;font-weight:900}.lesson-player-progress{height:5px;background:#efedf4}.lesson-player-progress i{display:block;height:100%;width:25%;background:linear-gradient(90deg,#ff4e98,#7449e8);transition:.3s}.lesson-card-stage{flex:1;position:relative;display:grid;place-items:center;padding:30px}.lesson-slide{display:none;text-align:center;width:100%;max-width:520px}.lesson-slide.active{display:block;animation:viewIn .28s ease}.lesson-mode{display:inline-block;background:#f1ecff;color:#6d48dd;border-radius:999px;padding:6px 9px;font-size:9px;letter-spacing:.1em;font-weight:900}.big-emoji{font-size:68px;margin:25px 0 12px}.lesson-slide h2{font-family:var(--font-display);font-size:42px;margin:10px 0 3px}.lesson-slide>p{font-size:18px;color:#838697;margin:0}.giant-sound{width:76px;height:76px;border-radius:50%;background:linear-gradient(135deg,#7b52ed,#5f38d3);color:#fff;font-size:26px;display:grid;place-items:center;margin:25px auto 13px;box-shadow:0 15px 35px rgba(89,52,188,.22)}.lesson-slide>small{color:#999baa;font-size:10px}.lesson-eq{height:100px;display:flex;align-items:center;justify-content:center;gap:9px;margin:20px 0 5px}.lesson-eq i{width:8px;background:linear-gradient(#ff4f99,#7147e8)}.answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:25px 0}.answer-grid button{border:1px solid #e4e1eb;background:#fff;border-radius:13px;padding:14px;font-weight:800;color:#53576d}.answer-grid button:hover{background:#f5f1ff;border-color:#cabdf5}.answer-grid button.correct{background:#e9fbf2;border-color:#8dd9b7;color:#19845b}.answer-grid button.wrong{background:#fff0f3;border-color:#ef9eb1;color:#bf415e}.complete-burst{width:90px;height:90px;border-radius:50%;background:linear-gradient(135deg,#25bc81,#62d0a4);color:#fff;display:grid;place-items:center;margin:20px auto;font-size:42px;box-shadow:0 0 0 17px rgba(49,192,134,.11)}.complete-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:25px 0}.complete-stats div{background:#f8f7fb;border-radius:13px;padding:13px}.complete-stats strong,.complete-stats span{display:block}.complete-stats strong{font-size:18px}.complete-stats span{font-size:8px;color:#9193a2}.lesson-player-foot{display:flex;justify-content:space-between;padding:18px 24px;border-top:1px solid #eceaf1}.practice-panel{width:min(470px,calc(100% - 30px));background:#fff;border-radius:25px;padding:35px;text-align:center;position:relative;transform:translateY(18px) scale(.98);transition:.25s}.practice-icon{width:65px;height:65px;border-radius:20px;background:#f1ecff;display:grid;place-items:center;font-size:31px;margin:auto}.practice-panel h2{font-family:var(--font-display);font-size:29px;margin:15px 0 5px}.practice-panel>p{color:#898c9a;font-size:12px}.practice-options{display:grid;gap:8px}.practice-options button{background:#faf9fc;border:1px solid #e8e6ee;border-radius:12px;padding:12px;font-weight:700}.practice-options button:hover,.practice-options .correct-option:hover{background:#ebfaf3;border-color:#8ed7b6;color:#25845e}
@media (max-width:1080px){.desktop-nav{gap:19px}.hero-grid{gap:30px}.lesson-phone{width:340px}.showcase-grid{gap:45px}.dashboard-row{grid-template-columns:1fr 1fr}.quick-card{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.quick-card .card-title-row{grid-column:1/-1}.practice-action{margin:0}.bottom-dashboard-row{grid-template-columns:1fr 1fr}.xp-card{grid-column:1/-1}.featured-song-app{grid-template-columns:170px 1fr}.featured-wave{display:none}.song-grid{grid-template-columns:repeat(2,1fr)}.premium-hero-app{padding:38px}.app-content{padding-inline:22px}}
@media (max-width:900px){.desktop-nav,.desktop-only{display:none}.menu-btn{display:flex}.mobile-menu{position:absolute;top:78px;left:20px;right:20px;background:#fff;border:1px solid #e7e2f3;border-radius:20px;padding:18px;box-shadow:var(--shadow);display:grid;gap:8px;transform:translateY(-10px);opacity:0;visibility:hidden;transition:.2s}.mobile-menu.open{transform:none;opacity:1;visibility:visible}.mobile-menu a{padding:10px;border-radius:10px;font-weight:700}.mobile-menu a:hover{background:#f4f0ff}.hero{padding-top:125px}.hero-grid{grid-template-columns:1fr;text-align:center}.hero-copy{max-width:750px;margin:auto}.hero-lead{margin:auto}.hero-actions,.social-proof{justify-content:center}.hero-stage{min-height:620px}.steps-grid,.review-grid,.pricing-grid{grid-template-columns:1fr;max-width:650px;margin-inline:auto}.feature-review,.price-card.featured{transform:none}.showcase-grid,.preview-grid{grid-template-columns:1fr}.showcase-copy{text-align:center}.feature-list{text-align:left;max-width:530px;margin-inline:auto;margin-bottom:32px}.album-stack{height:590px}.preview-copy{order:-1;text-align:center}.stat-row{text-align:left}.cta-card{display:block;text-align:center}.cta-card>.btn{margin-top:27px}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}.footer-grid>div:last-child{display:none}.app-sidebar{transform:translateX(-100%);transition:.25s;box-shadow:20px 0 50px rgba(28,18,72,.16)}.app-sidebar.open{transform:none}.app-main{margin-left:0}.app-menu-btn{display:grid;place-items:center}.home-grid{grid-template-columns:1fr}.week-progress-card{display:grid;grid-template-columns:1fr 1fr;align-items:center}.week-progress-card .card-title-row{grid-column:1/-1}.week-progress-card .progress-ring{grid-row:2/5}.dashboard-row{grid-template-columns:1fr}.quick-card{grid-column:auto;display:block}.practice-action{margin-top:8px}.bottom-dashboard-row{grid-template-columns:1fr}.xp-card{grid-column:auto}.metric-grid{grid-template-columns:repeat(2,1fr)}.progress-layout,.progress-layout.lower{grid-template-columns:1fr}.premium-feature-grid{grid-template-columns:repeat(2,1fr)}.profile-layout{grid-template-columns:1fr}.profile-summary{max-width:none}}
@media (max-width:650px){.container{width:min(100% - 26px,1180px)}.section-pad{padding:78px 0}.nav-shell{height:68px}.site-header .brand{width:125px}.mobile-menu{top:68px}.hero{padding-top:112px;min-height:auto}.hero h1{font-size:48px}.hero-lead{font-size:16px}.hero-actions{flex-direction:column}.hero-actions .btn{width:100%}.social-proof{flex-wrap:wrap}.hero-stage{transform:scale(.84);margin:-45px -50px -45px;min-height:600px}.lesson-phone{transform:none}.mini-card-b{right:0}.mini-card-a{left:0}.language-strip{padding:16px 0}.showcase-copy h2,.section-heading h2,.preview-copy h2{font-size:38px}.album-stack{transform:scale(.82);margin:-40px -50px;height:560px}.album-back{transform:translate(-65px,-10px) rotate(-8deg)}.album-middle{transform:translate(65px,-5px) rotate(7deg)}.preview-panel{padding:18px}.stat-row{grid-template-columns:1fr}.review-card>p{min-height:auto}.cta-card{padding:37px 22px}.cta-card h2{font-size:35px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-bottom{display:block;text-align:center}.footer-bottom span{display:block;margin-top:6px}.auth-card{padding:25px 20px}.app-topbar{padding:0 13px}.topbar-search{width:auto;flex:1}.topbar-actions .streak-top{display:none}.app-content{padding:20px 13px 40px}.app-heading-row{align-items:flex-start;flex-direction:column}.app-heading-row .btn{width:100%}.today-card{padding:24px;min-height:340px}.today-visual{position:absolute;right:-35px;bottom:-36px;opacity:.4}.today-stats{flex-wrap:wrap;gap:8px}.dashboard-row,.bottom-dashboard-row{gap:12px}.week-progress-card{display:block}.filter-row{overflow:auto;padding-bottom:4px}.filter-row label{display:none}.path-card{grid-template-columns:45px 1fr}.path-art{display:none}.featured-song-app{grid-template-columns:1fr;text-align:center}.featured-cover{width:180px;margin:auto}.song-tags{justify-content:center;flex-wrap:wrap}.song-grid,.mood-grid{grid-template-columns:1fr 1fr}.metric-grid{grid-template-columns:1fr 1fr}.premium-hero-app{padding:35px 22px;text-align:center;display:block}.premium-hero-app h1{font-size:38px}.premium-vinyl{width:150px;height:150px;margin:28px auto 0}.premium-feature-grid,.app-plan-grid{grid-template-columns:1fr}.profile-layout{gap:12px}.lesson-player{min-height:620px}.lesson-card-stage{padding:22px 18px}.lesson-slide h2{font-size:34px}.answer-grid{grid-template-columns:1fr}.practice-panel{padding:30px 20px}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}