:root{--green:#205c43;--mint:#e9f4e8;--lime:#d5eaac;--ink:#213c30;--muted:#748479;--paper:#f5f8f2;--line:#e0e9dd;--orange:#df9742}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.65 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}button,input{font:inherit}button{min-height:46px;border:1px solid var(--line);border-radius:14px;background:white;color:var(--green);padding:10px 17px;font-weight:650;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.5;cursor:default}button:hover:not(:disabled){background:var(--mint)}button:focus-visible,a:focus-visible{outline:3px solid var(--orange);outline-offset:3px}.primary{background:var(--green);color:white;border-color:var(--green)}.primary:hover:not(:disabled){background:#367456}.quiet{background:transparent;font-size:13px}header{max-width:1180px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:24px 28px}.brand{display:flex;align-items:center;gap:10px;font-size:27px}.brand span{font-size:19px;font-weight:800}.brand small{display:block;font-size:9px;letter-spacing:2px;color:var(--muted)}main{max-width:1124px;margin:auto;padding:0 24px 100px}.welcome{display:flex;justify-content:space-between;align-items:center;padding:24px 12px}.eyebrow{color:var(--green);font-size:12px;letter-spacing:3px}h1{font-size:38px;line-height:1.35;letter-spacing:1px;margin:10px 0 16px}h2{font-size:18px;margin:0 0 10px}h3{font-size:16px;margin:0}p{margin:8px 0;color:var(--muted)}.mascot{font-size:100px;width:260px;text-align:center;transform:rotate(-5deg)}.mascot span{display:block;font-size:13px;transform:rotate(5deg)}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:8px 0 26px}.stats>div{background:white;border:1px solid var(--line);border-radius:19px;text-align:center;padding:18px 4px}.stats b{display:block;font-size:28px;line-height:1.3}.stats>div:nth-child(1) b{color:#db7447}.stats>div:nth-child(3) b{color:#a67e39}.stats span{font-size:12px;color:var(--muted)}nav{display:flex;gap:8px;border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:24px}nav button{background:transparent;border:0}nav button.active{background:var(--green);color:white}.section-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:20px 0 14px}.section-head h2{margin:0}.section-head>span{font-size:12px;color:var(--muted)}.learning-layout{display:grid;grid-template-columns:1.45fr 1fr;gap:22px}.lesson{background:#edf3de;border:1px solid #dce7c9;border-radius:26px;padding:24px;text-align:center;overflow:hidden}.lesson-top{display:flex;justify-content:space-between;font-size:12px;color:#6f8154}.animal{font-size:105px;line-height:1.4;margin-top:15px}.letters{font:800 92px/1.1 "Trebuchet MS",sans-serif;letter-spacing:5px;color:var(--green)}#word{font-family:"Trebuchet MS",sans-serif;font-size:24px;margin:8px 0 0}#translation{margin:0 0 20px}.actions{display:flex;justify-content:center;gap:10px}.hint{font-size:12px;margin-top:14px}.recorder{background:#ffffffb8;padding:18px;border-radius:18px;margin-top:20px;text-align:left;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}.recorder p{font-size:12px}.recorder small{width:100%}audio{max-width:100%;width:100%}.recorder a{color:var(--green)}.pager{display:flex;justify-content:space-between;margin-top:20px}.pager button{background:transparent;border-color:#ccd9b7}.panel{background:white;border:1px solid var(--line);border-radius:23px;padding:22px;margin-bottom:20px}.panel .section-head{margin-top:0}.wide{width:100%;margin-top:10px}#choices{display:flex;gap:10px;margin:18px 0}#choices button{flex:1;font:bold 32px "Trebuchet MS",sans-serif;padding:15px}.check-card{background:#fff5dc}.sprout{font-size:42px}small{font-size:11px;color:var(--muted)}.alphabet{display:grid;grid-template-columns:repeat(9,1fr);gap:10px}.alphabet button{padding:13px 5px}.alphabet button span{display:block;font-size:26px}.alphabet button.selected{background:var(--green);color:white}.weekdays,#calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;text-align:center}.weekdays{color:var(--muted);padding:12px 0}#calendar>div{min-height:60px;padding:12px 2px;border-radius:13px;background:var(--paper)}#calendar .checked{background:var(--mint);color:var(--green);font-weight:bold}#calendar .current{outline:2px solid var(--green)}.reward{display:flex;align-items:center;gap:15px;background:white;border:1px solid var(--line);border-radius:18px;padding:18px;margin-bottom:10px}.reward .emoji{font-size:32px}.reward .info{flex:1}.reward h3{margin:0}.reward p{font-size:12px;margin:3px 0}.reward button{white-space:nowrap}.record-row{padding:13px 0;border-bottom:1px solid var(--line);font-size:13px}.record-row span{float:right;color:var(--green)}footer{text-align:center;font-size:12px;color:var(--muted);padding:35px 0}dialog{border:0;border-radius:23px;max-width:520px;width:calc(100% - 32px);max-height:85dvh;padding:24px;color:var(--ink)}dialog::backdrop{background:#153c2b66;backdrop-filter:blur(4px)}input{width:100%;border:1px solid #cad8c7;border-radius:9px;padding:10px;margin:4px 0 10px;color:var(--ink)}.setting-row{border-bottom:1px solid var(--line);padding:12px 0}.setting-row label{font-size:12px}.setting-row .pair{display:grid;grid-template-columns:2fr 1fr;gap:10px}#toast{position:fixed;bottom:95px;left:50%;transform:translateX(-50%);background:var(--green);color:white;border-radius:14px;padding:12px 20px;max-width:90%;width:max-content;z-index:10;display:none}.import-label{display:block;margin-top:15px}#confirmError{color:#b84535}[hidden]{display:none!important}@media(max-width:650px){header{padding:17px 18px}.brand span{font-size:16px}.brand small{font-size:7px}header button{padding:8px 10px;font-size:12px}main{padding:0 16px 85px}.welcome{padding:12px 3px}h1{font-size:28px}.mascot{font-size:70px;width:125px}.mascot span{font-size:9px}.eyebrow{font-size:10px}.welcome p#date{font-size:12px}.stats{gap:7px;margin:10px 0 20px}.stats>div{padding:14px 1px;border-radius:15px}.stats b{font-size:23px}.stats span{font-size:10px}nav{position:fixed;bottom:0;left:0;right:0;background:#fffffff5;backdrop-filter:blur(12px);z-index:5;margin:0;padding:9px 10px calc(9px + env(safe-area-inset-bottom));border-top:1px solid var(--line);gap:5px}nav button{flex:1;font-size:13px;padding:9px 4px}.learning-layout{grid-template-columns:1fr;gap:16px}.lesson{padding:20px}.animal{font-size:94px}.letters{font-size:82px}.panel{padding:18px;margin-bottom:16px}.alphabet{grid-template-columns:repeat(5,1fr);gap:8px}.alphabet button{padding:10px 3px}.section-head h2{font-size:17px}.section-head>span{font-size:10px}.reward{padding:14px;gap:10px}.reward button{padding:9px 13px}.reward h3{font-size:15px}#calendar>div{min-height:47px;padding:10px 0}.weekdays,#calendar{gap:5px}.recorder>div{width:100%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
/* 手机学习每次只展示一步，避免同时出现多个任务。 */
:root{--green:#4b7d2b;--mint:#eef5dc;--ink:#513c29;--muted:#8c7a63;--paper:#d5edf5;--line:#e2d7b9}body{background:linear-gradient(#c1e7f3 0,#dff1f5 530px,#e6edbd 900px,#dce8bc 100%);font-family:"Arial Rounded MT Bold","PingFang SC",sans-serif}header{position:relative;z-index:1}header button{background:#fffaf0;box-shadow:0 3px 0 #cabf9d}.brand small{letter-spacing:1px}.garden-scene{height:270px;max-width:680px;margin:auto;background:url('assets/animal-garden.jpg') center 37%/cover;border-radius:32px;position:relative;box-shadow:0 8px 24px #6b9d9b12}.garden-bubble{position:absolute;top:15px;left:16px;background:#fffbee;border:2px solid #e4d7b5;border-radius:20px 20px 20px 2px;padding:10px 18px;font-weight:bold}.welcome{justify-content:center;text-align:center;padding:13px 0 0}.welcome h1{font-size:25px;margin:2px 0}.welcome .eyebrow{margin:3px 0}.welcome .mascot{display:none}.welcome #date{font-size:12px;margin:2px 0}.stats{max-width:680px;margin:15px auto 22px}.stats>div{background:#fffbee;border:2px solid #e6ddc2;box-shadow:0 4px 0 #b8cda777}.stats b{font-size:24px}.step-tabs{display:flex;gap:10px;margin:12px auto 20px;max-width:680px}.step-tabs button{flex:1;border:2px solid #e6ddc2;background:#fffbef;box-shadow:0 4px 0 #c5bea7}.step-tabs button.active{background:#795a9e;color:#fff;border-color:#dbc8e9;box-shadow:0 4px 0 #574372}.learning-layout{display:block;max-width:680px;margin:auto}.lesson,.panel{background:#fffbef;border:3px solid #e6d8b3;box-shadow:0 6px 0 #c5be9e55;border-radius:27px}.lesson-top{color:#88785c}.lesson{padding:24px}.lesson .animal{font-size:100px;margin:0}.letters{color:#694a33}.lesson .recorder,.learning-layout aside{display:none}#learn[data-step=record] .recorder{display:flex}#learn[data-step=record] .lesson>.actions,#learn[data-step=record] .lesson>.hint{display:none}#learn[data-step=challenge] .lesson{display:none}#learn[data-step=challenge] aside{display:block}.check-card{background:#f2f5df}button{border-radius:17px;box-shadow:0 3px 0 #d7ccb1}button.primary{background:#4b7d2b;box-shadow:0 4px 0 #34581e}.recorder{background:#f0e9f5;border:1px solid #ded0e6}.recorder>div p{display:none}.lesson>.actions button:first-child{background:#795a9e;border-color:#795a9e;box-shadow:0 4px 0 #574372}.animal-drawer{max-width:680px;margin:26px auto;padding:18px;background:#fffbee;border:2px solid #e6d8b3;border-radius:20px}summary{cursor:pointer;font-weight:bold;min-height:36px}.animal-drawer .alphabet{margin-top:15px}.section-head{max-width:680px;margin-left:auto;margin-right:auto}.reward{background:#fffbef;border:2px solid #e6d8b3}#choices button{border-radius:50%;aspect-ratio:1;background:#f8e1a0;border:4px solid #e9cb7f;font-size:45px;box-shadow:0 6px 0 #baa062}#choices button:nth-child(2){background:#e7d7f0;border-color:#d5bde7;box-shadow:0 6px 0 #b49bc6}#choices button:nth-child(3){background:#d8eff0;border-color:#b5d9dc;box-shadow:0 6px 0 #91babe}#rewards,#checkin{max-width:680px;margin:auto}nav{justify-content:center}nav button{box-shadow:none}nav button.active{background:#4b7d2b}footer{color:#6d7b4d}@media(min-width:651px){.garden-scene{height:310px}.learning-layout{width:100%}.alphabet{grid-template-columns:repeat(7,1fr)}}@media(max-width:650px){header{padding:12px 16px}.garden-scene{height:228px;background-position:center 40%;border-radius:25px}.garden-bubble{font-size:13px;padding:7px 12px;top:10px;left:10px}.welcome h1{font-size:22px}.stats{gap:6px}.stats b{font-size:21px}.stats>div{padding:10px 1px}.step-tabs button{padding:10px 5px}.lesson .animal{font-size:82px}.letters{font-size:74px}.lesson{padding:18px}.lesson .pager{margin-top:14px}.section-head{margin-top:12px}.learning-layout .panel{margin-top:0}.alphabet{grid-template-columns:repeat(5,1fr)}}
:root{--green:#986384;--mint:#f8eaf1;--ink:#624b58;--muted:#9b8491;--paper:#fff8f7;--line:#efdee4}body{background:linear-gradient(#fff5f7,#fffaf1 700px,#f7f2fa)}.garden-scene{background-image:url('assets/friends.svg');background-position:center;background-size:cover;box-shadow:none}.garden-bubble{background:#fffaf5;border-color:#eddae3;color:#9a6885}.lesson,.panel{background:#fffdf7;border-color:#efdfdf;box-shadow:0 5px 0 #e9dbe144}.stats>div{background:#fffdfb;border-color:#efdee4;box-shadow:0 3px 0 #efdee466}.stats b,.letters{color:#986384}.lesson-top{color:#a08293}.step-tabs button{background:#fffbf8;border-color:#eedfe5;box-shadow:0 4px 0 #e4d4dc}.step-tabs button.active{background:#b18bc6;border-color:#e4d2ec;box-shadow:0 4px 0 #8e6aa1}button.primary,nav button.active{background:#986384;border-color:#986384}button.primary{box-shadow:0 4px 0 #774a67}.primary:hover:not(:disabled){background:#ae789b}.lesson .actions button:first-child{background:#a385bf;border-color:#a385bf;box-shadow:0 4px 0 #816798}.animal-drawer,.reward{background:#fffcfa;border-color:#efdee4}.check-card{background:#fff4e6}.recorder{background:#f8eff9;border-color:#eadced}.alphabet button.selected{background:#986384}.pager button{border-color:#ecdae3}.welcome .eyebrow{color:#ad8599}.brand{color:#986384}footer{color:#a08e9b}.garden-scene{height:250px}@media(max-width:650px){.garden-scene{height:190px;background-size:auto 100%}.garden-bubble{font-size:11px;top:8px;left:8px}.welcome h1{font-size:22px}}

/* ===== 全主题课程扩展（主题 → 单元 → 词条）===== */
.topic-rail{display:flex;gap:8px;overflow-x:auto;max-width:680px;margin:0 auto;padding:4px 2px 12px;scrollbar-width:none}
.topic-rail::-webkit-scrollbar{display:none}
.topic-rail button{flex:0 0 auto;display:flex;align-items:center;gap:6px;background:#fffbef;border:2px solid #e6ddc2;border-radius:16px;padding:9px 13px;font-size:13px;box-shadow:0 3px 0 #d7ccb1;white-space:nowrap}
.topic-rail button em{font-style:normal;font-size:10px;color:#a08e9b}
.topic-rail button.active{background:#986384;color:#fff;border-color:#986384;box-shadow:0 3px 0 #774a67}
.topic-rail button.active em{color:#f6e3ee}
.unit-bar{display:flex;align-items:center;gap:12px;max-width:680px;margin:0 auto 8px;flex-wrap:wrap}
.unit-chips{display:flex;gap:6px;flex-wrap:wrap;flex:1 1 260px}
.unit-chips button{min-height:34px;padding:6px 12px;font-size:12px;border-radius:12px;background:#fffdf7;border:1px solid #efdee4;color:#9a6885;box-shadow:none;font-weight:600}
.unit-chips button.active{background:#f4e4ee;border-color:#c9a4bd;color:#7c4f68;font-weight:800}
.unit-meter{display:flex;align-items:center;gap:8px;font-size:11px;color:#a08e9b;white-space:nowrap}
.unit-meter i{display:block;width:76px;height:7px;background:#f0e2e8;border-radius:99px;overflow:hidden}
.unit-meter i b{display:block;height:100%;width:0;background:#986384;border-radius:99px;transition:width .35s}
#choices.word{gap:8px;margin:14px 0}
#choices.word button{aspect-ratio:auto;border-radius:18px;font-size:13px;line-height:1.25;padding:12px 4px;display:flex;flex-direction:column;align-items:center;gap:5px;font-weight:700}
#choices.word button span{font-size:28px;line-height:1}
.animal-drawer .alphabet button{font-size:12px;line-height:1.25;padding:10px 4px;word-break:break-word}
.animal-drawer .alphabet button span{font-size:24px}
@media(max-width:650px){
  .topic-rail{padding-bottom:9px}
  .topic-rail button{padding:8px 11px;font-size:12px}
  .unit-bar{gap:8px}
  .unit-meter{font-size:10px}
  .unit-meter i{width:58px}
  #choices.word button{font-size:12px;padding:10px 3px}
  #choices.word button span{font-size:24px}
}

/* 主题栏：桌面换行全显示，手机横滑加提示 */
.rail-hint{display:none;max-width:680px;margin:0 auto 6px;font-size:11px;color:#a08e9b;text-align:center}
@media(min-width:651px){
  .topic-rail{flex-wrap:wrap;overflow:visible;justify-content:center}
}
@media(max-width:650px){
  .rail-hint{display:block}
}

/* ===== 小测 / 错题本 / 复习 ===== */
.unit-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;max-width:680px;margin:0 auto 4px}
.unit-actions button{min-height:40px;font-size:13px}
#reviewJump{background:#fff4e6;border:1px solid #f0d9bb;color:#a0722f;box-shadow:none}
#testNote{font-size:11px;color:#a08e9b}
.test-prompt{font-size:15px;font-weight:700;color:#624b58;margin:6px 0 10px}
.test-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0}
.test-option{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px;border-radius:18px;background:#fffbef;border:2px solid #e6ddc2;font-size:13px;line-height:1.25;box-shadow:0 4px 0 #d7ccb1;min-height:0}
.test-option span{font-size:30px;line-height:1}
.test-option b{font-size:16px}
.test-option em{font-style:normal;font-size:11px;color:#a08e9b}
.test-option.right{background:#e6f3d8;border-color:#8bbf5a;box-shadow:0 4px 0 #7aa94f}
.test-option.wrong{background:#fbe3e3;border-color:#d98a8a;box-shadow:0 4px 0 #c17575}
#testFeedback{min-height:22px;font-weight:700;color:#7c4f68;text-align:center}
#wrongList .record-row span,#resultWrong .record-row span{color:#b84535}
#resultWrong{margin:10px 0}
@media(max-width:650px){
  nav button{font-size:11px;padding:9px 2px}
  .unit-actions button{flex:1 1 45%;font-size:12px}
  .test-options{gap:7px}
  .test-option{padding:11px 4px;font-size:12px}
  .test-option b{font-size:14px}
  .test-option span{font-size:26px}
}

/* ===== 动态小红旗 ===== */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.flag{width:1em;height:1em;vertical-align:-.16em;display:inline-block;overflow:visible}
.stat-flag{width:1.5em;height:1.5em;vertical-align:-.38em;transform-origin:50% 90%;animation:flagSway 3.2s ease-in-out infinite;filter:drop-shadow(0 2px 2px rgba(120,60,40,.18))}
@keyframes flagSway{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
#flagCard{position:relative}
#flagCard.gain{animation:cardGain .85s cubic-bezier(.2,.9,.2,1)}
@keyframes cardGain{0%{transform:scale(1)}28%{transform:scale(1.07)}62%{transform:scale(.985)}100%{transform:scale(1)}}
#balance.pop{animation:numPop .55s cubic-bezier(.2,.9,.2,1)}
@keyframes numPop{0%{transform:scale(1)}35%{transform:scale(1.32);color:#e8452f}100%{transform:scale(1)}}
#balance.spend{animation:numSpend .45s ease-in-out}
@keyframes numSpend{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}}
#flagLayer{position:fixed;inset:0;pointer-events:none;z-index:40;overflow:hidden}
.fly-flag{position:absolute;display:flex;align-items:center;font-size:21px;font-weight:800;color:#e8452f;white-space:nowrap;animation:flyUp 1.7s cubic-bezier(.2,.75,.3,1) forwards;text-shadow:0 2px 0 #fff,0 0 12px #fff}
.fly-flag .flag{width:26px;height:26px;margin-right:2px}
@keyframes flyUp{0%{opacity:0;transform:translate(0,8px) scale(.5) rotate(-12deg)}18%{opacity:1;transform:translate(calc(var(--dx) * .25),-10px) scale(1.2) rotate(4deg)}45%{opacity:1;transform:translate(calc(var(--dx) * .6),-44px) scale(1) rotate(-3deg)}100%{opacity:0;transform:translate(var(--dx),-96px) scale(.85) rotate(8deg)}}
.reward.can-buy{border-color:#e8b86a;box-shadow:0 4px 0 #f0dcb7}
.reward.can-buy button.primary{animation:buyGlow 2.4s ease-in-out infinite}
@keyframes buyGlow{0%,100%{box-shadow:0 4px 0 #774a67}50%{box-shadow:0 4px 0 #774a67,0 0 0 6px rgba(232,69,47,.14)}}
.reward .flag{width:1.05em;height:1.05em}
.switch-row{display:flex;gap:10px;align-items:flex-start;background:#fff8ee;border:1px solid #f0e0c4;border-radius:14px;padding:12px;font-size:13px;line-height:1.5;margin:0 0 12px}
.switch-row input{width:22px;height:22px;flex:0 0 auto;margin:1px 0 0;accent-color:#986384}
button,summary,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
@media(max-width:650px){.stat-flag{width:1.4em;height:1.4em}}
@media(prefers-reduced-motion:reduce){.stat-flag,#flagCard.gain,#balance.pop,#balance.spend,.fly-flag,.reward.can-buy button.primary{animation:none!important}}

/* ===== 图标悬停 / 触摸交互 ===== */
#flagCard{transition:transform .26s cubic-bezier(.2,.8,.2,1),box-shadow .26s,background .26s}
.reward{transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s,border-color .22s}
.reward .emoji{transition:transform .3s cubic-bezier(.2,1.4,.4,1)}
.topic-rail button,.unit-chips button,.step-tabs button,nav button,.test-option{transition:transform .16s ease,box-shadow .18s,background .18s,border-color .18s}
/* 栏目切换时同步文字和底色，避免白字过渡到浅色底后看不清。 */
#nav button{transition:transform .16s ease}
#nav button[aria-current=page]{background:#986384;color:#fff;border-color:#986384}
@media(max-width:650px){#nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}#nav button{min-width:0;white-space:nowrap}}
@keyframes flagCheer{0%,100%{transform:rotate(-10deg) scale(1.16)}50%{transform:rotate(10deg) scale(1.22) translateY(-2px)}}
@keyframes flagHop{0%{transform:translateY(0) rotate(0) scale(1)}35%{transform:translateY(-7px) rotate(-14deg) scale(1.22)}70%{transform:translateY(0) rotate(7deg) scale(1.06)}100%{transform:translateY(0) rotate(0) scale(1)}}
@keyframes cardLift{to{transform:translateY(-4px)}}
@media(hover:hover) and (pointer:fine){
  #flagCard:hover{transform:translateY(-4px);background:#fffaf3;box-shadow:0 8px 0 #efdee4,0 12px 24px rgba(150,99,132,.16)}
  #flagCard:hover .stat-flag{animation:flagCheer .72s ease-in-out infinite;filter:drop-shadow(0 5px 8px rgba(232,69,47,.42))}
  #flagCard:hover #balance{color:#e8452f;letter-spacing:.5px;transition:color .2s,letter-spacing .2s}
  .reward:hover{transform:translateY(-3px);box-shadow:0 7px 0 #e6d8b3,0 14px 26px rgba(150,99,132,.14);border-color:#e8cf96}
  .reward:hover .flag{animation:flagHop .72s cubic-bezier(.25,1.5,.4,1)}
  .reward:hover .emoji{transform:scale(1.2) rotate(-7deg)}
  .reward button:hover:not(:disabled){transform:translateY(-2px)}
  .reward button:active:not(:disabled){transform:translateY(1px) scale(.98)}
  .topic-rail button:hover:not(.active){transform:translateY(-2px);background:#fff6e6;border-color:#dcc9a6;box-shadow:0 5px 0 #d7ccb1}
  .unit-chips button:hover:not(.active){background:#fdf2f7;border-color:#e2bcd1;color:#8d5b76}
  .step-tabs button:hover:not(.active){background:#fff6fb}
  nav button:hover:not(.active){background:#fff8fb}
  #choices.word button:hover:not(:disabled),.test-option:hover:not(:disabled){transform:translateY(-3px);border-color:#d9a9c1;box-shadow:0 6px 0 #d7ccb1}
  .animal-drawer .alphabet button:hover{transform:translateY(-2px);background:#fff6e6}
  .stats>div:hover{background:#fffaf3}
}
@media(hover:none){
  #flagCard:active{transform:scale(.985)}
  #flagCard:active .stat-flag{animation:flagCheer .8s ease-in-out infinite}
  .reward:active{transform:scale(.99)}
  .topic-rail button:active,.unit-chips button:active,.step-tabs button:active,nav button:active{transform:scale(.97)}
}

/* ===== 家长设置 · 离线说明 ===== */
.offline-note{background:#f7f4ff;border:1px solid #e3daf5;border-radius:14px;padding:10px 12px;margin:10px 0 0}
.offline-note summary{cursor:pointer;font-size:13px;font-weight:700;color:#6c5a92;list-style:none}
.offline-note summary::-webkit-details-marker{display:none}
.offline-note summary::before{content:"▸ ";transition:transform .2s}
.offline-note[open] summary::before{content:"▾ "}
.offline-note p{margin:9px 0 0;font-size:12px;line-height:1.65;color:#7b6f8c}
.offline-note b{color:#5d4d80}

/* 每日路线只作引导，完成一次有效练习即可打卡。 */
.daily-guide{max-width:680px;margin:0 auto 20px;padding:18px;background:#fffdfb;border:2px solid #efdee4;border-radius:24px;box-shadow:0 4px 0 #efdee455}
.daily-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px}
.daily-heading h2{margin:0;font-size:18px}
.daily-heading>span{font-size:12px;color:#986384}
.daily-route{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.daily-route button{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;min-height:76px;padding:9px 2px;background:#fff8f3;border:2px solid #f0e4df;box-shadow:none}
.daily-route button span{font-size:23px;line-height:1.2}
.daily-route button b{font-size:12px;font-weight:650;white-space:nowrap}
.daily-route button.current{border-color:#b18bc6;background:#f5edf9}
.daily-route button.done{border-color:#bed5b3;background:#f0f7e9;color:#5a793e}
.daily-guide>p{font-size:13px;margin:12px 0 0;color:#876779}
.daily-guide>small{display:block;margin-top:12px;font-size:11px;line-height:1.6}
.daily-guide.ready{border-color:#cba2bb}
.daily-guide .wide{margin-top:12px}
@media(max-width:650px){.daily-guide{padding:15px;margin-bottom:16px}.daily-route button b{font-size:11px}.daily-heading h2{font-size:17px}}

/* ===== 微信内置浏览器提示 ===== */
.wx-tip{display:flex;gap:10px;align-items:center;justify-content:space-between;max-width:680px;margin:0 auto 10px;padding:10px 12px;background:#fff6e5;border:1px solid #f0dcb4;border-radius:14px;font-size:12px;line-height:1.5;color:#8a6a34}
.wx-tip b{color:#b4552c}
.wx-tip button{min-height:32px;padding:4px 12px;font-size:12px;border-radius:10px;background:#fff;border:1px solid #e8d3a9;box-shadow:none;color:#8a6a34;flex:0 0 auto}
@media(max-width:650px){.wx-tip{font-size:11px;padding:9px 10px}}

/* ---------- 跟读三遍（不依赖麦克风，取代录音） ---------- */
.readalong{display:flex;flex-wrap:wrap;gap:9px;align-items:center;justify-content:space-between}
.readalong .ra-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.readalong h3{margin:0}
.readalong .ra-head p{margin:0;font-size:12px;color:#9b8491}
.ra-rounds{width:100%;display:flex;gap:12px;justify-content:center;margin:6px 0 2px}
.ra-rounds i{width:32px;height:32px;border-radius:50%;background:#fff;border:2px solid #e6d7e9;color:#c0a8ca;font-style:normal;font-weight:800;font-size:14px;display:grid;place-items:center;transition:transform .2s,background .2s,color .2s,box-shadow .2s}
.ra-rounds i.on{background:#f8cf9c;border-color:#e8b273;color:#8a5522;transform:scale(1.18);box-shadow:0 0 0 7px #f8cf9c33}
.ra-rounds i.done{background:#cfe8b4;border-color:#a7d084;color:#3e6b24}
.readalong .ra-status{width:100%;text-align:center;margin:0;font-weight:800;color:#7c5b8f;min-height:25px;font-size:14px}
.readalong.beating .ra-status{animation:raPulse .95s ease-in-out infinite}
.readalong .ra-actions{width:100%;display:flex;gap:10px}
.readalong .ra-actions button{flex:1}
@keyframes raPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.07);opacity:.82}}
@media(max-width:650px){.readalong .ra-actions{flex-direction:column}.readalong .ra-status{font-size:13px}}
@media(prefers-reduced-motion:reduce){.readalong.beating .ra-status{animation:none}.ra-rounds i{transition:none}}