/* Virtual investigation tools; deliberately scoped away from existing lessons. */
html.science-labs-page { scroll-behavior: auto; }
.science-labs { margin: 0; background: var(--hs-canvas); color: var(--hs-ink); font-family: var(--hs-font-body); line-height: var(--hs-lh-body); }
.science-labs *, .science-labs *::before, .science-labs *::after { box-sizing: border-box; }
.science-labs [hidden] { display: none !important; }
.science-labs a { color: #174dab; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.science-labs :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid #1d4ed8; outline-offset: 4px; }
.science-labs h1, .science-labs h2, .science-labs h3, .science-labs h4 { font-family: var(--hs-font-display); line-height: 1.2; color: inherit; }
.science-labs h2 { font-size: clamp(24px, 3vw, 32px); margin: 0 0 18px; }
.science-labs h3 { font-size: 21px; margin: 0 0 16px; }
.science-labs h4 { font-size: 19px; margin: 26px 0 8px; }
.science-labs p { margin: 0 0 16px; }
.sl-skip { position: fixed; top: -100px; left: 12px; padding: 12px; z-index: 20; background: white; }
.sl-skip:focus { top: 12px; }
.sl-header { display: flex; justify-content: space-between; align-items: center; gap: 18px; max-width: 1160px; margin: auto; padding: 22px 24px; }
.sl-brand { font-weight: 850; font-size: 23px; text-decoration: none; }
.sl-header nav { display: flex; gap: 18px; flex-wrap: wrap; }
.sl-header nav a { display: inline-flex; align-items: center; min-height: var(--hs-tap); font-weight: 650; }
.sl-shell { width: min(1112px, calc(100% - 48px)); margin: 0 auto; }
.sl-hero { background: var(--hs-brand-grad); color: #fff; border-radius: var(--hs-r-2xl); padding: clamp(28px, 5vw, 60px); margin: 0 0 36px; position: relative; overflow: hidden; }
.sl-hero h1 { margin: 12px 0 24px; font-size: clamp(34px, 5.5vw, 62px); letter-spacing: -0.03em; }
.sl-hero p { max-width: 790px; font-size: 18px; }
.sl-hero .sl-hero-note { font-size: 15px; padding: 14px 16px; margin-bottom: 0; border: 1px solid rgba(255,255,255,.45); border-radius: var(--hs-r-md); background: rgba(0,0,0,.14); }
.sl-eyebrow { font-weight: 750; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; }
.sl-mission-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 20px 0 36px; }
.sl-mission-cards > a { display: flex; flex-direction: column; gap: 8px; padding: 18px; min-height: var(--hs-tap); border: var(--hs-bw) solid var(--hs-rule); background: var(--hs-panel); border-radius: var(--hs-r-lg); box-shadow: var(--hs-stick-sm); text-decoration: none; color: var(--hs-ink); border-top: 5px solid #1d4ed8; }
.sl-mission-cards > a:nth-child(3n + 2) { border-top-color: #047857; }
.sl-mission-cards > a:nth-child(3n) { border-top-color: #7c3aed; }
.sl-mission-cards > a[aria-current="true"] { outline: 3px solid #1d4ed8; outline-offset: 2px; background: #eef4ff; }
.sl-card-title { font-size: 18px; font-weight: 800; line-height: 1.3; }
.sl-card-subject { font-size: 12px; font-weight: 700; color: var(--hs-ink-2); }
.sl-card-summary { font-size: 14px; color: var(--hs-ink-2); }
.sl-workbench { scroll-margin-top: 20px; }
.sl-mission-head { border-left: 6px solid #7c3aed; padding: 8px 0 8px 22px; margin: 30px 0 24px; }
.sl-question { font-size: 20px; font-weight: 650; }
.sl-sources { display: flex; gap: 16px; flex-wrap: wrap; font-size: 14px; }
.sl-two-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.sl-card { border: var(--hs-bw) solid var(--hs-rule); border-radius: var(--hs-r-xl); padding: 24px; background: var(--hs-panel); box-shadow: var(--hs-stick-sm); margin-bottom: 24px; min-width: 0; }
.sl-step { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: var(--hs-r-pill); background: #ede9fe; color: #5b21b6; margin-right: 6px; font-size: 18px; }
.science-labs label { display: block; font-size: 15px; font-weight: 650; margin: 0 0 7px; }
.science-labs :is(input, textarea, select) { display: block; width: 100%; min-width: 0; padding: 11px 12px; border: 1.5px solid #8d9aac; border-radius: var(--hs-r-sm); background: white; color: var(--hs-ink); font: inherit; min-height: var(--hs-tap); margin: 0 0 14px; }
.science-labs textarea { resize: vertical; line-height: 1.6; }
.sl-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.sl-controls > div { min-width: 0; }
.sl-help { color: var(--hs-ink-2); font-size: 14px; }
.sl-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 18px; }
.science-labs button { border-radius: var(--hs-r-md); padding: 11px 16px; min-height: var(--hs-tap); font: inherit; font-weight: 750; cursor: pointer; white-space: normal; }
.sl-primary { background: #1d4ed8; color: white; border: 2px solid #1d4ed8; }
.sl-secondary { background: white; color: #174dab; border: 1.5px solid #8d9aac; }
.sl-status { font-weight: 650; color: var(--hs-info); min-height: 25px; }
.sl-status.sl-error { color: var(--hs-bad); }
.sl-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.sl-metric { padding: 16px; background: #eef4ff; border: 1px solid #c3d5f8; border-radius: var(--hs-r-md); }
.sl-metric span { display: block; color: var(--hs-ink-2); font-size: 13px; }
.sl-metric strong { display: block; margin-top: 8px; font-size: 22px; font-weight: 800; overflow-wrap: anywhere; }
.sl-metric small { font-size: 14px; }
.sl-chart-panel { margin: 24px 0; border: 1px solid var(--hs-rule-soft); border-radius: var(--hs-r-md); padding: 16px; background: white; }
.science-labs #evidence-chart { display: block; width: 100%; height: 270px; }
.sl-axis-label { color: var(--hs-ink); font-size: 14px; font-weight: 700; margin-bottom: 8px !important; }
.sl-x-label { text-align: center; margin-top: 8px !important; }
.sl-legend { display: flex; flex-wrap: wrap; list-style: none; gap: 10px 18px; padding: 0; margin: 16px 0 0; font-size: 14px; }
.sl-legend li { display: flex; align-items: center; gap: 8px; }
.sl-legend-mark { display: inline-block; width: 24px; border-top: 3px solid; }
.sl-data { border-top: 1px solid var(--hs-rule); padding: 16px 0; }
.science-labs summary { font-weight: 700; color: #174dab; cursor: pointer; padding: 7px 0; min-height: var(--hs-tap); }
.sl-data > p { margin: 12px 0; }
.sl-table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid var(--hs-rule); border-radius: var(--hs-r-sm); margin: 12px 0; }
.science-labs table { border-collapse: collapse; width: 100%; font-size: 14px; }
.science-labs caption { text-align: left; font-weight: 700; padding: 14px; background: #f4f0e8; }
.science-labs :is(th, td) { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--hs-rule-soft); vertical-align: top; }
.science-labs th { background: #f4f0e8; font-weight: 750; }
.science-labs tbody tr:nth-child(even) { background: #faf8f4; }
.sl-trial-select { min-width: 72px; padding: 5px 9px !important; font-size: 14px !important; }
.sl-existing { margin-top: 40px; }
.sl-next { background: #e3f1f4; border: 1.5px solid #8ec4ca; padding: 28px; border-radius: var(--hs-r-xl); margin: 20px 0 40px; }
.sl-next p:last-child { margin-top: 14px; margin-bottom: 0; }
.sl-footer { max-width: 1112px; padding: 22px 24px 38px; margin: auto; display: flex; gap: 18px; flex-wrap: wrap; color: var(--hs-ink-2); font-size: 14px; }
@media (max-width: 800px) { .sl-mission-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sl-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sl-two-columns { grid-template-columns: 1fr; gap: 0; } }
@media (max-width: 480px) { .sl-header { padding: 14px 16px; align-items: start; flex-direction: column; gap: 6px; } .sl-header nav { gap: 18px; } .sl-shell { width: calc(100% - 32px); } .sl-hero { padding: 26px 20px; } .sl-hero p { font-size: 16px; } .sl-mission-cards { grid-template-columns: 1fr; } .sl-card { padding: 18px; } .sl-controls { grid-template-columns: 1fr; } .sl-metric { padding: 12px; } .sl-metric strong { font-size: 20px; } .sl-chart-panel { padding: 10px; } .sl-actions > button { width: 100%; } .sl-mission-head { padding-left: 14px; } }
@media (prefers-reduced-motion: reduce) { .science-labs *, .science-labs *::before, .science-labs *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }
@media print { .science-labs { background: white; font-size: 11pt; } .sl-header, .sl-footer, .sl-hero, #choose-lab, .sl-mission-cards, .sl-existing, .sl-next, .sl-actions, #trial-form, .sl-status { display: none !important; } .sl-shell { width: 100%; } .sl-workbench { display: block; } .sl-card { box-shadow: none; border: 1px solid #777; padding: 14px; break-inside: avoid; } .sl-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); } .sl-chart-panel { break-inside: avoid; } .sl-table-wrap { overflow: visible; max-width: none; } .science-labs table { font-size: 9pt; table-layout: fixed; overflow-wrap: anywhere; } .science-labs :is(th, td) { padding: 7px; } .science-labs textarea { border: 0; min-height: 100px; } .sl-help { font-size: 10pt; } }