/* ════════════════════════════════════════════════════════════════════════
   bz5.css — 修药丸容器宽度（2026-11-05）

   桌面截图实测：药丸竖排居中，每个一行。
   根因：`.gen-mode-bar` 容器宽度被限制成约 500px（因为 .segmented 上有
        width:auto + 父级可能有 inline-block / fit-content 行为），
        所以 flex-wrap 在 500px 里只能一行放一个，且 justify-content:center 让它居中。
   修法：让 .gen-mode-bar 和 .segmented 占满整行（width:100%），
        药丸左对齐。
   ════════════════════════════════════════════════════════════════════════ */

html[data-ui="crisp"] #view-work .gen-mode-bar,
html[data-ui="crisp"] .gen-mode-bar {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
}

html[data-ui="crisp"] #view-work #genModeSeg,
html[data-ui="crisp"] #genModeSeg {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

html[data-ui="crisp"] #genModeSeg > button {
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
  float: none !important;
}
