/**
 * page-extras-v20260511a.css — small sitewide UX additions.
 *
 * - Slow Mode (when localStorage.deskrune.slow_mode == '1', body gets [data-slow])
 * - Reading progress line on long pages
 * - "Today is..." inline widget hook
 */

/* Slow Mode: strip all animation + tighten type */
body[data-slow] *,
body[data-slow] *::before,
body[data-slow] *::after {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}
body[data-slow] {
  --ds-clay: #6f6a60;
}
body[data-slow] .aurora-stage,
body[data-slow] .desk-lantern .flame,
body[data-slow] .desk-jar .coin-glow,
body[data-slow] .wall-ticker .ticker-track {
  display: none !important;
}
body[data-slow] h1, body[data-slow] h2, body[data-slow] h3 { letter-spacing: 0; }

/* Reading progress line — fixed left margin, fills as page scrolls */
.dr-reading-progress {
  position: fixed;
  left: 0;
  top: 56px;
  bottom: 0;
  width: 3px;
  background: linear-gradient(to bottom, #c9613f 0%, #c9613f var(--read-pct, 0%), rgba(232,226,215,0.25) var(--read-pct, 0%));
  z-index: 40;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
@media (max-width: 720px) { .dr-reading-progress { display: none; } }
body[data-slow] .dr-reading-progress { transition: none; }

/* "Today is..." pill — used by /today/ widget and home insert */
.dr-today-pill {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  background: #fff;
  border: 1px solid #e8e2d7;
  border-radius: 99px;
  padding: 6px 14px;
  font-size: 12.5px;
  color: #1a1814;
  font-family: -apple-system, BlinkMacSystemFont, 'Inter var', system-ui, sans-serif;
}
.dr-today-pill .pill-dot {
  display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  background: #c9613f;
}
.dr-today-pill strong { color: #c9613f; }

/* Changelog dot in nav (pulses on new deploy since last visit) */
.dr-changelog-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #c9613f;
  margin-left: 6px;
  vertical-align: middle;
  animation: dr-pulse 1.6s ease-in-out infinite;
}
@keyframes dr-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(201,97,63,0.55); }
  50%      { box-shadow: 0 0 0 8px rgba(201,97,63,0); }
}
body[data-slow] .dr-changelog-dot { animation: none; }