/* ===== 像素进度动画 ===== */
.pixel-progress{position:fixed;inset:0;z-index:9997;display:flex;align-items:center;justify-content:center;background:rgba(10,10,12,.85);opacity:0;pointer-events:none;transition:opacity .4s var(--ease-out);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.pixel-progress.active{opacity:1;pointer-events:auto}

.pixel-progress-inner{display:flex;flex-direction:column;align-items:center;gap:24px}

/* 像素画布容器 */
.pixel-canvas-wrap{width:160px;height:160px;border-radius:16px;overflow:hidden;position:relative;background:rgba(255,255,255,.03);box-shadow:0 0 0 1px rgba(255,255,255,.06),0 16px 48px rgba(0,0,0,.3)}
.pixel-canvas-wrap canvas{width:100%;height:100%;display:block}

/* 进度信息 */
.pixel-progress-info{text-align:center}
.pixel-progress-pct{font-family:'SF Pro Display','Inter',system-ui,sans-serif;font-size:36px;font-weight:600;color:var(--text-primary);letter-spacing:-0.03em;line-height:1;transition:opacity .2s ease}
.pixel-progress-label{font-family:inherit;font-size:12px;color:var(--text-tertiary);letter-spacing:.12em;text-transform:uppercase;margin-top:10px}

/* 细进度条（画布下方） */
.pixel-progress-bar{width:140px;height:2px;background:rgba(255,255,255,.06);border-radius:1px;overflow:hidden}
.pixel-progress-bar-fill{height:100%;width:0%;background:var(--accent);border-radius:1px;transition:width .15s ease;box-shadow:0 0 12px rgba(var(--accent-rgb),.3)}

/* 脉冲呼吸效果 */
@keyframes pixelPulse{0%,100%{box-shadow:0 0 0 1px rgba(255,255,255,.06),0 16px 48px rgba(0,0,0,.3)}50%{box-shadow:0 0 0 1px rgba(var(--accent-rgb),.15),0 16px 48px rgba(0,0,0,.3),0 0 60px rgba(var(--accent-rgb),.06)}}
.pixel-progress.active .pixel-canvas-wrap{animation:pixelPulse 2.5s ease-in-out infinite}

/* 减弱动画模式 */
@media(prefers-reduced-motion:reduce){
  .pixel-progress{transition:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .pixel-progress.active .pixel-canvas-wrap{animation:none}
  .pixel-progress-bar-fill{transition:none}
}