/* ECO — Mi libro. Diseño basado en el árbol familiar oficial.
   Afecta exclusivamente a capitulos.html. */
:root{
  --eco-book-bg:#f7f4eb;
  --eco-book-cream:#fffdf6;
  --eco-book-green:#4d6542;
  --eco-book-deep:#293d30;
  --eco-book-pale:#edf0e5;
  --eco-book-ink:#302d25;
  --eco-book-muted:#777568;
  --eco-book-border:#dadaca;
}
body{
  background:var(--eco-book-bg);
  color:var(--eco-book-ink);
  padding:24px clamp(14px,2.5vw,42px) 80px;
}
body>header,body>main.wrap{width:100%;max-width:1700px;margin-left:auto;margin-right:auto;}
body>header{
  display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;
  gap:22px;margin-bottom:24px;
}
body>header .eco-book-title-group{min-width:0;}
body>header .eco-book-title-group h1{
  font-family:"Source Serif 4",Georgia,serif;font-weight:700;
  font-size:clamp(33px,4.5vw,51px);line-height:1.04;margin:0 0 9px;
  color:var(--eco-book-ink);
}
body>header .eco-book-title-group p{
  margin:0;color:var(--eco-book-muted);font-size:1rem;line-height:1.5;
}
body>header .eco-book-back{
  color:var(--eco-book-deep);font-size:14px;font-weight:700;
  text-decoration:none;display:inline-flex;align-items:center;min-height:34px;
  padding:0;margin-bottom:10px;border:0;border-radius:4px;
}
body>header .eco-book-back:hover{text-decoration:underline;}
body>header .eco-book-header-tools{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;max-width:100%;
}
body>header .eco-book-btn,body>header .eco-book-header-tools .volver,
body>header .eco-book-header-tools #personaSelect,
body>header .eco-book-header-tools button.generar{
  box-sizing:border-box;min-height:43px;border-radius:13px;
  padding:10px 15px;font-size:.94rem;line-height:1.25;font-weight:700;
  font-family:"Atkinson Hyperlegible",system-ui,sans-serif;
}
body>header .eco-book-btn,
body>header .eco-book-header-tools .volver{
  display:inline-flex;align-items:center;justify-content:center;text-align:center;
  background:var(--eco-book-cream);border:1px solid var(--eco-book-border);
  color:var(--eco-book-deep);text-decoration:none;white-space:normal;
}
body>header .eco-book-btn:hover,body>header .eco-book-header-tools .volver:hover{
  background:var(--eco-book-pale);
}
body>header .eco-book-header-tools #personaSelect{
  color:var(--eco-book-deep);background:var(--eco-book-cream);
  border:1px solid var(--eco-book-border);max-width:min(310px,100%);
  min-width:0;flex:0 1 290px;font-weight:600;
}
body>header .eco-book-header-tools button.generar{
  background:var(--eco-book-green);color:#fff;border:1px solid var(--eco-book-green);
  cursor:pointer;white-space:normal;box-shadow:none;
}
body>header .eco-book-header-tools button.generar:hover:not(:disabled){background:#405637;}
body>header .eco-book-header-tools button.generar:disabled{opacity:.55;cursor:not-allowed;}
body>header .eco-book-narration-label{font-size:.88rem;color:var(--eco-book-muted);font-weight:700;white-space:nowrap;}
body>header .eco-book-header-tools #status{color:var(--eco-book-muted);font-size:.85rem;max-width:320px;}
body>main.wrap{padding:0;}
body>main.wrap #lista{display:grid;gap:14px;}
body>main.wrap .chapter{
  background:var(--eco-book-cream);border:1px solid #e7e2d4;
  border-radius:23px;padding:clamp(19px,2.5vw,28px);
  margin:0;box-shadow:0 8px 24px rgba(46,44,33,.035);
}
body>main.wrap .chapter h2{
  font-family:"Source Serif 4",Georgia,serif;
  font-size:clamp(1.25rem,2vw,1.6rem);color:var(--eco-book-deep);
}
body>main.wrap .chapter .theme{color:var(--eco-book-green);font-weight:800;}
body>main.wrap .chapter .meta{color:var(--eco-book-muted);}
body>main.wrap .chapter .text{line-height:1.75;max-width:78ch;}
body>main.wrap .chapter .borrar{
  border:1px solid #e5c4bb;background:#fff9f6;border-radius:10px;
  color:#8f4132;text-decoration:none;min-height:44px;
}
body>main.wrap .chapter .borrar:hover{background:#fcece7;color:#7f3023;}
body>main.wrap .empty{
  padding:42px 22px;margin:0;background:var(--eco-book-cream);
  border:1px dashed var(--eco-book-border);border-radius:20px;
  color:var(--eco-book-muted);text-align:center;font-style:normal;
}
body>main.wrap .retry-btn{
  border:1px solid var(--eco-book-border);color:var(--eco-book-deep);
  border-radius:12px;background:var(--eco-book-cream);
}
body :focus-visible{outline:3px solid #9b6734;outline-offset:3px;}
@media(max-width:820px){
 body{padding:16px 14px 60px;}
 body>header{display:block;margin-bottom:19px;}
 body>header .eco-book-title-group h1{font-size:clamp(32px,7vw,42px);}
 body>header .eco-book-title-group p{font-size:.92rem;}
 body>header .eco-book-header-tools{margin-top:20px;gap:9px;}
 body>header .eco-book-header-tools #personaSelect{flex:1 1 210px;max-width:100%;}
 body>header .eco-book-narration-label{flex:0 0 100%;}
 body>header .eco-book-header-tools #status{flex:0 0 100%;}
 body>main.wrap .chapter{border-radius:18px;padding:18px 17px;}
}
@media(max-width:430px){
 body>header .eco-book-header-tools .eco-book-btn{flex:1 1 100%;}
 body>header .eco-book-header-tools #personaSelect{flex:1 1 100%;}
 body>header .eco-book-header-tools button.generar{flex:1 1 100%;}
}
