/* Original 32px artwork, integer scaling and restrained Win98 status motion. */
.status-computer{width:104px;height:126px;margin:8px auto 16px;position:relative}
.pixel-stage{position:relative;width:96px;height:96px;margin:4px auto 0}
.status-icon{position:absolute;inset:0;display:none;width:96px;height:96px;image-rendering:pixelated;image-rendering:crisp-edges;user-select:none}
.complete-focus{position:absolute;inset:-4px;border:1px dotted #000080;opacity:0;pointer-events:none}
.pixel-activity{display:flex;justify-content:center;gap:5px;height:5px;margin-top:14px;visibility:hidden}
.pixel-activity i{width:5px;height:5px;background:#000080;box-shadow:1px 1px #fff;opacity:.2}
.legacy-computer{display:none;width:70px;margin:18px auto 0}
.progress-pane[data-status=running] .icon-working{display:block;animation:win98-busy 1.6s steps(1,end) infinite}
.progress-pane[data-status=running] .pixel-activity{visibility:visible}
.progress-pane[data-status=running] .pixel-activity i{animation:win98-transfer 1.2s steps(1,end) infinite}
.progress-pane[data-status=running] .pixel-activity i:nth-child(2){animation-delay:.15s}
.progress-pane[data-status=running] .pixel-activity i:nth-child(3){animation-delay:.3s}
.progress-pane[data-status=running] .pixel-activity i:nth-child(4){animation-delay:.45s}
.progress-pane[data-status=success] .icon-complete{display:block;animation:win98-ready .48s steps(3,end) 1}
.progress-pane[data-status=success] .complete-focus{animation:win98-confirm .8s steps(1,end) 1}
.progress-pane:is([data-status=failed],[data-status=uncertain]) .pixel-stage,
.progress-pane:is([data-status=failed],[data-status=uncertain]) .pixel-activity{display:none}
.progress-pane:is([data-status=failed],[data-status=uncertain]) .legacy-computer{display:block}
@keyframes win98-busy{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes win98-transfer{0%,65%,100%{opacity:.2}15%,45%{opacity:1}}
@keyframes win98-ready{0%{transform:translateY(4px);opacity:.4}55%{transform:translateY(0);opacity:.75}100%{transform:translateY(0);opacity:1}}
@keyframes win98-confirm{0%,45%,100%{opacity:0}15%,60%{opacity:1}}
@media(prefers-reduced-motion:reduce){
  .status-icon,.pixel-activity i,.complete-focus{animation:none!important;transform:none!important}
  .pixel-activity i{opacity:.65}
  .complete-focus{opacity:0}
}
@media(max-width:440px){
  .status-computer{width:72px;height:94px}
  .pixel-stage,.status-icon{width:64px;height:64px}
}
