.visual-opportunity-lab{margin:32px auto;padding:28px;border:1px solid #c7d4df;border-radius:16px;background:#eef5f8;color:#12314b}
.visual-opportunity-lab *{box-sizing:border-box}.visual-opportunity-lab__heading{max-width:760px}.visual-opportunity-lab__heading h2{margin:.2rem 0 .6rem;font-size:clamp(1.6rem,3vw,2.35rem);line-height:1.15}.visual-opportunity-lab__heading p{margin:.4rem 0;color:#385066}.visual-opportunity-lab__eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#075a85}
.visual-lab-filters{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.visual-lab-filters button,.visual-lab-card button{min-height:44px;border:1px solid #536e83;border-radius:8px;background:#fff;color:#12314b;padding:10px 14px;font:600 .95rem/1.3 system-ui;cursor:pointer}.visual-lab-filters button[aria-pressed=true],.visual-lab-card button[aria-pressed=true]{background:#123e5c;color:#fff;border-color:#123e5c}.visual-lab-filters button:focus-visible,.visual-lab-card button:focus-visible{outline:3px solid #b74f00;outline-offset:3px}
.visual-lab-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}.visual-lab-card{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid #c7d4df;border-radius:12px;overflow:hidden}.visual-lab-card[hidden]{display:none}.visual-lab-card__source{position:relative;overflow:hidden;background:#fff;border-bottom:1px solid #d6e0e7}.visual-lab-card__source img{display:block;width:100%;height:220px;object-fit:contain;background:#fff}.visual-lab-card__source[data-frame=focus] img{object-fit:cover}.visual-lab-card__source::after{content:"Whole OEM page";position:relative;z-index:1;display:block;padding:6px 12px;background:#123e5c;color:#fff;font-size:.72rem;font-weight:800;letter-spacing:.04em}.visual-lab-card__source[data-frame=focus]::after{content:"OEM page \00B7  recorded focus"}.visual-lab-card__body{display:flex;flex:1;flex-direction:column;gap:10px;padding:16px}.visual-lab-card__meta{display:flex;justify-content:space-between;gap:8px;color:#51677c;font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.visual-lab-card h3{margin:0;font-size:1.15rem;line-height:1.25}.visual-lab-card p{margin:0;color:#385066}.visual-lab-card__focus{padding:10px 12px;border-left:3px solid #237ba1;background:#f2f8fa;font-size:.92rem}.visual-lab-card__actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}.visual-lab-card__actions a{display:inline-flex;align-items:center;min-height:44px;padding:10px 14px;border-radius:8px;background:#075a85;color:#fff;text-decoration:none;font-weight:700}.visual-lab-card__actions a:focus-visible{outline:3px solid #b74f00;outline-offset:3px}
.visual-lab-activity{margin-top:2px;padding-top:12px;border-top:1px solid #d6e0e7}.visual-lab-activity summary{min-height:44px;padding:10px 0;color:#075a85;font-weight:800;cursor:pointer}.visual-lab-question{font-weight:700}.visual-lab-choices{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.visual-lab-feedback{min-height:2.6em;margin-top:10px;padding:9px 11px;border-radius:8px;background:#f4f7f9;color:#385066}.visual-lab-feedback.is-correct{background:#e4f4ea;color:#155b36}.visual-lab-feedback.is-needs-work{background:#fff0db;color:#7b3f00}.visual-lab-steps{display:grid;gap:8px}.visual-lab-step{padding:10px 12px;border:1px solid #d2dee6;border-radius:8px;background:#f8fbfc}.visual-lab-step[hidden]{display:none}.visual-lab-step__controls{display:flex;align-items:center;gap:8px;margin-top:10px}.visual-lab-step__controls button{flex:0 0 auto}.visual-lab-step__status{margin-left:auto;font-size:.82rem;font-weight:800;color:#51677c}.visual-lab-boundary{margin-top:10px;font-size:.82rem;color:#51677c}
/* "Open" and the page wrap apart; the page name and its arrow stay together. */
.visual-lab-card__actions a{flex-wrap:wrap;column-gap:.3em;text-align:center}.visual-lab-card__page{white-space:nowrap}
@media(max-width:620px){.visual-opportunity-lab{padding:18px;margin:22px 0}.visual-lab-card__source img{height:190px}.visual-lab-card__actions a{flex:1 1 auto;justify-content:center}}
@media(prefers-reduced-motion:reduce){.visual-opportunity-lab *{scroll-behavior:auto!important;transition:none!important}}
@media print{.visual-opportunity-lab{background:#fff;border:1px solid #999}.visual-lab-filters,.visual-lab-card__actions,.visual-lab-activity summary{display:none}.visual-lab-card[hidden]{display:flex}.visual-lab-grid{grid-template-columns:1fr 1fr}.visual-lab-activity{display:block}}
