/* skin: warm linen, clay and sage; soft rounded shapes. */
:root {
  --linen: #f4ecdf; --paper: #fbf7f0; --wheat: #ecdcc2; --clay: #994724; --clay-soft: #f3dccb;
  --ink: #36271c; --bark: #5b4332; --sage: #536040; --sage-soft: #e3e6d2; --line: #d7c3a5;
}
html { background: var(--linen); }
body { background: var(--linen); color: var(--ink); }
a { color: var(--clay); text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
a:hover { color: var(--ink); }
a:focus-visible, button:focus-visible { outline: 3px solid var(--sage); outline-offset: 3px; border-radius: 12px; }
.site-name { color: var(--ink); }
.framing { color: var(--bark); }
.jump-index { background: var(--paper); border: 1px solid var(--line); border-radius: 999px; color: var(--ink); text-decoration: none; }
.page-lead { color: var(--bark); }
.belief { background: var(--paper); border-radius: 28px; border: 1px solid var(--line); box-shadow: 0 1px 0 var(--wheat); }
.heard { background: var(--linen); border-radius: 18px; color: var(--bark); }
.heard-label { color: var(--clay); }
.verdict-label { background: var(--sage); color: var(--paper); border-radius: 999px; }
.verdict { color: var(--ink); }
.source-line { border-top: 1px dashed var(--line); }
.source-label { color: var(--bark); }
.puppy-gap { background: var(--sage-soft); border-radius: 28px 28px 28px 6px; }
.vet-turn { background: var(--wheat); border-radius: 6px 28px 28px 28px; }
.margin-note { background: transparent; border: 2px dashed var(--line); border-radius: 28px; }
.emergency { background: var(--clay-soft); border-radius: 28px; border-left: 6px solid var(--clay); }
.budget-note { background: var(--sage-soft); border-radius: 28px; }
.report-note { background: var(--wheat); border-radius: 28px; }
.ask-sheet { background: var(--paper); border-radius: 28px; border: 1px solid var(--line); }
.ask-list ::marker { color: var(--clay); font-weight: 600; }
.ask-why { color: var(--bark); }
.reveal-toggle, .reveal-all { background: var(--clay); color: var(--paper); border: 0; border-radius: 999px; cursor: pointer; }
.reveal-toggle[aria-expanded="true"], .reveal-all[aria-pressed="true"] { background: var(--sage); }
.reveal-toggle:hover, .reveal-all:hover { background: var(--ink); }
.verdict-block.is-opening { animation: settle 0.35s ease-out; }
@keyframes settle { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .verdict-block.is-opening { animation: none; } }
.side-index { background: var(--paper); border-radius: 28px; border: 1px solid var(--line); }
.index-label { color: var(--bark); }
.side-index a { color: var(--ink); text-decoration: none; border-radius: 14px; }
.side-index a:hover { background: var(--linen); }
.side-index a[aria-current="page"] { background: var(--wheat); font-weight: 600; }
.next-notes a { background: var(--wheat); color: var(--ink); border-radius: 999px; text-decoration: none; }
.next-notes a:hover { background: var(--clay-soft); }
.site-foot { color: var(--bark); border-top: 1px solid var(--line); }
.foot-top { color: var(--clay); }
.diagram figcaption { color: var(--bark); }
.dg-paper { fill: var(--paper); stroke: var(--line); stroke-width: 2; }
.dg-path { fill: none; stroke: var(--sage); stroke-width: 3; stroke-dasharray: 2 10; stroke-linecap: round; }
.dg-stone rect { fill: var(--wheat); stroke: var(--clay); stroke-width: 2; }
.dg-empty rect { fill: var(--linen); stroke: var(--clay); stroke-width: 3; stroke-dasharray: 10 8; }
.dg-yes > rect { fill: var(--sage-soft); stroke: var(--sage); stroke-width: 2; }
.dg-no > rect { fill: var(--clay-soft); stroke: var(--clay); stroke-width: 2; }
.dg-tag { fill: var(--paper); stroke: var(--sage); stroke-width: 2; }
.dg-chip { fill: var(--paper); stroke: var(--line); stroke-width: 2; }
.dg-lane rect { fill: var(--linen); stroke: var(--line); stroke-width: 2; }
.dg-head, .dg-note { fill: var(--ink); }
.dg-foot, .dg-lane .dg-right { fill: var(--clay); }
