body.sentence-reading *{box-sizing:border-box}body.sentence-reading{margin:0;background:#e7f5fc;color:#244456;font:17px/1.45 system-ui,sans-serif}body.sentence-reading .r-header{padding:10px max(16px,calc((100% - 1240px)/2));background:#fffdf7;display:flex;justify-content:space-between;align-items:center;gap:12px}body.sentence-reading .r-header a{color:inherit;font-weight:750;text-decoration:none}body.sentence-reading .r-header img{width:32px;height:32px;vertical-align:middle;margin-right:7px}body.sentence-reading .r-wrap{max-width:1288px;padding:16px 24px 30px;margin:auto}body.sentence-reading .toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:12px}body.sentence-reading h1{font-size:clamp(1.15rem,2.4vw,1.65rem);margin:0}body.sentence-reading button,body.sentence-reading .next-link{font:inherit;font-weight:750;cursor:pointer;border:3px solid #fff;border-radius:17px;background:#edf4f9;color:#244456;min-height:52px;padding:10px 16px}body.sentence-reading button:focus-visible,body.sentence-reading a:focus-visible{outline:4px solid #325f80;outline-offset:3px}body.sentence-reading button:disabled{opacity:.45;cursor:default}body.sentence-reading .sheet{max-width:1000px;background:#fffdf5;border:4px solid white;border-radius:28px;padding:16px 22px;text-align:center;margin:auto}body.sentence-reading .progress{display:flex;gap:14px;align-items:center;color:#617a87;font-size:.85rem}body.sentence-reading progress{flex:1;min-width:0;height:9px;appearance:none;border:0;border-radius:9px;overflow:hidden;background:#e4ece5}body.sentence-reading progress::-webkit-progress-bar{background:#e4ece5}body.sentence-reading progress::-webkit-progress-value{background:#70aa96;border-radius:9px}body.sentence-reading progress::-moz-progress-bar{background:#70aa96;border-radius:9px}body.sentence-reading #prompt{font-size:clamp(1.1rem,2.5vw,1.5rem);margin:14px 0}body.sentence-reading .sentence{font-size:clamp(1.75rem,4vw,2.8rem);font-weight:750;line-height:1.35;margin:20px auto;max-width:850px}body.sentence-reading .context{font-size:clamp(1.05rem,2.4vw,1.3rem);text-align:left;background:#eff4e6;border-radius:16px;padding:14px 18px;margin:12px auto;max-width:790px;line-height:1.65}body.sentence-reading #scene>img{width:100%;max-width:570px;height:clamp(140px,28dvh,240px);object-fit:contain}body.sentence-reading #choices{display:flex;gap:12px;justify-content:center;margin:18px 0;flex-wrap:wrap}body.sentence-reading .picture-choice{padding:4px;background:#e5eee1;border:4px solid white;border-radius:20px;flex:1;max-width:280px;min-width:130px;overflow:hidden;box-shadow:0 3px 0 #c3d7c8}body.sentence-reading .picture-choice:nth-child(2){background:#e9e0f5}body.sentence-reading .picture-choice:nth-child(3){background:#faecc5}body.sentence-reading .picture-choice img{display:block;width:100%;height:clamp(115px,24dvh,190px);object-fit:contain}body.sentence-reading .picture-choice span{display:block;padding:6px;font-size:1.15rem}body.sentence-reading .picture-choice.correct{outline:4px solid #63a88a}body.sentence-reading .picture-choice.try{outline:3px solid #d89a4b}body.sentence-reading .actions{display:flex;justify-content:center;gap:12px;margin:18px 0 4px;align-items:center;flex-wrap:wrap}body.sentence-reading #next,body.sentence-reading #again,body.sentence-reading .next-link{background:#db863a;color:#fff;border-color:#db863a;box-shadow:0 5px 0 #b86a29;font-size:1.25rem;padding:14px 25px;min-height:62px}body.sentence-reading #back{font-size:1.5rem}body.sentence-reading #feedback{min-height:26px;color:#427a60;font-weight:750;margin:8px 0}body.sentence-reading #audio-note{font-size:.85rem;color:#617783;margin:8px 0}body.sentence-reading #audio-note:empty,body.sentence-reading #scene:empty,body.sentence-reading #choices:empty{display:none}body.sentence-reading .parent{margin-top:24px;line-height:1.7}body.sentence-reading .parent summary{font-weight:750;cursor:pointer}body.sentence-reading .paused #text,body.sentence-reading .paused #choices,body.sentence-reading .paused #scene{opacity:.3;pointer-events:none}body.sentence-reading .order-slots{display:flex;gap:10px;justify-content:center}body.sentence-reading .order-slots>div{width:30%;max-width:170px;min-height:90px;background:#eef0e8;border:2px dashed #9fbbad;border-radius:14px;display:grid;place-items:center;font-size:2rem}body.sentence-reading .order-slots img{width:100%;height:100px;object-fit:contain}body.sentence-reading .next-link{display:inline-block;text-decoration:none;margin:15px}body.sentence-reading #finish p{max-width:650px;margin:20px auto}body.sentence-reading [hidden]{display:none!important}@media(max-width:600px){body.sentence-reading .r-wrap{padding:12px}body.sentence-reading .sheet{padding:12px}body.sentence-reading .picture-choice{min-width:0;width:30%;padding:2px;border-radius:15px}body.sentence-reading .picture-choice img{height:135px}body.sentence-reading .actions{gap:7px}body.sentence-reading #next{font-size:1.12rem;padding:13px 17px}body.sentence-reading #listen{font-size:.95rem;padding:10px}body.sentence-reading .sentence{margin:18px 0}body.sentence-reading .context{padding:10px 12px}body.sentence-reading .r-header{font-size:.9rem}body.sentence-reading .picture-choice span{font-size:.95rem;padding:3px}body.sentence-reading .order-slots>div{min-height:75px}body.sentence-reading .order-slots img{height:75px}}@media(max-height:720px){body.sentence-reading .sentence{margin:12px 0}body.sentence-reading #prompt{margin:8px 0}body.sentence-reading #choices{margin:12px 0}body.sentence-reading .picture-choice img{height:20dvh}body.sentence-reading .actions{margin-top:10px}body.sentence-reading #scene>img{height:22dvh}}body.sentence-reading .sentence mark{background:#ffecae;color:inherit;border-radius:8px;padding:0 5px}body.sentence-reading .picture-choice img{object-fit:contain}body.sentence-reading .picture-choice:disabled{opacity:1}body.sentence-reading .finish-parent{margin:20px auto 5px;color:#617783;font-size:.9rem}body.sentence-reading .finish-parent summary{cursor:pointer}body.sentence-reading #listen.needs-audio{outline:3px solid #db863a}body.sentence-reading .actions{flex-wrap:nowrap}body.sentence-reading #next{white-space:nowrap}@media(max-width:600px){body.sentence-reading .actions{gap:5px}body.sentence-reading #next{font-size:1rem;padding:12px}body.sentence-reading #listen{font-size:0;padding:10px;min-width:50px}body.sentence-reading #listen::before{content:"🔊";font-size:1.3rem}body.sentence-reading #back{padding:10px 12px}body.sentence-reading .sheet{padding:10px}body.sentence-reading .sentence{font-size:clamp(1.5rem,6vw,1.9rem)}body.sentence-reading .context{line-height:1.45;font-size:1rem}body.sentence-reading .order-slots img{height:68px}body.sentence-reading .order-slots>div{min-height:68px}}

/* Keep the passage available; each sentence has optional, clearly labelled audio. */
body.sentence-reading .story-text{max-width:720px;text-align:left;padding:12px 18px}
body.sentence-reading .story-line{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 0}
body.sentence-reading .story-line+.story-line{border-top:1px solid #dce6d6}
body.sentence-reading .story-line span{flex:1}
body.sentence-reading button.line-audio{flex:none;min-width:44px;min-height:44px;padding:7px;border:2px solid #fff;background:#fffdf5;font-size:1rem;border-radius:12px}
@media(max-width:600px){body.sentence-reading .story-text{padding:8px 12px;margin:8px auto}body.sentence-reading .story-line{gap:6px;padding:2px 0}body.sentence-reading .story-line span{font-size:1.05rem}body.sentence-reading #choices{margin:10px 0}body.sentence-reading .order-slots{gap:6px}body.sentence-reading .picture-choice img{height:clamp(90px,18dvh,130px)}}
