/* ============ v3：新教室、答對後暫停、螢幕外任務、大人小抄 ============ */
:root{ --sheet:#FFFDF5; --line:#F0E2B8; --tag:#118AB2; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --sheet:#2C3158; --line:#454B7A; --tag:#7CC8EE } }
:root[data-theme="dark"]{ --sheet:#2C3158; --line:#454B7A; --tag:#7CC8EE }

/* ---- Today：窗戶與星期火車 ---- */
.skywin{width:150px}
.week{display:grid; grid-template-columns:repeat(7,1fr); gap:5px; width:100%; max-width:520px; padding-top:30px}
.daycar{position:relative; border:0; border-radius:12px 12px 6px 6px; background:var(--dc); color:#2B2D42; padding:10px 0 12px; font:inherit; box-shadow:0 4px 0 rgba(43,45,66,.2)}
.daycar b{font-size:clamp(.78rem,3.4vw,1.05rem); font-weight:800}
.daycar::before,.daycar::after{content:""; position:absolute; bottom:-7px; width:11px; height:11px; border-radius:50%; background:#2B2D42; border:2px solid #fff}
.daycar::before{left:14%} .daycar::after{right:14%}
.daycar.today{transform:translateY(-4px); box-shadow:0 0 0 4px #fff, 0 0 0 7px var(--dc), 0 6px 0 rgba(43,45,66,.2)}
.daycar .rider{position:absolute; left:50%; bottom:100%; width:34px; margin-left:-17px; margin-bottom:-6px}
.daycar.ring{animation:pop .5s}
.week-sing{display:flex; align-items:center; gap:6px; margin:14px auto 0; border:0; border-radius:99px; background:var(--yellow); color:#2B2D42; padding:6px 14px 6px 8px; font-weight:800; box-shadow:0 3px 0 rgba(43,45,66,.2)}
.week-sing .ic{width:24px}
.card .daychip{display:grid; place-items:center; aspect-ratio:1; border-radius:50%; background:var(--dc)!important; color:#2B2D42; box-shadow:inset 0 -6px 0 rgba(43,45,66,.15)}
.card .daychip b{font-size:clamp(1.3rem,6vw,1.9rem); font-weight:800}

/* ---- Hide and seek：房子 ---- */
.house{width:100%; max-width:440px; margin:0 auto 14px}
.roof{height:46px; margin:0 6%; background:#EF476F; clip-path:polygon(50% 0,100% 100%,0 100%)}
.hgrid{display:grid; grid-template-columns:1fr 1fr; gap:6px; background:#F2C27B; padding:6px; border-radius:0 0 18px 18px; box-shadow:0 4px 0 rgba(43,45,66,.18)}
.hroom{display:flex; flex-direction:column; align-items:center; gap:2px; border:0; border-radius:12px; background:var(--card); padding:8px 6px 6px; font:inherit; color:var(--ink)}
.hroom .hpic{width:min(100%,130px); display:block}
.hroom .hname{font-weight:800; font-size:clamp(.9rem,3.8vw,1.1rem)}
button.hroom{box-shadow:0 3px 0 rgba(43,45,66,.12)}
button.hroom.found{box-shadow:0 0 0 5px var(--green)}
button.hroom.nope{animation:shake .4s}

/* ---- 答對後暫停：下方「下一題」列 ---- */
.nextbar{position:fixed; left:0; right:0; bottom:0; z-index:17; display:flex; align-items:stretch; gap:10px; max-width:760px; margin:0 auto;
  padding:10px 16px calc(12px + env(safe-area-inset-bottom,0px)); background:var(--sheet); border-radius:24px 24px 0 0; box-shadow:0 -4px 0 rgba(43,45,66,.1), 0 -10px 30px rgba(43,45,66,.12); animation:barUp .3s ease}
.nextbar[hidden]{display:none}
@keyframes barUp{from{transform:translateY(100%)}}
body.has-next #game{padding-bottom:150px}
.nb-talk{flex:1; min-width:0; display:flex; flex-direction:column; gap:4px}
.nb-tag{font-family:var(--zh); font-weight:700; font-size:.8rem; color:var(--tag)}
.nb-next{flex:none; display:grid; grid-template-columns:auto auto; grid-template-rows:auto auto; align-items:center; column-gap:6px; border:0; border-radius:20px; background:var(--green); color:#2B2D42;
  padding:8px 14px 8px 18px; font-weight:800; font-size:1.35rem; box-shadow:0 4px 0 rgba(43,45,66,.22)}
.nb-next .nb-zh{grid-row:2; font-family:var(--zh); font-size:.8rem; font-weight:700}
.nb-next .nb-arr{grid-column:2; grid-row:1 / 3; width:30px}
.nb-next:active{transform:translateY(3px); box-shadow:0 1px 0 rgba(43,45,66,.22)}

/* ---- 可點播的英文句子（下一題列、小抄、任務共用） ---- */
.say-line{display:flex; align-items:center; gap:10px; width:100%; border:0; background:none; padding:6px 4px; text-align:left; font:inherit; color:var(--ink); border-radius:12px}
.say-line .sl-ico{flex:none; width:34px; height:34px; border-radius:50%; background:var(--yellow); padding:6px}
.say-line .sl-txt{min-width:0; display:flex; flex-direction:column}
.say-line b{font-size:1.08rem; line-height:1.25}
.say-line .sl-txt span{font-family:var(--zh); font-size:.85rem; color:var(--soft)}
.say-line.saying .sl-ico{animation:pop .5s}

/* ---- 過關後的螢幕外任務 ---- */
.overlay{overflow-y:auto}
.win.has-mission .mascot{width:84px}
.win.has-mission .big.sticker{width:70px}
.mission{display:flex; align-items:center; gap:10px; margin:12px 0 4px; background:#fff; border-radius:20px; padding:10px 10px 10px 12px; text-align:left; box-shadow:0 3px 0 rgba(43,45,66,.15); animation:popIn .5s .5s backwards}
.mission .m-ico{flex:none; width:52px; height:52px; border-radius:50%; background:#FFF1C2; padding:8px}
.mission .m-txt{min-width:0; display:flex; flex-direction:column; gap:2px}
.mission small{font-weight:800; color:#EF476F; font-size:.85rem}
.mission small .zh{color:#5C607A; font-weight:500}
.mission b{font-size:1.05rem; line-height:1.25; color:#2B2D42}
.mission .m-zh{font-size:.82rem; color:#5C607A}
.mission .m-say{flex:none; width:40px; height:40px; border:0; border-radius:50%; background:var(--yellow); padding:8px; box-shadow:0 3px 0 rgba(43,45,66,.2)}
body.no-zh .mission .zh{display:none}

/* ---- 大人小抄 ---- */
.cheat-btn{width:52px; height:52px; padding:6px 6px 2px; display:flex; flex-direction:column; align-items:center; gap:0}
.cheat-btn .ic{width:28px}
.cheat-btn span{font-family:var(--zh); font-size:.62rem; font-weight:700; line-height:1}
#game .bar{gap:6px}
#game .progress{min-width:0; flex:1; justify-content:center}
.cheat{position:fixed; inset:0; z-index:19; display:none; align-items:flex-end; justify-content:center; background:rgba(31,35,64,.4); padding:16px 12px 0}
.cheat.show{display:flex}
.ch-card{width:100%; max-width:560px; max-height:82vh; overflow-y:auto; background:var(--sheet); border-radius:28px 28px 0 0; padding:16px 18px calc(22px + env(safe-area-inset-bottom,0px)); animation:barUp .3s ease}
.ch-head{display:flex; align-items:center; gap:12px; padding-bottom:10px; border-bottom:2px dashed var(--line)}
.ch-head > div{flex:1; min-width:0}
.ch-ico{flex:none; width:52px; height:52px; border-radius:50%; background:var(--card); padding:8px}
.ch-head small{font-family:var(--zh); font-weight:700; color:var(--tag); font-size:.8rem}
.ch-head h3{margin:0; font-size:1.4rem; line-height:1.15}
.ch-sub{font-family:var(--zh); color:var(--soft); font-size:.88rem}
.ch-close{flex:none; width:44px; height:44px; border:0; border-radius:50%; background:var(--card); padding:12px; box-shadow:0 3px 0 rgba(43,45,66,.15)}
.ch-card h4{margin:14px 0 4px; font-family:var(--zh); font-size:.9rem; color:var(--tag)}
.ch-words,.ch-tip{margin:0; font-family:var(--zh); line-height:1.7; font-size:.95rem}
.ch-words{font-family:var(--en); font-weight:700}