/* A single grid keeps the reader identity and controls aligned at every width. */
.reader-bar{
  display:grid;grid-template-areas:"brand chapter actions";
  grid-template-columns:minmax(180px,1fr) minmax(240px,340px) max-content;
  align-items:center;gap:24px;padding:18px 4%;
  border-bottom:1px solid #193e3020;background:#f4efdfdf;
}
.reader-bar .brand{grid-area:brand;justify-self:start;font-size:27px;white-space:nowrap}
.reader-bar .brand span{font-size:6px;margin-top:7px}
.reader-bar .top-actions{grid-area:actions;justify-content:flex-end;gap:10px;min-width:0}
.reader-bar .language-picker{min-width:0}
.reader-bar .language-select,.reader-bar .back,.reader-bar #fullscreen,.reader-bar .chapter-bar{
  height:44px;min-height:44px;border:1px solid #193e3045;border-radius:8px;
  background:#f4efdf;color:#193e30;font:12px/1.4 Arial,Helvetica,sans-serif;
}
.reader-bar .language-select{width:112px;max-width:none;padding:0 26px 0 12px}
.reader-bar .back{width:auto;max-width:none;padding:0 16px;white-space:nowrap;text-align:center;border-color:#193e30}
.reader-bar #fullscreen{padding:0 12px;white-space:nowrap}
.reader-bar .back:hover,.reader-bar #fullscreen:hover{background:#193e30;color:#f4efdf}
.reader-bar .chapter-bar{
  grid-area:chapter;position:static;inset:auto;transform:none;
  display:flex;align-items:center;gap:12px;width:100%;max-width:none;padding:0 12px;
}
.reader-bar .chapter-bar label{font-size:9px;letter-spacing:.12em;white-space:nowrap}
.reader-bar .chapter-bar select{
  flex:1;min-width:0;width:100%;max-width:none;height:100%;
  padding:0 20px 0 0;border:0;background:transparent;font-size:12px;
}
.reader-viewport{top:104px}
@media(max-width:1100px){
  .reader-bar{
    grid-template-areas:"brand return" "language chapter";
    grid-template-columns:minmax(106px,.8fr) minmax(0,1.6fr);
    gap:12px 14px;padding:16px 5%;
  }
  .reader-bar .brand{font-size:24px}
  .reader-bar .top-actions{display:contents}
  .reader-bar .back{grid-area:return;justify-self:end;padding:0 14px}
  .reader-bar #fullscreen{display:none}
  .reader-bar .language-picker{grid-area:language;display:flex;width:100%}
  .reader-bar .language-select{width:100%;max-width:none}
  .reader-bar .chapter-bar{gap:0}
  .reader-bar .chapter-bar label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .reader-bar .chapter-bar select{max-width:none}
  .reader-viewport{top:152px}
}
@media(max-width:580px){
  .reader-bar .brand{font-size:22px}
  .reader-bar .brand span{font-size:5px;letter-spacing:.18em}
  .reader-bar .language-select,.reader-bar .back,.reader-bar .chapter-bar select{font-size:12px}
  .reader-bar .back{padding:0 12px}
  .reader-bar .chapter-bar{padding-inline:10px}
}
@media(max-width:1100px) and (max-height:560px){
  .reader-bar{padding:8px 4%;gap:8px 14px}
  .reader-bar .brand{font-size:21px}
  .reader-bar .language-select,.reader-bar .back,.reader-bar .chapter-bar{height:38px;min-height:38px}
  .reader-viewport{top:116px}
}
@media(min-width:1101px) and (max-height:560px){
  .reader-bar{padding-block:10px}
  .reader-viewport{top:82px}
}
@media(prefers-reduced-motion:reduce){.reader-bar .back{transition:none}}
