/* Page narration: native controls with the site's shared theme colours. */
.page-audio{
  position:relative;width:100%;max-width:100%;min-width:0;margin:0 0 20px;
  padding:clamp(12px,1.5vw,16px);border:1px solid var(--cizgi-2);
  border-radius:var(--r);background:var(--zemin-yumusak);box-shadow:var(--sh-xs);
  color:var(--metin-2);overflow-wrap:anywhere;
}
.page-audio-heading{
  display:flex;align-items:center;justify-content:space-between;
  gap:8px 12px;margin-bottom:6px;min-width:0;
}
.page-audio-heading h2,.page-audio-heading h3{
  flex:1 1 auto;min-width:0;margin:0;font-size:1rem;line-height:1.3;letter-spacing:-.015em;
}
.page-audio audio{
  display:block;width:100%;max-width:100%;min-width:0;height:44px;
  border-radius:var(--r-sm);
}
.page-audio-settings{
  display:flex;align-items:center;flex:0 0 auto;gap:6px;margin:0;
}
.page-audio-settings label{
  margin:0;font-size:.75rem;font-weight:600;color:var(--metin);white-space:nowrap;
}
.page-audio [data-audio-speed]{
  width:88px;max-width:100%;height:44px;padding:6px 8px;
  border:1.5px solid var(--cizgi-2);border-radius:var(--r-sm);
  background:var(--yuzey);color:var(--metin);font:inherit;font-size:.85rem;
  line-height:1.4;cursor:pointer;
}
.page-audio [data-audio-speed]:focus-visible{
  outline:3px solid var(--vurgu);outline-offset:2px;border-color:var(--marka);
}
.page-audio [data-audio-speed]:disabled{
  color:var(--metin-soluk);cursor:default;opacity:.7;
}
.page-audio [data-audio-status]{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0;
}
.page-audio [data-audio-error]{
  margin:8px 0 0;padding:8px 10px;border:1px solid var(--vurgu-koyu);
  border-radius:var(--r-sm);background:var(--vurgu-yumusak);color:var(--metin);
  font-size:.875rem;line-height:1.6;
}
.page-audio [hidden]{display:none!important}
@media (max-width:420px){
  .page-audio-heading{column-gap:8px}
  .page-audio [data-audio-speed]{width:80px}
}
