.na-audio{position:relative;display:inline-flex;align-items:center;justify-content:center;vertical-align:baseline;width:20px;height:20px;margin-inline-start:4px;padding:0;border:1px solid currentColor;border-radius:50%;background:transparent;color:inherit;cursor:pointer;line-height:1;font:inherit;transition:transform .15s ease;}
.na-audio svg{width:12px;height:12px;pointer-events:none;}
h1 .na-audio svg,h2 .na-audio svg,h3 .na-audio svg{width:14px;height:14px;}
h1 .na-audio,h2 .na-audio,h3 .na-audio{width:24px;height:24px;}
.na-audio::before{content:'';position:absolute;inset:-12px;}
.na-audio:focus-visible{outline:2px solid currentColor;outline-offset:4px;}
.na-audio[aria-pressed=true]{opacity:.55;}
.na-audio-wort{white-space:nowrap;}
.na-audio-beschriftet{border:0;border-radius:0;width:auto;height:auto;gap:6px;margin-inline-start:12px;font-size:.85em;}

.na-audio-beschriftet svg{box-sizing:border-box;width:18px;height:18px;padding:3px;border:1px solid currentColor;border-radius:50%;}

/* Maxim 12.10.2026, 18:26: Grow-Hover und Spinner, bis die Aufnahme spielt. */
.na-audio:hover,.na-audio:focus-visible{transform:scale(1.2);}
.na-audio-beschriftet:hover,.na-audio-beschriftet:focus-visible{transform:none;}
.na-audio-beschriftet:hover svg,.na-audio-beschriftet:focus-visible svg{transform:scale(1.2);}
.na-audio-beschriftet svg{transition:transform .15s ease;}
.na-audio-laedt:not(.na-audio-beschriftet)::after{content:'';position:absolute;inset:-3px;border-radius:50%;border:1.5px solid transparent;border-top-color:currentColor;animation:na-audio-dreh .7s linear infinite;}
.na-audio-laedt:not(.na-audio-beschriftet) svg{opacity:.35;}
.na-audio-beschriftet.na-audio-laedt svg{border-color:transparent;border-top-color:currentColor;animation:na-audio-dreh .7s linear infinite;}
.na-audio[aria-pressed=true].na-audio-laedt{opacity:1;}
@keyframes na-audio-dreh{to{transform:rotate(360deg);}}
@media (prefers-reduced-motion:reduce){.na-audio,.na-audio-beschriftet svg{transition:none;}.na-audio:hover,.na-audio:focus-visible,.na-audio-beschriftet:hover svg{transform:none;}.na-audio-laedt::after,.na-audio-laedt svg{animation-duration:2s;}}