.hemodynamics-page { color: #172d43; background: #f2f5f8; }
.hemodynamics-page .workspace { grid-template-columns: minmax(0,1fr); gap: 18px; }
.hemodynamics-page .panel { min-width: 0; }
.hemodynamics-page .snapshot-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(260px,320px); align-items: start; gap: 18px; }
.hemodynamics-page .prompt { color: #172d43; }
.hemodynamics-page .toolbar .secondary { margin-left: 0; }
.hemodynamics-page .toolbar select { min-width: 150px; }
.hemodynamics-page .snapshot { background: #081c30; color: #f5f9ff; border: 1px solid #304860; border-radius: 12px; padding: 24px; }
.hemodynamics-page .snapshot-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-bottom: 20px; border-bottom: 1px solid #3a5066; }
.hemodynamics-page .snapshot-heading h2 { color: #fff; margin: 0; font-size: 1.4rem; }
.hemodynamics-page .snapshot-heading > span { font-size: .875rem; color: #c5d6e6; border: 1px solid #52677e; padding: 6px 10px; border-radius: 5px; }
.hemodynamics-page .value-table { grid-template-columns: repeat(2,minmax(0,1fr)); margin: 20px 0 0; gap: 20px; }
.hemodynamics-page .snapshot-group { min-width: 0; --metric: #73d7ff; }
.hemodynamics-page .snapshot-group.pressure { grid-column: 1 / -1; }
.hemodynamics-page .snapshot-group.flow { grid-column: 1 / -1; --metric: #7fe2bb; }
.hemodynamics-page .snapshot-group.resistance { --metric: #ffd47b; }
.hemodynamics-page .snapshot-group.oxygen { --metric: #d4b5ff; }
.hemodynamics-page .snapshot-group h3 { margin: 0 0 10px; color: #e5eff8; font-size: 1rem; font-weight: 600; }
.hemodynamics-page .snapshot-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.hemodynamics-page .flow .snapshot-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
.hemodynamics-page .resistance .snapshot-cards,.hemodynamics-page .oxygen .snapshot-cards { grid-template-columns: minmax(0,1fr); }
.hemodynamics-page .value-card { background: #122b43; border: 1px solid #3e5670; border-top: 3px solid var(--metric); border-radius: 6px; padding: 16px 20px; min-width: 0; }
.hemodynamics-page .value-card .metric-label { color: var(--metric); font-size: 1rem; font-weight: 750; letter-spacing: .04em; }
.hemodynamics-page .value-card strong { color: #fff; font-size: clamp(1.75rem,3.5vw,2.75rem); font-variant-numeric: tabular-nums; letter-spacing: -.025em; margin: 8px 0 2px; line-height: 1.2; overflow-wrap: anywhere; }
.hemodynamics-page .value-card small { color: #d7e4f0; font-size: .875rem; }
.hemodynamics-page .value-card .metric-name { color: #c0d2e3; font-size: .875rem; margin-top: 12px; line-height: 1.4; }
.hemodynamics-page .beginner-metric { grid-column: 1 / -1; max-width: 420px; }
.hemodynamics-page .beginner-metric .snapshot-cards { grid-template-columns: minmax(0,1fr); }
.hemodynamics-page .beginner-card.correct { background: #123b35; border-color: #7fe2bb; }
.hemodynamics-page .beginner-card.wrong { background: #44292e; border-color: #ff9c92; }
.hemodynamics-page #selection-help { color: #425b72; margin: 6px 0 0; }
.hemodynamics-page .reference { background: #fff; color: #172d43; padding: 0; border: 1px solid #aabccc; box-shadow: none; }
.hemodynamics-page .reference summary { cursor: pointer; padding: 20px 24px; color: #172d43; font-size: 1rem; font-weight: 750; }
.hemodynamics-page .reference summary span { display: inline-block; margin-left: 16px; color: #425b72; font-size: .875rem; font-weight: 500; }
.hemodynamics-page .range-content { padding: 0 24px 20px; color: #253f55; line-height: 1.65; }
.hemodynamics-page .range-content ul { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 24px; list-style: none; padding: 0; }
.hemodynamics-page .snapshot-row .range-content ul { grid-template-columns: minmax(0,1fr); }
.hemodynamics-page .range-content li { color: #172d43; padding: 8px 0; border-bottom: 1px solid #dce4eb; }
.hemodynamics-page .range-content li::before { content: none; }
.hemodynamics-page .answer-grid button:disabled { opacity: 1; }
.hemodynamics-page .answer-grid button.selected { background: #e7f1f5; color: #102b40; }
.hemodynamics-page #feedback { color: #123d2d; margin: 18px 0 0; }
.hemodynamics-page #feedback.wrong-feedback { background: #fff0ed; color: #752b24; }
.hemodynamics-page summary:focus-visible { outline: 3px solid #8b2d18; outline-offset: 3px; }
@media (max-width:600px) {
 .hemodynamics-page .snapshot { padding: 16px; }
 .hemodynamics-page .snapshot-cards,.hemodynamics-page .flow .snapshot-cards,.hemodynamics-page .value-table { grid-template-columns: minmax(0,1fr); }
 .hemodynamics-page .value-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 4px 12px; }
 .hemodynamics-page .value-card strong { grid-column: 2; grid-row: 1 / 3; margin: 0; }
 .hemodynamics-page .value-card .metric-name { grid-column: 1 / -1; margin-top: 6px; }
 .hemodynamics-page .range-content ul { grid-template-columns: minmax(0,1fr); }
}
@media (max-width:900px) {
 .hemodynamics-page .snapshot-row { grid-template-columns: minmax(0,1fr); }
}
