:root{--cb-navy:#1e2e3e;--cb-navy2:#30485e;--cb-paper:#f8f6f0;--cb-ink:#1e2e3e;--cb-gold:#d4a853;--cb-red:#b5262e}
html,body{scroll-behavior:smooth}
.cb-shell{max-width:1720px;width:calc(100% - 36px);margin:25px auto 60px;font-family:Inter,Arial,sans-serif;color:var(--cb-ink)}
.cb-hero{background:#f8f6f0;border:1px solid #dbc9a1;border-radius:14px;padding:30px 36px;margin-bottom:22px}
.cb-hero h1{margin:0 0 10px;font:900 clamp(26px,3vw,40px)/1.2 Montserrat,Inter,sans-serif;color:#1e2e3e}
.cb-hero p{margin:0;max-width:1100px;font-size:15px;line-height:1.65}
.cb-landing{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cb-landing[hidden],.cb-workspace[hidden],.cb-panel[hidden]{display:none!important}
.cb-choice{appearance:none;cursor:pointer;display:flex;flex-direction:column;align-items:stretch;text-align:left;gap:12px;padding:18px;min-height:340px;border:1px solid #d7d1c7;border-top:5px solid var(--cb-gold);border-radius:12px;background:#fff;color:#1e2e3e;box-shadow:0 4px 16px #0a192921;transition:border-color .15s,transform .15s}
.cb-choice:hover,.cb-choice:focus-visible{transform:translateY(-2px);border-color:var(--cb-gold);outline:2px solid #dbbc7d}
.cb-choice img{display:block;width:100%;height:158px;object-fit:contain;background:#f0f2f4;border-radius:8px;padding:8px}
.cb-choice strong{font:800 22px/1.25 Montserrat,Inter,sans-serif}
.cb-choice p{font-size:14px;line-height:1.55;color:#52616e;margin:0;flex:1}
.cb-assessments{font-size:12px;font-weight:800;color:#ad2833;border-top:1px solid #e3e0da;padding-top:9px}
.cb-tabbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:16px 0 12px}
.cb-tabs{display:flex;gap:8px;flex-wrap:wrap}
.cb-tab{background:#30485e;color:#fff;border:1px solid #69849a;border-radius:7px;padding:11px 17px;font:800 13px Inter,Arial,sans-serif;cursor:pointer}
.cb-tab[aria-selected="true"]{color:#1e2e3e;background:#f8f6f0;border-color:#d4a853}
.cb-tab:hover,.cb-back:hover{border-color:var(--cb-gold)}
.cb-back{border:1px solid #c7a66b;border-radius:7px;background:#1e2e3e;color:#f2d18a;padding:10px 16px;cursor:pointer;font-weight:700}
.cb-panel{background:#f8f6f0;border:1px solid #c9ba9e;border-radius:12px;padding:18px;min-width:0}
.cb-panel h2{font:900 26px/1.3 Montserrat,Inter,sans-serif;margin:0 0 7px}
.cb-intro{margin:0 0 15px;font-size:14px;line-height:1.7;max-width:1150px}
.cb-resources{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0 20px}
.cb-resources>h3{flex:0 0 100%;margin:0;font:800 16px Montserrat,Inter,sans-serif}
.cb-resource{position:relative;flex:1 1 170px;max-width:250px;min-width:140px}
.cb-resource>button{cursor:pointer;width:100%;min-height:148px;display:flex;align-items:center;flex-direction:column;gap:6px;text-align:center;border:1px solid #d9d9d9;border-radius:9px;background:#fff;padding:10px;color:#1e2e3e}
.cb-resource>button:hover{border-color:var(--cb-gold)}
.cb-resource>button img{width:100%;height:100px;object-fit:contain;background:#f2f3f5}
.cb-resource>button span{font:700 12px/1.3 Inter,Arial,sans-serif}
.cb-embed{display:block;width:100%;height:1500px;min-height:660px;border:0;border-radius:10px;background:#1e2e3e}
.cb-video-placeholder{margin:16px 0;padding:18px 22px;background:#203447;border:1px dashed #d4a853;border-radius:10px;color:#f8f6f0}
.cb-video-placeholder strong{display:block;font:800 17px Montserrat,Inter,sans-serif}.cb-video-placeholder p{font-size:13px;opacity:.8;margin:7px 0 0}
.cb-comparison{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
.cb-comparison-image{display:block;background:white;border:1px solid #e1ddd5;padding:12px;border-radius:10px;width:100%;max-height:630px;object-fit:contain}
.cb-comparison-desc{padding:18px;background:white;border:1px solid #e1ddd5;border-radius:10px;font-size:14px;line-height:1.7}
.cb-comparison-desc h3{font:800 17px Montserrat,Inter,sans-serif;margin:0 0 12px}
.cb-comparison-desc a{display:inline-block;margin-top:10px;color:#a32630;font-weight:800}
/* Common anchored previews. Fixed coordinates are computed from the clicked tile, so previews do not clip menus. */
.cb-pop{position:fixed;z-index:2147483000;max-width:calc(100vw - 20px);max-height:calc(100vh - 20px);overflow:auto;padding:10px;border:1px solid #d4a853;border-radius:10px;background:#fff;color:#1e2e3e;box-shadow:0 12px 40px #101c2860}
.cb-pop[hidden]{display:none!important}.cb-pop>a{display:block;color:#a32630;font-size:12px;font-weight:800;text-decoration:none}
.cb-pop img{display:block;max-width:100%;width:100%;max-height:65vh;object-fit:contain;background:#f2f3f5;border-radius:5px}.cb-pop span{display:block;padding-top:6px}
.cb-method-pop{width:min(900px,calc(100vw - 20px));height:min(720px,calc(100vh - 20px));display:flex;flex-direction:column;padding:0;background:#1e2e3e;color:white}
.cb-method-pop .cb-pophead{height:50px;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;background:#1e2e3e}
.cb-method-pop .cb-pophead a{color:#f4d593;font-size:12px;font-weight:800}.cb-method-pop .cb-pophead button{border:1px solid #9fbbd1;background:#edf2f5;color:#1e2e3e;padding:6px 9px;cursor:pointer;border-radius:6px;font-weight:700}
.cb-method-pop iframe{height:calc(100% - 50px);width:100%;border:0;background:#1e2e3e}
@media(max-width:900px){.cb-landing{grid-template-columns:repeat(2,minmax(0,1fr))}.cb-comparison{grid-template-columns:1fr}}
@media(max-width:620px){.cb-shell{width:calc(100% - 16px);margin-top:12px}.cb-hero{padding:18px}.cb-landing{grid-template-columns:1fr}.cb-choice{min-height:0}.cb-tabbar{align-items:flex-start;flex-direction:column}.cb-tab{font-size:11px;padding:9px}.cb-panel{padding:10px}.cb-resource{flex-basis:140px}.cb-method-pop{width:calc(100vw - 16px)!important;height:calc(100vh - 16px)!important}}

/* Existing generic hover zoom panels are superseded by the anchored click-preview system. */
.hover-preview,.resource-hover-preview,.resource-preview-popover{display:none!important}

/* v201: compact resource/video strip and intrinsic iframe height. */
.cb-resource-ribbon {display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px!important;margin:8px 0 12px!important;align-items:stretch}
.cb-resource-ribbon>h3{grid-column:1/-1;margin:0 0 2px!important;font-size:13px!important}
.cb-resource-ribbon .cb-resource{flex:none!important;max-width:none!important;min-width:0!important;position:relative}
.cb-resource-ribbon .cb-resource>button{min-height:110px!important;max-height:122px!important;padding:7px!important;gap:5px!important}
.cb-resource-ribbon .cb-resource img{height:75px!important;max-width:100%;width:100%;object-fit:contain;display:block}
.cb-resource-ribbon .cb-resource span{font-size:11px!important;line-height:1.25!important}
.cb-resource-video{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-decoration:none;gap:5px;min-height:110px;max-height:122px;padding:7px;background:#fff;border:1px solid #d9d9d9;border-radius:9px;color:#1e2e3e;text-align:center}
.cb-resource-video:hover{border-color:#d4a853}
.cb-resource-video img{object-fit:cover!important;border-radius:5px}
.cb-embed{height:450px;min-height:0!important;overflow:hidden!important;border:0!important;display:block!important}
.cb-panel{padding-bottom:12px!important}
.cb-shell{margin-bottom:0!important;padding-bottom:0!important}
.site-footer{margin-top:12px!important}
@media(max-width:1050px){.cb-resource-ribbon{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:580px){.cb-resource-ribbon{grid-template-columns:repeat(2,minmax(0,1fr))!important}.cb-resource-ribbon .cb-resource img{height:62px!important}}

/* v202: normal document flow, no footer/workspace overlap. */
body.critb-page-v202{display:flex!important;flex-direction:column!important;min-height:100vh!important;overflow-x:clip!important;background:#1e2e3e!important}
body.critb-page-v202>.site-nav{flex:0 0 auto!important}
body.critb-page-v202>main.cb-shell{position:relative!important;display:block!important;flex:1 0 auto!important;height:auto!important;min-height:0!important;overflow:visible!important;max-height:none!important;margin:25px auto 52px!important;padding:0 0 8px!important;contain:none!important}
body.critb-page-v202>footer.site-footer{position:relative!important;clear:both!important;flex:0 0 auto!important;display:block!important;margin:0!important;transform:none!important;top:auto!important;bottom:auto!important;z-index:1!important}
.cb-landing{margin-bottom:0!important}
.cb-landing-ai{margin:28px 0 42px;padding:24px 28px;border:1px solid #ccb990;border-top:4px solid #d4a853;border-radius:12px;background:#f8f6f0;box-shadow:0 5px 17px #11202e1c}
.cb-landing-ai-head h2{font:900 clamp(20px,2vw,26px)/1.3 Montserrat,Inter,sans-serif;margin:4px 0;color:#1e2e3e}
.cb-landing-ai-head p{color:#455664;margin:0 0 16px;line-height:1.65;max-width:1100px}
.cb-ai-kicker{color:#a82931;font-size:11px;font-weight:800;letter-spacing:.1em}
.cb-landing-ai-controls{display:flex;gap:10px;align-items:center;margin:0 0 14px}
.cb-landing-ai-controls label,.cb-ai-label{font-size:13px;font-weight:800;color:#1e2e3e}
.cb-landing-ai-controls select{font:600 13px Inter,Arial,sans-serif;min-height:39px;border:1px solid #bfc9ce;border-radius:7px;background:#fff;color:#1e2e3e;padding:7px 10px}
.cb-ai-label{display:block;margin-bottom:6px}
#cbAiWork{display:block;width:100%;min-height:120px;resize:vertical;border:1px solid #a8b5bf;border-radius:8px;background:#fff;padding:13px 15px;font:15px/1.6 Inter,Arial,sans-serif;color:#1e2e3e}
#cbAiWork:focus{outline:3px solid #d4a85370;border-color:#ae873d}
.cb-landing-ai-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}
.cb-landing-ai-actions button{border:1px solid #1e2e3e;background:#1e2e3e;color:#fff;border-radius:7px;padding:10px 16px;font:800 13px Inter,Arial,sans-serif;cursor:pointer}
.cb-landing-ai-actions button:disabled{opacity:.55;cursor:wait}
.cb-landing-ai-actions .cb-ai-clear{background:#fff;color:#1e2e3e;border-color:#aeb8c1}
.cb-landing-ai-actions small{font-size:12px;color:#5b6975}
.cb-landing-ai-messages{display:flex;flex-direction:column;gap:10px;min-height:0;margin-top:14px}
.cb-ai-message{padding:13px 15px;border:1px solid #d7dce1;border-radius:8px;background:#fff;color:#1e2e3e;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.65}
.cb-ai-message.user{background:#edf3f6;border-left:4px solid #628aa4}.cb-ai-message.assistant{border-left:4px solid #d4a853}
#cb-workspace{position:relative!important;clear:both!important;overflow:visible!important;max-height:none!important;min-height:0!important}
.cb-panel{position:relative!important;display:flow-root!important;overflow:visible!important;min-height:0!important;max-height:none!important;padding-bottom:18px!important}
.cb-panel[hidden]{display:none!important}
.cb-embed{display:block!important;position:relative!important;float:none!important;clear:both!important;width:100%!important;max-height:none!important;min-height:0!important;height:1px;background:#1e2e3e;border:0;border-radius:10px;overflow:hidden!important}
.cb-resource-ribbon{position:relative!important;overflow:visible!important;isolation:auto!important;z-index:2;margin-bottom:18px!important}
.cb-resource-ribbon .cb-resource{overflow:visible!important;min-width:0!important}
.cb-pop{z-index:2147483000!important}
@media(max-width:650px){body.critb-page-v202>main.cb-shell{margin:12px auto 34px!important}.cb-landing-ai{padding:18px 14px;margin:22px 0 35px}.cb-landing-ai-actions small{flex:1 0 100%}}

/* v203: 3-Step resources: 5 images in a compact two-row grid, video tile spans both rows. */
.cb-resource-ribbon{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(220px,1.18fr)!important;grid-template-rows:auto repeat(2,minmax(118px,auto))!important;gap:12px!important;align-items:stretch!important;overflow:visible!important}
.cb-resource-ribbon>h3{grid-column:1/-1!important;grid-row:1!important}
.cb-resource-ribbon>.cb-resource:not(.cb-resource-video){max-width:none!important;min-width:0!important;min-height:116px!important}
.cb-resource-ribbon>.cb-resource:nth-of-type(1){grid-column:1;grid-row:2}
.cb-resource-ribbon>.cb-resource:nth-of-type(2){grid-column:2;grid-row:2}
.cb-resource-ribbon>.cb-resource:nth-of-type(3){grid-column:3;grid-row:2}
.cb-resource-ribbon>.cb-resource:nth-of-type(4){grid-column:1;grid-row:3}
.cb-resource-ribbon>.cb-resource:nth-of-type(5){grid-column:2;grid-row:3}
.cb-resource-ribbon .cb-resource>button{height:100%!important;min-height:118px!important;max-height:none!important;overflow:hidden}
.cb-resource-ribbon .cb-resource img{height:74px!important;object-fit:contain!important}
.cb-resource-ribbon>.cb-resource-video{grid-column:4!important;grid-row:2 / 4!important;display:flex!important;flex-direction:column!important;justify-content:center!important;min-height:248px!important;max-height:none!important;padding:12px!important}
.cb-resource-ribbon>.cb-resource-video img{width:100%!important;height:auto!important;aspect-ratio:16/9!important;max-height:none!important;object-fit:cover!important}
.cb-resource-ribbon>.cb-resource-video span{font-size:14px!important;line-height:1.45!important}
@media(max-width:1080px){.cb-resource-ribbon{grid-template-columns:repeat(3,minmax(0,1fr))!important}.cb-resource-ribbon>.cb-resource-video{grid-column:3!important;grid-row:3!important;min-height:118px!important}.cb-resource-ribbon>.cb-resource-video img{max-height:90px!important}}
@media(max-width:680px){.cb-resource-ribbon{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:auto!important}.cb-resource-ribbon>.cb-resource{grid-column:auto!important;grid-row:auto!important}.cb-resource-ribbon>.cb-resource-video{grid-column:1/-1!important;grid-row:auto!important;min-height:160px!important}.cb-resource-ribbon>.cb-resource-video img{max-height:165px!important}}
/* Natural document flow and no unused iframe minimum height. */
.cb-panel>.cb-embed{height:0!important;min-height:0!important;max-height:none!important;display:block!important;overflow:hidden!important;border:0!important;background:transparent!important;transition:none!important}
.cb-panel>.cb-embed[data-height-ready="true"]{height:var(--cb-measured-height,0px)!important}
.cb-panel{overflow:visible!important;display:flow-root!important}
.cb-panel>iframe.cb-embed{margin:0!important;padding:0!important}
body.critb-page-v202>footer.site-footer{margin-top:0!important}
/* Disable old duplicate large hovers on the Crit B page; only the anchored preview is used. */
body.critb-page-v202 .site-resource-preview,body.critb-page-v202 .site-resource-popover,body.critb-page-v202 .resource-viewer-popover{display:none!important}

/* v203: footer follows the last visible AI/output section without a large spacer. */
body.critb-page-v202>main.cb-shell{margin-bottom:12px!important;padding-bottom:0!important}

/* v204: one alignment and popover strategy. */
.cb-panel .cb-embed{width:100%!important;display:block!important;position:relative!important;margin:0!important;border:0!important;overflow:hidden!important}
.cb-panel .cb-embed[data-height-ready="true"]{height:var(--cb-measured-height)!important;max-height:none!important}
.cb-panel{min-width:0!important;overflow:visible!important}
.cb-resource-ribbon{overflow:visible!important;position:relative!important}
.cb-pop{position:fixed!important;right:auto!important;bottom:auto!important;transform:none!important;margin:0!important;overflow-y:auto!important}
body.critb-page-v202>main.cb-shell{margin-bottom:22px!important}

/* Keep method previews beside thumbnails without hiding large sections of work. */
.cb-method-pop{width:min(560px,calc(100vw - 24px))!important;height:min(480px,calc(100vh - 24px))!important}

/* v206: Method hover previews contain only small posters. The full interactive lab opens on click. */
.cb-method-pop{width:min(420px,calc(100vw - 24px))!important;height:auto!important;max-height:min(570px,calc(100vh - 24px))!important;background:#fff!important;color:#1e2e3e!important;overflow-y:auto!important}
.cb-method-pop .cb-pophead{height:auto!important;min-height:45px;background:#1e2e3e!important;color:#fff!important}
.cb-method-pop .cb-method-link{display:block;padding:10px 12px 12px;text-decoration:none;color:#a32630;font:800 13px/1.4 Inter,Arial,sans-serif}
.cb-method-pop .cb-method-link img{width:100%;height:auto;max-height:290px;object-fit:contain;display:block;background:#f2f3f5;border-radius:6px}
.cb-method-pop .cb-method-link span{display:block;padding-top:9px}
.cb-landing-ai-controls{flex-wrap:wrap;gap:8px 12px}
.cb-landing-ai-controls select{min-width:160px;max-width:100%}
/* Avoid zero-height iframe on first selection. Replace the placeholder with measured content after load. */
.cb-panel>.cb-embed:not([data-height-ready]){height:120px!important;min-height:120px!important;background:#f8f6f0!important}
.cb-panel>.cb-embed[data-height-ready="true"]{height:var(--cb-measured-height,0px)!important;min-height:0!important}
/* v208: matched five-thumbnail + two-row video placeholder resource grids. */
.cb-method-ribbon{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(220px,1.18fr)!important;grid-template-rows:auto repeat(2,minmax(118px,auto))!important;align-items:stretch!important;gap:12px!important}
.cb-method-ribbon>h3{grid-column:1/-1!important;grid-row:1!important}
.cb-method-ribbon>.cb-resource:nth-of-type(1){grid-column:1!important;grid-row:2!important}
.cb-method-ribbon>.cb-resource:nth-of-type(2){grid-column:2!important;grid-row:2!important}
.cb-method-ribbon>.cb-resource:nth-of-type(3){grid-column:3!important;grid-row:2!important}
.cb-method-ribbon>.cb-resource:nth-of-type(4){grid-column:1!important;grid-row:3!important}
.cb-method-ribbon>.cb-resource:nth-of-type(5){grid-column:2!important;grid-row:3!important}
.cb-method-ribbon>.cb-resource-video{grid-column:4!important;grid-row:2/4!important;min-height:248px!important;display:flex!important;align-items:stretch!important;justify-content:center!important;flex-direction:column!important}
.cb-method-ribbon .cb-resource-video .cb-video-soon-art{width:100%;aspect-ratio:16/9;background:#e7ebee;border:1px dashed #9eaeb9;display:flex;align-items:center;justify-content:center;border-radius:7px;color:#52697a;font:800 16px Montserrat,Inter,sans-serif}
.cb-method-ribbon>.cb-resource-video span{font-weight:750!important;margin-top:12px;font-size:14px!important;text-align:center!important}
.cb-method-ribbon>.cb-resource:not(.cb-resource-video)>button{min-height:110px!important;height:100%;border-radius:7px}
.cb-font-options{display:flex;align-items:center;gap:5px;margin-left:auto;margin-right:11px;white-space:nowrap}
.cb-font-options>span{color:#d7e1e7;font:700 12px Inter,Arial,sans-serif;margin-right:6px}
.cb-font-options button{border:1px solid #617084;border-radius:6px;background:#253e51;color:#fff;font:750 13px Inter,sans-serif;padding:8px 10px;cursor:pointer}
.cb-font-options button[aria-pressed="true"]{background:#d4a853;color:#1e2e3e;border-color:#d4a853}
@media(max-width:1080px){.cb-method-ribbon{grid-template-columns:repeat(3,minmax(0,1fr))!important}.cb-method-ribbon>.cb-resource-video{grid-column:3!important;grid-row:3!important;min-height:118px!important}}
@media(max-width:700px){.cb-method-ribbon{grid-template-columns:repeat(2,minmax(0,1fr))!important}.cb-method-ribbon>.cb-resource{grid-row:auto!important;grid-column:auto!important}.cb-method-ribbon>.cb-resource-video{grid-column:1/-1!important;grid-row:auto!important;min-height:145px!important}.cb-tabbar{flex-wrap:wrap!important}.cb-font-options{order:3;flex:1;justify-content:flex-end}}