/* Shared improvements preserve the existing dark/red project palette. */
:root { --muted: #b0b0b0; --dim: #a0a0a0; }
html { scroll-padding-top: 1rem; }
body { padding-bottom: calc(5rem + env(safe-area-inset-bottom)); }
a:focus-visible, button:focus-visible, summary:focus-visible, textarea:focus-visible, input:focus-visible { outline: 3px solid #f2c16b; outline-offset: 4px; }
.skip-link { position: fixed; left: 1rem; top: -8rem; z-index: 20000; background: #fff; color: #111; padding: .75rem 1rem; }
.skip-link:focus { top: 1rem; }
.header-intro { max-width: 56ch; margin: 0 auto 1.5rem; font-size: 1.1rem; }
.start-paths { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.start-card { display: flex; flex-direction: column; gap: .8rem; padding: 1.25rem; border: 1px solid #505050; border-radius: 6px; background: var(--surface, #181818); }
.start-card:hover { border-color: #e78a7f; }
.start-card strong { font-size: 1.15rem; line-height: 1.35; }
.start-card span { font-size: .9rem; line-height: 1.5; color: #bdbdbd; }
.start-card .start-label { font-size: .75rem; color: #ef9d92; }
.start-card b { margin-top: auto; padding-top: .5rem; font-size: .9rem; color: #fff; }
.project-status { font-size: .875rem; color: #bdbdbd; }
.section-nav, .return-nav { display: flex; gap: .5rem; flex-wrap: wrap; }
.section-nav { padding: .75rem 0; border-block: 1px solid #444; margin-bottom: 2rem; }
.section-nav a, .return-nav a { display: inline-flex; align-items: center; min-height: 48px; padding: .5rem .85rem; text-decoration: underline; text-underline-offset: .25rem; }
.return-nav { max-width: 900px; margin: auto; padding: 1rem 1.25rem 0; }
.background { margin: 2rem 0; border: 1px solid #505050; border-radius: 6px; }
.background summary { padding: 1rem; min-height: 48px; cursor: pointer; font-weight: 600; }
.disclosure-content { padding: 0 1.25rem 1.25rem; }
.disclosure-content a, .page p a { text-decoration: underline; text-underline-offset: .2rem; }
.page .engage-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.page .engage-tag, .page .event-kicker, .page .option-num, .page .seq-num, .kicker, .mode { color: #ef9d92; }
.page .event-meta, .page .engage-arrow, .page footer span, .page footer a, .muted, .footer { color: #aaa; }
.choice { font: inherit; }
.choice:focus-visible { outline: 3px solid #f2c16b; outline-offset: 4px; }
.btn, .btn-primary, .btn-secondary, .event-actions a { min-height: 48px; }
#main:focus, #routeTitle:focus { outline: none; }
@media (max-width: 700px) { .start-paths { grid-template-columns: 1fr; } .start-card { gap: .5rem; } .page { padding-inline: 1rem; } .section-nav { gap: 0; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto !important; } *, *::before, *::after { animation: none !important; transition: none !important; } }
.document-page { background: #0d0d0d; color: #f0f0f0; margin: 0; font: 16px/1.75 system-ui, sans-serif; }
.document-page * { box-sizing: border-box; }
.document-page a { color: #f0d0ca; text-underline-offset: .2rem; overflow-wrap: anywhere; }
.document-content { max-width: 820px; margin: auto; padding: 1rem 1.25rem 3rem; }
.document-content h1 { font-size: clamp(1.9rem, 5vw, 3rem); line-height: 1.2; }
.document-content h2 { margin-top: 2rem; line-height: 1.35; }
.document-content p, .document-content li { color: #c5c5c5; }
.document-content ul, .document-content ol { padding-left: 1.5rem; }
.document-content li { margin-block: .5rem; }
.document-content table { display: block; overflow-x: auto; border-collapse: collapse; max-width: 100%; }
.document-content td, .document-content th { padding: .65rem; border: 1px solid #555; text-align: left; }
.document-content pre { overflow-x: auto; padding: 1rem; background: #181818; }
.document-content blockquote { border-left: 3px solid #c0392b; padding-left: 1rem; margin-inline: 0; }
.document-content footer { border-top: 1px solid #444; padding-top: 1rem; margin-top: 3rem; }
.document-label { font-size: .8rem; color: #ef9d92 !important; }
.document-toc { border: 1px solid #505050; padding: 0 1rem; border-radius: 6px; }
.document-toc summary { min-height: 48px; padding-block: .7rem; cursor: pointer; }
.document-toc a { display: inline-block; min-height: 44px; padding-block: .4rem; }
@media print { .pixie-button, .pixie-backdrop, .return-nav, .skip-link, .document-toc { display: none !important; } .document-page { background: #fff; color: #111; } .document-content p, .document-content li, .document-page a { color: #111; } }
