.poetry-layout-controls { display:flex; flex-wrap:wrap; align-items:center; gap:0 .25rem; margin-top:1.25rem; color:var(--muted); font:.75rem/1.7 var(--mono); }
.poetry-layout-controls[hidden] { display:none; }
.poetry-layout-controls > span { margin-inline-end:.75rem; }
.poetry-layout-controls button { position:relative; min-height:44px; padding:.6rem .625rem; border:0; background:transparent; color:var(--muted); font:inherit; cursor:pointer; }
.poetry-layout-controls button::after { content:""; position:absolute; inset-inline:.625rem; bottom:.4rem; height:1px; background:currentColor; opacity:0; }
.poetry-layout-controls button[aria-pressed="true"] { color:var(--ink); }
.poetry-layout-controls button[aria-pressed="true"]::after { opacity:1; }
.poetry-layout-controls button:hover { color:var(--ink); }
.poetry-layout-controls button:disabled { opacity:.5; cursor:default; }
.poetry-authorial-label { white-space:nowrap; }
/* At very large text sizes, translated A/B metadata can be wider than the
   reader. Keep the script horizontal, but permit a line break instead of
   clipping the edition label or forcing two-dimensional scrolling. */
@container page-shell (max-width: 15rem) {
  .poetry-authorial-label { white-space:normal; overflow-wrap:anywhere; }
}
.poetry-page .poem-version .body { width:fit-content; max-width:100%; margin-inline:auto; }
.poetry-composition { --flow-stanza-gap:24px; --flow-title-gap:18px; --flow-band-gap:28px; }
html[data-poetry-layout="vertical"] .poetry-composition > h2 {
  writing-mode:vertical-rl; text-orientation:mixed; text-align:start;
  inline-size:18em; flex:none; margin:0; font-size:1.125rem;
  line-height:1.7; letter-spacing:.025em; line-break:strict; text-wrap:wrap;
}
html[data-poetry-layout="vertical"] .poetry-stanza {
  writing-mode:vertical-rl; text-orientation:mixed; white-space:pre;
  letter-spacing:.03em; flex:none; width:max-content; margin:0;
}
/* Bands already supply stanza spacing, including the wider reading setting. */
.poetry-page .poetry-composition .poetry-stanza { margin:0; }
.poetry-composition[data-flow-active][data-flow-title-position="side"] {
  display:flex; flex-direction:row-reverse; flex-wrap:wrap; align-items:flex-start;
  justify-content:center; gap:var(--flow-title-gap); row-gap:var(--flow-band-gap); width:fit-content;
  max-width:100%; margin-inline:auto;
}
.poetry-composition[data-flow-active][data-flow-title-position="top"] {
  display:flex; flex-direction:column; align-items:flex-end;
  gap:var(--flow-band-gap); width:fit-content; max-width:100%; margin-inline:auto;
}
.poetry-page .poetry-composition[data-flow-active] > .flow-poem-body {
  display:flex; flex-direction:column; align-items:flex-end; justify-content:flex-start;
  gap:var(--flow-band-gap); flex:none; margin:0; max-width:100%; white-space:normal;
}
.flow-row { display:flex; flex-direction:row-reverse; align-items:flex-start; justify-content:flex-start; gap:var(--flow-stanza-gap); width:100%; }
.poetry-page .poetry-composition h2[data-flow-title] {
  display:flex; flex-direction:column; align-items:flex-start; flex:none;
  inline-size:max-content; min-height:0; margin:0; gap:0; white-space:pre;
}
.flow-title-column { display:block; flex:none; inline-size:max-content; white-space:pre; }
html[data-poetry-layout="vertical"] .locale-zh.poetry-single .poetry-intro > h1 {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip-path:inset(50%); white-space:nowrap;
}
@media(max-width:620px) {
  html[data-poetry-layout="vertical"] .poetry-composition > h2 { font-size:1rem; }
}
/* Vermilion marks: one resting point at a poem's close, and an optional
   rhyme reading aid set as 着重號 (right of a vertical character, below a
   horizontal one). The toggle shows its own mark. */
.poetry-layout-controls .poetry-rhyme-toggle { margin-inline-start:.75rem; }
.poetry-layout-controls .poetry-rhyme-toggle[hidden] { display:none; }
.poetry-rhyme-toggle::before { content:""; display:inline-block; width:.42em; height:.42em; margin-inline-end:.5em; border-radius:50%; background:var(--accent); vertical-align:.1em; opacity:.4; }
.poetry-rhyme-toggle[aria-pressed="true"]::before { opacity:1; }
.poem-version.source .poetry-end { color:var(--accent); }
:root[data-poetry-rhymes="on"] .poem-version.source .poetry-rhyme {
  -webkit-text-emphasis:filled dot var(--accent); text-emphasis:filled dot var(--accent);
  -webkit-text-emphasis-position:under right; text-emphasis-position:under right;
}
@media (forced-colors:active) {
  .poetry-rhyme-toggle::before { background:CanvasText; }
  .poem-version.source .poetry-end { color:CanvasText; }
  :root[data-poetry-rhymes="on"] .poem-version.source .poetry-rhyme { -webkit-text-emphasis-color:CanvasText; text-emphasis-color:CanvasText; }
}