/* ── Theme definitions ── Default: original (no data-theme attribute needed). Golden Hour: warm autumnal palette — set data-theme="golden-hour" on . */ html[data-theme="golden-hour"] { --paper: #faf3e6; --paper-alt: #f0e5ce; --paper-2: #f0e5ce; --paper-deep: #e5d6ba; --paper-3: #e5d6ba; --ink: #4a403a; --ink-soft: #655850; --ink-2: #5a4f48; --sepia: #8a7560; --sepia-muted: #c4ab8a; --red: #b86820; --red-deep: #96541a; --carmine: #b86820; --vermilion: #b86820; --blue: #c1666b; --teal: #8a6e42; --moss: #7a8650; --mustard: #f4a900; --ochre: #c17028; --jade: #7a8650; --claret: #a04e52; --muted: #8a7560; --rule: rgba(74, 64, 58, 0.9); --rule-soft: rgba(74, 64, 58, 0.22); --rule-hair: rgba(74, 64, 58, 0.12); } /* strava stats dark page */ html[data-theme="golden-hour"] .strava-dark { --accent: #f4a900; --accent-glow: rgba(244, 169, 0, 0.15); --accent-dim: #c08700; } /* ── Theme switcher button (injected by theme-switcher.js) ── */ .theme-toggle { appearance: none; border: 1.5px solid currentColor; background: transparent; width: 26px; height: 26px; border-radius: 50%; cursor: pointer; margin-left: auto; padding: 0; display: flex; align-items: center; justify-content: center; opacity: 0.5; transition: opacity 0.15s, transform 0.15s; flex-shrink: 0; } .theme-toggle:hover { opacity: 1; transform: scale(1.1); } .theme-toggle .swatch { width: 14px; height: 14px; border-radius: 50%; pointer-events: none; } /* swatch colors per theme — show the *other* theme's accent */ html:not([data-theme="golden-hour"]) .theme-toggle .swatch { background: #b86820; } html[data-theme="golden-hour"] .theme-toggle .swatch { background: #b8202a; }