/* Pench Jam: a warm wooden kitchen wall, pause overlay and win shelf */

body.game {
  --bg-top: #6b3f22;
  --bg-bottom: #3d2213;
  --hud-ink: #fff;
  --hud-chip: rgba(255, 240, 220, .14);
  background:
    radial-gradient(ellipse at 50% 42%, rgba(255, 210, 150, .16) 0 30%, transparent 62%),
    repeating-linear-gradient(90deg, rgba(0, 0, 0, .06) 0 2px, transparent 2px 64px),
    linear-gradient(180deg, var(--bg-top), var(--bg-bottom));
}
.stage { overscroll-behavior: none; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.subhud .chip { white-space: nowrap; }
.chip.c-hard { background: #fff; color: #b3122e; font-weight: 800; }

.coach-line { top: auto; bottom: 10px; }

.boost.armed { background: var(--turmeric); color: var(--ink); box-shadow: 0 0 0 3px rgba(255, 213, 74, .45); }

.pench-pause {
  position: absolute; inset: 0; z-index: 7; border: 0; display: grid; place-content: center; gap: 4px;
  background: rgba(45, 22, 8, .74); color: #fff; text-align: center; touch-action: manipulation;
}
.pench-pause b { font: 700 34px/1.1 var(--display); }
.pench-pause span { font-weight: 700; font-size: 17px; opacity: .9; }

.pench-win .pench-art { width: 100%; max-width: 300px; height: auto; margin: -4px auto -6px; display: block; }
.win.lose h2 { color: #b3122e; }
.goals-left { font-weight: 700; color: var(--ink) !important; }

/* Tries: three little brass screw heads (kept apart from the ❤ cafe-lives chip) */
.chip.c-tries { display: inline-flex; align-items: center; gap: 4px; }
.chip.c-tries .pj-tl { margin-right: 2px; }
.pj-try {
  display: inline-block; width: 13px; height: 13px; border-radius: 50%; position: relative;
  background: radial-gradient(circle at 35% 35%, #fff0b8, #d39a2f 60%, #7a5212); opacity: .28; filter: grayscale(1);
}
.pj-try::after { content: ""; position: absolute; left: 3px; right: 3px; top: 5.5px; height: 2px; border-radius: 1px; background: rgba(60, 35, 5, .7); }
.pj-try.on { opacity: 1; filter: none; }
.chip.c-moves.low { background: #fff; color: #b3122e; font-weight: 800; }

.pj-how { text-align: left; margin: 6px 0 12px; padding-left: 20px; display: grid; gap: 8px; line-height: 1.35; }
.pj-perfect { font-weight: 800; color: #2f8f6b !important; }
