@media (max-width:900px){
  .hero{grid-template-columns:1fr;padding-block:36px 24px;gap:30px}
  .forge,.runner{grid-template-columns:1fr}
  .blueprint,.palette{position:static}
  .steps{grid-template-columns:1fr 1fr}
  .two{grid-template-columns:1fr}
  .score-hero{grid-template-columns:1fr;justify-items:start}
  .mini{left:0}
  .badge-float{right:0}
}
@media (max-width:700px){
  .stepper li{padding:6px;justify-content:center;gap:6px}
  .stepper li .lb{display:none}
  .stepper li.on{flex:3}
  .stepper li.on .lb{display:flex}
  nav.links .btn.ghost{display:none}
}
@media (max-width:520px){
  .steps{grid-template-columns:1fr}
  .pgrid{grid-template-columns:repeat(6,1fr)}
  .qactions .btn{flex:1 1 40%}
  .timer{font-size:18px;min-width:80px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@keyframes rise{from{opacity:.001;transform:translateY(10px)}to{opacity:1;transform:none}}
main:not([hidden]){animation:rise .4s ease both}

#v-home{position:relative}