/* Shared cervical stenosis / myelopathy anatomy presentation. */
.cc-hero-figure{width:100%;max-width:470px;margin:0;background:#fff;border:1px solid #ffffff55;border-radius:24px;overflow:hidden;box-shadow:0 30px 65px -28px #001a3599}
.cc-hero-label{padding:18px 22px 0;color:#125985;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.cc-hero-figure img{display:block;width:100%;aspect-ratio:1;object-fit:contain}
.cc-hero-figure figcaption{padding:0 22px 22px;color:#526a7d;font-size:13px;line-height:1.6}
.cc-hero-figure figcaption strong{display:block;color:#123551;font-size:17px;margin-bottom:5px}
.cx-figure.cc-cross{padding:18px;border-radius:22px;overflow:hidden;background:#0b293e;border:1px solid #ffffff30;box-shadow:0 24px 55px -35px #0009}
.cc-cross .cx-figure-head{padding:3px 4px 16px;gap:12px}
.cc-cross .cx-figure-head span{font-size:10px;letter-spacing:.1em;white-space:nowrap}
.cc-cross-stage{background:#fff;border-radius:16px;overflow:hidden}
.cc-cross-stage img{width:100%;aspect-ratio:1;object-fit:contain;display:block}
.cc-orientation{display:flex;justify-content:space-between;gap:12px;padding:10px 15px;color:#526a7d;font-size:10px;font-weight:800;letter-spacing:.07em;background:#f0f6fa;text-transform:uppercase}
.cc-cross .cx-legend{gap:9px 14px;flex-wrap:wrap;padding:14px 0;font-size:11px}
.cc-focus{border:1px solid #ffc47a44;border-radius:12px;padding:13px 15px;background:#ffc47a0b;color:#f4d19d;font-size:13px;line-height:1.6}
.cc-focus strong{display:block;color:#ffcf8d;font-size:10px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.cc-cross figcaption{margin-top:16px;font-size:13px;min-height:0;padding:16px 4px 4px;border-top:1px solid #ffffff24}
#stages .pg-btn{padding:18px;min-height:92px;border-color:#b4d2e354}
#stages .pg-btn:focus-visible,#daily-signs .pg-btn:focus-visible{outline:3px solid #ffd080;outline-offset:4px}
.cc-stage-note{max-width:760px;margin:25px auto 0;text-align:center;color:#b1cbde;font-size:13px;line-height:1.7}
.cc-connection{display:grid;gap:12px;margin-top:24px;padding:22px 25px;border-radius:18px;border:1px solid #cbdde9;background:#f0f7fb;color:#4d6376;font-size:15px;line-height:1.7}
.cc-connection strong{color:#163852;font-size:17px;display:block;margin-bottom:4px}
.cc-connection a{color:#0a4d8c;font-weight:800;text-decoration:underline;text-underline-offset:3px}
.cm-visual-grid{display:grid;gap:28px;align-items:start}
.cm-body-figure{margin:0;padding:20px;background:#0b293e;border:1px solid #ffffff30;border-radius:22px;overflow:hidden}
.cm-body-heading{display:flex;gap:12px;justify-content:space-between;align-items:center;color:#d7ebf6;font-size:13px;font-weight:700}
.cm-body-heading span{padding:4px 9px;border-radius:99px;border:1px solid #b0dcee44;font-size:10px;white-space:nowrap;color:#afd9ee}
.cm-body-svg{display:block;width:100%;height:530px}
.cm-body-area{fill:#ffba4f55;stroke:#ffd181;stroke-width:3}
.cm-body-cord{stroke:#ffd079;stroke-width:7;fill:none;stroke-linecap:round}
.cm-body-signal{stroke:#ffce7b;stroke-width:3;fill:none;stroke-dasharray:8 7;opacity:.8}
.cm-body-neck{fill:#f9b77e44;stroke:#ffbf89;stroke-width:3}
.cm-body-figure figcaption{border-top:1px solid #ffffff22;padding-top:14px;color:#b1ccde;font-size:12px;line-height:1.7}
.cm-body-legend{display:flex;gap:16px;flex-wrap:wrap;margin:8px 0 13px;color:#d1e2ed;font-size:11px}
.cm-body-legend span{display:flex;align-items:center;gap:6px}
.cm-body-legend i{display:inline-block;width:12px;height:12px;background:#ffba4f55;border:1px solid #ffd181;border-radius:3px}
.cm-body-legend span:last-child i{border-radius:50%;background:#f9b77e44;border-color:#ffbf89}
.cm-task-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-bottom:18px}
.cm-task-tabs .pg-btn{min-height:85px;padding:17px;border-radius:14px;text-align:left;font:inherit;border-color:#b4d2e354;cursor:pointer}
.cm-task-tabs .pg-btn div{font-size:14px;line-height:1.5}
.cm-task-detail{min-height:205px}
.cm-visual-note{padding:16px 0;color:#b2cdde;font-size:13px;line-height:1.7}
.cm-visual-note a{color:#a3e3fa;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.cc-mri-callout{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:28px;padding:24px;border-radius:18px;background:#eef7fc;border:1px solid #cddfeb;text-decoration:none}
.cc-mri-callout strong{display:block;color:#173952;font-size:18px;margin-bottom:6px}
.cc-mri-callout p{color:#536c80;font-size:14px;line-height:1.7}
.cc-mri-callout>span{font-size:13px;font-weight:800;color:#0a4d8c;flex-shrink:0}
.cc-mri-callout:hover{background:#e4f3fc}
.cc-mri-callout:focus-visible{outline:3px solid #1f93c3;outline-offset:4px}
@media(min-width:850px){.cm-visual-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:32px}.cc-connection{grid-template-columns:1fr auto;align-items:center;gap:30px}}
@media(max-width:599px){.cc-cross .cx-figure-head{align-items:flex-start;flex-direction:column;gap:5px}.cm-body-svg{height:460px}.cm-task-tabs .pg-btn{padding:14px}.cc-mri-callout{display:block}.cc-mri-callout>span{display:block;margin-top:15px}}
@media(prefers-reduced-motion:reduce){#stages .pg-btn,#daily-signs .pg-btn{transition:none}}