/* === v1.11.5a · 足球时间感 toast === */
.match-feedback.halftime {
  border-color: #f0d99b;
  box-shadow: 3px 3px 0 rgba(212, 160, 74, .36);
}

.match-feedback.halftime b {
  color: #f0d99b;
}

.match-feedback.extra-time {
  border-color: #e07a3a;
  animation:
    v77-toast-in 0.3s ease-out both,
    extra-time-pulse 1.2s ease-in-out 0.3s infinite;
  box-shadow: 3px 3px 0 rgba(224, 122, 58, .36);
}

.match-feedback.extra-time b {
  color: #ffb27a;
}

.agg-toast.halftime {
  border-color: #f0d99b;
  box-shadow: 3px 3px 0 rgba(212, 160, 74, .36);
}

.agg-toast.extra-time {
  border-color: #e07a3a;
  animation:
    agg-toast-in .3s ease-out both,
    extra-time-pulse 1.2s ease-in-out .3s infinite;
}

@keyframes extra-time-pulse {
  0%, 100% { box-shadow: 0 16px 48px rgba(224, 122, 58, .28); }
  50% { box-shadow: 0 16px 48px rgba(224, 122, 58, .52); }
}

/* === v1.11.5c + hotfix-18 · toast 时间标 + viewport 中央位置 === */
.toast-time {
  display: block;
  margin-bottom: 4px;
  color: rgba(255, 255, 255, .55);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}

.match-feedback .toast-time {
  color: rgba(255, 255, 255, .65);
}

.v77-hand-toast .toast-time,
.combo-toast .toast-time {
  margin-bottom: 2px;
  font-size: 9.5px;
}

.match-feedback {
  --toast-y: -50%;
  top: 45%;
  bottom: auto;
  transform: translate(calc(-50% + var(--toast-shift)), -50%);
}

.v77-hand-toast,
.combo-toast {
  --toast-y: -50%;
  top: 45%;
  bottom: auto;
  transform: translate(calc(-50% + var(--toast-shift)), -50%);
}

/* === v1.11 hotfix-21 · 聚合 toast === */
.agg-toast {
  --toast-y: -50%;
  position: fixed;
  top: 40%;
  left: 50%;
  z-index: 200;
  background: rgba(15, 17, 21, .97);
  border: 2px solid #f0d99b;
  border-radius: 0;
  padding: 14px 22px;
  min-width: 280px;
  max-width: 460px;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, .7);
  animation: agg-toast-in .3s ease-out both;
  text-align: center;
  pointer-events: none;
  transform: translate(calc(-50% + var(--toast-shift)), -50%);
}

.agg-toast.out {
  animation: agg-toast-out .35s ease-in forwards;
}

/* keyframe 必须保留 --toast-shift，否则打开时间线时会跳回视口中心。 */
@keyframes agg-toast-in {
  from { opacity: 0; transform: translate(calc(-50% + var(--toast-shift)), calc(-50% - 8px)); }
  to   { opacity: 1; transform: translate(calc(-50% + var(--toast-shift)), -50%); }
}

@keyframes agg-toast-out {
  from { opacity: 1; transform: translate(calc(-50% + var(--toast-shift)), -50%); }
  to   { opacity: 0; transform: translate(calc(-50% + var(--toast-shift)), calc(-50% - 8px)); }
}

.agg-toast .agg-time {
  display: block;
  font-size: 10px;
  color: rgba(255, 255, 255, .55);
  letter-spacing: 1.5px;
  margin-bottom: 6px;
  text-transform: uppercase;
}

.agg-toast .agg-hero {
  display: block;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 4px;
  color: #d5d9e2;   /* 默认中性色 */
}

