/* Leitura em voz alta — Guia Essencial dos Tecidos */
.read-aloud{width:min(calc(100% - 2rem),47rem);margin:2rem auto 0;padding:1rem 1.1rem;border:1px solid rgba(57,65,47,.16);border-radius:1rem;background:rgba(247,243,234,.92);box-shadow:0 10px 28px rgba(67,58,45,.05);color:#2d2c28;font-family:Arial,Helvetica,sans-serif}
.read-aloud__row{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.read-aloud__heading{min-width:0;margin-right:auto}
.read-aloud__title{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:1.05rem;font-weight:500;color:#39412f}
.read-aloud__chapter{display:none;margin:.16rem 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6e6a61;font-size:.72rem;line-height:1.2;max-width:24rem}
.read-aloud__controls{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.read-aloud button{appearance:none;border:1px solid rgba(57,65,47,.22);border-radius:999px;background:#fff;color:#39412f;padding:.55rem .85rem;font:600 .84rem/1 Arial,Helvetica,sans-serif;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.read-aloud button:hover{background:#e5e9df;border-color:rgba(57,65,47,.34)}
.read-aloud button:active{transform:translateY(1px)}
.read-aloud button:focus-visible{outline:3px solid #8c6f52;outline-offset:3px}
.read-aloud button:disabled{opacity:.42;cursor:default;transform:none}
.read-aloud__status{width:100%;margin:.2rem 0 0;color:#6e6a61;font-size:.79rem;line-height:1.45}
.read-aloud[data-state="speaking"] .read-aloud__play{background:#e5e9df}
.read-aloud__speed{display:inline-flex;align-items:center;gap:.4rem;margin-left:.1rem;color:#6e6a61;font-size:.78rem;font-weight:600}
.read-aloud__speed span{white-space:nowrap}
.read-aloud__rate{appearance:auto;border:1px solid rgba(57,65,47,.22);border-radius:999px;background:#fff;color:#39412f;padding:.48rem .65rem;font:600 .82rem/1 Arial,Helvetica,sans-serif;cursor:pointer}
.read-aloud__rate:hover{background:#e5e9df;border-color:rgba(57,65,47,.34)}
.read-aloud__rate:focus-visible{outline:3px solid #8c6f52;outline-offset:3px}

/* Durante a leitura, o bloco se transforma em um mini-player fixo. */
.read-aloud[data-state="speaking"],
.read-aloud[data-state="paused"]{
  position:fixed;
  left:50%;
  bottom:max(1.2rem,calc(env(safe-area-inset-bottom) + .35rem));
  transform:translateX(-50%);
  width:min(calc(100% - 2.5rem),38rem);
  margin:0;
  padding:.62rem .72rem;
  z-index:60;
  border-color:rgba(57,65,47,.2);
  background:rgba(247,243,234,.97);
  box-shadow:0 14px 38px rgba(45,44,40,.16);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.read-aloud[data-state="speaking"] .read-aloud__row,
.read-aloud[data-state="paused"] .read-aloud__row{flex-wrap:nowrap;gap:.65rem}
.read-aloud[data-state="speaking"] .read-aloud__heading,
.read-aloud[data-state="paused"] .read-aloud__heading{flex:1 1 auto;min-width:7rem;margin-right:.2rem}
.read-aloud[data-state="speaking"] .read-aloud__title,
.read-aloud[data-state="paused"] .read-aloud__title{font-size:.9rem;line-height:1.1}
.read-aloud[data-state="speaking"] .read-aloud__title::before{content:"● ";font-size:.65em;vertical-align:.08em;color:#687356}
.read-aloud[data-state="paused"] .read-aloud__title::before{content:"Ⅱ ";font-family:Arial,Helvetica,sans-serif;font-size:.75em;color:#8c6f52}
.read-aloud[data-state="speaking"] .read-aloud__chapter,
.read-aloud[data-state="paused"] .read-aloud__chapter{display:block}
.read-aloud[data-state="speaking"] .read-aloud__status,
.read-aloud[data-state="paused"] .read-aloud__status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.read-aloud[data-state="speaking"] .read-aloud__controls,
.read-aloud[data-state="paused"] .read-aloud__controls{flex:0 0 auto;flex-wrap:nowrap;gap:.38rem}
.read-aloud[data-state="speaking"] button,
.read-aloud[data-state="paused"] button{padding:.48rem .68rem;font-size:.78rem}
.read-aloud[data-state="speaking"] .read-aloud__speed,
.read-aloud[data-state="paused"] .read-aloud__speed{gap:.25rem;margin-left:0;font-size:.7rem}
.read-aloud[data-state="speaking"] .read-aloud__speed span,
.read-aloud[data-state="paused"] .read-aloud__speed span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.read-aloud[data-state="speaking"] .read-aloud__rate,
.read-aloud[data-state="paused"] .read-aloud__rate{padding:.44rem .5rem;font-size:.76rem;min-width:4.35rem}
.read-aloud[data-state="paused"]{border-color:rgba(140,111,82,.34)}
body.read-aloud-active{padding-bottom:5.4rem}


.read-aloud__chapter-nav{display:none;align-items:center;gap:.28rem}
.read-aloud__chapter-nav a{display:inline-grid;place-items:center;width:2rem;height:2rem;border:1px solid rgba(57,65,47,.18);border-radius:999px;background:rgba(255,255,255,.78);color:#39412f;text-decoration:none;font:600 1rem/1 Arial,Helvetica,sans-serif;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.read-aloud__chapter-nav a:hover{background:#e5e9df;border-color:rgba(57,65,47,.32)}
.read-aloud__chapter-nav a:focus-visible{outline:3px solid #8c6f52;outline-offset:2px}
.read-aloud__chapter-nav a[aria-disabled="true"]{opacity:.28;pointer-events:none}
.read-aloud[data-state="speaking"] .read-aloud__chapter-nav,
.read-aloud[data-state="paused"] .read-aloud__chapter-nav{display:flex}

@media(max-width:680px){
  .read-aloud{width:min(calc(100% - 1.25rem),47rem);padding:.95rem}
  .read-aloud__row{align-items:flex-start}
  .read-aloud__heading{width:100%;margin-bottom:.15rem}
  .read-aloud__controls{width:100%}
  .read-aloud button{flex:1 1 auto}
  .read-aloud__speed{flex:1 1 100%;justify-content:flex-start;margin-top:.1rem}
  .read-aloud__rate{min-width:5rem}

  .read-aloud[data-state="speaking"],
  .read-aloud[data-state="paused"]{
    width:min(calc(100% - 1.25rem),38rem);
    bottom:max(.85rem,calc(env(safe-area-inset-bottom) + .25rem));
    padding:.62rem .68rem;
    border-radius:.9rem;
  }
  .read-aloud[data-state="speaking"] .read-aloud__row,
  .read-aloud[data-state="paused"] .read-aloud__row{align-items:center;flex-wrap:wrap;gap:.45rem}
  .read-aloud[data-state="speaking"] .read-aloud__heading,
  .read-aloud[data-state="paused"] .read-aloud__heading{width:100%;display:flex;align-items:baseline;gap:.45rem;margin:0}
  .read-aloud[data-state="speaking"] .read-aloud__title,
  .read-aloud[data-state="paused"] .read-aloud__title{flex:0 0 auto;font-size:.84rem}
  .read-aloud[data-state="speaking"] .read-aloud__chapter,
  .read-aloud[data-state="paused"] .read-aloud__chapter{flex:1 1 auto;min-width:0;margin:0;max-width:none;font-size:.68rem}
  .read-aloud[data-state="speaking"] .read-aloud__controls,
  .read-aloud[data-state="paused"] .read-aloud__controls{width:100%;display:grid;grid-template-columns:auto 1fr 1fr auto;gap:.34rem}
  .read-aloud[data-state="speaking"] .read-aloud__play,
  .read-aloud[data-state="paused"] .read-aloud__play{grid-column:2}
  .read-aloud[data-state="speaking"] .read-aloud__chapter-nav,
  .read-aloud[data-state="paused"] .read-aloud__chapter-nav{grid-column:1;grid-row:1}
  .read-aloud[data-state="speaking"] .read-aloud__pause,
  .read-aloud[data-state="paused"] .read-aloud__pause{grid-column:3}
  .read-aloud[data-state="speaking"] .read-aloud__stop,
  .read-aloud[data-state="paused"] .read-aloud__stop{grid-column:3}
  .read-aloud[data-state="speaking"] .read-aloud__speed,
  .read-aloud[data-state="paused"] .read-aloud__speed{grid-column:4;grid-row:1;align-self:stretch;display:flex;margin:0}
  .read-aloud[data-state="speaking"] .read-aloud__rate,
  .read-aloud[data-state="paused"] .read-aloud__rate{height:100%;min-width:4.4rem}
  .read-aloud[data-state="speaking"] .read-aloud__stop{display:none}
  .read-aloud[data-state="paused"] .read-aloud__pause{display:none}
  body.read-aloud-active{padding-bottom:7rem}
}

@media(prefers-reduced-motion:reduce){.read-aloud button{transition:none}}

/* V18.10 — bloco inicial mais nítido e destacado antes da leitura */
.read-aloud[data-state="idle"]{
  width:min(calc(100% - 2rem),42rem);
  margin-top:1.75rem;
  padding:1.15rem 1.2rem;
  border:1px solid rgba(88,99,73,.44);
  border-left:6px solid #667457;
  border-radius:1.1rem;
  background:linear-gradient(180deg,#f3ecdf 0%,#fbf7f0 100%);
  box-shadow:0 16px 34px rgba(67,58,45,.11);
}
.read-aloud[data-state="idle"] .read-aloud__row{
  align-items:center;
  gap:.9rem;
}
.read-aloud[data-state="idle"] .read-aloud__heading{
  flex:1 1 16rem;
  margin-right:.35rem;
}
.read-aloud[data-state="idle"] .read-aloud__title{
  font-size:1.24rem;
  font-weight:700;
  color:#2f3727;
  letter-spacing:.004em;
}
.read-aloud[data-state="idle"] .read-aloud__chapter{
  display:block;
  margin:.28rem 0 0;
  color:#546047;
  font-size:.82rem;
  line-height:1.35;
  max-width:28rem;
}
.read-aloud[data-state="idle"] .read-aloud__status{
  position:relative;
  margin-top:.42rem;
  padding-left:1.05rem;
  color:#5e584d;
  font-size:.82rem;
  line-height:1.45;
}
.read-aloud[data-state="idle"] .read-aloud__status::before{
  content:"•";
  position:absolute;
  left:.15rem;
  top:0;
  color:#667457;
  font-size:1rem;
  line-height:1.1;
}
.read-aloud[data-state="idle"] .read-aloud__controls{
  flex:0 0 auto;
  gap:.6rem;
}
.read-aloud[data-state="idle"] .read-aloud__play{
  position:relative;
  padding:.72rem 1.08rem .72rem 2.08rem;
  border-color:#667457;
  background:#667457;
  color:#fff;
  box-shadow:0 7px 16px rgba(70,82,59,.18);
}
.read-aloud[data-state="idle"] .read-aloud__play::before{
  content:"▶";
  position:absolute;
  left:.84rem;
  top:50%;
  transform:translateY(-49%);
  font-size:.72rem;
  line-height:1;
}
.read-aloud[data-state="idle"] .read-aloud__play:hover{
  background:#566449;
  border-color:#566449;
}
.read-aloud[data-state="idle"] .read-aloud__pause,
.read-aloud[data-state="idle"] .read-aloud__stop{
  display:none;
}
.read-aloud[data-state="idle"] .read-aloud__speed{
  padding-left:.1rem;
  color:#4f5845;
  font-size:.8rem;
}
.read-aloud[data-state="idle"] .read-aloud__rate{
  border-color:rgba(88,99,73,.38);
  background:#fffdf9;
}

/* Mini-player: um pouco mais alto e mais contido na tela */
.read-aloud[data-state="speaking"],
.read-aloud[data-state="paused"]{
  bottom:max(1.85rem,calc(env(safe-area-inset-bottom) + .7rem));
  width:min(calc(100% - 3rem),35rem);
}

@media(max-width:680px){
  .read-aloud[data-state="idle"]{
    width:min(calc(100% - 1.25rem),42rem);
    padding:1rem;
  }
  .read-aloud[data-state="idle"] .read-aloud__heading{
    flex:1 1 100%;
    margin:0;
  }
  .read-aloud[data-state="idle"] .read-aloud__title{
    font-size:1.15rem;
  }
  .read-aloud[data-state="idle"] .read-aloud__chapter{
    max-width:none;
    font-size:.79rem;
  }
  .read-aloud[data-state="idle"] .read-aloud__status{
    font-size:.79rem;
  }
  .read-aloud[data-state="idle"] .read-aloud__controls{
    width:100%;
    display:flex;
    align-items:center;
    gap:.5rem;
  }
  .read-aloud[data-state="idle"] .read-aloud__play{
    flex:0 0 auto;
  }
  .read-aloud[data-state="idle"] .read-aloud__speed{
    flex:0 0 auto;
    margin-left:auto;
  }
  .read-aloud[data-state="speaking"],
  .read-aloud[data-state="paused"]{
    width:min(calc(100% - 1.5rem),35rem);
    bottom:max(1.25rem,calc(env(safe-area-inset-bottom) + .55rem));
  }
}