/* Shared, optional audio examples on the Words page and first-words guide. */
.word-demo-controls{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.word-demo-controls .word-demo-play{display:inline-flex;align-items:center;gap:9px;min-height:44px;max-width:100%;padding:10px 13px;border:1px solid var(--hairline);border-radius:12px;background:var(--card,#fff);color:var(--ink);font:inherit;font-size:15px;font-weight:700;line-height:1.4;text-align:left;cursor:pointer}
.word-demo-play svg{flex:0 0 18px;width:18px;height:18px;color:var(--coral-ink)}
.word-demo-play span{min-width:0}
.word-demo-controls .word-demo-play:hover{border-color:var(--coral-ink)}
.word-demo-controls .word-demo-play.is-playing{background:var(--ink);color:#fff;border-color:var(--ink)}
.word-demo-play.is-playing svg{color:#fff}
.word-demo-play.is-loading{opacity:.65}
.word-demo-play.is-error{border-color:var(--coral-ink);text-decoration:underline dotted}
.word-demo-play:focus-visible{outline:3px solid var(--coral-ink);outline-offset:3px}
.word-demo-letters .word-demo-play{font-family:var(--serif);font-size:22px;justify-content:center;min-width:48px}
.word-demo-letters .word-demo-play:not(:last-child) svg{display:none}
.words-next-list p.word-demo-turn,.fw-family p.word-demo-turn{font-size:14px;line-height:1.5;color:var(--ink-2);margin:12px 0 0}
@media print{.word-demo-controls,.word-demo-turn{display:none}}
.words-bridge{display:flex;align-items:center;gap:28px;margin-top:32px;padding:28px;border:1px solid var(--hairline);border-radius:var(--r-card);background:var(--paper-warm,#fbf5e9)}
.words-bridge>img{width:160px;height:auto;flex:0 0 160px;border-radius:var(--r-tile)}
.words-bridge h3{font-family:var(--serif);font-size:24px;line-height:1.25;margin:0 0 10px;text-wrap:pretty}
.words-bridge p{font-size:16px;line-height:1.6;margin:0 0 12px;max-width:65ch}
.words-bridge .eyebrow{font-size:11px;margin-bottom:8px}
.words-bridge p.words-bridge-links{display:flex;flex-wrap:wrap;gap:12px 24px;margin-bottom:0;font-weight:800}
.words-bridge-links a{text-underline-offset:4px}
@media(max-width:600px){.words-bridge{display:block;padding:22px}.words-bridge>img{width:100px;margin-bottom:16px}.words-bridge h3{font-size:22px}}