/* Phonology tools are original HTML/SVG teaching diagrams, based on the official IPA taxonomy. */
.phonology-lab{max-width:1120px;margin:38px 0 75px;padding:clamp(20px,3.5vw,42px);border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:0 15px 35px rgba(40,45,33,.055)}
.phonology-lab h2{margin:0 0 12px;font-size:clamp(2.1rem,3.4vw,3.6rem)}
.phonology-lab h3{margin:36px 0 12px;font-size:clamp(1.4rem,2vw,2rem)}
.phonology-lab p{max-width:80ch;color:var(--ink-soft);line-height:1.75}
.phonology-lab__intro{margin-bottom:28px}
.phonology-lab__nav{display:flex;flex-wrap:wrap;gap:9px;margin:23px 0 32px}
.phonology-lab__nav a,.tract-key{display:inline-flex;align-items:center;min-height:42px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:linear-gradient(135deg,var(--surface),var(--surface-2));color:var(--ink);font-weight:750;font-size:.8rem;text-decoration:none}
.phonology-lab__nav a:hover,.tract-key:hover,.tract-key[aria-pressed="true"]{border-color:var(--accent);color:var(--accent-hover)}
.ipa-table-wrap{max-width:100%;overflow:auto;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.ipa-table{width:100%;min-width:790px;border-collapse:collapse;text-align:center}
.ipa-table caption{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.ipa-table th,.ipa-table td{padding:8px 5px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);vertical-align:middle}
.ipa-table th{min-width:65px;background:var(--surface-2);font-size:.72rem;line-height:1.3}
.ipa-table tbody th{text-align:left;min-width:126px}
.ipa-table td:last-child,.ipa-table th:last-child{border-right:0}
.ipa-table tr:last-child td,.ipa-table tr:last-child th{border-bottom:0}
.ipa-cell{display:flex;justify-content:center;gap:3px;min-height:36px;align-items:center}
.ipa-cell--empty{color:var(--muted);font-size:.65rem}
.ipa-cell--impossible{background:repeating-linear-gradient(-45deg,transparent,transparent 5px,color-mix(in srgb,var(--line) 34%,transparent) 5px,color-mix(in srgb,var(--line) 34%,transparent) 9px)}
.ipa-cell--right-impossible{background:linear-gradient(90deg,transparent 0 50%,color-mix(in srgb,var(--line) 43%,var(--surface)) 50% 100%)}
.ipa-token{display:inline-grid;place-items:center;min-width:36px;min-height:36px;padding:3px 6px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--ink);font:500 1.4rem/1 Georgia,"Times New Roman",serif}
.ipa-token{font-family:"DejaVu Sans","Noto Sans","Arial Unicode MS",Arial,sans-serif}
.ipa-token:hover,.ipa-token[aria-pressed="true"]{border-color:var(--accent);background:var(--surface-2);color:var(--accent-hover)}
.ipa-token--wide{min-width:59px;font-size:1.15rem}
.ipa-inspector,.tract-inspector{margin:20px 0 0;padding:20px 24px;border-left:4px solid var(--gold);border-radius:0 12px 12px 0;background:var(--surface-2)}
.ipa-inspector{position:sticky;top:83px;z-index:4;display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 18px;align-items:center;margin:0 0 25px;border:1px solid var(--line);border-left:4px solid var(--gold);box-shadow:0 8px 24px rgba(38,40,30,.12)}
.ipa-inspector__symbol{grid-row:1/3;min-width:74px;text-align:center}
.ipa-inspector p{grid-column:2}
.ipa-inspector strong,.tract-inspector strong{display:block;font:500 1.55rem Georgia,"Times New Roman",serif}
.ipa-inspector__symbol{display:block;margin:0 0 7px;color:var(--accent-hover);font:500 2.5rem Georgia,"Times New Roman",serif}
.ipa-inspector p,.tract-inspector p{margin:8px 0 0;font-size:.88rem}
.ipa-group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px}
.ipa-group{padding:17px;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--surface) 80%,var(--surface-2))}
.ipa-group h4{margin:0 0 8px;font:500 1.45rem Georgia,"Times New Roman",serif}
.ipa-group p{margin:5px 0 0;font-size:.76rem;line-height:1.5}
.ipa-token-line{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px}
.ipa-token-line span{color:var(--ink-soft);font-size:.75rem}
.ipa-legend{margin:12px 0;color:var(--ink-soft);font-size:.75rem}
.tract-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(220px,.75fr);gap:24px;align-items:start}
.tract-figure{margin:0;padding:12px;border:1px solid var(--line);border-radius:16px;background:#f4ead6}
.tract-figure svg{width:100%;height:auto;display:block}
.tract-figure figcaption{padding:5px 10px 0;color:var(--ink-soft);font-size:.72rem;line-height:1.55}
.tract-map-point{fill:#fffdf8;stroke:#aa6139;stroke-width:3;transition:fill .15s,stroke .15s}
.tract-map-point.is-selected{fill:#c45e29;stroke:#562e1d}
.tract-map-label{fill:#153a33;font:600 13px Inter,Arial,sans-serif}
.tract-keys{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.tract-key{cursor:pointer}
.manner-figure{padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:#f4ead6}
.manner-figure svg{display:block;width:100%;height:auto}
.manner-figure p{margin:13px 0 0;font-size:.84rem;line-height:1.7}
.ipa-source-pill{width:max-content;max-width:100%;margin-top:28px;color:var(--ink-soft);font-size:.76rem}
.ipa-source-pill summary{width:max-content;padding:6px 11px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2);color:var(--ink);font-weight:750;cursor:pointer}
.ipa-source-pill p{max-width:75ch;margin:12px 0 0;font-size:.76rem;line-height:1.65}
.ipa-source-pill a{color:var(--accent-hover);text-underline-offset:3px}
@media(max-width:800px){.tract-layout{grid-template-columns:1fr}.ipa-table{min-width:700px}}
@media(max-width:580px){.phonology-lab{padding:21px 15px}.ipa-table{min-width:690px}.ipa-token{min-width:33px}.tract-figure{padding:5px}.tract-map-label{font-size:11px}}
@media(max-width:580px){.ipa-inspector{top:65px;padding:10px 12px;gap:0 10px}.ipa-inspector__symbol{min-width:47px;font-size:1.9rem}.ipa-inspector strong{font-size:1.1rem}.ipa-inspector p{font-size:.71rem;line-height:1.35}}
@media(prefers-reduced-motion:reduce){.tract-map-point{transition:none}}