.cost-page { --paper: #e7e3d9; --pale: #f6f4ed; --ink: #24251f; --moss: #4c5d33; --wash: #cbd1ba; --dust: #dad7cd; background: var(--paper); color: var(--ink); }
.cost-page a { color: inherit; }
.cost-mast { border-bottom: 2px solid var(--ink); }
.cost-chapter { background: var(--pale); }
.cost-chapter--wash { background: var(--wash); }
.cost-chapter--dust { background: var(--dust); }
.cost-chapter--moss { background: var(--moss); color: var(--pale); }
.cost-notes { border-top: 2px solid currentColor; }
.cost-prompt { background: var(--paper); }
.cost-next { color: var(--pale) !important; background: var(--moss); text-decoration: none; border: 2px solid transparent; border-radius: 0; }
.cost-next:hover { color: var(--ink) !important; background: var(--wash); border-color: var(--ink); }
.cost-footer { border-top: 2px solid var(--ink); background: var(--wash); }
.cost-footer a[aria-current='page'] { text-decoration-style: double; }
.cost-page :focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }
.cost-next:focus-visible, .cost-skip:focus-visible { outline-color: var(--ink); box-shadow: 0 0 0 7px var(--pale); }
.cost-skip { background: var(--ink); color: var(--pale) !important; }
@media (forced-colors: active) {
  .cost-next { border-color: ButtonText; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}


.cost-controls button { border: 2px solid var(--moss); border-radius: 0; background: transparent; color: var(--ink); }
.cost-controls button[aria-pressed='true'] { background: var(--moss); color: var(--pale); }
.cost-controls button:hover { border-color: var(--ink); text-decoration: underline; text-underline-offset: .2em; }
.cost-controls button:focus-visible { outline-color: var(--ink); }
.cost-line { border-top: 2px solid var(--moss); }
@media (max-width: 760px) { .cost-line dl > div { border-left: 3px solid var(--moss); } }