.advanced-reader-four {
  --ar4-accent: #a8dfcf;
  margin: 1.35rem 0;
  padding: clamp(.9rem, 2.4vw, 1.45rem);
  min-width: 0;
  border: 1px solid #528b98;
  border-radius: 1rem;
  color: #edf7f8;
  background: radial-gradient(circle at 94% 0, #22515d, transparent 45%), #0b2633;
  box-shadow: 0 12px 30px #04141d55;
}
.advanced-reader-four * { box-sizing: border-box; }
.advanced-reader-four--scene { --ar4-accent: #b5d9ef; }
.advanced-reader-four--cpr { --ar4-accent: #f0c98f; }
.advanced-reader-four--ischemia { --ar4-accent: #dfb8ed; }
.advanced-reader-four--environment { --ar4-accent: #a8dcba; }
.advanced-reader-four--pregnancy { --ar4-accent: #e8b8ce; }
.advanced-reader-four--capnography { --ar4-accent: #a2e1e4; }
.advanced-reader-four--assessment { --ar4-accent: #a9c7f1; }
.advanced-reader-four--perfusion { --ar4-accent: #efc28d; }
.advanced-reader-four--postmi { --ar4-accent: #e9b3b6; }
.advanced-reader-four--rightheart { --ar4-accent: #b9dcb9; }
.advanced-reader-four--support { --ar4-accent: #d3c0f1; }
.advanced-reader-four--postrosc { --ar4-accent: #a5dce7; }
.advanced-reader-four-title { display: block; color: #f6fbfb; font-size: clamp(1.14rem, 2.4vw, 1.5rem); font-weight: 800; line-height: 1.25; }
.advanced-reader-four-job { margin: .6rem 0 .35rem; color: #e4f0f1; line-height: 1.48; }
.advanced-reader-four-source, .advanced-reader-four-note { margin: .55rem 0; color: #c0d8dd; font-size: .84rem; line-height: 1.48; }
.advanced-reader-four-picks { display: flex; gap: .45rem; min-width: 0; overflow-x: auto; padding: .7rem 0; scrollbar-width: thin; }
.advanced-reader-four-pick-cue { margin: -.2rem 0 .55rem; color: #afcbd3; font-size: .78rem; }
.advanced-reader-four button { appearance: none; flex: none; max-width: 100%; padding: .55rem .75rem; border: 1px solid #6ba2ae; border-radius: .6rem; background: #19434f; color: #f4fbfb; font: inherit; font-size: .85rem; font-weight: 750; line-height: 1.3; cursor: pointer; }
.advanced-reader-four button:hover { background: #285b68; }
.advanced-reader-four button[aria-pressed="true"] { border-color: var(--ar4-accent); background: #435f5b; box-shadow: inset 0 0 0 1px var(--ar4-accent); }
.advanced-reader-four button:focus-visible { outline: 3px solid #ffe2a3; outline-offset: 2px; }
.advanced-reader-four-pick { flex: 0 0 auto; max-width: min(18rem, 85%); white-space: normal; text-align: left; }
.advanced-reader-four-canvas { display: grid; gap: .7rem; min-width: 0; }
.advanced-reader-four-card { display: grid; align-content: start; gap: .48rem; min-width: 0; padding: .8rem .9rem; border: 1px solid #527f8d; border-left: 5px solid var(--ar4-accent); border-radius: .7rem; background: #163a48; overflow-wrap: anywhere; }
.advanced-reader-four-label { color: var(--ar4-accent); font-size: .75rem; font-weight: 850; text-transform: uppercase; letter-spacing: .035em; }
.advanced-reader-four-value { color: #f1f8f8; font-size: .91rem; font-weight: 670; line-height: 1.45; }
.advanced-reader-four-equivalent { margin: .25rem 0 0; padding: .62rem .75rem; border-left: 3px solid #a9dcca; border-radius: .35rem; background: #0b2e39; color: #dcebed; font-size: .82rem; line-height: 1.45; overflow-wrap: anywhere; }
.advanced-reader-four-action { justify-self: start; white-space: normal; text-align: left; }
.advanced-reader-four-rail { display: flex; gap: .5rem; min-width: 0; overflow-x: auto; padding: .15rem .1rem .55rem; scrollbar-width: thin; }
.advanced-reader-four-stop { display: grid; gap: .32rem; align-content: start; flex: 1 0 8rem; min-width: 8rem; padding: .7rem; border: 1px solid #69838a; border-bottom: 4px solid #69838a; border-radius: .55rem; background: #223d4b; }
.advanced-reader-four-stop.is-current { border-color: var(--ar4-accent); background: #365660; }
.advanced-reader-four-stop.is-replay { border-style: dashed; }
.advanced-reader-four-stop span { color: var(--ar4-accent); font-size: .77rem; font-weight: 850; }
.advanced-reader-four-stop strong { font-size: .82rem; line-height: 1.35; }

.advanced-reader-four-scene-board, .advanced-reader-four-cpr-comparison, .advanced-reader-four-ischemia-board,
.advanced-reader-four-environment-center, .advanced-reader-four-pregnancy-board, .advanced-reader-four-assessment-compare,
.advanced-reader-four-perfusion-board, .advanced-reader-four-postmi-compare, .advanced-reader-four-postrosc-pair {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem;
}
.advanced-reader-four-capnography-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.advanced-reader-four-rightheart-map, .advanced-reader-four-support-board { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.advanced-reader-four-tasks, .advanced-reader-four-leads { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.advanced-reader-four-choices { display: flex; flex-wrap: wrap; gap: .45rem; }
.advanced-reader-four-choices .advanced-reader-four-action { border-radius: 2rem; }
.advanced-reader-four-cpr-comparison .is-other { border-style: dashed; opacity: .8; }
.advanced-reader-four-cpr-comparison .is-current { background: #3b4d51; }
.advanced-reader-four-ischemia-board .is-signal, .advanced-reader-four-assessment-compare .is-baseline { border-left-color: #acbff1; }
.advanced-reader-four-ischemia-board .is-person, .advanced-reader-four-assessment-compare .is-current { border-left-color: #e9c38b; }
.advanced-reader-four-perfusion-board .is-bedside { border-left-color: #a3d8bd; }
.advanced-reader-four-perfusion-board .is-pressure { border-left-color: #efc18a; }
.advanced-reader-four-card.is-unverified { border-style: dashed; border-left-width: 5px; border-color: #eec188; background: #3f3b35; }
.advanced-reader-four-rightheart-map .is-venous, .advanced-reader-four-support-board .is-person { border-left-color: #a9daba; }
.advanced-reader-four-rightheart-map .is-respiratory { border-left-color: #a7c9f1; }
.advanced-reader-four-rightheart-map .is-pressure, .advanced-reader-four-support-board .is-pressure { border-left-color: #ebc18b; }
.advanced-reader-four-rightheart-map .is-view, .advanced-reader-four-support-board .is-device { border-left-color: #d4bdf0; }
.advanced-reader-four-postrosc-pair .is-perfusion { border-left-color: #eec18e; }
.advanced-reader-four-postrosc-pair .is-ecg { border-left-color: #a7c6f1; }

@media (max-width: 760px) {
  .advanced-reader-four-picks { flex-wrap: wrap; overflow-x: visible; }
  .advanced-reader-four-pick { flex: 1 1 10rem; max-width: 100%; }
  .advanced-reader-four-scene-board, .advanced-reader-four-cpr-comparison, .advanced-reader-four-ischemia-board,
  .advanced-reader-four-environment-center, .advanced-reader-four-pregnancy-board, .advanced-reader-four-assessment-compare,
  .advanced-reader-four-perfusion-board, .advanced-reader-four-postmi-compare, .advanced-reader-four-postrosc-pair,
  .advanced-reader-four-capnography-columns, .advanced-reader-four-rightheart-map, .advanced-reader-four-support-board { grid-template-columns: 1fr; }
  .advanced-reader-four-tasks, .advanced-reader-four-leads { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 390px) {
  .advanced-reader-four { padding: .8rem; }
  .advanced-reader-four-tasks, .advanced-reader-four-leads { grid-template-columns: 1fr; }
}
