@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap";:root{font-family:DM Sans,Noto Sans SC,PingFang SC,sans-serif;color:#24362f;background:#f5f5f0;font-synthesis:none;text-rendering:optimizeLegibility;--green: #214c3f;--green-dark: #153b31;--green-soft: #e8efe9;--orange: #db7957;--orange-soft: #f8eae2;--gold: #dcb464;--ink: #24362f;--muted: #7d8983;--paper: #fffefa;--cream: #f6f2e8;--line: #e6e7df;--shadow: 0 8px 28px rgba(30, 55, 45, .055)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline:3px solid rgba(219,121,87,.3);outline-offset:3px}button{-webkit-tap-highlight-color:transparent}h1,h2,h3,p{margin:0}button svg{flex-shrink:0}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:232px;z-index:20;display:flex;flex-direction:column;padding:30px 20px 22px;background:#fbfbf7;border-right:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;border:0;background:none;padding:0 8px;cursor:pointer;text-align:left}.brand__mark{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;color:#f9f5e9;background:var(--green);transform:rotate(-3deg)}.brand>span:last-child{display:flex;flex-direction:column}.brand strong{font-size:23px;letter-spacing:5px;line-height:1.15}.brand small{margin-top:5px;color:#8c958f;font-size:8px;font-weight:600;letter-spacing:1.25px}.main-nav{display:flex;flex-direction:column;gap:7px;margin-top:58px}.nav-caption{color:#a0a7a2;font-size:11px;font-weight:600;letter-spacing:1.4px;padding:0 14px 10px}.main-nav button{position:relative;display:flex;align-items:center;gap:13px;width:100%;height:48px;padding:0 15px;border:0;border-radius:12px;background:transparent;color:#75817b;cursor:pointer;font-size:14px;font-weight:500;text-align:left;transition:.16s ease}.main-nav button:hover{background:#f0f2ec;color:var(--green)}.main-nav button.is-active{background:var(--green);color:#fff;box-shadow:0 5px 14px #214c3f29}.main-nav button i{position:absolute;right:14px;width:5px;height:5px;background:#e4c788;border-radius:50%}.sidebar-bottom{margin-top:auto}.sidebar-quote{position:relative;margin:0 5px 24px;padding:18px;border-radius:14px;background:#f1eee4;overflow:hidden}.sidebar-quote>span{position:absolute;right:10px;top:-15px;font-family:Georgia,serif;color:#214c3f1a;font-size:76px}.sidebar-quote p{position:relative;font-family:Georgia,Noto Sans SC,serif;color:#6f796e;font-size:12px;line-height:1.9}.profile-chip{display:flex;align-items:center;gap:10px;padding:12px 7px 0;border-top:1px solid var(--line)}.profile-chip>span{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#e6ece4;color:var(--green);font-size:13px}.profile-chip div{display:flex;flex-direction:column;gap:3px}.profile-chip strong{font-size:12px;font-weight:600}.profile-chip small{color:#9aa19d;font-size:9px}.main-area{min-height:100vh;margin-left:232px}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 42px;border-bottom:1px solid rgba(224,226,217,.8);background:#f5f5f0e0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.topbar__breadcrumb{color:#87918c;font-size:12px}.instrument-chip{display:flex;align-items:center;gap:10px}.instrument-icon{width:34px;height:34px;display:grid;place-items:center;border:1px solid #dde1d8;border-radius:10px;background:#fafaf5;color:var(--green)}.instrument-chip div{display:flex;flex-direction:column;gap:2px}.instrument-chip small{color:#9ba29e;font-size:9px}.instrument-chip strong{font-size:11px;font-weight:600}.mobile-brand{display:none}.page-container{width:100%;max-width:1440px;margin:0 auto;padding:35px 42px 60px}.page-enter{animation:page-in .35s ease both}@keyframes page-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.page-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:29px}.page-kicker{display:block;margin-bottom:9px;color:#97a098;font-size:9px;font-weight:700;letter-spacing:2.1px}.page-header h1{color:var(--ink);font-size:clamp(27px,2.4vw,36px);font-weight:600;letter-spacing:-1.3px;line-height:1.35}.page-header p{margin-top:9px;color:#85908a;font-size:13px;line-height:1.7}.date-chip{display:flex;align-items:center;gap:7px;color:#8d9690;font-size:11px;padding-bottom:5px}.date-chip span{width:6px;height:6px;border-radius:50%;background:var(--orange)}.panel{background:var(--paper);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.eyebrow{display:inline-flex;align-items:center;gap:6px;color:#8b958f;font-size:10px;font-weight:600;letter-spacing:1px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.section-heading h2{margin-top:6px;font-size:18px;font-weight:600;letter-spacing:-.4px}.section-heading--compact h2{font-size:16px}.text-button{display:inline-flex;align-items:center;gap:6px;padding:7px 0;border:0;background:none;color:#718079;font-size:11px;cursor:pointer}.text-button:hover{color:var(--green)}.button{min-height:43px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 19px;border:0;border-radius:10px;cursor:pointer;font-size:12px;font-weight:600;transition:transform .15s ease,background .15s ease}.button:hover{transform:translateY(-1px)}.button--cream{background:#f6f0df;color:var(--green-dark)}.button--cream:hover{background:#fff9e9}.button--dark{background:var(--green);color:#fff}.button--dark:hover{background:var(--green-dark)}.button--completed{background:var(--green-soft);color:var(--green);cursor:default}.button:disabled{opacity:1;transform:none}.soft-badge{display:inline-flex;padding:5px 9px;border-radius:20px;background:#f0f2ec;color:#87918b;font-size:10px;white-space:nowrap}.back-button{display:inline-flex;align-items:center;gap:7px;margin-bottom:24px;padding:0;border:0;background:none;color:#7d8982;font-size:12px;cursor:pointer}.back-button:hover{color:var(--green)}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 278px;gap:24px}.dashboard-main{min-width:0}.continue-card{min-height:272px;display:grid;grid-template-columns:1fr .95fr;overflow:hidden;border-radius:20px;background:var(--green);box-shadow:0 12px 30px #1b403421}.continue-card__content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:31px 0 31px 34px;color:#fff}.continue-label{display:inline-flex;align-items:center;gap:6px;margin-bottom:20px;padding:5px 10px;border:1px solid rgba(255,255,255,.16);border-radius:20px;color:#e4e9df;font-size:10px}.continue-card__content>p{color:#aebfb5;font-size:10px}.continue-card__content h2{margin:8px 0 7px;font-size:clamp(23px,2.2vw,31px);font-weight:600;letter-spacing:-.7px}.continue-subtitle{color:#b9c8bf;font-size:12px}.continue-card__content .button{margin-top:24px}.continue-card__visual{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;overflow:hidden;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.07),transparent 67%)}.continue-card__visual:before,.continue-card__visual:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.06);border-radius:50%}.continue-card__visual:before{width:290px;height:290px}.continue-card__visual:after{width:220px;height:220px}.continue-card__visual .harmonica{width:113%;transform:rotate(-7deg);z-index:1}.continue-card__visual>p{z-index:1;margin-top:20px;color:#9cb2a6;font-size:9px;letter-spacing:1.2px}.floating-note{position:absolute;z-index:3;width:43px;height:43px;display:flex;align-items:center;justify-content:center;gap:4px;border-radius:12px;background:#e5b968;color:var(--green-dark);box-shadow:0 8px 20px #0a1e1733;font-size:18px;font-weight:700;transform:rotate(7deg)}.floating-note small{font-size:9px;font-weight:500}.floating-note--one{top:30px;right:29px}.floating-note--two{bottom:46px;left:7px;background:#e9e5d7;transform:rotate(-7deg)}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0 24px}.stat-card{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:11px;padding:16px;border:1px solid var(--line);border-radius:15px;background:var(--paper)}.stat-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:11px}.stat-icon--orange{background:var(--orange-soft);color:var(--orange)}.stat-icon--green{background:var(--green-soft);color:var(--green)}.stat-icon--yellow{background:#f7f0de;color:#b78b35}.stat-card>div{display:flex;flex-direction:column}.stat-card strong{font-size:20px;line-height:1.2}.stat-card strong small{margin-left:3px;font-size:10px;font-weight:500}.stat-card>div>span{margin-top:3px;color:#8a948f;font-size:10px}.stat-card>small{grid-column:2;color:#afb5b1;font-size:9px;margin-top:-6px}.learning-path{padding:24px 26px 10px}.lesson-list{margin-top:14px}.lesson-row{width:100%;display:flex;align-items:center;gap:13px;padding:13px 0;border:0;border-top:1px solid #eeefe9;background:none;text-align:left;cursor:pointer}.lesson-row:first-child{border-top:0}.lesson-number{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;border-radius:10px;background:#f2f3ee;color:#939c96;font-size:10px;font-weight:600}.lesson-number.is-current{background:var(--orange-soft);color:var(--orange)}.lesson-number.is-complete{background:var(--green-soft);color:var(--green)}.lesson-row__content{min-width:0;display:flex;flex:1;flex-direction:column;gap:4px}.lesson-row__content strong{overflow:hidden;font-size:12px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.lesson-row__content small{overflow:hidden;color:#9ba39e;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.lesson-row__meta{display:flex;align-items:center;gap:4px;color:#9ba39e;font-size:9px;white-space:nowrap}.current-tag{padding:4px 7px;border-radius:5px;background:var(--orange-soft);color:var(--orange);font-size:8px;white-space:nowrap}.lesson-row__chevron{color:#b0b7b2}.lesson-row:hover .lesson-row__content strong,.lesson-row:hover .lesson-row__chevron{color:var(--green)}.dashboard-aside{display:flex;flex-direction:column;gap:17px}.daily-goal-card{padding:21px}.daily-goal-card .section-heading>svg{color:#b9c0b9}.goal-ring{--progress: 0deg;width:126px;height:126px;display:grid;place-items:center;margin:24px auto 18px;border-radius:50%;background:conic-gradient(var(--orange) var(--progress),#efeee7 0);transform:rotate(-45deg)}.goal-ring:before{content:"";grid-area:1/1;width:104px;height:104px;border-radius:50%;background:var(--paper)}.goal-ring>div{z-index:1;grid-area:1/1;display:flex;flex-direction:column;align-items:center;transform:rotate(45deg)}.goal-ring strong{font-size:25px}.goal-ring span{margin-top:3px;color:#a0a8a3;font-size:8px}.daily-goal-card>p{color:#929b96;font-size:10px;line-height:1.8;text-align:center}.daily-goal-card>p strong{color:#68776f;font-weight:600}.week-labels{display:flex;justify-content:space-between;margin-top:17px}.week-labels span{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;color:#a1a9a4;font-size:9px}.week-labels span.is-today{background:var(--green);color:#fff}.recommended-card{position:relative;overflow:hidden;padding:23px;border-radius:18px;background:#e9dfca}.recommended-card:after{content:"♪";position:absolute;right:-4px;top:24px;color:#48463412;font-family:Georgia,serif;font-size:120px;transform:rotate(12deg)}.recommended-card__icon{width:42px;height:42px;display:grid;place-items:center;margin-bottom:19px;border-radius:12px;background:#fffefa94;color:var(--green)}.recommended-card h3{margin:7px 0;font-size:21px}.recommended-card p{color:#85816f;font-size:10px;line-height:1.8}.recommended-card .button{position:relative;z-index:1;width:100%;margin-top:18px}.tip-card{display:flex;align-items:flex-start;gap:11px;padding:16px;border:1px dashed #d9ddd3;border-radius:14px;color:#a28b56}.tip-card strong{display:block;margin-bottom:5px;color:#788078;font-size:10px}.tip-card p{color:#9ba19a;font-size:9px;line-height:1.75}.harmonica{position:relative;width:100%;padding:28px 18px 14px;border:1px solid #b8bdb8;border-radius:12px;background:linear-gradient(170deg,#eff0ec,#bfc4c0 34%,#f5f5f1 56%,#a8afaa);box-shadow:inset 0 1px 1px #fff,inset 0 -2px 3px #2f393340,0 10px 18px #20312924}.harmonica__brand{position:absolute;top:7px;left:24px;right:24px;display:flex;align-items:center;justify-content:space-between;color:#58635d;text-shadow:0 1px rgba(255,255,255,.8)}.harmonica__brand span{font-size:9px;font-weight:700;letter-spacing:3px}.harmonica__brand small{font-size:6px;letter-spacing:1px}.harmonica__holes{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px}.harmonica-hole{min-width:0;display:flex;flex-direction:column;align-items:center;padding:0;border:0;background:none}.harmonica-hole:disabled{opacity:1}.harmonica-hole:not(:disabled){cursor:pointer}.harmonica-hole__number{margin-bottom:5px;color:#3e4943;font-size:9px;font-weight:700}.harmonica-hole__opening{position:relative;width:100%;height:48px;display:grid;place-items:center;overflow:hidden;border:2px solid #7c8580;border-radius:3px 3px 7px 7px;background:radial-gradient(ellipse at 50% 20%,#46504a,#111814 70%);box-shadow:inset 0 3px 7px #060a08,0 1px #ffffffa6;transition:.15s ease}.harmonica-hole.is-active .harmonica-hole__opening{border-color:#e4a256;background:radial-gradient(ellipse at center,#97602d,#211a12 75%);box-shadow:0 0 0 3px #e4a2564d,inset 0 3px 7px #060a08}.harmonica-hole__pulse{width:12px;height:12px;border-radius:50%;background:#eabe74;filter:blur(3px);animation:pulse .8s ease-in-out infinite alternate}@keyframes pulse{to{opacity:.45;transform:scale(.75)}}.harmonica-hole__notes{display:flex;flex-direction:column;gap:2px;margin-top:7px;color:#5d6761;font-size:7px;line-height:1.3;white-space:nowrap}.harmonica-hole__notes .is-current{color:#9a4f29;font-weight:700}.harmonica__screw{position:absolute;top:8px;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fafafa,#707a74)}.harmonica__screw--left{left:7px}.harmonica__screw--right{right:7px}.harmonica--decorative{padding-bottom:18px}.harmonica--decorative .harmonica-hole__opening{height:55px}.harmonica--decorative .harmonica-hole__number{color:#46524b}.course-overview{display:flex;align-items:center;gap:18px;margin-bottom:34px;padding:23px 26px;border-radius:18px;background:var(--green);color:#fff}.course-overview__icon{width:58px;height:58px;display:grid;place-items:center;flex:0 0 auto;border-radius:16px;background:#ffffff17;color:#e6c583}.course-overview>div:nth-child(2){flex:1}.course-overview>div>span{color:#afc1b7;font-size:9px}.course-overview h2{margin:5px 0 7px;font-size:18px;font-weight:600}.course-overview p{color:#afc1b7;font-size:10px}.course-overview__progress{display:flex;flex-direction:column;align-items:flex-end;padding-left:30px;border-left:1px solid rgba(255,255,255,.12)}.course-overview__progress strong{color:#f2e6c9;font-size:30px}.course-overview__progress strong small{color:#a9bbb2;font-size:14px}.course-overview__progress>span{margin-top:2px}.course-stage{margin-bottom:32px}.course-stage__heading{display:flex;align-items:center;gap:13px;margin-bottom:15px}.course-stage__heading>span{color:#c7cbc3;font-family:Georgia,serif;font-size:29px;font-style:italic}.course-stage__heading h2{font-size:17px;font-weight:600}.course-stage__heading p{margin-top:4px;color:#959e98;font-size:10px}.course-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.course-card{min-height:188px;display:flex;flex-direction:column;padding:19px;border:1px solid var(--line);border-radius:16px;background:var(--paper);text-align:left;cursor:pointer;box-shadow:var(--shadow);transition:.16s ease}.course-card:hover{border-color:#bcc9c0;transform:translateY(-3px);box-shadow:0 12px 25px #1e372d14}.course-card__top{display:flex;align-items:center;justify-content:space-between}.course-card__number{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:#f0f2ec;color:#87928b;font-size:10px;font-weight:600}.course-card.is-complete .course-card__number{background:var(--green-soft);color:var(--green)}.course-card__duration{display:flex;align-items:center;gap:4px;color:#a1a9a4;font-size:9px}.course-card h3{margin:17px 0 7px;font-size:14px;font-weight:600}.course-card>p{color:#969f99;font-size:10px;line-height:1.6}.course-card__bottom{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:14px;color:#7d8982;font-size:10px}.course-card:hover .course-card__bottom{color:var(--orange)}.lesson-hero{display:flex;align-items:center;gap:24px;margin-bottom:28px;padding:26px 30px;border-radius:18px;background:#ecebdf}.lesson-hero__index{width:73px;height:80px;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 auto;border-right:1px solid #d6d8cb}.lesson-hero__index span{color:#999f91;font-size:8px;letter-spacing:1.5px}.lesson-hero__index strong{color:var(--green);font-family:Georgia,serif;font-size:38px;font-style:italic;font-weight:400}.lesson-hero h1{font-size:26px;font-weight:600;letter-spacing:-.6px}.lesson-hero p{margin-top:5px;color:#818b80;font-size:12px}.lesson-hero__meta{display:flex;flex-wrap:wrap;gap:17px;margin-top:13px}.lesson-hero__meta>span{display:inline-flex;align-items:center;gap:5px;color:#899287;font-size:9px}.lesson-hero__meta .completed-label{color:var(--green)}.lesson-layout{display:grid;grid-template-columns:minmax(0,1fr) 242px;gap:22px;align-items:start}.lesson-content{min-width:0;display:flex;flex-direction:column;gap:20px}.lesson-article{padding:28px 30px}.objective-box{display:flex;align-items:flex-start;gap:13px;padding:17px;border-radius:12px;background:var(--green-soft);color:var(--green)}.objective-box>div{display:flex;flex-direction:column;gap:5px}.objective-box span{font-size:9px;font-weight:600;letter-spacing:1px}.objective-box strong{font-size:12px;font-weight:500;line-height:1.7}.article-section{margin-top:26px}.article-section h2{margin-bottom:12px;font-size:16px;font-weight:600}.article-section>p{color:#68766f;font-size:12px;line-height:2}.key-points{display:grid;grid-template-columns:1fr 1fr;gap:9px}.key-points>div{display:flex;align-items:flex-start;gap:9px;padding:11px;border:1px solid #eceee7;border-radius:10px}.key-points span{width:20px;height:20px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#f0f1eb;color:#859189;font-size:8px}.key-points p{color:#6f7c75;font-size:10px;line-height:1.7}.mistake-box{margin-top:25px;padding:17px 19px;border-left:3px solid #dda07e;border-radius:0 10px 10px 0;background:#fbf3ed}.mistake-box__title{display:flex;align-items:center;gap:7px;color:#a4684b;font-size:11px}.mistake-box ul{margin:10px 0 0;padding-left:19px;color:#967c6e;font-size:10px;line-height:1.9}.lesson-tip{display:flex;gap:10px;margin-top:20px;color:#b19350}.lesson-tip p{color:#92998d;font-size:10px;line-height:1.8}.lesson-sidebar{position:sticky;top:20px;padding:21px 15px}.lesson-sidebar>.eyebrow{padding-left:8px}.lesson-outline{display:flex;flex-direction:column;gap:2px;margin-top:13px}.lesson-outline button{display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:6px;padding:9px 8px;border:0;border-radius:8px;background:none;color:#9aa29d;text-align:left;cursor:pointer}.lesson-outline button>span{font-size:8px}.lesson-outline button strong{overflow:hidden;font-size:9px;font-weight:500;text-overflow:ellipsis;white-space:nowrap}.lesson-outline button.is-current{background:var(--green-soft);color:var(--green)}.lesson-outline button:hover{background:#f2f3ed}.lesson-complete{display:flex;align-items:center;gap:12px;padding:23px 26px}.lesson-complete>div{flex:1}.lesson-complete h2{margin:5px 0;font-size:16px}.lesson-complete p{color:#959e98;font-size:9px;line-height:1.7}.practice-player{min-width:0;padding:27px 29px;border:1px solid var(--line);border-radius:18px;background:var(--paper);box-shadow:var(--shadow)}.practice-player__heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}.practice-player__heading h3{margin-top:6px;font-size:19px;font-weight:600}.live-dot{width:6px;height:6px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 3px var(--orange-soft)}.practice-player>.harmonica{max-width:760px;margin:0 auto 24px}.score-scroll{overflow-x:auto;padding:4px 2px 10px;scrollbar-width:thin;scrollbar-color:#d6dbd2 transparent}.score{display:flex;gap:7px;padding:8px 3px 12px}.score-note{position:relative;flex:0 0 56px;display:flex;flex-direction:column;align-items:center;padding:9px 4px 8px;border:1px solid #e7e9e1;border-radius:10px;background:#fafaf6;cursor:pointer;transition:.15s ease}.score-note:hover{border-color:#b9c9bd;transform:translateY(-2px)}.score-note.is-active{border-color:var(--orange);background:#fff5ec;box-shadow:0 4px 12px #db795724;transform:translateY(-3px)}.score-note.is-passed{background:#edf4ee;border-color:#d4e2d5}.score-note__pitch{color:#a1a9a3;font-size:7px}.score-note strong{margin:3px 0 1px;font-size:22px;line-height:1.1}.breath{display:inline-flex;align-items:center;justify-content:center;border-radius:4px;font-style:normal;font-weight:500}.score-note .breath{min-width:25px;padding:2px 5px;font-size:8px}.breath--blow{background:#e8f0e7;color:#3b7257}.breath--draw{background:#f7eadf;color:#b46d45}.score-note__beats{margin-top:5px;color:#b0b6b2;font-size:7px}.score-hint{color:#a3aba5;font-size:8px;text-align:center}.playback-controls{display:flex;align-items:center;gap:13px;margin:21px 0;padding:17px 0;border-top:1px solid #eceee7;border-bottom:1px solid #eceee7}.control-button{min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 15px;border:0;border-radius:9px;cursor:pointer;font-size:10px;font-weight:600}.control-button--primary{background:var(--green);color:#fff}.control-button--primary:hover{background:var(--green-dark)}.tempo-control{display:flex;align-items:center;gap:8px;margin-left:auto;color:#8e9892}.tempo-control>button{width:24px;height:24px;display:grid;place-items:center;padding:0;border:1px solid #e3e6de;border-radius:6px;background:#fafaf6;cursor:pointer}.tempo-control span{font-size:8px;white-space:nowrap}.tempo-control strong{color:#55665d;font-size:12px}.icon-text-button{display:inline-flex;align-items:center;gap:5px;padding:7px 9px;border:0;border-radius:7px;background:transparent;color:#939c96;font-size:9px;cursor:pointer}.icon-text-button.is-active{background:var(--green-soft);color:var(--green)}.micro-trainer{padding:19px;border-radius:13px;background:#f3f4ee;transition:background .18s ease}.micro-trainer.is-listening{background:#edf3ec}.micro-trainer__top{display:flex;align-items:center;justify-content:space-between;gap:15px}.micro-trainer__top p{margin-top:5px;color:#969f98;font-size:9px}.mic-button{min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 13px;border:1px solid #d8ded5;border-radius:9px;background:var(--paper);color:var(--green);cursor:pointer;font-size:10px;font-weight:600;white-space:nowrap}.mic-button.is-active{border-color:var(--green);background:var(--green);color:#fff}.detection-panel{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:center;margin-top:17px;padding-top:17px;border-top:1px solid #dfe5dc}.target-note,.detected-note{display:grid;grid-template-columns:auto auto;align-items:center;justify-content:start;gap:3px 9px;padding:11px 14px;border-radius:10px;background:#ffffffb3}.target-note>span,.detected-note>span{grid-column:1 / -1;color:#9aa49c;font-size:8px}.target-note>strong{grid-row:2 / 4;font-size:30px}.target-note>strong small{margin-left:2px;font-size:9px;font-weight:500}.target-note .breath{padding:3px 7px;font-size:8px}.target-note em,.detected-note em{color:#9aa49c;font-size:8px;font-style:normal}.detected-note>strong{grid-row:2 / 4;font-size:23px}.detected-note.is-correct{background:#e1eee0;color:#33704c}.detection-actions{display:flex;align-items:center;gap:6px}.detection-actions button{width:28px;height:28px;display:grid;place-items:center;padding:0;border:1px solid #dce2d9;border-radius:7px;background:#fff;color:#7f8d83;cursor:pointer}.detection-actions button:disabled{opacity:.35;cursor:default}.detection-actions span{color:#8b978e;font-size:8px;white-space:nowrap}.volume-track{grid-column:1 / -1;height:3px;overflow:hidden;border-radius:3px;background:#dfe5db}.volume-track span{display:block;height:100%;border-radius:inherit;background:var(--orange);transition:width 80ms linear}.complete-label{display:flex;align-items:center;gap:5px;color:var(--green);font-size:18px!important}.inline-message{margin-top:14px;padding:10px;border-radius:8px;font-size:9px;line-height:1.7}.inline-message--warning{background:#fff0e6;color:#a66a45}.practice-success{display:flex;align-items:center;gap:8px;margin-top:14px;color:var(--green);font-size:10px}.practice-success>span{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:#dce9dc}.practice-success button{margin-left:auto;border:0;background:none;color:var(--green);font-size:9px;text-decoration:underline;cursor:pointer}.practice-banner{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:31px;padding:29px 32px;border-radius:19px;background:var(--green);color:#fff}.practice-banner .eyebrow{color:#d8c18c}.practice-banner h2{margin:10px 0;font-size:23px;font-weight:500;line-height:1.55}.practice-banner p{color:#b0c0b6;font-size:10px}.practice-banner__steps{display:flex;align-items:center;gap:10px}.practice-banner__steps span{display:flex;flex-direction:column;gap:6px;color:#c0cec5;font-size:9px;text-align:center}.practice-banner__steps b{color:#eddbb3;font-family:Georgia,serif;font-size:24px;font-style:italic;font-weight:400}.practice-banner__steps i{width:28px;height:1px;background:#ffffff26}.practice-section{margin-top:27px}.practice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}.practice-card{overflow:hidden;padding:0;border:1px solid var(--line);border-radius:16px;background:var(--paper);text-align:left;cursor:pointer;box-shadow:var(--shadow);transition:.16s ease}.practice-card:hover{transform:translateY(-3px);box-shadow:0 12px 25px #1e372d17}.practice-card__art{position:relative;height:105px;display:flex;align-items:center;justify-content:center;background:#e4e9df;color:var(--green)}.practice-card__art--1{background:#eee4d5;color:#9a6f43}.practice-card__art--2{background:#e3e9e9;color:#4e7270}.practice-card__art>span{position:absolute;top:12px;left:12px;padding:4px 7px;border-radius:10px;background:#ffffff8c;font-size:8px}.practice-card__art>i{position:absolute;right:12px;bottom:-9px;color:#24362f14;font-family:Georgia,serif;font-size:62px}.practice-card__body{padding:17px}.practice-card__body>span{color:#a0a8a2;font-size:8px}.practice-card__body h3{margin:5px 0 16px;font-size:16px;font-weight:600}.practice-card__body>div{display:flex;align-items:center;gap:13px}.practice-card__body small{display:inline-flex;align-items:center;gap:4px;color:#9aa39d;font-size:8px}.round-play{width:31px;height:31px;display:grid;place-items:center;margin-left:auto;border-radius:50%;background:var(--green);color:#fff}.practice-detail>.practice-player{margin-bottom:18px}.related-lesson{width:100%;display:flex;align-items:center;gap:13px;padding:18px 22px;color:var(--green);text-align:left;cursor:pointer}.related-lesson>div{display:flex;flex:1;flex-direction:column;gap:4px}.related-lesson strong{font-size:11px}.related-lesson span{color:#929d96;font-size:9px}.tools-grid{display:grid;grid-template-columns:340px minmax(0,1fr);gap:20px;align-items:start}.metronome-card{overflow:hidden;border-radius:18px;background:var(--green);color:#fff;box-shadow:var(--shadow)}.metronome-visual{position:relative;height:205px;display:flex;justify-content:center;align-items:flex-end;background:radial-gradient(circle at 50% 100%,rgba(255,255,255,.08),transparent 70%)}.metronome-base{position:absolute;bottom:22px;width:150px;height:125px;clip-path:polygon(35% 0,65% 0,100% 100%,0 100%);background:linear-gradient(90deg,#d6bb86,#f0d9a9 48%,#bfa270);border-radius:8px}.metronome-base:after{content:"";position:absolute;inset:15px 36px 16px;clip-path:polygon(35% 0,65% 0,100% 100%,0 100%);background:#24473c}.metronome-pendulum{position:absolute;z-index:2;bottom:39px;left:calc(50% - 2px);width:4px;height:128px;border-radius:4px;background:#e8e5d9;transform-origin:50% 100%;transform:rotate(-19deg)}.metronome-pendulum>span{position:absolute;left:-8px;top:49px;width:20px;height:25px;border-radius:5px;background:#c6a56e;box-shadow:0 2px 5px #0003}.metronome-pendulum.is-playing{animation:pendulum 1s ease-in-out infinite alternate}@keyframes pendulum{0%{transform:rotate(-24deg)}to{transform:rotate(24deg)}}.metronome-content{padding:23px 27px 27px}.metronome-content .eyebrow{color:#b6c6bb}.metronome-bpm{display:flex;align-items:baseline;justify-content:center;gap:8px;margin:3px 0 8px}.metronome-bpm strong{font-family:Georgia,serif;font-size:52px;font-weight:400}.metronome-bpm span{color:#b8c6be;font-size:10px}.beat-dots{display:flex;justify-content:center;gap:9px;margin-bottom:19px}.beat-dots span{width:7px;height:7px;border-radius:50%;background:#ffffff2e}.beat-dots span.is-active{background:#e7bd72;box-shadow:0 0 0 4px #e7bd721f}.metronome-content input{width:100%;accent-color:#e3bc75;cursor:pointer}.metronome-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px}.metronome-actions>button:not(.control-button){width:36px;height:36px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);border-radius:9px;background:transparent;color:#fff;cursor:pointer}.metronome-actions .control-button--primary{background:#f3ead6;color:var(--green)}.tuning-guide{padding:25px}.tuning-guide>p{margin:9px 0 24px;color:#98a19b;font-size:9px}.current-reference{display:flex;align-items:center;gap:8px;margin:23px 0 15px;padding:12px 14px;border-radius:10px;background:var(--green-soft);color:var(--green)}.current-reference span{font-size:9px}.current-reference strong{margin-left:auto;font-size:10px}.hole-table{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.hole-table>div{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border:1px solid #e5e8df;border-radius:8px}.hole-table>div>strong{grid-column:1 / -1;padding:4px;background:#f2f3ed;color:#7e8a82;font-size:9px;text-align:center}.hole-table button{display:flex;flex-direction:column;gap:2px;padding:7px 3px;border:0;background:#fff;color:#68766e;font-size:8px;cursor:pointer}.hole-table button+button{border-left:1px solid #e5e8df}.hole-table button small{color:#a0a9a3;font-size:7px}.hole-table button.is-active{background:var(--orange-soft);color:#a65e3c}.tool-note{display:flex;gap:11px;margin-top:18px;padding:17px 20px;border:1px dashed #d6dbd1;border-radius:13px;color:#9b8c62}.tool-note strong{color:#7c887f;font-size:10px}.tool-note p{margin-top:4px;color:#969f98;font-size:9px;line-height:1.8}@media(max-width:1200px){.page-container{padding:30px 28px 50px}.topbar{padding:0 28px}.dashboard-grid{grid-template-columns:minmax(0,1fr) 245px;gap:18px}.continue-card__content{padding-left:26px}.stat-card{padding:13px;gap:8px}.stat-card>small{display:none}.course-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lesson-layout{grid-template-columns:minmax(0,1fr) 215px}.tools-grid{grid-template-columns:300px minmax(0,1fr)}}@media(max-width:1000px){.sidebar{width:198px;padding-inline:14px}.main-area{margin-left:198px}.brand{padding-left:5px}.brand strong{font-size:21px}.dashboard-grid{grid-template-columns:1fr}.dashboard-aside{display:grid;grid-template-columns:1fr 1fr}.tip-card{grid-column:1 / -1}.daily-goal-card{grid-row:span 2}.lesson-layout{grid-template-columns:1fr}.lesson-sidebar{display:none}.tools-grid{grid-template-columns:1fr}.metronome-card{display:grid;grid-template-columns:240px 1fr}.metronome-visual{height:100%;min-height:330px}.practice-banner{align-items:flex-start;flex-direction:column}.practice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.sidebar{inset:auto 0 0;width:100%;height:68px;padding:7px 12px calc(7px + env(safe-area-inset-bottom));border:0;border-top:1px solid var(--line);background:#fffefaf5;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.brand,.sidebar-bottom,.nav-caption{display:none}.main-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:0}.main-nav button{height:52px;flex-direction:column;justify-content:center;gap:3px;padding:0;border-radius:9px;font-size:9px}.main-nav button svg{width:19px}.main-nav button.is-active{background:var(--green-soft);color:var(--green);box-shadow:none}.main-nav button i{display:none}.main-area{margin-left:0;padding-bottom:70px}.topbar{height:62px;padding:0 20px}.mobile-brand{display:flex;align-items:center;gap:7px;border:0;background:none;color:var(--green)}.mobile-brand strong{letter-spacing:3px}.topbar__breadcrumb{display:none}.page-container{padding:25px 20px 35px}.page-header{margin-bottom:23px}.page-header h1{font-size:28px}.date-chip{display:none}.continue-card{grid-template-columns:1fr .8fr}.continue-card__visual .harmonica{width:150%}.floating-note--two{display:none}.lesson-hero{padding:22px}.lesson-hero__index{width:57px}.lesson-hero h1{font-size:23px}.course-overview__progress{display:none}.practice-player{padding:23px 20px}.detection-panel{grid-template-columns:1fr 1fr}.detection-actions{grid-column:1 / -1;justify-content:center}.harmonica{padding-inline:10px}.harmonica__holes{gap:3px}.harmonica-hole__notes{font-size:6px}}@media(max-width:540px){.page-container{padding-inline:15px}.topbar{padding-inline:16px}.instrument-chip>div{display:none}.instrument-chip strong{font-size:9px}.continue-card{min-height:270px;grid-template-columns:1fr}.continue-card__content{padding:27px}.continue-card__content h2{font-size:27px}.continue-card__visual{display:none}.stats-grid{display:flex;gap:7px}.stat-card{width:0;min-width:0;flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:7px;padding:12px 10px}.stat-icon{width:31px;height:31px}.stat-icon svg{width:17px}.stat-card strong{font-size:17px}.stat-card strong small{display:block;margin:3px 0 0;font-size:8px}.stat-card>div>span{font-size:8px}.learning-path{padding:20px 16px 8px}.section-heading h2{font-size:16px}.lesson-row{gap:9px}.lesson-row__meta,.current-tag{display:none}.dashboard-aside{grid-template-columns:1fr}.daily-goal-card{grid-row:auto}.tip-card{grid-column:auto}.course-overview{align-items:flex-start;padding:20px}.course-overview__icon{width:44px;height:44px}.course-overview h2{font-size:14px;line-height:1.6}.course-overview p{line-height:1.7}.course-card-grid,.practice-grid{grid-template-columns:1fr}.course-card{min-height:172px}.lesson-hero{align-items:flex-start;gap:14px;padding:19px 16px}.lesson-hero__index{width:43px;height:68px}.lesson-hero__index strong{font-size:30px}.lesson-hero h1{font-size:20px}.lesson-hero p{font-size:10px}.lesson-hero__meta{gap:9px}.lesson-article{padding:21px 17px}.key-points{grid-template-columns:1fr}.lesson-complete{align-items:stretch;flex-direction:column}.practice-player__heading{align-items:flex-start}.practice-player__heading h3{font-size:16px}.practice-player>.harmonica{margin-bottom:17px}.harmonica__brand{left:17px;right:17px}.harmonica-hole__number{font-size:8px}.harmonica-hole__opening{height:38px}.harmonica-hole__notes{display:none}.playback-controls{flex-wrap:wrap;gap:9px}.tempo-control{margin-left:0}.icon-text-button{margin-left:auto}.micro-trainer{padding:15px}.micro-trainer__top{align-items:stretch;flex-direction:column}.mic-button{width:100%}.target-note,.detected-note{padding:10px}.target-note>strong{font-size:25px}.detected-note>strong{font-size:18px}.practice-success{align-items:flex-start;flex-wrap:wrap}.practice-banner{padding:24px}.practice-banner h2{font-size:20px}.practice-banner__steps{width:100%;justify-content:space-between}.practice-banner__steps i{flex:1}.metronome-card{display:block}.metronome-visual{height:185px;min-height:0}.tuning-guide{padding:20px 14px}.hole-table{grid-template-columns:repeat(2,1fr)}.current-reference{flex-wrap:wrap}.current-reference strong{width:100%;margin:2px 0 0 27px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}