/* Natural text sizing; typography, visibility, and access remain page-owned. */
html:root body,
html:root body :where(article,main,section,div,p,li,dd,dt,h1,h2,h3,h4,h5,h6,blockquote,figcaption,summary,button,label,span,strong,em,b,i,small,a,th,td):not(svg *) {
 word-break:normal!important;overflow-wrap:break-word!important;-webkit-hyphens:none!important;hyphens:none!important;
}
html:root body :is(code,kbd,samp,a[href^="mailto:"]) {overflow-wrap:anywhere!important;word-break:normal!important}
html:root body pre {max-inline-size:100%;overflow-x:auto}
html:root body :is(button,[role="button"],label) > :is(span,div) {min-inline-size:0!important;max-inline-size:100%}
html:root body :is(th,td),
html:root body :is(th,td) :where(p,div,span,strong,em,b,i,small,a,button,label) {
 overflow-wrap:normal!important;word-break:normal!important;-webkit-hyphens:none!important;hyphens:none!important;
}
html:root body .bw-text-table-scroll {
 min-inline-size:0!important;max-inline-size:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
}
html:root body .bw-text-table-scroll > table {display:table!important;table-layout:auto!important;max-inline-size:none!important}
html:root body .bw-text-table-scroll > table[data-bw-wide-table] {min-inline-size:42rem!important}
html:root body .bw-text-table-scroll [data-bw-text-key] {white-space:nowrap!important}
/* Caption words determine the minimum thumbnail width. */
html:root body :is(.card-photo-strip,.photo-strip) :is(.photo-item,.card-photo) {min-inline-size:min-content!important}
html:root body :is(.card-photo-label,.photo-strip-label,.card-photo-strip .photo-caption) {overflow-wrap:normal!important}
/* Compact controls must wrap as controls, not sacrifice letters to flex shrink. */
html:root body :is(.mode-controls,.builder-options,.fry-btns,.tx-step) {flex-wrap:wrap}
html:root body .mode-controls > button,
html:root body :is(.builder-btn,.fry-btn) {flex:1 0 auto!important;min-inline-size:min-content!important}
html:root body .tx-step .tx-num {flex:0 0 auto!important;inline-size:auto!important;min-inline-size:max-content!important}
html:root body .cs-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr))!important}
html:root body .clinical-image-gate {display:grid!important;min-inline-size:min-content!important;grid-template-columns:minmax(0,1fr)}
html:root body .clinical-image-gate > img,
html:root body .clinical-image-gate > .clinical-reveal-cover {grid-area:1 / 1}
html:root body .clinical-image-gate > .clinical-reveal-cover {position:relative!important;inset:auto!important}
html:root body .clinical-reveal-btn {min-inline-size:min-content!important;overflow-wrap:normal!important}
@media(max-width:600px) {
 html:root body .bento-grid {grid-template-columns:1fr!important}
 html:root body .bento-grid > * {grid-column:auto!important;grid-row:auto!important}
}
/* Two-column activity controls cannot take the entire row from their prompt. */
@media(min-width:521px) {
 html:root body .bw-direction-row {grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
 html:root body .bw-direction-row > * {min-inline-size:0}
}
/* Labels and revealed explanations need their own readable flex space. */
html:root body .v-stat {flex-wrap:wrap}
html:root body .v-stat-value {min-inline-size:min-content!important;max-inline-size:100%}
html:root body .quiz-opt:has(> .quiz-explain) {flex-wrap:wrap}
html:root body .quiz-opt > .quiz-explain {flex:1 0 100%;min-inline-size:0}
/* Game HUDs retain their dedicated fitting and clipping rules. */
html:root body .game-shell,
html:root body .game-shell :where(div,p,span,h1,h2,h3,button,label,strong,small) {overflow-wrap:normal!important}
/* Native phone readers retain their labeled-card table presentation. */
@media(max-width:480px) {
 html:root:has(#bw-native-reader-style) body .bw-text-table-scroll > table {display:block!important;min-inline-size:0!important;max-inline-size:100%!important}
 html:root:has(#bw-native-reader-style) body .bw-text-table-scroll :is(th,td),
 html:root:has(#bw-native-reader-style) body .bw-text-table-scroll :is(th,td) * {white-space:normal!important;overflow-wrap:break-word!important}
 html:root:has(#bw-native-reader-style) body .bw-text-table-scroll td {flex-wrap:wrap}
 html:root:has(#bw-native-reader-style) body .bw-text-table-scroll td::before {display:block;flex-basis:100%;flex-shrink:1;max-inline-size:100%;white-space:normal;overflow-wrap:break-word;word-break:normal}
 html:root:has(#bw-native-reader-style) body :is(main,.container,.bwcr,.bw-read) {inline-size:100%!important;max-inline-size:100%!important;margin-inline:0!important;padding-inline:10px!important}
 html:root:has(#bw-native-reader-style) body :is(.hero,.page-section,.bwcr-intro,.bwcr-case,.opener,.quiz-block,.mech-diagram,.mech-side,.battle-card) {padding-inline:12px!important}
 html:root:has(#bw-native-reader-style) body button.choice {flex-wrap:wrap;padding-inline:12px!important;gap:8px}
 html:root:has(#bw-native-reader-style) body button.choice > .choice-body {flex:1 0 auto!important;max-inline-size:100%}
 html:root:has(#bw-native-reader-style) body .bwcr-options {padding-inline:0!important}
 html:root:has(#bw-native-reader-style) body .bwcr-options label {padding-inline:12px!important;gap:8px!important}
 html:root:has(#bw-native-reader-style) body :where(p,div,span,li,th,td,h1,h2,h3,label,button) {-webkit-hyphens:manual!important;hyphens:manual!important}
}

/* Activity controls reflow into fewer columns before their labels fragment. */
html:root body .stage-tabs:has(> .stage-tab) {grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr))!important}
html:root body .defect-tabs:has(> .defect-tab) {grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr))!important}
html:root body .target-row:has(> .target-box) {grid-template-columns:repeat(auto-fit,minmax(min(100%,7rem),1fr))!important}
html:root body .loss-row:has(> button) {grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr))!important}
/* Legacy quiz labels have no source whitespace before the answer. Supply a
   soft break after the label so the entire next word can move to a new line. */
html:root body .wt-opts > .wt-opt > .wt-ltr::after {content:"\200b"}
