/* Also loaded before React, so the first-paint intro uses the exact site branding. */
:root { --terminal-ink: #f5f7f6; --terminal-green: #39ff7a; }
[data-theme='light'] { --terminal-ink: #101713; --terminal-green: #087536; }
/* The dark-on-light variant needs opaque ink, rather than pale translucent silver glyphs. */
[data-theme='light'] .terminal-ink-layer { filter: var(--dark-ink-filter); }
.terminal-logo { display: block; }
.terminal-art { display: block; width: 100%; height: 100%; overflow: hidden; }
.terminal-pulse { animation: terminal-glow var(--pulse-duration, 8s) linear var(--pulse-delay, 0s) infinite; }
.chain-digit { fill: #d4d9d6; animation: chain-white 7s ease-in-out var(--digit-delay, 0s) infinite; }
@keyframes chain-white { 0%, 100% { fill: #d4d9d6; } 35%, 55% { fill: #fff; } }
[data-theme='light'] .chain-digit { fill: #050807; animation-name: chain-white-light; }
@keyframes chain-white-light { 0%, 100% { fill: #050807; } 35%, 55% { fill: #202923; } }
@media (prefers-reduced-motion: reduce) { .chain-digit { animation: none; } [data-theme='light'] .chain-digit { fill: #050807; } }
html[data-brand-paused] .chain-digit { animation-play-state: paused; }
@keyframes terminal-glow {
  0%, 100% { opacity: 1; }
  6.25%, 93.75% { opacity: .8536; }
  12.5%, 87.5% { opacity: .5; }
  18.75%, 81.25% { opacity: .1464; }
  25%, 75% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .terminal-pulse { animation: none; opacity: 0; } }
html[data-brand-paused] .terminal-pulse { animation-play-state: paused; }
@media (max-width: 900px) { .sidebar:not(.open) .terminal-pulse { animation-play-state: paused; } }