/* Topic-scoped; continuous content and native controls remain the foundation. */
body[data-pku-visual] .bwcr{font-size:1.125rem;line-height:1.65;max-width:72rem;padding-inline:clamp(1rem,4vw,3rem)}
body[data-pku-visual] .bwcr-intro{padding-block:1rem;margin-bottom:1rem}
body[data-pku-visual] .bwcr-intro h1{font-size:clamp(1.8rem,5vw,3rem);line-height:1.12;max-width:22ch}
body[data-pku-visual] .bwcr p{max-width:72ch}
body[data-pku-visual] .bwcr section{scroll-margin-top:8rem}
body[data-pku-visual] .bwcr h2{margin-top:3rem;line-height:1.25}
body[data-pku-visual] .bwcr h3{line-height:1.35}
body[data-pku-visual] .bwcr button,body[data-pku-visual] .bwcr select,body[data-pku-visual] .bwcr input,body[data-pku-visual] .bwcr summary{font:inherit;min-height:44px}
body[data-pku-visual] .bwcr button{white-space:normal;overflow-wrap:anywhere;cursor:pointer;padding:.6rem .85rem}
body[data-pku-visual] .bwcr label{font-size:1em;overflow-wrap:anywhere}
body[data-pku-visual] .bwcr input[type=radio]{min-width:1.2rem;min-height:1.2rem}
body[data-pku-visual] .bwcr select,body[data-pku-visual] .bwcr input[type=number]{width:100%;max-width:100%;box-sizing:border-box;padding:.65rem;background:#17223b;color:#eff3ff;border:1px solid #8c9bb8;border-radius:.4rem}
body[data-pku-visual] .bwcr :focus-visible,.pku-image-dialog :focus-visible{outline:3px solid #f9d277;outline-offset:4px}
.pku-activity{margin:1.5rem 0 2rem;padding:clamp(.75rem,2vw,1.5rem);background:#111b31;border:1px solid #63728f;border-radius:1rem;color:#eff3ff}
.pku-activity h3{margin:0 0 .6rem;color:#f9d277;font-size:1.3em}
.pku-prompt{font-weight:600}
.pku-controls{display:flex;flex-wrap:wrap;gap:.8rem;align-items:end;margin:1rem 0}
.pku-controls>label{flex:1 1 14rem;min-width:0;display:grid;gap:.35rem}
.pku-controls button{flex:1 1 12rem;border:1px solid #a3b8d2;background:#223450;color:#fff;border-radius:.5rem}
.pku-controls button:disabled{opacity:.65;cursor:default}
.pku-diagram-scroll{max-width:100%;overflow:auto;margin:1rem 0;padding:.15rem;overscroll-behavior-inline:contain}
.pku-diagram-scroll svg{display:block;width:100%;min-width:17.5rem;max-width:22rem;margin:auto;color:#eff3ff;background:#111b31;overflow:visible}
.pku-diagram-scroll text{font-family:Arial,sans-serif;font-size:18px;fill:#eff3ff}
.pku-flow{fill:none;stroke:#8ee4d2;stroke-width:4}
.pku-pool-frame{fill:#17243c;stroke:#8d9cb9;stroke-width:1.5}
[data-pku-pool=phe] circle,[data-pku-maternal-pool] circle{fill:#f9d277}
[data-pku-pool=tyr] circle{fill:#8ee4d2}
[data-pku-branch] rect{fill:#21443f;stroke:#8ee4d2;stroke-width:2}
[data-pku-branch][data-state=impaired] rect{fill:#543923;stroke:#f9d277;stroke-dasharray:5 3}
.pku-ratio-bar{fill:#c4b5fd}
.pku-output{font-weight:600;min-height:1.5em;border-left:3px solid #f9d277;padding-left:.85rem}
.pku-output:empty{display:none}
.pku-limit,.pku-figure figcaption{color:#c7d4e8;font-size:1.125rem;line-height:1.6}
.pku-worked{padding-block:1rem;border-block:1px solid #455571}
.pku-chain{margin-block:1.1rem}
.bwcr .pku-chain details{margin:.7rem 0;border:1px solid #667792;border-radius:.5rem;padding:.35rem .75rem;background:#152139;color:#eff3ff}
.bwcr .pku-chain summary{padding:.55rem 0;cursor:pointer;font-weight:600;color:#d4c9ff}
.bwcr .pku-chain details p{padding-bottom:.6rem;margin:.4rem 0}
.pku-full-explanation{margin-top:1rem}
.pku-full-explanation summary{cursor:pointer;padding:.6rem 0}
.pku-figure{margin:2rem 0;max-width:48rem}
.pku-figure>a{display:block;max-width:100%;padding:.5rem;border:1px solid #657491;border-radius:.8rem;background:#111b31;overflow:auto}
.pku-figure img{display:block;width:auto;max-width:100%;height:auto;margin:auto}
.pku-figure img[src$='.svg']{width:20rem;min-width:17.5rem}
.pku-figure a>span{display:block;min-height:44px;padding-top:.5rem;text-align:center;color:#d6cbff;font-size:1rem}
.pku-figure figcaption p{margin:.6rem 0}
body[data-pku-visual] .bwcr-rationales{padding-left:1.35rem}
body[data-pku-visual] .bwcr-rationales li{overflow-wrap:anywhere}
body[data-pku-visual] [data-case] legend{font-size:1.125rem;line-height:1.6}
body[data-pku-visual] [data-pku-case-picker]{padding:1rem;border:1px solid #647797;border-radius:.7rem;margin-block:1rem}
body[data-pku-visual] [data-pku-case-picker] label{display:grid;gap:.6rem}
body[data-pku-visual] [data-pku-inline]{margin:2rem 0}
.pku-image-dialog{color:#eff3ff;background:#10192b;border:1px solid #8e9db9;border-radius:.7rem;width:calc(100vw - 2rem);max-width:90rem;max-height:90vh;padding:1rem;box-sizing:border-box;font:1.125rem/1.5 Arial,sans-serif}
.pku-image-dialog::backdrop{background:#020711e8}
.pku-image-dialog button{font:inherit;min-height:44px;padding:.65rem;background:#273e5c;color:#fff;border:1px solid #b0c2dc;border-radius:.4rem;margin:0 .5rem .6rem 0;cursor:pointer}
.pku-image-viewport{max-height:65vh;overflow:auto}
.pku-image-viewport img{display:block;max-width:100%;height:auto;margin:auto}
.pku-image-viewport[data-original] img{max-width:none;min-width:560px}
body[data-pku-visual] [hidden],.pku-image-dialog [hidden]{display:none!important}
@media(min-width:850px){.pku-activity{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);column-gap:1.5rem}.pku-activity>h3,.pku-activity>.pku-prompt,.pku-activity>.pku-limit,.pku-activity>.pku-worked,.pku-activity>.pku-chain{grid-column:1/-1}.pku-activity>.pku-output{grid-column:2}.pku-diagram-scroll{grid-column:1;grid-row:3/5}.pku-controls{grid-column:2;grid-row:3}}
@media(prefers-reduced-motion:reduce){body[data-pku-visual] *{scroll-behavior:auto!important}}

body[data-pku-visual] .bwcr .pku-chain details{background:#152139!important;color:#eff3ff!important} body[data-pku-visual] .bwcr .pku-chain summary{background:transparent!important;color:#d4c9ff!important}
body[data-pku-visual] .bwcr-intro{background:transparent;padding:0;color:#241739;border:0} body[data-pku-visual] .bwcr-intro h1{color:#241739} body[data-pku-visual] .pku-toc{background:transparent;border:0;margin:1rem 0;color:#241739} body[data-pku-visual] .pku-toc>summary{padding:.7rem 0;color:#573294;cursor:pointer}
/* These narrow overrides also survive the current shared learning surface rules. */
body[data-pku-visual] .bwcr .bwcr-intro{background:transparent!important;color:#241739!important;padding:0!important;margin:0 0 1rem!important}
body[data-pku-visual] .bwcr .bwcr-intro :is(h1,p){color:#241739!important}
body[data-pku-visual] .bwcr .pku-activity h3{color:#f9d277!important}
body[data-pku-visual] .bwcr :is(select,input[type=number]){background:#fffefa!important;color:#241739!important;-webkit-text-fill-color:#241739!important;font:inherit!important}
body[data-pku-visual] .bwcr .pku-figure figcaption{color:#3c3450!important}
body[data-pku-visual] .bwcr .pku-figure figcaption p{color:inherit!important}

body[data-pku-visual] .bwcr select{min-width:0!important}
.pku-controls>label,body[data-pku-visual] [data-pku-case-picker] label{grid-template-columns:minmax(0,1fr)}

/* Keep the full causal diagram and reading column usable at phone widths and large text. */
@media(max-width:600px){
 body[data-pku-visual] main.bwcr{width:100%;max-width:100%;box-sizing:border-box;padding-inline:8px!important}
 body[data-pku-visual] .bwcr section[data-lesson-section]{padding-inline:0!important}
 body[data-pku-visual] .pku-activity{box-sizing:border-box;width:100%;min-width:0;padding:8px}
 body[data-pku-visual] .pku-controls{display:grid;grid-template-columns:minmax(0,1fr);width:100%;min-width:0}
 body[data-pku-visual] .pku-controls>label{width:100%;min-width:0}
 body[data-pku-visual] .pku-controls select{padding-inline:8px!important}
 body[data-pku-visual] .pku-diagram-scroll{padding:0;width:100%;box-sizing:border-box}
 body[data-pku-visual] .pku-diagram-scroll svg{min-width:0;width:100%;max-width:22rem;height:auto}
 body[data-pku-visual] .pku-figure img[src$='.svg']{min-width:0;width:100%;max-width:20rem}
}
