body { isolation: isolate; }
#market-background { position: fixed; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
.sidebar { background: #0b0e0cf5; }
header { background: #0b0e0cbd; }
.brand { display: inline-flex; align-items: center; gap: 7px; animation: brand-halo 4.8s ease-in-out infinite; }
.hero > * { min-width: 0; }
.brand .logo { position: relative; width: 36px; height: 38px; flex: 0 0 36px; margin: 0; border-radius: 0; background: #c4fa68; color: #17230e; box-shadow: 0 0 12px #b6f66333, 0 0 28px #9ce04414; clip-path: polygon(0 6px, 6px 6px, 6px 0, 30px 0, 30px 6px, 36px 6px, 36px 32px, 30px 32px, 30px 38px, 6px 38px, 6px 32px, 0 32px); animation: pixel-glow 4.8s ease-in-out infinite; }
.brand .logo svg { width: 28px; height: 28px; shape-rendering: crispEdges; }
.brand .logo::after { content: ''; position: absolute; inset: -50% 0; pointer-events: none; background: linear-gradient(transparent 43%, #f4ffcd70 49%, transparent 56%); transform: translateY(-45%); animation: pixel-scan 6s linear infinite; }
.brand .pixel-arrow { animation: pixel-step 4s steps(2, end) infinite; transform-origin: center; }
.brand .wordmark { text-shadow: 0 0 18px #b3ed5821; }
.brand .brand-dot { margin-left: -7px; text-shadow: 0 0 9px #c4fa6877; }
#motion-toggle { color: var(--muted); background: transparent; font-size: 12px; padding: 0; text-decoration: underline; text-underline-offset: 3px; }
#motion-toggle:disabled { text-decoration: none; opacity: .85; cursor: default; }
footer { gap: 16px; flex-wrap: wrap; }
@keyframes pixel-glow { 0%, 100% { filter: drop-shadow(0 0 3px #a5e35a44); background-color: #b8ee60; } 50% { filter: drop-shadow(0 0 9px #c4fa6888); background-color: #d3ff89; } }
@keyframes pixel-step { 0%, 30%, 70%, 100% { transform: translate(0, 0); } 40%, 60% { transform: translate(1px, -1px); } }
@keyframes pixel-scan { 0%, 25% { transform: translateY(-45%); } 75%, 100% { transform: translateY(45%); } }
@keyframes brand-halo { 0%, 100% { filter: drop-shadow(0 0 2px #a6e84e22); } 50% { filter: drop-shadow(0 0 7px #b6ef6555); } }
html[data-effects-motion=off] .brand, html[data-effects-motion=off] .brand .logo, html[data-effects-motion=off] .brand .pixel-arrow, html[data-effects-motion=off] .brand .logo::after { animation-play-state: paused; }
@media (max-width: 760px) {
  .hero { grid-template-columns: minmax(0, 1fr); }
  .reward-stack { flex-wrap: wrap; }
  .reward-stack > span { flex-basis: 100%; }
  .stock-row { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .brand, .brand .logo, .brand .pixel-arrow, .brand .logo::after { animation: none !important; }
  .brand .logo::after { display: none; }
}