/* Blue-to-red intensity groups questions, rather than rating treatments. */
:root { --blue: #0080FF; --red: #FF0000; --ink: #142637; --muted: #394e60; --paper: #f7f9fc; --line: #bfcedb; --radius: 24px; }
html { background: var(--paper); color: var(--ink); }
a { color: #154e82; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
a:hover { color: #10293e; }
:focus-visible { outline: 3px solid #101f33; outline-offset: 5px; }
::selection { color: #101f33; background: #b5d9ff; }
.page__identity { color: var(--muted); }
.breadcrumb__item { color: var(--muted); }
.breadcrumb__item + .breadcrumb__item::before { color: #566d80; }
.hero__kicker { color: #225179; }
.hero__aside { background: #e5f0fd; border: 1px solid #c3d5e7; box-shadow: inset 8px 0 var(--blue); }
.hero__jump { color: var(--ink); border: 1px solid #769fbd; border-radius: 16px; background: #fafdff; font-weight: 700; }
.heat-key__item { color: var(--muted); }
.heat-key__dot--learn { background: #0080FF; }
.heat-key__dot--check { background: #94bfff; }
.heat-key__dot--plan { background: #d6aeeb; }
.heat-key__dot--pause { background: #FF0000; }
.question-matrix__cell { color: var(--ink); text-decoration: none; border: 1px solid transparent; transition: background-color .18s ease, border-color .18s ease; }
.question-matrix__cell:hover, .question-matrix__cell:focus-visible { color: var(--ink); border-color: #223b52; }
.question-matrix__cell--learn { background: #dfeeff; }
.question-matrix__cell--learn:hover { background: #c6e1ff; }
.question-matrix__cell--learn-deeper { background: #cce4ff; }
.question-matrix__cell--learn-deeper:hover { background: #b3d7ff; }
.question-matrix__cell--verify { background: #d8ddfb; }
.question-matrix__cell--verify:hover { background: #c6cdf8; }
.question-matrix__cell--verify-deeper { background: #c8d4fa; }
.question-matrix__cell--verify-deeper:hover { background: #b6c8f6; }
.question-matrix__cell--visit { background: #e7ddf5; }
.question-matrix__cell--visit:hover { background: #d9c8ed; }
.question-matrix__cell--plan { background: #ead8ef; }
.question-matrix__cell--plan:hover { background: #dfc4e7; }
.question-matrix__cell--plan-deeper { background: #efd4e6; }
.question-matrix__cell--plan-deeper:hover { background: #e8bed7; }
.question-matrix__cell--pause { background: #ffd6d2; }
.question-matrix__cell--pause:hover { background: #ffc1ba; }
.question-matrix__cell--help { background: #ffc6bd; box-shadow: inset 8px 0 var(--red); }
.question-matrix__cell--help:hover { background: #ffb2a6; }
.question-matrix__cell--follow { background: #e5e9f2; }
.question-matrix__cell--follow:hover { background: #d6ddea; }
.question-matrix__category { color: #293e51; }
.question-matrix__copy { color: #293e51; }
.answer { border-color: var(--line); }
.editorial__frame { background: linear-gradient(115deg, #d4e9fe 0%, #e6e2ef 45%, #f4d9d3 100%); border: 1px solid #bacddd; }
.editorial__image { color: #293e51; font: inherit; }
.editorial__caption { color: var(--muted); }
.myth { background: #e8eefc; border: 1px solid #bccae7; transition: background-color .18s ease; }
.myth--open { background: #dce9fb; }
.myth__kicker { color: #324a66; }
.myth__toggle { color: var(--ink); background: #b9d9fd; border: 1px solid #658fb9; font-weight: 700; transition: background-color .18s ease; }
.myth__toggle:hover { background: #a4cdfe; }
.sources { background: #ffffff; border-color: var(--line); }
.sources__link { border-bottom: 1px solid #d7e1e9; }
.sources__list li:last-child .sources__link { border-bottom: 0; }
.next-question { color: var(--ink); background: #e5eef8; text-decoration: none; border: 1px solid #afc6dc; transition: background-color .18s ease; }
.next-question:hover { background: #d8e7f7; color: var(--ink); }
.next-question__label { color: #324d66; }
.page__footer { border-color: var(--line); background: #edf2f8; }
.page__footer-copy { color: #293e51; }
.page__footer-link { border: 1px solid #afc6dc; border-radius: 16px; }
.skip-link { color: #142637; background: white; border-radius: 16px; border: 2px solid #142637; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; } }
@media print { html, .page__footer, .sources, .myth, .question-matrix__cell { background: white; color: black; } a { color: black; } }
