.word-coach{margin-top:20px;border:1px solid #d5e2f0;border-radius:13px;background:#fff;overflow:hidden;min-width:0}.word-coach-tabs{display:flex;gap:4px;background:#eaf1fa;padding:5px}.word-coach-tabs button{flex:1;min-width:0;min-height:44px;border:0;border-radius:8px;background:transparent;color:#506c8b;font-size:11px;font-weight:500;line-height:1.7;font-family:inherit;cursor:pointer;padding:7px}.word-coach-tabs button[aria-selected=true]{background:#fff;color:#285c96;box-shadow:0 2px 7px #254c7710}.word-coach-panel{padding:17px;min-width:0}.word-coach button:focus-visible,.phoneme-select:focus-visible{outline:2px solid #356eaf;outline-offset:3px}.word-detail .word-phonemes>div{padding:0;overflow:visible}.phoneme-select{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:100%;min-height:67px;padding:9px 5px 11px;border:0;border-radius:7px;background:transparent;position:relative;overflow:hidden;cursor:pointer;font-family:inherit}.word-phonemes>div.selected{outline:2px solid #356eaf;outline-offset:2px}.word-phonemes>div.selected::after{content:'';display:block;width:5px;height:5px;border-radius:50%;background:#356eaf;position:absolute;top:-2px;right:-2px}
.wave-intro strong{font-size:12px;font-weight:600;color:#2c527c}.wave-intro p{font-size:11px;color:#52677d;line-height:1.9;margin:5px 0 13px}.word-waveform>.button{font-size:11px;min-height:44px}.wave-status{font-size:11px;line-height:1.9;color:#52677d;margin:10px 0 0}.wave-status:empty{display:none}.wave-row{border:1px solid #dbe6f3;border-radius:10px;padding:12px;margin-top:12px;background:#f6f9fe}.wave-row.learner{background:#fbf8f2;border-color:#e9dcc6}.wave-row-head{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:8px}.wave-row-head>span{font-size:10px;color:#3f628a}.wave-row-head small{font-size:10px;white-space:nowrap;color:#6a7d92;font-variant-numeric:tabular-nums}.wave-row.learner .wave-row-head>span{color:#805b2d}.wave-chart{height:67px;position:relative;overflow:hidden;border-radius:6px;background:linear-gradient(90deg,transparent calc(50% - .5px),#d7e3f1 50%,transparent calc(50% + .5px))}.wave-chart svg{width:100%;height:100%;display:block}.wave-signal{fill:#467fb8;fill-opacity:.87}.learner .wave-signal{fill:#b38a50}.wave-baseline{stroke:#c8d8e9;stroke-width:1;fill:none}.wave-cursor{stroke:#233e60;stroke-width:2}.wave-seek{position:absolute;inset:0 auto 0 0;margin:0!important;padding:0!important;min-height:0!important;height:100%;border:0!important;opacity:0;cursor:crosshair;direction:ltr;outline:none}.wave-chart:focus-within{outline:2px solid #356eaf;outline-offset:2px}.wave-row-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:6px}.wave-play{min-width:52px;min-height:44px;padding:5px 11px;background:#fff;border:1px solid #c9d9eb;border-radius:7px;color:#315f92;font-size:11px;line-height:1.6;font-family:inherit;cursor:pointer}.wave-position{font-size:10px;color:#52677d;direction:ltr;font-variant-numeric:tabular-nums}.wave-axis{display:flex;justify-content:space-between;font-size:9px;color:#607895;margin:6px 12px 0;font-variant-numeric:tabular-nums}.wave-note,.wave-unavailable{font-size:10px;line-height:1.9;color:#60738a;margin:12px 0}.wave-unavailable{padding:12px;background:#f3f6fa;border-radius:8px}.wave-compare{margin-top:8px;width:100%;min-height:44px}.wave-row button:disabled,.word-waveform>.button:disabled{opacity:.55;cursor:not-allowed}
.articulation-head{display:flex;align-items:center;gap:15px;justify-content:space-between}.articulation-head>div:first-child{flex-shrink:0;text-align:center}.articulation-head .eyebrow{font-size:9px}.articulation-ipa{display:block;font:500 31px/1.6 Georgia,serif;color:#2c6098;direction:ltr}.articulation-head>div:last-child{display:flex;flex-direction:column;gap:5px;min-width:0}.articulation-head b{font-size:12px;font-weight:550;color:#345b85}.articulation-head span:not(.eyebrow){font-size:10px;line-height:1.8;color:#637a94}.articulation-figure{margin:15px 0 13px;border:1px solid #e0e9f3;border-radius:12px;background:linear-gradient(150deg,#f8fbff,#eaf2fb);padding:10px 7px}.articulation-figure svg{display:block;width:100%;height:auto;aspect-ratio:350/260;max-height:240px}.tract-outline{fill:#fff;stroke:#8ba3bd;stroke-width:2;stroke-linejoin:round}.tract-wall{fill:none;stroke:#acbdcf;stroke-width:2.5;stroke-linecap:round}.tract-nose{fill:none;stroke:#d0ddeb;stroke-width:3}.tract-velum{fill:none;stroke:#a4b8ce;stroke-width:5;stroke-linecap:round}.tract-teeth{fill:#fff;stroke:#8ba3bd;stroke-width:1.5}.tract-tongue{fill:#90b8de;stroke:#356eaf;stroke-width:2;stroke-linejoin:round;transition:d .45s ease}.tract-lips{fill:none;stroke:#356eaf;stroke-width:4;stroke-linecap:round}.tract-air{fill:none;stroke:#4a80b5;stroke-width:2;stroke-dasharray:5 5;opacity:.7}.tract-vocal path{fill:none;stroke:#829cb8;stroke-width:2.5;stroke-linecap:round}.tract-vocal.voiced path{stroke:#b08048}.tract-labels text{fill:#4c6b8c;font:10px sans-serif}.tract-callout{fill:none;stroke:#b5c6d8;stroke-width:1}.articulation-figure figcaption{font-size:9px;text-align:center;color:#5b7694;line-height:1.8;margin-top:3px}.articulation-instruction{font-size:12px;line-height:2;color:#3e5f82;margin:10px 0 14px}.articulation-actions{display:flex;align-items:center;gap:13px;flex-wrap:wrap}.articulation-actions .button{font-size:10px;min-height:44px}.articulation-actions .text-button{font-size:10px;min-height:44px}.articulation-note{font-size:10px;line-height:1.9;color:#667b91;margin:12px 0 0}.articulation-sources{margin-top:13px;border-top:1px solid #e1eaf4;padding-top:10px}.articulation-sources summary{font-size:10px;color:#607a97;cursor:pointer}.articulation-sources a{display:block;color:#356eaf;font-size:10px;margin-top:7px}.articulation-guide.moving .tract-air{animation:tract-flow .7s linear infinite}.articulation-guide.moving .tract-vocal.voiced{transform-origin:96px 211px;animation:tract-voice .16s linear infinite alternate}.articulation-guide[data-air=release].moving .tract-air{opacity:.1}.articulation-guide[data-air=release].moving.articulation-step .tract-air{opacity:1}
@keyframes tract-flow{to{stroke-dashoffset:-20}}@keyframes tract-voice{to{transform:translateX(1.4px)}}
@container(max-width:440px){.word-coach-panel{padding:14px}.word-coach-tabs button{font-size:10px}.wave-row{padding:10px}.wave-row-head{gap:5px}.wave-row-head>span{font-size:9px}.wave-row-head small{font-size:9px}.wave-chart{height:61px}.articulation-head{gap:9px}.articulation-head b{font-size:11px}.articulation-head .eyebrow{font-size:8px}.articulation-ipa{font-size:27px}.articulation-instruction{font-size:11px}.articulation-actions{gap:8px}}
@media(prefers-reduced-motion:reduce){.tract-tongue{transition:none}.articulation-guide.moving .tract-air,.articulation-guide.moving .tract-vocal.voiced{animation:none}}

.articulation-head>div:last-child{flex:1;overflow-wrap:anywhere;white-space:normal}.articulation-head>div:last-child b,.articulation-head>div:last-child span{white-space:normal;max-width:100%}
.shadow-lesson {
 display:grid;
 gap:12px;
 margin-block-end:20px;
 padding:clamp(14px, 3vw, 24px);
 border:1px solid #cbdbee;
 border-radius:16px;
 background:#f3f7fc;
 scroll-margin-top:16px;
}
.shadow-lesson > p {margin:0;}
.shadow-lesson-actions {
 display:flex;
 flex-wrap:wrap;
 gap:10px;
}
.word-analysis-focused .word-detail {
 padding:0;
 border:0;
 background:transparent;
}
.word-analysis-focused .word-coach {
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr));
 gap:12px;
 align-items:start;
}
.word-analysis-focused .word-coach-panel {
 min-width:0;
 margin:0;
}
.speech-accent {
 display:flex;
 align-items:center;
 flex-wrap:wrap;
 gap:8px;
 padding-block-end:12px;
 color:var(--muted);
 font-size:.8rem;
}
.speech-accent select {
 min-height:36px;
 max-width:100%;
}
.practice-feedback .compare-row {flex-wrap:wrap;}
.source-accent-badge {
 display:inline-flex;
 flex-wrap:wrap;
 gap:.45em;
 justify-self:start;
 width:fit-content;
 max-width:100%;
 margin:.35rem 0;
 padding:.35rem .65rem;
 border:1px solid #bbd0ea;
 border-radius:.6rem;
 background:#e4eefb;
 color:#244c78;
 font-weight:800;
}
.source-accent-badge span {font-weight:600;}
.quick-pick .source-accent-badge {color:#244c78;}
.phoneme-diagnosis {
  padding: 9px 12px;
  background: var(--accent-soft);
  border-inline-start: 3px solid var(--primary);
  border-radius: 8px;
  font-size: .88rem;
}
.phoneme-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-block: 8px; }
.phoneme-controls button { min-height: 44px; }
.phoneme-practice {
  width: min(32rem, calc(100% - 24px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  padding: 20px;
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 16px;
}
.phoneme-practice::backdrop { background: #172b48a8; }
.phoneme-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.phoneme-dialog-header h2 { margin: 0; font-size: 1.25rem; }
.phoneme-practice .phoneme-dialog-header [data-close] { width: auto; min-width: 66px; flex: 0 0 auto; margin: 0; }
.phoneme-practice .phoneme-controls > :is(.button,.text-button) { width: auto; flex: 0 1 auto; margin: 0; }
.phoneme-target-row { padding: 12px 0; }
.phoneme-target { color: var(--accent-ink); font: 1.65rem/1.4 Georgia, serif; overflow-wrap: anywhere; margin: 4px 0 10px; text-align: center; }
.phoneme-picker, .phoneme-carriers { display: flex; flex-wrap: wrap; gap: 6px; }
.phoneme-picker { justify-content: center; }
.phoneme-picker button, .phoneme-carriers button {
  min-height: 44px;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
  color: var(--ink);
}
.phoneme-picker button { min-width: 44px; display: grid; justify-items: center; align-content: center; font: 1.1rem/1.15 Georgia, serif; }
.phoneme-picker button b { font-weight: 500; }
.phoneme-picker button small { margin-top: 3px; font: .72rem/1.1 system-ui, sans-serif; }
.phoneme-picker button[data-progress=passed] { background: var(--success-soft); color: var(--success); }
.phoneme-picker button[data-progress=review] { background: var(--warning-soft); color: var(--warning); }
.phoneme-progress { margin: 8px 0 0; color: var(--muted); text-align: center; }
.phoneme-picker button[data-review=true]:not([aria-pressed=true]) { background: var(--warning-soft); color: var(--warning); }
.phoneme-picker button[aria-pressed=true], .phoneme-carriers button[aria-pressed=true] {
  color: var(--accent-ink);
  background: var(--accent-soft);
  border-color: var(--accent-ink);
  box-shadow: inset 0 0 0 1px var(--accent-ink);
}
.phoneme-step { padding: 12px; margin-block: 8px; border: 1px solid var(--line); border-radius: 12px; }
.phoneme-step h3 { margin: 0 0 8px; font-size: .98rem; }
.phoneme-step .phoneme-instruction { margin: 7px 0; color: var(--muted); font-size: .85rem; }
.phoneme-test [data-record] { width: 100%; min-height: 44px; }
.phoneme-meter { display: flex; align-items: center; gap: 8px; font-size: .82rem; margin-top: 8px; }
.phoneme-meter .level-track { flex: 1; }
.phoneme-result { background: var(--accent-soft); }
.phoneme-result [data-result] { margin: 0; }
.phoneme-result summary { cursor: pointer; font-size: .85rem; }
.phoneme-practice [data-status] { margin: 8px 0 0; }
.phoneme-practice [data-result] { font-weight: 650; }
.phoneme-practice audio { max-width: 100%; }
.phoneme-practice .saved-path { overflow-wrap: anywhere; font-size: .8rem; }
