:root{--ink:#342c37;--muted:#716974;--pink:#8e3976;--pink-soft:#f8eaf2;--teal:#087d83;--teal-soft:#e8f6f3;--orange:#b96618;--line:#e8e0e6;--paper:#fffdfa;--shadow:0 9px 30px #40213a0a}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Microsoft JhengHei","PingFang TC",system-ui,sans-serif;line-height:1.7}button,select{font:inherit}button{cursor:pointer;min-height:44px;border:0;border-radius:12px;font-weight:700;padding:10px 16px}button:disabled{cursor:default;opacity:.6}button:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #087d83;outline-offset:4px}button:hover:not(:disabled){filter:brightness(.96)}[hidden]{display:none!important}img{max-width:100%;height:auto}h1,h2,h3,p,figure{margin:0}h1{font-size:clamp(2.3rem,5vw,3.9rem);line-height:1.25;letter-spacing:-.04em}h2{font-size:clamp(1.55rem,3vw,2rem);line-height:1.45;margin:4px 0 8px}h3{font-size:1.15rem}p{margin:8px 0}small{display:block;color:var(--muted)}.skip{position:fixed;top:12px;left:-9999px;z-index:99;background:white;padding:12px}.skip:focus{left:16px}.topbar{max-width:1180px;margin:auto;padding:20px 30px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:12px}.brand img{width:64px;height:44px;object-fit:contain}.brand strong{font-size:1.12rem}.brand small{font-size:.8rem}.quiet{background:transparent;color:var(--muted);font-size:.85rem;border:1px solid var(--line)}main{max-width:1120px;margin:auto;padding:0 24px}.hero{border:1px solid #ecd7e2;border-radius:26px;background:linear-gradient(115deg,#fff2e2,#fcf0f6 65%);padding:40px;display:grid;grid-template-columns:1.05fr 1fr;gap:34px;align-items:center;overflow:hidden}.eyebrow{font-size:.71rem;color:var(--pink);letter-spacing:.16em;font-weight:800}.hero h1{margin:10px 0}.subtitle{color:var(--pink);font-size:1.15rem;font-weight:700}.hero-copy>p:not(.subtitle){color:#665064}.hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.hero-tags span{font-size:.8rem;background:#fff9;border:1px solid #ead1e0;border-radius:50px;padding:3px 12px;color:var(--pink)}.primary{background:var(--pink);color:white;box-shadow:0 4px 0 #62224f;padding:12px 20px}.secondary{background:white;border:1px solid #dbcbd8;color:var(--pink)}.hero-image{position:relative;align-self:center}.hero-image>img{display:block;border-radius:22px;border:8px solid #fff;box-shadow:0 12px 24px #80306316;width:100%;background:white}.hero-image figcaption{text-align:center;font-size:.78rem;color:#6f5167;margin-top:12px}.sticker{position:absolute;top:-30px;right:2px;transform:rotate(6deg);background:#ffefad;color:#775022;font-size:.85rem;padding:12px 16px;border-radius:16px;box-shadow:0 6px 0 #ead687}.progress-card{display:flex;align-items:center;justify-content:space-between;gap:32px;background:white;border:1px solid var(--line);border-radius:16px;padding:18px 24px;margin:22px 0;box-shadow:var(--shadow)}.progress-card b{font-size:.95rem}.progress-card small{font-size:.78rem}.progress-track{width:40%;height:10px;background:#f0e6ed;border-radius:10px;overflow:hidden}#progress-fill{height:100%;width:0;background:var(--teal);transition:width .3s}.activity-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:24px 0 16px}.activity-nav button{color:var(--muted);background:#f3eef1;border:1px solid transparent;white-space:nowrap;font-size:.95rem}.activity-nav button span{opacity:.8;font-size:.8rem;margin-right:4px}.activity-nav button.active{background:var(--pink);color:white}.activity-nav button.done:not(.active){background:var(--teal-soft);color:var(--teal);border-color:#c7e5dc}.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 0 22px;font-size:.85rem}.toolbar label{color:var(--muted)}select{min-height:44px;border:1px solid var(--line);border-radius:10px;background:white;padding:8px;color:var(--ink)}#audio-status{color:var(--teal);font-size:.8rem;flex:1;min-width:180px}.panel{background:white;border:1px solid var(--line);border-radius:22px;padding:30px;box-shadow:var(--shadow);scroll-margin-top:16px}.section-heading{display:flex;gap:18px;align-items:flex-start;justify-content:space-between;margin-bottom:24px}.section-heading p{color:var(--muted);font-size:.92rem}.source-tag{display:inline-block;background:#f5f0f3;border-radius:6px;color:var(--muted);font-size:.72rem;white-space:nowrap;padding:5px 9px}.spread{display:flex;align-items:flex-end;border-radius:18px;overflow:hidden;background:white;margin-bottom:24px}.spread img{width:50%;height:190px;object-fit:cover;object-position:bottom}.dialogue-list{display:grid;gap:12px}.dialogue-row{display:grid;grid-template-columns:64px 1fr;gap:14px;background:#fffdfa;border:1px solid var(--line);border-radius:15px;padding:18px}.speaker{display:flex;flex-direction:column;align-items:center;color:var(--pink);font-size:.87rem;font-weight:800;padding-top:4px}.speaker .avatar{border-radius:50%;width:48px;height:48px;background:var(--pink-soft);display:grid;place-items:center;font-size:1.3rem;margin-bottom:5px}.speaker.dawen{color:var(--teal)}.speaker.dawen .avatar{background:var(--teal-soft)}.dialogue-row .text{font-size:1.08rem;font-weight:600}.reading{font-size:.83rem;line-height:1.8;color:#766776;margin:6px 0 10px;overflow-wrap:anywhere}.audio-btn{font-size:.8rem;background:var(--teal-soft);color:var(--teal);padding:8px 12px;margin:3px 4px 0 0;min-height:44px}.audio-btn.slow{background:#f4edf2;color:var(--pink)}.audio-btn.playing,.vocab-card.playing{box-shadow:0 0 0 3px #71b9b4}.compact{margin-top:32px;margin-bottom:12px}.vocab-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.vocab-card{text-align:left;background:white;border:1px solid #e5dce2;padding:14px}.vocab-card b{display:flex;justify-content:space-between;font-size:1.12rem}.vocab-card .reading{font-size:.78rem;font-weight:400;margin:3px 0}.vocab-card small{font-size:.73rem;font-weight:400}.tip{background:var(--pink-soft);color:#714b66;border-radius:14px;padding:18px 20px;margin-top:22px;font-size:.9rem}.tip b{display:block;margin-bottom:5px}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.activity-layout{display:grid;grid-template-columns:250px 1fr;gap:28px}.learning-note{background:#fff8e5;border-radius:16px;padding:20px;font-size:.88rem;align-self:start}.learning-note ul{padding-left:20px}.note-callout{background:white;border-radius:10px;padding:14px;color:#98612c}.card-bank{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px;min-height:56px;border-radius:12px;padding:8px 0}.drag-card{touch-action:none;user-select:none;background:var(--pink-soft);border:2px solid #e5c8da;color:var(--pink);font-size:.95rem;max-width:100%;padding:12px 16px}.drag-card[aria-pressed=true]{background:var(--pink);color:white;box-shadow:0 0 0 3px #f1d8e7}.drag-card:disabled{opacity:.5}.clock-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.clock-target{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:18px 8px;border:2px dashed #ccdcd9;background:#fcfdfb;min-height:220px;color:var(--muted);font-size:.85rem}.clock-svg{width:142px;max-width:100%;height:auto}.clock-target.correct{border-style:solid;border-color:#7dbdaf;background:var(--teal-soft);color:var(--teal)}.drop-hover{outline:4px solid #cf92b7;outline-offset:2px}.drag-ghost{position:fixed;z-index:1000;pointer-events:none;transform:translate(-50%,-50%);max-width:250px;box-shadow:0 6px 22px #54304a44;opacity:.95}.feedback{padding:13px 16px;min-height:52px;border-radius:12px;background:#f5f2f4;color:#685666;margin-top:18px;font-size:.9rem}.feedback.success{background:var(--teal-soft);color:#086264}.feedback.error{background:#fff1e2;color:#944819}.schedule-intro{display:grid;grid-template-columns:140px 1fr;gap:24px;align-items:center;background:#fff8e5;padding:20px;border-radius:16px;margin-bottom:22px}.schedule-intro img{border-radius:14px}.timeline{display:grid;gap:12px}.timeline-slot{width:100%;display:grid;grid-template-columns:175px 1fr;align-items:center;text-align:left;border:2px dashed #d7d6dc;background:#fdfafc;color:var(--ink);padding:16px 22px;min-height:84px;gap:20px}.timeline-slot .time{color:var(--pink);font-size:1rem;border-right:1px solid #e6d4e0}.timeline-slot .placeholder{color:#827683;font-weight:400;font-size:.92rem}.timeline-slot.correct{background:var(--teal-soft);border:2px solid #9ccdc0}.small-note{font-size:.78rem;color:var(--muted)}.pattern-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px}.pattern-grid>div{background:var(--teal-soft);border-radius:12px;padding:16px;font-size:.9rem}.pattern-grid b{color:var(--teal)}.pattern-grid p{font-size:.82rem}.sentence-box{border:1px solid var(--line);padding:24px;border-radius:18px}.sentence-top{display:flex;justify-content:space-between;gap:10px;font-size:1.05rem}.sentence-top span{font-size:.83rem;color:var(--pink);white-space:nowrap}.sentence-box>p:not(.feedback){color:var(--muted);font-size:.9rem}.sentence-answer{border:2px dashed #cfb6c8;border-radius:14px;background:#fdf8fb;min-height:90px;padding:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;position:relative}.sentence-answer:empty:before{content:"把詞語排在這裡";color:#8d7d89;font-size:.9rem}.sentence-answer.correct{border-color:#64a798;background:var(--teal-soft)}.sentence-answer .drag-card{background:white;padding:8px 12px}.sentence-box>small{margin-top:8px;font-size:.73rem}.extension{margin-top:26px;background:#fff8eb;border-radius:16px;padding:22px}.extension h3{margin-top:10px}.quiz-card{max-width:800px;margin:auto;background:#fffdfa;border:1px solid #eadfe7;border-radius:20px;padding:28px}.quiz-meta{display:flex;justify-content:space-between;color:var(--pink);font-size:.85rem;gap:12px}.quiz-card h3{font-size:1.25rem;margin:18px 0;line-height:1.65}.quiz-clock{text-align:center}.quiz-clock .clock-svg{width:180px}.quiz-options{display:grid;gap:12px;margin-top:18px}.quiz-option{width:100%;text-align:left;background:white;border:2px solid #e5dce3;color:var(--ink);padding:14px 16px;display:flex;gap:14px;align-items:center}.quiz-option .letter{border-radius:8px;background:#f3edf2;color:#8a5877;min-width:32px;height:32px;text-align:center;padding-top:2px}.quiz-option:disabled{opacity:1}.quiz-option.correct{border-color:#479b83;background:var(--teal-soft)}.quiz-option.wrong{border-color:#cb7935;background:#fff0df}.result-card{text-align:center;max-width:800px;margin:auto;padding:32px;border-radius:20px;background:linear-gradient(130deg,#e9f7f1,#fff6df)}.result-card .score{font-size:4rem;color:var(--teal);font-weight:900;line-height:1.3;margin:16px 0}.result-card h3{font-size:1.5rem}.review-list{display:grid;gap:12px;text-align:left;margin-top:24px}.review-item{background:white;border-radius:12px;padding:16px;font-size:.9rem}.review-item b{color:var(--pink)}.teacher-note{margin:28px 0;border:1px solid var(--line);border-radius:14px;background:white}.teacher-note summary{cursor:pointer;padding:16px 22px;font-size:.85rem;font-weight:700;min-height:48px}.teacher-note>div{padding:0 22px 18px;font-size:.82rem;color:var(--muted)}footer{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:.75rem;padding:0 4px 34px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#342c37;color:white;border-radius:14px;padding:12px 22px;max-width:90vw;opacity:0;pointer-events:none;transition:opacity .2s;font-size:.9rem;z-index:90}.toast.show{opacity:1}@media(max-width:900px){.hero{gap:24px;padding:30px}.activity-layout{grid-template-columns:210px 1fr;gap:18px}.activity-nav button{padding:10px 8px;font-size:.84rem}.panel{padding:24px}.vocab-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:640px){.topbar{padding:14px 16px}.brand{gap:8px}.brand img{width:43px}.brand strong{font-size:.98rem}.brand small{font-size:.7rem}.topbar .quiet{font-size:.72rem;padding:8px}main{padding:0 14px}.hero{grid-template-columns:1fr;padding:28px 24px;gap:38px}.hero-image{max-width:420px;width:100%;margin:auto}.hero-image>img{border-width:5px}.hero-copy>p{font-size:.92rem}.hero-tags{margin:16px 0}.sticker{top:-24px;font-size:.75rem}.progress-card{padding:16px;gap:14px;margin:16px 0}.progress-card b{font-size:.85rem}.progress-card small{font-size:.72rem}.progress-track{width:30%}.activity-nav{display:flex;overflow-x:auto;gap:7px;padding:3px 1px 8px;margin:16px 0 8px;scrollbar-width:thin}.activity-nav button{flex:0 0 auto;min-width:106px;padding:10px}.toolbar{gap:8px;padding-bottom:16px}.toolbar #audio-status{flex-basis:100%}.panel{padding:20px 16px;border-radius:18px}.section-heading{flex-direction:column;gap:6px;margin-bottom:18px}.section-heading p{font-size:.88rem}.spread img{height:110px}.dialogue-row{grid-template-columns:43px 1fr;padding:14px 12px;gap:10px}.speaker .avatar{width:36px;height:36px;font-size:1rem}.speaker{font-size:.75rem}.dialogue-row .text{font-size:1rem}.reading{font-size:.76rem}.vocab-grid{grid-template-columns:repeat(2,1fr)}.vocab-card{padding:12px}.activity-layout{grid-template-columns:1fr}.learning-note{padding:16px}.learning-note ul{margin:8px 0}.note-callout{padding:10px}.clock-grid{gap:10px}.clock-target{min-height:200px;padding:14px 6px}.clock-svg{width:132px}.drag-card{font-size:.9rem;padding:10px 12px}.schedule-intro{grid-template-columns:90px 1fr;gap:12px;padding:16px}.schedule-intro p{font-size:.83rem}.timeline-slot{grid-template-columns:130px 1fr;gap:12px;padding:14px 12px}.timeline-slot .time{font-size:.85rem}.timeline-slot .placeholder{font-size:.82rem}.pattern-grid{grid-template-columns:1fr;gap:8px}.pattern-grid>div{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:14px}.pattern-grid p{margin:0}.sentence-box{padding:18px 14px}.sentence-top{font-size:.97rem}.actions>button{flex-grow:1}.quiz-card{padding:22px 16px}.quiz-card h3{font-size:1.1rem}.quiz-option{padding:12px;font-size:.94rem}.result-card{padding:26px 16px}footer{flex-direction:column;gap:4px}.teacher-note summary{padding:16px}.source-tag{max-width:100%;white-space:normal}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.speaker .avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.speaker .avatar{overflow:hidden}


.release-links{display:flex;max-width:1120px;margin:0 auto 12px;justify-content:space-between;gap:12px;align-items:center;padding:0 24px;font-size:.8rem;color:var(--muted)}.release-links a{display:flex;min-height:44px;align-items:center;color:var(--pink);text-decoration:none;font-weight:700}@media(max-width:640px){.release-links{padding:0 16px;font-size:.72rem}}