:root {
  color-scheme: light;
  --paper: #f6f3e9;
  --ink: #203730;
  --quiet: #485b51;
  --line: #c3cbbb;
  --leaf: #d1e0ca;
  --blue: #d2e1e8;
  --lilac: #dfd7eb;
  --sun: #efe1a5;
}
body { background: var(--paper); color: var(--ink); }
a { color: var(--ink); }
::selection { color: var(--ink); background: var(--sun); }
.guide-mast { border-bottom: 1px solid var(--line); }
.guide-kicker, .topic-label, .reading-purpose { color: var(--quiet); }
.plain-switch input { appearance: none; border: 2px solid var(--ink); border-radius: 999px; background: var(--paper); }
.plain-switch input::before { content: ''; position: absolute; width: 24px; height: 24px; top: 8px; left: 4px; border-radius: 50%; background: var(--ink); }
.plain-switch input:checked { background: var(--leaf); }
.plain-switch input:checked::before { left: 20px; }
.reading-ring { border-radius: 50%; background: conic-gradient(from -30deg, var(--leaf) 0deg 112deg, var(--paper) 112deg 120deg, var(--blue) 120deg 232deg, var(--paper) 232deg 240deg, var(--lilac) 240deg 352deg, var(--paper) 352deg 360deg); border: 1px solid var(--line); }
.reading-ring::after { content: ''; position: absolute; inset: 2.75rem; border-radius: 50%; background: var(--paper); border: 1px solid var(--line); }
.map-centre { border-radius: 50%; background: var(--paper); }
.reading-map a { border: 1px solid var(--ink); border-radius: 3px; box-shadow: 4px 4px 0 var(--paper); }
.medicine-route { background: var(--leaf); }
.care-route { background: var(--blue); }
.cost-route { background: var(--lilac); }
.contents-rail summary { border-bottom: 1px solid var(--line); }
.reading-topics .topic-group::before { content: ''; display: inline-block; width: .65rem; height: .65rem; margin-right: .5rem; border: 1px solid var(--ink); border-radius: 50%; }
.understand-topics .topic-group::before { background: var(--leaf); }
.arrange-topics .topic-group::before { background: var(--blue); }
.decide-topics .topic-group::before { background: var(--lilac); }
.continuous-reading .guide-topic { border-top: 1px solid var(--ink); }
.topic-label::before { content: ''; display: inline-block; width: .9rem; height: .9rem; margin-right: .65rem; border: 2px solid var(--ink); border-radius: 50%; vertical-align: -.08em; }
.medicine-reading .topic-label::before, .results-reading .topic-label::before { background: var(--leaf); }
.care-reading .topic-label::before, .health-reading .topic-label::before, .product-reading .topic-label::before { background: var(--blue); }
.payment-reading .topic-label::before, .question-reading .topic-label::before, .evidence-reading .topic-label::before { background: var(--lilac); }
.medicine-names > section { background: var(--leaf); border-top: 2px solid var(--ink); }
.medicine-names > section + section { background: var(--blue); }
.conversation { background: var(--sun); border-left: 3px solid var(--ink); border-radius: 0 2rem 2rem 0; }
.word-note { border: 1px dashed var(--quiet); border-radius: 1.8rem; }
.attention-note { background: var(--blue); border-left: 3px solid var(--ink); }
.urgent-note { background: var(--ink); color: var(--paper); border-radius: 0 2rem 2rem 0; }
.care-steps > section + section, .health-notes > section + section { border-top: 1px solid var(--line); }
.product-checks li { border-bottom: 1px solid var(--line); }
.cost-notes > section { background: var(--lilac); border-left: 3px solid var(--ink); }
.cost-notes > section:nth-child(2) { background: var(--leaf); }
.cost-notes > section:nth-child(3) { background: var(--blue); }
.visit-questions li { border-bottom: 1px solid var(--line); }
.visit-questions li::before { border: 2px solid var(--ink); border-radius: 50%; background: var(--paper); }
.annotated-reading li { border-top: 1px solid var(--line); }
.guide-footer { border-top: 2px solid var(--ink); }
a:focus-visible, input:focus-visible, summary:focus-visible { outline: 3px solid var(--ink); outline-offset: 4px; }
a:hover { text-decoration: underline; }
.reading-map a:hover, .reading-topics a:hover { background: var(--sun); }
@media (max-width: 760px) {
  .contents-rail { border: 1px solid var(--line); border-radius: 3px; }
  .reading-ring::after { inset: 2.3rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
@media print {
  body, .conversation, .word-note, .attention-note, .urgent-note, .medicine-names > section, .cost-notes > section { color: #000; background: #fff; }
  .guide-footer { border-top-color: #000; }
}