/* Chuha Chase: night kitchen backdrop, night card, pause overlay */

body.game {
  --bg-top: #232a45;
  --bg-bottom: #141a2c;
  --hud-ink: #fff4e2;
  --hud-chip: rgba(255, 230, 190, .13);
}
.stage { overscroll-behavior: none; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.boosters:empty { padding-top: 0; padding-bottom: env(safe-area-inset-bottom, 0px); }

.subhud .chip { white-space: nowrap; font-variant-numeric: tabular-nums; }
.chip.c-lives { letter-spacing: 1px; min-width: 3.6em; text-align: center; }

.chuha-hand { margin: 0 0 0 -16px; animation: chuha-swipe 1.3s ease-in-out infinite; }
@keyframes chuha-swipe {
  0% { transform: translateX(20px); opacity: 0; }
  15% { opacity: 1; }
  70% { transform: translateX(-46px); opacity: 1; }
  100% { transform: translateX(-56px); opacity: 0; }
}

.chuha-card {
  position: absolute; z-index: 6; left: 50%; top: 44%; pointer-events: none; text-align: center;
  transform: translate(-50%, -50%) scale(.6) rotate(-3deg); opacity: 0;
  padding: 12px 26px 14px; border-radius: 18px; background: #e0218a; color: #fff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45), inset 0 0 0 3px rgba(255, 255, 255, .25);
  transition: opacity .2s, transform .35s cubic-bezier(.2, 1.6, .4, 1);
  max-width: calc(100% - 32px);
}
.chuha-card.show { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-3deg); }
.chuha-card b { display: block; font: 700 30px/1.1 var(--display); white-space: nowrap; }
.chuha-card small { display: block; font-weight: 700; font-size: 15px; opacity: .92; margin-top: 2px; }

.chuha-pause {
  position: absolute; inset: 0; z-index: 7; display: grid; place-content: center; gap: 6px; border: 0;
  background: rgba(14, 18, 34, .7); color: #fff4e2; font: inherit; text-align: center;
}
.chuha-pause b { font: 700 34px/1 var(--display); }
.chuha-pause span { font-weight: 700; font-size: 17px; opacity: .9; }

.chuha-win .chuha-kicker { font-weight: 800; letter-spacing: .12em; text-transform: uppercase; font-size: 14px; color: var(--chili); text-align: center; }
.chuha-win h2 { text-align: center; }
.chuha-win .chuha-fail { text-align: center; color: var(--ink-soft); font-weight: 600; }
.chuha-win .chuha-progress { display: grid; gap: 6px; text-align: center; }
.chuha-win .chuha-ate { margin: 0; font-weight: 800; font-size: 18px; color: var(--ink); }
.chuha-win .chuha-bar { position: relative; height: 12px; border-radius: 999px; background: var(--line); overflow: visible; }
.chuha-win .chuha-bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px; background: linear-gradient(90deg, #f2b33d, #e0218a); animation: chuhaFill .7s cubic-bezier(.2, .8, .3, 1) both; transform-origin: left; }
.chuha-win .chuha-bar u { position: absolute; top: -4px; bottom: -4px; width: 3px; margin-left: -1.5px; border-radius: 2px; background: var(--ink); }
@keyframes chuhaFill { from { transform: scaleX(0); } }
.chuha-win .chuha-best { margin: 0; font-weight: 700; color: var(--ink-soft); font-size: 14px; }
.chuha-win .chuha-best.new { color: var(--chili); font-size: 16px; }
.chuha-card small.chuha-new { margin-top: 6px; padding: 4px 10px; border-radius: 10px; background: rgba(0, 0, 0, .22); white-space: normal; }
.chuha-card:has(.chuha-new) { min-width: min(300px, calc(100% - 32px)); }