.shadow-dialog{width:min(820px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:0;border:0;border-radius:28px;color:#16213b;background:#f5f7fc;box-shadow:0 30px 100px #10275640;overflow:auto}.shadow-dialog::backdrop{background:#111d3f99;backdrop-filter:blur(5px)}.shadow-dialog *{box-sizing:border-box}.shadow-dialog button,.shadow-dialog select{font:inherit}.shadow-dialog button{cursor:pointer}.shadow-dialog button:disabled{cursor:not-allowed;opacity:.45}.shadow-dialog button:focus-visible,.shadow-dialog select:focus-visible,.shadow-dialog input:focus-visible,.shadow-dialog summary:focus-visible{outline:3px solid #7899ff;outline-offset:3px}.shadow-header{padding:28px 30px 24px;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;background:#fff}.shadow-eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:800;color:#587198}.shadow-header h2{font-size:24px;margin:8px 0}.shadow-header p{font-size:12px;color:#748199;margin:0}.shadow-close{background:#f1f4fa;border:0;border-radius:50%;width:36px;height:36px;font-size:25px!important;line-height:30px;color:#68768f;flex-shrink:0}.shadow-tabs{display:flex;gap:7px;background:#fff;padding:0 30px 18px;position:sticky;top:0;z-index:2;border-bottom:1px solid #e7ecf4}.shadow-tabs button{flex:1;border:0;background:transparent;color:#748199;border-radius:12px;padding:12px 7px;font-weight:650;font-size:13px}.shadow-tabs button.active{background:#2454ec;color:#fff}.shadow-tabs small{font-size:10px;opacity:.7;margin-left:7px}.shadow-body{padding:25px 30px 20px}.shadow-stepbar{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:18px;font-weight:750}.shadow-stepbar small{font-size:12px;font-weight:500;color:#9aa5b8}.shadow-stepbar button{border:0;background:#fff;color:#876727;padding:10px 13px;border-radius:12px;font-size:12px}.shadow-stepbar button[aria-pressed=true]{background:#fff0c7}.shadow-track{height:4px;background:#e3e9f5;border-radius:8px;overflow:hidden;margin:16px 0 22px}.shadow-track i{display:block;height:100%;background:#2454ec}.shadow-reading,.shadow-recorder,.shadow-text-practice,.shadow-feedback{background:#fff;padding:23px;border-radius:20px;margin-bottom:16px;border:1px solid #e5eaf4}.shadow-reading{box-shadow:0 8px 24px #1b3a7d06}.shadow-section-title{display:flex;justify-content:space-between;gap:15px;align-items:center}.shadow-section-title h3{font-size:15px;margin:0}.shadow-section-title>span:not(.shadow-eyebrow){font-size:10px;color:#8a96aa}.shadow-section-title>button{border:0;background:transparent;color:#7c8aa2;font-size:11px;padding:5px}.shadow-target{font-family:Georgia,'Times New Roman',serif;font-size:27px;line-height:1.65;letter-spacing:.1px;margin:22px 0 25px;color:#233b64}.shadow-hidden{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:140px;color:#4566a0;font-size:18px;background:repeating-linear-gradient(0deg,#f7f9fd,#f7f9fd 29px,#eaf0fa 30px);border-radius:12px;margin:20px 0;gap:14px}.shadow-hidden small{font-size:11px;color:#9aa5b8}.shadow-player,.shadow-record-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.shadow-primary,.shadow-secondary,.shadow-stop{border-radius:12px;padding:12px 17px;font-size:12px;font-weight:700;min-height:43px;border:1px solid transparent}.shadow-primary{background:#2454ec;color:white}.shadow-secondary{border-color:#dce4f2;background:#fff;color:#45618c}.shadow-stop{background:#d84555;color:#fff;animation:shadowPulse 2s infinite}.shadow-speed{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:11px;color:#8896ad}.shadow-speed select{border:1px solid #dce4f2;border-radius:9px;background:#fff;padding:8px 5px;color:#46608c;font-size:12px}.shadow-loop{font-size:11px;color:#7585a0;display:flex;align-items:center;gap:5px}.shadow-dialog input[type=checkbox]{accent-color:#2454ec;width:16px;height:16px;flex-shrink:0}.shadow-note{font-size:11px;line-height:1.85;color:#8b98ad;margin:10px 0 16px}.shadow-warning{font-size:11px;line-height:1.8;color:#8c6b32;padding:12px;border-radius:10px;background:#fff6e6}.shadow-review{margin:18px 0 0;border:0;background:#edf7f3;color:#28846b;width:100%;font-size:12px;border-radius:10px;padding:12px}.shadow-review:disabled{background:#f0f3f7;color:#8b98ad}.shadow-consent{display:flex;align-items:flex-start;gap:9px;font-size:11px;line-height:1.7;color:#667995;margin:14px 0}.shadow-consent input{margin:1px 0}.shadow-text-practice>.shadow-secondary{margin:2px 0 5px}.shadow-feedback{padding:18px 0 0;border:0;border-radius:0;border-top:1px solid #edf0f7;margin:20px 0 0}.shadow-feedback .shadow-section-title h3{font-size:13px}.shadow-word-list{display:flex;flex-wrap:wrap;gap:8px}.shadow-word{border-radius:8px;padding:9px 10px;font-size:16px;display:inline-flex;flex-direction:column;gap:4px;align-items:center;min-width:40px}.shadow-word small{font-family:system-ui,sans-serif;font-size:9px;opacity:.8}.shadow-word.match{background:#e8f5ed;color:#27805e}.shadow-word.missing{background:#edf0f6;color:#8d98ac;border:1px dashed #bec8d9}.shadow-word.mismatch{background:#fff1db;color:#a17227}.shadow-extra{font-size:11px;color:#937642;line-height:1.8}.shadow-recognized{font-size:11px;color:#8191aa;margin-top:18px}.shadow-recognized summary{cursor:pointer}.shadow-recognized p{font-size:14px;color:#45618c;line-height:1.7}.shadow-legend{display:flex;flex-wrap:wrap;gap:14px;font-size:10px;margin-top:17px}.shadow-legend .match{color:#27805e}.shadow-legend .mismatch{color:#a17227}.shadow-legend .missing{color:#8d98ac}.shadow-interim{background:#f6f8fd;font-size:13px;color:#5375a7;padding:13px;border-radius:10px;line-height:1.7}.shadow-navigation{display:flex;gap:10px;justify-content:space-between;margin-top:24px}.shadow-navigation button{font-size:11px;padding:12px}.shadow-status{font-size:12px;min-height:20px;line-height:1.8;color:#5c77a1;margin:18px 0 0}.shadow-intro{margin:3px 0 25px}.shadow-intro h3{font-size:20px;margin:10px 0}.shadow-intro p{font-size:12px;color:#8b98ad;line-height:1.9}.shadow-sentence-list{display:grid;gap:12px}.shadow-sentence-list>button{display:flex;align-items:center;text-align:left;border:1px solid #e3eaf5;background:#fff;padding:16px;border-radius:16px;gap:16px;color:#486185}.shadow-sentence-list>button.selected{border-color:#9cb2f8;background:#f4f7ff}.shadow-sentence-list>button>span{font-size:12px;color:#a7b4ca}.shadow-sentence-list p{font-size:15px;line-height:1.7;margin:0;flex:1}.shadow-sentence-list p small{display:block;font-size:10px;margin-top:8px;color:#94a0b4}.shadow-sentence-list>button>small{font-size:10px;color:#8a9ab4;white-space:nowrap}.shadow-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 24px}.shadow-metrics>div{background:#fff;border:1px solid #e5eaf4;border-radius:16px;padding:20px 12px;display:flex;flex-direction:column;gap:8px;text-align:center}.shadow-metrics b{font-size:25px;color:#2454ec}.shadow-metrics b small{font-size:12px;color:#a4afc1;font-weight:500}.shadow-metrics span{font-size:10px;color:#8896ad}@keyframes shadowPulse{50%{box-shadow:0 0 0 5px #d8455510}}@media(max-width:600px){.shadow-dialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;border-radius:0}.shadow-header{padding:24px 20px 20px}.shadow-header h2{font-size:22px}.shadow-tabs{padding:0 20px 16px}.shadow-body{padding:22px 16px calc(20px + env(safe-area-inset-bottom))}.shadow-reading,.shadow-recorder,.shadow-text-practice{padding:19px 17px;border-radius:18px}.shadow-target{font-size:25px;line-height:1.65;margin:24px 0}.shadow-player{gap:8px}.shadow-player>.shadow-primary{padding:12px 14px}.shadow-record-actions{gap:9px}.shadow-record-actions>button{flex:1;padding:12px 8px}.shadow-section-title{gap:8px}.shadow-section-title>span:not(.shadow-eyebrow){font-size:9px}.shadow-stepbar{font-size:17px}.shadow-stepbar button{font-size:10px}.shadow-sentence-list>button{gap:11px;padding:15px 12px;align-items:flex-start}.shadow-sentence-list p{font-size:14px}.shadow-sentence-list>button>small{font-size:9px;margin-top:4px}.shadow-navigation{gap:7px}.shadow-navigation button{padding:12px 10px;font-size:10px}.shadow-word{font-size:15px;padding:9px}.shadow-metrics{gap:8px}.shadow-metrics>div{padding:18px 8px}}@media(prefers-reduced-motion:reduce){.shadow-stop{animation:none}}

.shadow-recent{margin-top:26px;padding:20px;background:#fff;border:1px solid #e5eaf4;border-radius:16px}.shadow-recent h3{font-size:14px;margin:0 0 14px}.shadow-recent>div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0;border-top:1px solid #edf1f7;font-size:11px;color:#6780a3}.shadow-recent small{font-size:10px;color:#94a0b4;text-align:right}@media(max-width:600px){.shadow-recent>div{align-items:flex-start;flex-direction:column;gap:6px}.shadow-recent small{text-align:left}}
.shadow-section-title>button{white-space:nowrap;flex-shrink:0}.shadow-section-title>.shadow-eyebrow{min-width:0;white-space:normal}html:has(.shadow-dialog[open]),body:has(.shadow-dialog[open]){overflow:hidden}
