:root{--ground: #f7f8f6;--surface: #f3f1ea;--card: #ffffff;--ink: #1d1b16;--muted: #5c5a52;--line: #e6e1d4;--track: #e6e1d4;--path: #c4b896;--shade: rgba(29, 27, 22, .12);--forest: #0f7a5c;--forest-dark: #0a5c45;--forest-tint: #e1f3eb;--laterite: #e2572b;--laterite-dark: #b23f19;--laterite-tint: #fde8df;--sun: #f5b82e;--sun-dark: #c9890f;--sun-tint: #fff4d6;--river: #2f7fd8;--hide: #f1e2c4;--blush: #f29a8a;--good-bg: #e1f3eb;--good-ink: #0b4a37;--near-bg: #fff4d6;--near-ink: #5b3a06;--miss-bg: #fde8df;--miss-ink: #6a1a12;--pill-positive-bg: #dcf5e7;--pill-positive-ink: #0b4a37;--pill-warning-bg: #fff4d6;--pill-warning-ink: #7a4b05;--pill-neutral-bg: #efece3;--pill-neutral-ink: #3d3b35;--negative: #b42318;--positive: #1f7a3a;--radius: 22px;--radius-sm: 14px;--gap: 16px;--sidebar: 240px;--sans: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;--bas: "Gentium Book Plus", "Gentium Plus", "Charis SIL", "Noto Serif", "Times New Roman", serif;--spring: cubic-bezier(.34, 1.56, .64, 1);--ease-out: cubic-bezier(.22, 1, .36, 1);--t-fast: .14s;--t-med: .28s}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--ground);color:var(--ink);font:600 16px / 1.5 var(--sans);-webkit-font-smoothing:antialiased}h1,h2,h3,p,ol,ul,dl,dd{margin:0}h1,h2,h3{font-weight:900;letter-spacing:-.01em}ol,ul{padding:0;list-style:none}a{color:var(--forest);text-underline-offset:3px}button,input,select{font:inherit;color:inherit}button{cursor:pointer;touch-action:manipulation}:focus-visible{outline:3px solid var(--river);outline-offset:2px;border-radius:8px}::selection{background:var(--sun-tint)}.num{font-variant-numeric:tabular-nums}.muted{color:var(--muted)}.small{font-size:14px}.strong{font-weight:700}.bas{font-family:var(--bas);font-weight:700}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.icon{flex:none}.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:8px;z-index:100}.skip:focus{left:8px}.shell{min-height:100dvh;display:grid;grid-template-columns:var(--sidebar) 1fr}.sidebar{position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;gap:4px;padding:24px 12px 20px;border-right:2px solid var(--line);background:var(--ground)}.wordmark{display:inline-flex;align-items:center;gap:8px;font-weight:900;font-size:20px;color:var(--ink);text-decoration:none;padding:0 10px;letter-spacing:-.02em}.wordmark-drum{display:inline-flex;margin-top:-4px}.wordmark-drum .mascot-shadow{display:none}.course-switch{display:flex;flex-direction:column;margin:16px 0 18px;padding:10px 14px;border-radius:var(--radius-sm);background:var(--forest-tint);border:2px solid #c6e6d7}.course-name{font-family:var(--bas);font-size:20px;font-weight:700;color:var(--forest-dark)}.course-sub{font-size:13px;color:var(--muted)}.nav{display:flex;flex-direction:column;gap:4px}.nav-item{display:flex;align-items:center;gap:12px;min-height:46px;padding:0 14px;border-radius:14px;color:var(--muted);text-decoration:none;font-weight:800;font-size:15px;border:2px solid transparent;transition:background var(--t-fast),color var(--t-fast),transform var(--t-fast) var(--spring)}.nav-item:hover{background:var(--surface);color:var(--ink);transform:translate(2px)}.nav-item[aria-current=page]{background:var(--sun-tint);border-color:#f3d98f;color:var(--ink)}.nav-foot{margin-top:auto;display:flex;flex-direction:column;gap:8px}.side-level{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;background:var(--surface);font-size:14px}.topbar,.tabbar{display:none}.canvas{padding:32px 32px 96px;outline:none;min-width:0}.banner{max-width:1160px;margin:0 auto 24px;padding:12px 16px;border-radius:12px;background:var(--pill-warning-bg);color:var(--pill-warning-ink)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:16px;border:0;font-weight:900;font-size:15px;text-decoration:none;white-space:nowrap;letter-spacing:.01em;transition:transform var(--t-fast) var(--spring),background var(--t-fast),box-shadow var(--t-fast),opacity var(--t-fast)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--forest);color:#fff}.btn-quiet{background:var(--card);color:var(--ink);border:2px solid var(--line)}.btn-quiet:hover{background:var(--surface)}.btn-lg{min-height:52px;padding:0 28px;font-size:17px}.btn-game{box-shadow:0 5px 0 var(--forest-dark)}.btn-game:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 0 var(--forest-dark)}.btn-game:active:not(:disabled){transform:translateY(4px);box-shadow:0 1px 0 var(--forest-dark)}.btn-game:disabled{box-shadow:0 5px #cfc8b6;background:var(--track);color:#5f5b50;opacity:1}.btn-game-quiet{box-shadow:0 4px 0 var(--line)}.btn-game-quiet:active{transform:translateY(3px);box-shadow:0 1px 0 var(--line)}.btn-danger{background:var(--negative);color:#fff}.btn-text-danger{background:none;color:var(--negative);padding:0;min-height:44px}.btn-link{background:none;border:0;padding:4px 0;color:var(--forest);display:inline-flex;align-items:center;gap:4px;min-height:36px;font-weight:800}.btn-link:hover{text-decoration:underline;text-underline-offset:3px}.btn-row{display:flex;gap:10px;flex-wrap:wrap}.icon-btn{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;color:var(--ink);flex:none;transition:background var(--t-fast),transform var(--t-fast) var(--spring)}.icon-btn:hover{background:var(--surface)}.icon-btn:active{transform:scale(.9)}.chip{display:inline-flex;align-items:center;gap:4px;height:34px;padding:0 12px;border-radius:999px;font-weight:900;font-size:15px}.chip-xp{background:var(--sun-tint);color:#6b4a00}.top-stats{display:inline-flex;align-items:center;gap:4px}.level-ring{position:relative;display:inline-grid;place-items:center;flex:none}.level-ring svg{position:absolute;top:0;right:0;bottom:0;left:0}.level-ring-fill{transition:stroke-dashoffset .9s var(--ease-out)}.level-ring-n{position:relative;font-weight:900;font-size:1.05em}.star{flex:none}.star path{fill:var(--track)}.star.on path{fill:var(--sun);stroke:var(--sun-dark);stroke-width:1}.card{background:var(--card);border:2px solid var(--line);border-radius:var(--radius);padding:18px;min-width:0}.card h2{font-size:17px;margin-bottom:10px;display:flex;align-items:center;justify-content:space-between;gap:8px}.panel-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}.panel-head h2{margin:0}.count{font-size:13px;padding:2px 10px;border-radius:999px;background:var(--surface);color:var(--muted);font-variant-numeric:tabular-nums}.empty{color:var(--muted);padding:12px 0}.pill{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:800;flex:none}.pill-positive{background:var(--pill-positive-bg);color:var(--pill-positive-ink)}.pill-warning{background:var(--pill-warning-bg);color:var(--pill-warning-ink)}.pill-neutral{background:var(--pill-neutral-bg);color:var(--pill-neutral-ink)}.play-btn{width:46px;height:46px;flex:none;display:grid;place-items:center;border-radius:14px;border:0;background:var(--river);color:#fff;box-shadow:0 4px #1f5ea6;transition:transform var(--t-fast) var(--spring),box-shadow var(--t-fast)}.play-btn:hover{transform:translateY(-1px) scale(1.04)}.play-btn:active{transform:translateY(3px);box-shadow:0 1px #1f5ea6}.play-btn.play-drum{background:var(--laterite);box-shadow:0 4px 0 var(--laterite-dark)}.play-btn.playing .wave{animation:wave .7s ease-in-out infinite}.play-btn.playing .w2{animation-delay:.15s}@keyframes wave{0%,to{opacity:.3}50%{opacity:1}}.home{max-width:1160px;margin:0 auto}.hero-card{display:flex;align-items:center;gap:20px;padding:20px 24px;border-radius:28px;background:var(--forest);color:#fff;margin-bottom:24px;overflow:hidden;position:relative}.hero-card:after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:#ffffff0f}.hero-card .mascot{flex:none}.hero-text{display:flex;flex-direction:column;gap:6px;align-items:flex-start;position:relative;z-index:1}.hero-text h1{font-size:30px;line-height:1.15}.hero-text p{opacity:.92;max-width:56ch}.hero-text strong{color:#fff;text-decoration:underline;text-decoration-color:var(--sun);text-decoration-thickness:3px;text-underline-offset:4px}.hero-text .btn-game{margin-top:8px;background:var(--sun);color:var(--ink);box-shadow:0 5px 0 var(--sun-dark)}.hero-text .btn-game:hover{box-shadow:0 6px 0 var(--sun-dark)}.hero-text .btn-game:active{box-shadow:0 1px 0 var(--sun-dark)}.home-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start}.map{min-width:0}.map-title{font-size:24px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:8px 0 12px}.map-sub{font-size:15px;font-weight:700;color:var(--muted)}.trail{position:relative;width:min(440px,100%);margin:0 auto 32px}.trail-line{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible}.trail-dash{animation:march 1.6s linear infinite}@keyframes march{to{stroke-dashoffset:-28}}.trail-stop{position:absolute;display:flex;flex-direction:column;align-items:center;width:150px;transform:translate(-50%,-40px);animation:pop-stop .52s var(--spring) both}.node{position:relative;width:80px;height:80px;border-radius:50%;display:grid;place-items:center;background:var(--card);border:3px solid var(--line);box-shadow:0 6px 0 var(--line);transition:transform var(--t-fast) var(--spring),box-shadow var(--t-fast)}.node:hover{transform:translateY(-3px) scale(1.04)}.node:active{transform:translateY(4px);box-shadow:0 2px 0 var(--line)}.node.done{background:var(--sun-tint);border-color:var(--sun);box-shadow:0 6px 0 var(--sun-dark)}.node.next{background:var(--forest-tint);border-color:var(--forest);box-shadow:0 6px 0 var(--forest-dark);animation:bob 2s ease-in-out infinite}.node.next:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;border:3px solid var(--forest);animation:ping 2s var(--ease-out) infinite;pointer-events:none}.node-lab:not(.done):not(.next){border-style:dashed}.node-stars{display:inline-flex;gap:2px;margin-top:8px}.node-label{font-size:14px;font-weight:900;text-align:center;line-height:1.2;margin-top:2px;background:var(--ground);padding:0 6px;border-radius:6px}.go-tag{position:absolute;top:-34px;background:var(--ink);color:#fff;font-size:12px;font-weight:900;padding:4px 10px;border-radius:10px;white-space:nowrap;animation:bob 2s ease-in-out infinite;z-index:1}.go-tag:after{content:"";position:absolute;left:50%;bottom:-5px;margin-left:-5px;border:5px solid transparent;border-bottom:0;border-top-color:var(--ink)}.rail{display:flex;flex-direction:column;gap:14px;position:sticky;top:24px}.level-card{display:flex;align-items:center;gap:14px}.level-card h2{margin-bottom:6px}.level-card>div{flex:1;min-width:0}.level-card .level-ring-n{font-size:22px}.xp-bar,.quest-bar{display:block;height:12px;border-radius:12px;background:var(--track);overflow:hidden;margin-bottom:6px}.xp-bar>span,.quest-bar>span{display:block;height:100%;border-radius:12px;background:var(--sun);transform-origin:left;transition:transform .8s var(--ease-out)}.quests{display:flex;flex-direction:column;gap:12px;margin-bottom:10px}.quest-top{display:flex;justify-content:space-between;gap:8px;font-size:15px;margin-bottom:4px}.quest-bar>span{background:var(--forest)}.quest.done .quest-top{color:var(--forest-dark)}.quest.done .quest-bar>span{background:var(--sun)}.week{display:flex;gap:6px}.dot{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:900;color:var(--muted);background:var(--surface)}.dot.on{background:var(--laterite);color:#fff;animation:pop .4s var(--spring) both}.dot.today{outline:2px solid var(--ink);outline-offset:-2px}.wod-row{display:flex;align-items:center;gap:12px}.wod-word{display:block;font-size:26px;line-height:1.1}.wod-en{display:block;color:var(--muted)}.badges{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.badge{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.badge-art{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--surface);filter:grayscale(1);opacity:.45}.badge-art.earned{filter:none;opacity:1;background:var(--sun-tint);box-shadow:0 4px 0 var(--sun)}.badge-name{font-size:11px;font-weight:800;line-height:1.2;color:var(--muted)}.badge.earned .badge-name{color:var(--ink)}.page{max-width:1160px;margin:0 auto}.crumb{font-size:14px;color:var(--muted);margin-bottom:14px}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:24px}.page-head h1{font-size:32px;line-height:1.15}.lede{margin-top:6px;color:var(--muted);max-width:60ch;font-size:17px}.unit-hero{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;padding:22px 24px;border-radius:28px;margin-bottom:20px;background:var(--sun-tint);border:3px solid #f3d98f}.unit-hero-lab{background:var(--laterite-tint);border-color:#f6c6b3}.unit-hero-icon{width:104px;height:104px;border-radius:50%;display:grid;place-items:center;background:var(--card);box-shadow:0 6px 0 var(--shade);animation:bob 2.4s ease-in-out infinite}.unit-hero-text h1{font-size:32px;line-height:1.1}.unit-hero-meta{display:flex;align-items:center;gap:12px;margin-top:10px}.unit-body{display:grid;grid-template-columns:7fr 5fr;gap:var(--gap);align-items:start}.phrases{display:flex;flex-direction:column}.phrase{display:flex;align-items:center;gap:14px;padding:10px 0;border-bottom:2px solid var(--surface);animation:rise .38s var(--ease-out) both}.phrase:last-child{border-bottom:0}.phrase-text{display:flex;flex-direction:column;flex:1;min-width:0}.phrase-text .bas{font-size:21px;line-height:1.25;overflow-wrap:anywhere}.phrase-en{color:var(--muted);font-size:15px}.phrase-src{font-size:13px}.guide{display:flex;flex-direction:column;gap:12px}.guide>h2{font-size:17px}.guide-note{background:var(--card);border:2px solid var(--line);border-radius:var(--radius);padding:18px}.guide-note h3{font-size:17px;margin-bottom:6px}.guide-note p{font-size:15px;line-height:1.6;font-weight:600}.filters{display:flex;gap:12px;margin-bottom:var(--gap);flex-wrap:wrap}.field{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:800}.field input,.field select{min-height:48px;padding:0 14px;border:2px solid var(--line);border-radius:14px;background:var(--card);font-weight:700;min-width:240px;font-size:16px}.field input:focus,.field select:focus{outline:3px solid var(--river);outline-offset:0;border-color:transparent}.settings .set-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:32px;padding:28px 0;border-top:2px solid var(--line)}.set-label h2{font-size:18px;margin-bottom:4px}.set-label p{font-size:15px;color:var(--muted);max-width:44ch}.set-panel{background:var(--card);border:2px solid var(--line);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:14px}.seg{display:inline-flex;gap:4px;padding:4px;background:var(--surface);border-radius:16px;align-self:flex-start;flex-wrap:wrap}.seg button{min-width:44px;min-height:44px;border:0;border-radius:12px;background:none;font-weight:900;font-variant-numeric:tabular-nums;transition:background var(--t-fast),transform var(--t-fast) var(--spring)}.seg button:hover{background:var(--card)}.seg button[aria-checked=true]{background:var(--forest);color:#fff;transform:scale(1.05)}.toggle-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;cursor:pointer;min-height:44px}.toggle-row+.toggle-row{padding-top:14px;border-top:2px solid var(--surface)}.toggle-title{display:block;font-weight:900;font-size:15px}.toggle-desc{display:block;font-size:14px;color:var(--muted);margin-top:2px}.toggle-row input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:none;width:48px;height:28px;border-radius:999px;background:var(--track);position:relative;margin:2px 0 0;cursor:pointer;transition:background var(--t-fast)}.toggle-row input[type=checkbox]:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform var(--t-med) var(--spring)}.toggle-row input[type=checkbox]:checked{background:var(--forest)}.toggle-row input[type=checkbox]:checked:after{transform:translate(20px)}.file-btn{position:relative;overflow:hidden}.file-btn input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.danger{border-top:2px solid var(--surface);padding-top:12px;display:flex;flex-direction:column;gap:10px}.ok{color:var(--positive)}.err{color:var(--negative)}.rows{display:flex;flex-direction:column}.row{display:flex;align-items:baseline;gap:12px;padding:10px 0;border-bottom:2px solid var(--surface)}.row:last-child{border-bottom:0}.row .bas{font-size:19px}.row .btn-link{margin-left:auto}.about-sec{margin-bottom:36px}.about-sec>h2{font-size:22px;margin-bottom:14px}.fixes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.fixes>div{padding:16px;border-radius:18px;background:var(--card);border:2px solid var(--line)}.fixes dt{font-weight:900;margin-bottom:2px}.fixes dd{font-size:15px}.plain{display:flex;flex-direction:column;gap:10px}.plain li{line-height:1.55;max-width:75ch}.lesson{min-height:100dvh;display:flex;flex-direction:column;background:var(--ground)}.lesson-bar{display:flex;align-items:center;gap:12px;padding:14px 24px;max-width:920px;width:100%;margin:0 auto}.lesson-progress{flex:1;height:18px;border-radius:18px;background:var(--track);overflow:hidden}.lesson-progress>span{display:block;height:100%;border-radius:18px;background:var(--forest);transform-origin:left;transition:transform .52s var(--spring);position:relative}.lesson-progress>span:after{content:"";position:absolute;left:10px;right:10px;top:4px;height:4px;border-radius:4px;background:#ffffff59}.combo-pill{display:inline-flex;align-items:center;gap:2px;height:36px;font-weight:900;color:var(--laterite-dark);font-size:18px}.combo-pill.on{animation:pop .42s var(--spring) both}.combo-pill.on .flame{animation:flicker .6s ease-in-out infinite alternate;transform-origin:bottom center}@keyframes flicker{0%{transform:scale(1) rotate(-4deg)}to{transform:scale(1.12) rotate(4deg)}}.xp-pill{display:inline-flex;align-items:center;gap:4px;height:36px;padding:0 12px;border-radius:999px;background:var(--sun-tint);font-weight:900;color:#6b4a00}.lesson-body{flex:1;width:100%;max-width:760px;margin:0 auto;padding:16px 24px 220px;outline:none;display:flex;flex-direction:column;justify-content:center}.stage{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start}.stage-mascot{padding-top:4px}.exercise{display:flex;flex-direction:column;gap:22px;min-width:0}.exercise>:not(.check-bar){animation:rise var(--t-med) var(--ease-out) both}.exercise>:nth-child(2){animation-delay:60ms}.exercise>:nth-child(3){animation-delay:.12s}.bubble{position:relative;background:var(--card);border:2px solid var(--line);border-radius:22px;padding:16px 18px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}.bubble:before{content:"";position:absolute;left:-11px;top:26px;width:18px;height:18px;background:var(--card);border-left:2px solid var(--line);border-bottom:2px solid var(--line);transform:rotate(45deg)}.bubble-label{font-size:20px;line-height:1.25}.prompt-bas{font-size:40px;line-height:1.15;overflow-wrap:anywhere}.prompt-bas.big{font-size:46px}.prompt-en{font-size:28px;font-weight:900;line-height:1.2}.prompt-en.small-prompt{font-size:16px;font-weight:700;color:var(--muted)}.listen{display:flex;align-items:center;gap:12px}.speak{position:relative;display:grid;place-items:center;width:56px;height:56px;border-radius:18px;border:0;background:var(--river);color:#fff;box-shadow:0 5px #1f5ea6;transition:transform var(--t-fast) var(--spring),box-shadow var(--t-fast)}.speak:hover{transform:translateY(-1px) scale(1.04)}.speak:active{transform:translateY(4px);box-shadow:0 1px #1f5ea6}.speak-big{width:84px;height:84px;border-radius:26px}.speak-slow{width:48px;height:48px;border-radius:16px;background:var(--card);color:var(--river);border:2px solid #b9d3f2;box-shadow:0 4px #b9d3f2}.speak-mini{width:40px;height:40px;border-radius:12px;box-shadow:0 3px #1f5ea6;flex:none}.speak .ring{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;border:3px solid var(--river);opacity:0;pointer-events:none}.speak.playing .ring{animation:ping 1.2s var(--ease-out) infinite}.speak.playing .r2{animation-delay:.4s}.speak.playing .wave{animation:wave .7s ease-in-out infinite}.speak.playing .w2{animation-delay:.15s}.tone-drum{display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:6px 14px;border:0;border-radius:16px;background:var(--laterite);color:#fff;box-shadow:0 4px 0 var(--laterite-dark);font-weight:900;transition:transform var(--t-fast) var(--spring)}.tone-drum:active{transform:translateY(3px);box-shadow:0 1px 0 var(--laterite-dark)}.tone-bars{display:inline-flex;align-items:flex-end;gap:5px;height:30px}.tone-bar{width:12px;border-radius:4px;background:var(--hide);transition:transform var(--t-fast) var(--spring);transform-origin:bottom}.tone-bar.t-H{height:28px}.tone-bar.t-D{height:22px}.tone-bar.t-L{height:10px}.tone-bar.t-R{height:28px;clip-path:polygon(0 65%,100% 0,100% 100%,0 100%)}.tone-bar.t-F{height:28px;clip-path:polygon(0 0,100% 65%,100% 100%,0 100%)}.tone-bar.hit{background:var(--sun);transform:scaleY(1.25)}.teach-card{background:var(--sun-tint);border:3px solid #f3d98f;border-radius:24px;padding:22px;display:flex;flex-direction:column;gap:6px}.teach-en{font-size:24px;font-weight:900}.options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.option{display:flex;align-items:center;gap:12px;min-height:66px;padding:12px 16px;text-align:left;background:var(--card);border:2px solid var(--line);border-radius:18px;font-size:18px;font-weight:800;box-shadow:0 4px 0 var(--line);animation:pop .38s var(--spring) both;transition:background var(--t-fast),border-color var(--t-fast),transform var(--t-fast) var(--spring),box-shadow var(--t-fast)}.option .bas{font-size:24px}.option:hover:not(:disabled){background:var(--surface);transform:translateY(-1px)}.option:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 var(--line)}.option.is-picked{border-color:var(--river);background:#eaf2fd;box-shadow:0 4px #9cc0ec}.option.is-right{border-color:var(--forest);background:var(--good-bg);color:var(--good-ink);box-shadow:0 4px #8fd0b3;animation:pulse-ok .5s var(--spring)}.option.is-wrong{border-color:var(--laterite);background:var(--miss-bg);color:var(--miss-ink);box-shadow:0 4px #f0b49c}.option.is-dim{opacity:.5}.option.is-done{opacity:.35;transform:scale(.96);box-shadow:none}.option:disabled{cursor:default}.key{width:26px;height:26px;flex:none;display:grid;place-items:center;border-radius:8px;border:2px solid var(--line);font-size:12px;color:var(--muted)}.check-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:6px}.field-big input{width:100%;min-height:62px;font-size:22px;border-radius:18px;padding:0 18px}.field-big input.bas{font-size:26px}.keys{display:flex;flex-wrap:wrap;gap:6px}.key-btn{min-width:44px;height:46px;padding:0 8px;border:2px solid var(--line);border-radius:12px;background:var(--card);font-size:20px;box-shadow:0 3px 0 var(--line);transition:transform var(--t-fast) var(--spring)}.key-btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}.key-tone{background:var(--sun-tint);border-color:#f3d98f}.answer-line{min-height:74px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 0;border-bottom:3px dashed var(--line)}.bank{display:flex;flex-wrap:wrap;gap:10px}.tile-word{min-height:52px;padding:0 16px;border:2px solid var(--line);border-radius:14px;background:var(--card);font-size:22px;box-shadow:0 4px 0 var(--line);animation:pop .36s var(--spring) both;transition:transform var(--t-fast) var(--spring),opacity var(--t-fast)}.tile-word:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 var(--line)}.bank .tile-word:disabled{opacity:.2;transform:scale(.92);box-shadow:none}.match{display:grid;grid-template-columns:1fr 1fr;gap:12px}.match-col{display:flex;flex-direction:column;gap:10px}.shake{animation:shake .38s ease-in-out}.feedback{position:fixed;left:0;right:0;bottom:0;z-index:20;padding:20px 24px calc(20px + env(safe-area-inset-bottom));animation:up .36s var(--spring) both;border-top:3px solid transparent}.feedback-inner{max-width:760px;margin:0 auto;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.feedback-text{display:flex;flex-direction:column;gap:6px;min-width:0}.feedback h2{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:22px}.fb-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center}.fb-icon .icon{color:#fff}.feedback-good .fb-icon{background:var(--forest)}.feedback-near .fb-icon{background:var(--sun-dark)}.feedback-miss .fb-icon{background:var(--laterite)}.fb-xp{font-size:15px;padding:2px 10px;border-radius:999px;background:var(--sun);color:var(--ink);animation:pop .42s var(--spring) .2s both}.fb-answer{display:flex;align-items:center;gap:10px}.feedback .bas{font-size:20px}.feedback-good{background:var(--good-bg);color:var(--good-ink);border-color:#9fd8bd}.feedback-near{background:var(--near-bg);color:var(--near-ink);border-color:#f3d98f}.feedback-miss{background:var(--miss-bg);color:var(--miss-ink);border-color:#f0b49c}.feedback .muted{color:inherit;opacity:.8}.feedback a,.feedback .btn-link{color:inherit}.feedback-meta{display:flex;gap:16px;flex-wrap:wrap;align-items:center}.disagree-note{font-size:14px}.feedback-miss .btn-game{background:var(--laterite);box-shadow:0 5px 0 var(--laterite-dark)}.feedback-near .btn-game{background:var(--sun-dark);box-shadow:0 5px #9a680a}.lesson-empty{padding-top:8vh;display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center}.lesson-empty h1{font-size:34px}.done{display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center;padding-top:12px}.done-hero{display:flex;flex-direction:column;align-items:center;gap:8px}.done-hero h1{font-size:38px;animation:pop .52s var(--spring) .12s both}.done-stars{display:flex;gap:10px}.done-star{transform:scale(.6);opacity:.4;transition:transform .48s var(--spring),opacity .2s}.done-star.lit{transform:scale(1);opacity:1}.done-star:nth-child(2){margin-top:-14px}.level-up{padding:12px 20px;border-radius:16px;background:var(--sun);font-weight:900;font-size:18px;animation:pop .52s var(--spring) .6s both}.done-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%;max-width:560px}.stat{display:flex;flex-direction:column;gap:4px;padding:14px 10px;border-radius:18px;border:2px solid var(--line);background:var(--card);animation:pop .42s var(--spring) both}.stat:nth-child(2){animation-delay:.12s}.stat:nth-child(3){animation-delay:.24s}.stat-label{font-size:13px;color:var(--muted);font-weight:800}.stat-value{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-size:28px;font-weight:900}.stat-xp{border-color:var(--sun);background:var(--sun-tint)}.stat-combo{border-color:#f6c6b3;background:var(--laterite-tint)}.done-rewards{display:flex;flex-direction:column;gap:10px;width:100%;max-width:560px}.reward{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:var(--card);border:2px solid var(--line);text-align:left;animation:rise .42s var(--ease-out) .7s both}.reward-tag{font-size:12px;font-weight:900;padding:2px 8px;border-radius:999px;background:var(--forest);color:#fff;flex:none}.done-actions{justify-content:center}.speak-meaning{font-size:20px;font-weight:900;color:var(--muted)}.mic-zone{display:flex;flex-direction:column;align-items:center;gap:10px;padding:8px 0}.mic-btn{position:relative;width:104px;height:104px;border-radius:50%;border:0;display:grid;place-items:center;background:var(--laterite);color:#fff;box-shadow:0 6px 0 var(--laterite-dark);transition:transform var(--t-fast) var(--spring),box-shadow var(--t-fast),background var(--t-fast)}.mic-btn:hover:not(:disabled){transform:translateY(-2px) scale(1.03)}.mic-btn:active:not(:disabled){transform:translateY(4px);box-shadow:0 2px 0 var(--laterite-dark)}.mic-btn:disabled{opacity:.6}.mic-btn svg{position:relative;z-index:1}.mic-pulse{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:var(--laterite);opacity:0}.mic-btn.on{background:var(--negative);box-shadow:0 6px #7f160f}.mic-btn.on .mic-pulse{opacity:.3;transform:scale(calc(1 + var(--lvl, 0) * .6));transition:transform 80ms linear}.mic-btn.on:after{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:50%;border:3px solid var(--negative);animation:ping 1.3s var(--ease-out) infinite}.mic-hint{font-weight:800;color:var(--muted);text-align:center;min-height:24px}.mic-fallback{background:var(--surface);border:2px solid var(--line);border-radius:20px;padding:18px;display:flex;flex-direction:column;gap:14px}.speak-result{background:var(--card);border:2px solid var(--line);border-radius:22px;padding:18px;display:flex;flex-direction:column;gap:12px;animation:pop .42s var(--spring) both}.speak-result.pass{border-color:#9fd8bd;background:var(--good-bg)}.speak-score{display:flex;flex-direction:column;gap:2px}.speak-score strong{font-size:22px;font-weight:900}.speak-stars{display:inline-flex;gap:4px;margin-bottom:4px}.melody{margin:0}.melody svg{width:100%;height:auto;max-height:160px;display:block;background:var(--surface);border-radius:14px}.melody-mid{stroke:var(--line);stroke-width:1;stroke-dasharray:3 5}.melody polyline{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:600;stroke-dashoffset:600;animation:draw .9s var(--ease-out) forwards}.melody-native{stroke:var(--forest)}.melody-you{stroke:var(--laterite);animation-delay:.25s!important}@keyframes draw{to{stroke-dashoffset:0}}.melody figcaption{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;margin-top:8px;font-size:14px;font-weight:800}.key-native:before,.key-you:before{content:"";display:inline-block;width:18px;height:4px;border-radius:2px;margin-right:6px;vertical-align:middle}.key-native:before{background:var(--forest)}.key-you:before{background:var(--laterite)}.unit-hero-actions{display:flex;flex-direction:column;gap:12px;align-items:stretch}.unit-hero-talk{gap:8px}.mascot{overflow:visible;flex:none}.mascot-body,.mascot-sticks,.mascot .pupil,.mascot .mouth{transform-box:fill-box;transform-origin:center bottom}.mascot .pupil{transform-origin:center;animation:blink 4.5s infinite}.mascot--idle .mascot-body,.mascot--think .mascot-body{animation:breathe 2.8s ease-in-out infinite}.mascot--happy .mascot-body{animation:hop .62s var(--spring)}.mascot--sad .mascot-body{animation:droop .7s var(--ease-out) forwards}.mascot--talk .mouth{transform-origin:center;animation:talk .18s ease-in-out infinite alternate}.mascot--talk .mascot-body{animation:breathe .9s ease-in-out infinite}.mascot--party .mascot-body{animation:dance .7s ease-in-out infinite alternate}.mascot-sticks{transform-origin:center}.mascot--party .mascot-sticks,.mascot--happy .mascot-sticks{animation:drum .26s ease-in-out infinite alternate}@keyframes breathe{0%,to{transform:translateY(0) scaleY(1)}50%{transform:translateY(-2px) scaleY(1.02)}}@keyframes hop{0%{transform:translateY(0)}35%{transform:translateY(-14px) scale(1.04,.97)}70%{transform:translateY(0) scale(1.05,.94)}to{transform:none}}@keyframes droop{to{transform:rotate(-6deg) translateY(2px)}}@keyframes talk{0%{transform:scaleY(.6)}to{transform:scaleY(1.25)}}@keyframes dance{0%{transform:rotate(-6deg) translateY(0)}to{transform:rotate(6deg) translateY(-8px)}}@keyframes drum{0%{transform:translateY(0)}to{transform:translateY(-4px)}}@keyframes blink{0%,94%,to{transform:scaleY(1)}96%{transform:scaleY(.1)}}.reveal{animation:rise .46s var(--ease-out) both}.rail>.reveal:nth-child(2){animation-delay:70ms}.rail>.reveal:nth-child(3){animation-delay:.14s}.rail>.reveal:nth-child(4){animation-delay:.21s}.rail>.reveal:nth-child(5){animation-delay:.28s}.rail>.reveal:nth-child(6){animation-delay:.35s}.pop-in{animation:pop .3s var(--spring) both}@keyframes rise{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}@keyframes pop{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}@keyframes pop-stop{0%{opacity:0;transform:translate(-50%,-40px) scale(.6)}to{opacity:1;transform:translate(-50%,-40px)}}@keyframes up{0%{transform:translateY(100%)}to{transform:none}}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes ping{0%{transform:scale(1);opacity:.7}to{transform:scale(1.45);opacity:0}}@keyframes pulse-ok{0%{transform:scale(1)}40%{transform:scale(1.05)}to{transform:scale(1)}}#fx-layer{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:60;overflow:hidden}.fx-piece{position:fixed;width:9px;height:9px;border-radius:2px}.fx-float{position:fixed;font-weight:900;font-size:18px;color:#6b4a00;background:var(--sun);padding:2px 10px;border-radius:999px;white-space:nowrap}.fx-confetti{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}html[data-motion=reduce] *,html[data-motion=reduce] *:before,html[data-motion=reduce] *:after{animation-duration:1ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}@media(max-width:1100px){.home-grid{grid-template-columns:1fr}.rail{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.unit-body{grid-template-columns:1fr}}@media(max-width:900px){.shell{grid-template-columns:1fr}.sidebar{display:none}.topbar{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10;height:56px;padding:0 8px 0 4px;background:var(--ground);border-bottom:2px solid var(--line)}.topbar .wordmark{font-size:18px}.tabbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:10;background:var(--card);border-top:2px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:60px;font-size:12px;font-weight:800;color:var(--muted);text-decoration:none;transition:transform var(--t-fast) var(--spring)}.tab:active{transform:scale(.92)}.tab[aria-current=page]{color:var(--forest)}.tab[aria-current=page] .icon{transform:scale(1.15)}.canvas{padding:24px 24px 120px}.settings .set-row{grid-template-columns:1fr;gap:14px}}@media(max-width:760px){.canvas{padding:16px 16px 112px}.hero-card{padding:16px;gap:12px;border-radius:22px;align-items:flex-start}.hero-card .mascot{width:64px;height:75px}.hero-text h1{font-size:22px}.hero-text p{font-size:15px}.hero-text .btn-game{align-self:stretch}.map-title{font-size:20px}.map-sub{font-size:13px}.trail-stop{width:120px}.node{width:70px;height:70px}.node svg{width:34px;height:34px}.node-label{font-size:13px}.rail{grid-template-columns:1fr}.unit-hero{grid-template-columns:auto 1fr;padding:16px;gap:14px;border-radius:22px}.unit-hero-icon{width:76px;height:76px}.unit-hero-icon svg{width:52px;height:52px}.unit-hero-text h1{font-size:24px}.unit-hero-actions{grid-column:1 / -1}.unit-hero-go,.unit-hero-talk{width:100%}.mic-btn{width:92px;height:92px}.speak-meaning{font-size:18px}.speak-ex .check-bar{display:grid;grid-template-columns:1fr 2fr;gap:10px}.page-head{flex-direction:column;align-items:stretch;gap:16px;margin-bottom:18px}.page-head h1{font-size:26px}.field,.field input,.field select{min-width:0;width:100%}.seg{display:flex;flex-wrap:nowrap;align-self:stretch}.seg button{flex:1;min-width:0}.filters{flex-direction:column}.fixes{grid-template-columns:1fr}.phrase-text .bas{font-size:19px}.lesson-bar{padding:10px 16px 10px 8px;gap:8px}.lesson-progress{height:14px}.xp-pill{padding:0 8px}.lesson-body{padding:8px 16px 260px;justify-content:flex-start}.stage{grid-template-columns:1fr;gap:6px}.stage-mascot{display:flex;justify-content:flex-start}.stage-mascot .mascot{width:56px;height:66px}.bubble:before{left:22px;top:-11px;border-left:2px solid var(--line);border-top:2px solid var(--line);border-bottom:0}.bubble-label{font-size:18px}.prompt-bas{font-size:32px}.prompt-bas.big{font-size:36px}.prompt-en{font-size:23px}.speak-big{width:72px;height:72px}.options{grid-template-columns:1fr;gap:10px}.option{min-height:58px;font-size:17px}.check-bar{position:fixed;left:0;right:0;bottom:0;padding:12px 16px calc(14px + env(safe-area-inset-bottom));background:var(--ground);border-top:2px solid var(--line);z-index:15}.check-bar .small{display:none}.check-bar .btn{width:100%}.feedback{padding:16px 16px calc(16px + env(safe-area-inset-bottom))}.feedback-inner{flex-direction:column;align-items:stretch;gap:12px}.feedback h2{font-size:19px}.feedback .btn{width:100%}.done-hero h1{font-size:30px}.done-stats{gap:8px}.stat-value{font-size:22px}.done-actions{flex-direction:column;align-self:stretch}.done-actions .btn{width:100%}}@media(max-width:480px){.badges{gap:6px}.badge-name{font-size:11px}.match .option .bas{font-size:19px}.option .bas{font-size:21px}.play-btn{width:44px;height:44px}.phrase .pill{display:none}}
