.reading-assessment{display:grid;gap:24px}.reading-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);gap:24px}.reading-main,.reading-submit,.reading-result{padding:28px}.reading-pickers{display:grid;grid-template-columns:1fr 1fr;gap:18px}.reading-pickers label{min-width:0}.reading-pickers select{display:block;max-width:100%;width:100%;margin-top:9px;padding:12px;border:1px solid var(--line,#e4dfec);border-radius:12px;background:white;color:inherit;font:inherit}.reading-target{display:grid;justify-items:center;text-align:center;gap:20px;min-height:250px;padding:36px 16px}.reading-target>span,.reading-target>p{color:var(--muted,#92899e)}.reading-target>strong{font-size:clamp(26px,3vw,42px);line-height:1.8;word-break:break-all}.reading-target>strong.reading-single{font-size:100px;line-height:1.2}.reading-controls{display:flex;justify-content:center;align-items:center;gap:18px;flex-wrap:wrap}.reading-help{font-size:14px;line-height:1.8;color:var(--muted,#81788c)}.reading-main>.reading-help{text-align:center}.reading-submit{align-self:start;display:grid;gap:16px}.reading-submit h2,.reading-submit p{margin:0}.reading-submit p{line-height:1.85}.reading-consent{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.8;cursor:pointer}.reading-consent input{margin-top:6px;flex:0 0 auto;accent-color:#9276b9;width:18px;height:18px}.reading-playback{display:grid;gap:14px;margin-top:24px;padding:18px;border-radius:16px;background:#f4f1f9}.reading-playback audio{width:100%}.reading-playback .button{justify-self:start}.reading-message{color:#875e79;line-height:1.7}.reading-live{color:#ae4d62;display:inline-flex;gap:5px;align-items:center}.reading-live:before{content:'';width:10px;height:10px;background:currentColor;border-radius:50%;margin-right:5px}.reading-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:16px;margin:24px 0}.reading-metrics>div{display:grid;gap:12px;padding:18px;border-radius:16px;background:#f4f1f9}.reading-metrics strong{font-size:38px;color:#796291}.reading-metrics small{font-size:14px}.reading-word-feedback{display:flex;flex-wrap:wrap;gap:12px}.reading-word{display:grid;gap:7px;padding:12px 18px;border:1px solid #e2e8d6;border-radius:12px;background:#f5f8ee}.reading-word strong{font-size:25px}.reading-word small{color:#7b826e}.reading-word-review{background:#fff5e8;border-color:#efdfc9}.reading-assessment button:focus-visible,.reading-assessment select:focus-visible,.reading-assessment input:focus-visible{outline:3px solid #ad93d0;outline-offset:3px}.reading-assessment .button:disabled{opacity:.55;cursor:not-allowed}@media(max-width:850px){.reading-layout{grid-template-columns:1fr}.reading-pickers{grid-template-columns:1fr}.reading-main,.reading-submit,.reading-result{padding:20px}.reading-target{min-height:200px}}
.reading-activity{display:grid;gap:12px;text-align:center;padding:14px;border-radius:16px;background:#f4f8f1;scroll-margin-block:100px}.reading-activity p{margin:0;font-weight:600;line-height:1.7;color:#496449}.reading-activity p:empty{display:none}.reading-activity .reading-live{justify-self:center}.reading-volume{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}.reading-volume meter{width:min(260px,100%);height:18px}.reading-volume span{font-size:13px;color:#53664d}.reading-message{scroll-margin-block:100px}.reading-message:empty{display:none}.reading-main .reading-result,.reading-partial{margin:18px 0;padding:20px;border:1px solid #e4dfec;border-radius:18px;background:#fbf9fe;scroll-margin-block:100px}.reading-partial{background:#f4f8f1;border-color:#dce8d4}.reading-partial h2{font-size:19px;line-height:1.6}.reading-partial h2 small{display:block;font-size:13px;font-weight:400;color:#69795d}.reading-partial>p{font-size:14px;line-height:1.7;color:#53664d}.reading-controls{margin-top:18px}.reading-submit .reading-consent{padding:14px;border:1px solid #d9cce9;border-radius:14px;background:#faf7ff}.reading-result:focus,.reading-message:focus,.reading-activity:focus{outline:2px solid #ad93d0;outline-offset:4px}@media(max-width:850px){.reading-submit{grid-row:1}.reading-main .reading-result,.reading-partial{padding:16px}.reading-activity{padding:12px}.reading-partial .reading-word{padding:8px 10px}}