.agg-toast .agg-hero.goal { color: #6bcf7f; }
.agg-toast .agg-hero.concede { color: #c44a4a; }
.agg-toast .agg-hero.warning { color: #f0d99b; }
.agg-toast .agg-hero.shot { color: #f0d99b; }
.agg-toast .agg-hero.neutral { font-size: 17px; font-weight: 700; }

.ux-lesson-popover {
  position: fixed;
  z-index: 260;
  max-width: min(280px, calc(100vw - 20px));
  padding: 9px 11px;
  border: 1px solid rgba(240, 217, 155, .48);
  border-radius: 0;
  color: #e8edf7;
  background: rgba(14, 17, 24, .95);
  box-shadow: 3px 3px 0 rgba(0, 0, 0, .48);
  pointer-events: none;
  animation: v77-toast-in .22s ease-out both;
}

.ux-lesson-popover b {
  display: block;
  color: #f0d99b;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.35;
}

.ux-lesson-popover span {
  display: block;
  margin-top: 4px;
  color: #aeb7c7;
  font-size: 11px;
  line-height: 1.35;
}

.ux-lesson-popover.v77-toast-out {
  animation: v77-toast-fade-out .32s cubic-bezier(.4, 0, .7, .3) forwards;
}

/* === 阶段 3 情绪反馈层 · 批 1（失球红屏 + 进球绿屏）=== */
body.fb-flash-goal {
  --flash-color: 107, 207, 127;
}

body.fb-flash-concede {
  --flash-color: 196, 74, 74;
}

body.fb-flash-goal::after,
body.fb-flash-concede::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9990;
  pointer-events: none;
  border-radius: 0;
  animation: fb-flash-pulse 480ms cubic-bezier(.2, .8, .3, 1) both;
}

@keyframes fb-flash-pulse {
  0% {
    box-shadow: inset 0 0 0 0 rgba(var(--flash-color), 0);
    background: transparent;
  }
  20% {
    box-shadow:
      inset 0 0 60px 12px rgba(var(--flash-color), .68),
      inset 0 0 200px 20px rgba(var(--flash-color), .22);
    background: rgba(var(--flash-color), .06);
  }
  100% {
    box-shadow: inset 0 0 0 0 rgba(var(--flash-color), 0);
    background: transparent;
  }
}

body.fb-flash-goal #score,
body.fb-flash-concede #score {
  transform-origin: center;
  animation: fb-score-emphasize 460ms cubic-bezier(.2, 1.4, .35, 1) both;
}

@keyframes fb-score-emphasize {
  0% { transform: scale(1); }
  35% {
    transform: scale(1.32);
    text-shadow: 0 0 18px rgba(var(--flash-color), .8);
  }
  100% { transform: scale(1); }
}

/* === v1.11 hotfix-27 · 阶段 3 批 2 · 链触发 + 攻势热潮屏幕脉冲 === */
body.fb-flash-chain {
  --flash-color: 212, 160, 74;
}

body.fb-flash-surge {
  --flash-color: 240, 217, 155;
}

body.fb-flash-chain::after,
body.fb-flash-surge::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9990;
  pointer-events: none;
  border-radius: 0;
}

body.fb-flash-chain::after {
  animation: fb-flash-chain-pulse 600ms cubic-bezier(.2, .8, .3, 1) both;
}

body.fb-flash-surge::after {
  animation: fb-flash-surge-pulse 800ms cubic-bezier(.2, .8, .3, 1) both;
}

@keyframes fb-flash-chain-pulse {
  0% {
    box-shadow: inset 0 0 0 0 rgba(var(--flash-color), 0);
    background: transparent;
  }
  30% {
    box-shadow:
      inset 0 0 50px 10px rgba(var(--flash-color), .55),
      inset 0 0 180px 18px rgba(var(--flash-color), .20);
    background: rgba(var(--flash-color), .05);
  }
  100% {
    box-shadow: inset 0 0 0 0 rgba(var(--flash-color), 0);
    background: transparent;
  }
}

@keyframes fb-flash-surge-pulse {
  0% {
    box-shadow: inset 0 0 0 0 rgba(var(--flash-color), 0);
    background: transparent;
  }
  35% {
    box-shadow:
      inset 0 0 80px 16px rgba(var(--flash-color), .72),
      inset 0 0 240px 28px rgba(var(--flash-color), .26);
    background: rgba(var(--flash-color), .08);
  }
  100% {
    box-shadow: inset 0 0 0 0 rgba(var(--flash-color), 0);
    background: transparent;
  }
}

/* === v1.11 hotfix-28 · 阶段 3 批 3 · 防守压制蓝光波纹 === */
body.fb-flash-press {
  --flash-color: 107, 143, 207;
}

body.fb-flash-press::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9990;
  pointer-events: none;
  border-radius: 0;
  animation: fb-flash-press-pulse 720ms cubic-bezier(.2, .9, .35, 1) both;
}

@keyframes fb-flash-press-pulse {
  0% {
    box-shadow: inset 0 0 0 0 rgba(var(--flash-color), 0);
    background: transparent;
  }
  20% {
    box-shadow:
      inset 0 0 40px 8px rgba(var(--flash-color), .50),
      inset 0 0 160px 14px rgba(var(--flash-color), .18);
    background: rgba(var(--flash-color), .04);
  }
  40% {
    box-shadow:
      inset 0 0 20px 4px rgba(var(--flash-color), .25),
      inset 0 0 100px 10px rgba(var(--flash-color), .10);
    background: rgba(var(--flash-color), .02);
  }
  65% {
    box-shadow:
      inset 0 0 45px 9px rgba(var(--flash-color), .55),
      inset 0 0 180px 16px rgba(var(--flash-color), .20);
    background: rgba(var(--flash-color), .05);
  }
  100% {
    box-shadow: inset 0 0 0 0 rgba(var(--flash-color), 0);
    background: transparent;
  }
}