/* Dhaba Rush: highway-dhaba HUD, pause overlay, end-of-day card and upgrade shop */

body.game {
  --bg-top: #b8401a;
  --bg-bottom: #7a2a10;
  --hud-ink: #fff;
  --hud-chip: rgba(255, 255, 255, .16);
  overscroll-behavior: none;
  background:
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .035) 0 2px, transparent 2px 18px),
    linear-gradient(180deg, var(--bg-top), var(--bg-bottom));
}

.subhud { max-width: 560px; width: 100%; margin-inline: auto; }
.subhud .chip { white-space: nowrap; font-variant-numeric: tabular-nums; }
.dr-coins { background: var(--turmeric) !important; color: var(--ink); font-weight: 800; min-width: 74px; text-align: center; }
.dr-coins.bump { animation: drBump .3s cubic-bezier(.2, 1.6, .4, 1); }
@keyframes drBump { from { transform: scale(1.25); } to { transform: none; } }
/* today's hearts (walkouts left); the ❤ chip in the top bar is the cafe-life wallet */
.dr-hearts { display: inline-flex; align-items: center; gap: 1px; padding-inline: 8px !important; }
.dr-hearts svg { width: 18px; height: 18px; fill: rgba(255, 255, 255, .2); stroke: rgba(255, 255, 255, .45); stroke-width: 1.4; }
.dr-hearts svg.on { fill: #ffd34d; stroke: #7a2a10; }
.dr-hearts.hit { animation: drShake .4s; }
@keyframes drShake { 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
.boosters:empty { padding: 0 0 env(safe-area-inset-bottom, 0px); }
.stage { margin-bottom: env(safe-area-inset-bottom, 0px); }

.dr-pause {
  position: absolute; inset: 0; z-index: 7; display: grid; place-content: center; gap: 4px; border: 0;
  background: rgba(60, 20, 5, .62); color: #fff; font: inherit; text-align: center;
}
.dr-pause[hidden] { display: none; }
.dr-pause b { font: 700 34px/1.1 var(--display); }
.dr-pause span { font-weight: 700; opacity: .85; }

.coach-line { width: max-content; font-size: 15px; padding: 7px 14px; }

.dr-card { text-align: center; }
.dr-kicker { font-weight: 800; letter-spacing: .12em; text-transform: uppercase; font-size: 12.5px; color: var(--chili) !important; }
.dr-sum {
  display: grid; grid-template-columns: auto auto; justify-content: center; gap: 2px 14px; margin: 0;
  padding: 10px 14px; border-radius: 14px; background: #fbf1de; color: var(--ink-soft); font-weight: 600;
}
.dr-sum dt { text-align: right; }
.dr-sum dd { margin: 0; text-align: left; color: var(--ink); font-weight: 800; }
.dr-vs { font-weight: 700; padding: 8px 12px; border-radius: 12px; background: #f6ead6; color: var(--ink) !important; }
.dr-vs.won { background: var(--mint); color: #fff !important; }

.dr-shop .dr-wallet { font-weight: 800; color: var(--ink) !important; font-size: 18px; text-align: center; }
.dr-shop-list { display: grid; gap: 8px; }
.dr-up {
  display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 14px; background: #fbf1de; text-align: left;
}
.dr-up-ic { font-size: 28px; text-align: center; }
.dr-up-tx { display: grid; line-height: 1.2; }
.dr-up-tx b { font-size: 16px; }
.dr-up-tx small { color: var(--ink-soft); font-size: 13px; }
.dr-pips { display: flex; gap: 4px; margin-top: 4px; }
.dr-pips i { width: 18px; height: 6px; border-radius: 3px; background: var(--line); }
.dr-pips i.on { background: var(--mint); }
.dr-up .btn { min-width: 76px; min-height: 44px; }
.dr-up .btn[aria-disabled="true"] { opacity: .55; }
.dr-more { font-weight: 700; color: var(--chili) !important; margin: -4px 0 0; }