.noya{display:inline-flex;width:min(100%,440px);align-items:center;gap:16px;color:#3f4249;margin-bottom:-2px;animation:noya-fade-in .32s ease-out}.noya-avatar{position:relative;display:grid;flex:0 0 auto;width:112px;aspect-ratio:1;place-items:center}.noya-large{width:min(100%,520px)}.noya-large .noya-avatar{width:clamp(126px,30vw,170px)}.noya-hero{display:grid;justify-items:center;width:100%;text-align:center}.noya-hero .noya-avatar{width:clamp(170px,46vw,260px)}@media(max-width:420px){.noya{gap:12px}.noya-avatar{width:96px}.noya p{font-size:14px}}.noya-avatar:after{position:absolute;top:5px;right:5px;bottom:5px;left:5px;z-index:-1;border-radius:34px;background:#f3c64e38;content:"";opacity:0}.noya img{display:block;width:100%;height:auto;filter:drop-shadow(0 10px 18px rgba(17,17,20,.08))}.noya p{margin:0;color:#5d6068;font-size:16px;font-weight:800;line-height:1.45}.noya.motion-welcome img{animation:noya-wave 1.3s ease-in-out infinite}.noya.motion-welcome .noya-avatar{animation:noya-breathe 2.4s ease-in-out infinite}.noya.motion-correct img{animation:noya-bounce .62s cubic-bezier(.18,.9,.22,1.18)}.noya.motion-incorrect img,.noya.thinking img{animation:noya-tilt 1.7s ease-in-out infinite}.noya.complete .noya-avatar:after{animation:noya-glow 1.4s ease-in-out infinite}.noya.motion-complete img{animation:noya-complete 1.2s cubic-bezier(.18,.9,.22,1.18)}@keyframes noya-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes noya-wave{0%,to{transform:rotate(0) translateY(0)}35%{transform:rotate(-7deg) translateY(-4px)}70%{transform:rotate(5deg) translateY(0)}}@keyframes noya-breathe{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.025)}}@keyframes noya-bounce{0%{transform:scale(1)}22%{transform:translateY(-4px) scale(1.04,.92)}42%{transform:translateY(-18px) scale(1.14,1.06)}to{transform:translateY(0) scale(1)}}@keyframes noya-tilt{0%,to{transform:rotate(-5deg)}50%{transform:rotate(7deg)}}@keyframes noya-glow{0%,to{opacity:.28;transform:scale(.92)}50%{opacity:1;transform:scale(1.2)}}@keyframes noya-complete{0%{transform:rotate(0) scale(.92)}55%{transform:rotate(12deg) scale(1.14)}to{transform:rotate(360deg) scale(1.04)}}@media(prefers-reduced-motion:reduce){.noya,.noya img,.noya-avatar:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}.course-app{min-height:100vh;background:#f7f5f0;color:#243b42;font-family:system-ui,-apple-system,sans-serif}.course-app main{max-width:1120px;margin:auto;padding:24px}.course-app button,.course-app input,.course-app select{font:inherit}.course-app button{min-height:44px;border:1px solid #ced7d3;border-radius:12px;padding:10px 18px;background:#fff;color:#243b42;cursor:pointer}.course-app button:disabled{cursor:default;opacity:.6}.course-app button:focus-visible,.course-app input:focus-visible,.course-app select:focus-visible{outline:3px solid #a04d19;outline-offset:3px}.course-app button[aria-pressed=true]{background:#d4e8df;border:2px solid #1e6652}.course-app .primary{background:#235e4b;color:#fff;margin-top:16px}.topbar{display:flex;align-items:center;gap:18px;padding:16px 28px;border-bottom:1px solid #dce1db;background:#fffdf9}.topbar span{margin-left:auto}.topbar .brand{font-weight:750;border:0;background:none;font-size:20px}.notice{background:#fff0d5;border-radius:12px;padding:14px;font-size:14px}.hero{padding:40px 0 28px}.eyebrow{color:#386757;font-size:13px;letter-spacing:.08em;font-weight:700}.hero h1{font-size:clamp(32px,5vw,54px);line-height:1.15;letter-spacing:-.035em;max-width:800px}.hero .noya{max-width:480px}.stats{display:flex;gap:32px;margin-top:20px}.stats span{display:grid;gap:5px;font-size:14px}.stats strong{font-size:32px}.filters{display:flex;gap:16px;flex-wrap:wrap;padding:20px 0}.filters label,.auth label{display:grid;gap:7px}.course-app input,.course-app select{padding:11px;border:1px solid #b9c8bf;border-radius:10px;background:#fff;min-width:140px}.lesson-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.course-app .lesson-tile{text-align:left;min-height:185px;padding:22px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}.lesson-tile h3{margin:8px 0;font-size:20px}.lesson-tile p{font-size:14px;margin:0 0 12px}.lesson-tile small{margin-top:8px}.syncbar,.lesson-nav{display:flex;gap:12px;align-items:center;justify-content:space-between;margin:16px 0}.syncbar{font-size:13px}.lesson-player,.auth{max-width:800px;padding:32px;background:#fff;border-radius:24px;margin:20px auto;border:1px solid #e1e6de}.lesson-player h1{font-size:32px}.lesson-player progress{width:100%;height:8px;accent-color:#235e4b}.lesson-player .noya{margin:16px 0}.teaching p{font-size:19px;line-height:1.85}.staff-wrap svg{width:100%;display:block;max-height:230px;background:#fcfbf8;border-radius:12px;margin:18px 0}.audio-actions,.options,.placement{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.question h3{font-size:24px}.good,.retry{padding:16px;background:#edf6ed;border-radius:12px}.retry{background:#fff0d5}.auth{display:grid;gap:16px;max-width:500px}.auth p{line-height:1.6}.course-app footer{padding:32px;text-align:center;color:#50635e;font-size:13px}@media(max-width:760px){.lesson-grid{grid-template-columns:repeat(2,1fr)}.topbar{padding:12px;gap:8px;flex-wrap:wrap}.topbar span{font-size:13px}.course-app main{padding:16px}.lesson-player{padding:20px}.filters label{flex:1}.filters input,.filters select{width:100%}}@media(max-width:430px){.lesson-grid{grid-template-columns:1fr}.topbar .brand{font-size:18px}.lesson-nav{flex-wrap:wrap}.stats{gap:20px}.lesson-player h1{font-size:27px}}.records{background:#fff;border-radius:18px;padding:20px;margin:20px 0}.record-table{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:12px;border-bottom:1px solid #dde4dc;white-space:nowrap}.syncbar{flex-wrap:wrap}.learning-hint,.lesson-reference{border:1px solid #d6e3d9;background:#f3f8f1;border-radius:12px;padding:12px 16px;margin:16px 0}.learning-hint summary,.lesson-reference summary{cursor:pointer;font-weight:650;min-height:30px}.learning-hint p,.lesson-reference p{line-height:1.8}.teaching .teaching-step{font-size:14px;color:#526d60;margin-bottom:12px}.placement-help{font-size:14px;line-height:1.6;color:#456052}.options button:has(.staff-wrap){min-width:180px;flex:1;max-width:100%}.options .staff-wrap svg{margin:0;max-height:140px}.rhythm-puzzle{padding:16px;background:#f3f8f1;border-radius:14px}.beat-slots{display:flex;gap:5px;margin:16px 0}.beat-slots span{flex:1;text-align:center;border:1px dashed #91a899;border-radius:6px;padding:14px 4px}.beat-slots .fixed{background:#d4e0d7}.beat-slots .added{background:#9bccb2}.rhythm-puzzle button{margin-right:8px}.session-plan{background:#eef5ed;border-radius:14px;padding:16px;margin:16px 0}.session-stages{display:flex;flex-wrap:wrap;gap:8px;font-size:13px}.session-stages span{padding:7px;background:#fff;border-radius:8px}.question-phase{color:#36644f;font-weight:650}.audio-status{font-size:14px;color:#466b5a}.teaching-music{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:16px 0;color:#64766b}.reward-celebration{position:relative;isolation:isolate;overflow:hidden;border-radius:24px;margin:18px 0;padding:20px;background:linear-gradient(135deg,#fff3cb,#e6f4ee);text-align:center;border:1px solid #ead8a0}.reward-celebration .noya-avatar{width:120px}.reward-perfect{padding:32px 20px;background:radial-gradient(circle at 50% 40%,#fff9d7,#e0f3ec)}.reward-perfect .noya-avatar{width:180px}.reward-celebration .noya.motion-complete img{animation:reward-hop 1.1s ease-in-out 3}.reward-ten .noya.motion-complete img{animation:reward-dance 1.2s ease-in-out 3}.reward-perfect .noya.motion-complete img{animation:reward-dance 1.2s ease-in-out 5}.reward-stars{color:#bd8729;font-size:28px;animation:reward-sparkle 1s ease-in-out 4}.reward-confetti{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none}.reward-confetti i{position:absolute;top:-16px;width:9px;height:14px;border-radius:3px;animation:reward-fall 2.7s ease-in 2 both}@keyframes reward-hop{0%,to{transform:translateY(0) rotate(-5deg)}45%{transform:translateY(-20px) rotate(8deg) scale(1.08)}}@keyframes reward-dance{0%,to{transform:rotate(-9deg) scale(1)}30%{transform:translateY(-16px) rotate(10deg) scale(1.08)}70%{transform:rotate(-12deg) scale(1.04)}}@keyframes reward-sparkle{50%{opacity:.6;transform:scale(1.15)}}@keyframes reward-fall{to{top:105%;transform:rotate(260deg)}}@media(prefers-reduced-motion:reduce){.reward-celebration *,.reward-celebration .noya.motion-complete img{animation:none!important}.reward-confetti i{top:20%}}.rhythm-notation{width:100%;overflow-x:auto;border-radius:12px;background:#fbfaf7;margin:8px 0}.rhythm-notation svg{display:block;width:100%;min-width:290px;max-height:190px}.options .rhythm-notation svg{min-width:0;height:85px}.rhythm-builder .options{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.paired-staves{display:grid;gap:8px}.creator-credit{color:#66766f;font-size:14px;letter-spacing:.06em;padding:16px 0 22px}.account-nav{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 20px}.teacher-panel{max-width:1000px;margin:auto}.student-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin:24px 0}.student-card,.student-detail{padding:22px;border:1px solid #d9e2dc;border-radius:18px;background:#fff}.student-card button{margin:4px 8px 4px 0}.student-detail table{width:100%;text-align:left;border-collapse:collapse}.student-detail td,.student-detail th{padding:12px;border-bottom:1px solid #e4ebe6}:root{color:#111114;background:#f7f7f4;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,SF Pro Display,SF Pro Text,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button{border:0;font:inherit}button:focus-visible{outline:3px solid rgba(0,122,255,.35);outline-offset:3px}.app-shell{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:18px}.lesson-stage{display:grid;width:min(100%,640px);min-height:min(780px,calc(100vh - 36px));grid-template-rows:auto 1fr;gap:18px}.lesson-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:2px 4px}.lesson-title{margin:0;color:#5d5f66;font-size:15px;font-weight:700}.lesson-count{margin:4px 0 0;color:#8a8c92;font-size:13px;font-weight:700}.progress-wrap{display:grid;width:min(48vw,210px);gap:8px}.progress-bar{overflow:hidden;height:10px;border-radius:999px;background:#ddded9}.progress-bar span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f3c64e,#111114);transition:width .28s ease}.progress-dots{display:grid;grid-template-columns:repeat(var(--progress-count, 8),1fr);gap:6px}.progress-dot{height:8px;border-radius:999px;background:#ddded9}.progress-dot.active{background:#111114}.card-transition{display:grid}.lesson-card{display:grid;min-height:100%;grid-template-rows:1fr auto;gap:24px;border:1px solid rgba(20,20,24,.08);border-radius:8px;background:#ffffffd1;box-shadow:0 24px 70px #1e1f2314;padding:clamp(24px,7vw,56px);animation:card-in .26s ease-out}.card-content{display:flex;min-height:0;flex-direction:column;justify-content:center;gap:22px}.eyebrow{margin:0 0 -10px;color:#6f7178;font-size:14px;font-weight:800;letter-spacing:0}h1{margin:0;max-width:14ch;font-size:clamp(34px,8vw,58px);font-weight:800;letter-spacing:0;line-height:1.08}.lead-text{margin:0;color:#4b4d54;font-size:clamp(20px,5vw,28px);line-height:1.45}.body-text{max-width:34rem;margin:0;color:#5f6269;font-size:clamp(17px,4.3vw,21px);font-weight:650;line-height:1.7}.card-actions{display:grid;gap:12px}.primary-button,.secondary-button,.small-button,.choice-button{min-height:58px;cursor:pointer;border-radius:8px;font-weight:800;transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease}.primary-button{color:#fff;background:#111114;box-shadow:0 12px 24px #1111142e}.secondary-button{color:#111114;background:#e9e9e4}.small-button{min-height:42px;padding:0 18px;color:#111114;background:#e9e9e4;font-size:14px}.primary-button:hover:not(:disabled),.secondary-button:hover:not(:disabled),.small-button:hover:not(:disabled),.choice-button:hover:not(:disabled){transform:translateY(-1px)}.primary-button:active:not(:disabled),.secondary-button:active:not(:disabled),.small-button:active:not(:disabled),.choice-button:active:not(:disabled){transform:translateY(0)}.primary-button:disabled{cursor:not-allowed;background:#c9cbc6;box-shadow:none}.sound-orb{display:grid;width:min(58vw,250px);aspect-ratio:1;place-items:center;border-radius:50%;color:#111114;background:radial-gradient(circle at 34% 28%,#ffffff 0 12%,transparent 13%),linear-gradient(145deg,#f1f1ed,#dedfd8);box-shadow:inset 0 0 0 1px #1414180f;font-size:42px;font-weight:850}.choice-grid{display:grid;gap:12px}.two-column,.three-column{grid-template-columns:1fr}.choice-button{width:100%;border:1px solid rgba(20,20,24,.1);color:#17181b;background:#f2f2ef;box-shadow:inset 0 -2px #1414180d}.choice-button.correct{border-color:#f3c64eb8;color:#5f4700;background:#fff2bf}.choice-button.incorrect{border-color:#d64d536b;color:#8f1f2a;background:#fae2e3}.feedback{min-height:30px;margin:-6px 0 0;font-size:17px;font-weight:800;line-height:1.45}.feedback.correct{color:#8a6500}.feedback.incorrect{color:#b3333a}.staff-graphic,.notes-graphic,.story-illustration,.learn-visual{width:100%;max-height:220px}.story-card .card-content{justify-content:start}.story-card h1{max-width:11ch;font-size:clamp(34px,8vw,54px)}.story-illustration{max-height:none;aspect-ratio:420 / 260;border-radius:8px;box-shadow:inset 0 0 0 1px #1111140d}.story-card{background:#fffdf8}.story-card .card-content{justify-content:center;gap:18px}.learn-visual{max-height:260px;border-radius:8px}.noya-welcome-card{background:#fffdf8}.noya-welcome-card .card-content{justify-content:center}.noya-welcome-card h1{max-width:11ch}.noya-book-scene{width:100%;max-height:260px;border-radius:8px}.svg-label{fill:#5d5f66;font:800 18px system-ui}.challenge-list{display:grid;gap:14px}.challenge-item{display:grid;gap:10px;border-top:1px solid rgba(20,20,24,.08);padding-top:14px}.challenge-item:first-child{border-top:0;padding-top:0}.challenge-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:20px;font-weight:850}.compact .choice-button{min-height:48px;font-size:14px}.completion-title{margin:0;color:#24262b;font-size:clamp(22px,5.6vw,34px);font-weight:850;line-height:1.35}.learned-list{display:grid;gap:10px;color:#3d4047;font-size:clamp(18px,4.6vw,24px);font-weight:700}.learned-list p{margin:0}.floating-notes{position:relative;display:flex;min-height:54px;align-items:center;gap:18px;color:#f3c64e;font-size:clamp(26px,7vw,42px);font-weight:900}.floating-notes span{display:inline-block;animation:float-note 2.6s ease-in-out infinite}.floating-notes span:nth-child(2){color:#111114;animation-delay:.18s}.floating-notes span:nth-child(3){color:#7f858f;animation-delay:.36s}.reward-panel{display:grid;gap:8px;border:1px solid rgba(243,198,78,.48);border-radius:8px;background:#fff7d7;padding:18px;color:#5f4700;font-size:clamp(18px,4.5vw,23px);font-weight:850;line-height:1.35}.reward-panel p{margin:0}.celebration{position:relative;overflow:hidden;place-items:center;min-height:290px;text-align:center;animation:scale-in .36s cubic-bezier(.2,.9,.2,1.2)}.badge-pop{display:grid;width:118px;aspect-ratio:1;place-items:center;border-radius:50%;background:#fff;box-shadow:0 18px 36px #16653629,inset 0 0 0 1px #16653614;font-size:64px;animation:badge-pop .52s cubic-bezier(.18,.92,.22,1.25)}.reward-stars{position:absolute;top:18px;right:18px;bottom:18px;left:18px;pointer-events:none}.reward-stars span{position:absolute;color:#f3b700;font-size:28px;animation:twinkle 1.4s ease-in-out infinite}.reward-stars span:nth-child(1){left:16%;top:22%}.reward-stars span:nth-child(2){right:18%;top:14%;animation-delay:.18s}.reward-stars span:nth-child(3){right:26%;bottom:18%;animation-delay:.36s}@keyframes card-in{0%{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes float-note{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes scale-in{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}@keyframes badge-pop{0%{transform:translateY(16px) scale(.72)}70%{transform:translateY(-4px) scale(1.06)}to{transform:translateY(0) scale(1)}}@keyframes twinkle{0%,to{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.18)}}@media(min-width:560px){.app-shell{padding:28px}.lesson-stage{min-height:min(760px,calc(100vh - 56px))}.card-actions,.two-column{grid-template-columns:repeat(2,minmax(0,1fr))}.three-column{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}