/* Cavalo — todos os seletores abaixo do root do jogo. Lê tokens do portal com fallback; nunca os redefine. */
.jpm-game[data-game="cavalo"] {
  --cavalo-glass: rgba(23, 27, 52, .72);
  font-family: inherit;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  container-type: size;
}
.jpm-game[data-game="cavalo"] .cv-canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; touch-action: none; }

.jpm-game[data-game="cavalo"] .cv-hud { position: absolute; left: 0; right: 0; top: 0; display: flex; gap: 8px; align-items: center; padding: 10px 12px; pointer-events: none; z-index: 2; }
.jpm-game[data-game="cavalo"] .cv-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 8px; border-radius: var(--r-pill, 999px); background: var(--cavalo-glass); color: var(--surface, #fff); font-weight: 900; font-size: clamp(13px, 2.4cqw, 20px); font-variant-numeric: tabular-nums; }
.jpm-game[data-game="cavalo"] .cv-ico { width: 1.15em; height: 1.15em; }
.jpm-game[data-game="cavalo"] .cv-hearts { margin-left: auto; display: flex; gap: 4px; padding: 6px 10px; border-radius: var(--r-pill, 999px); background: var(--cavalo-glass); }
.jpm-game[data-game="cavalo"] .cv-heart { width: clamp(16px, 3cqw, 26px); height: clamp(16px, 3cqw, 26px); color: var(--coral, #FF6868); transition: transform .2s, opacity .2s; }
.jpm-game[data-game="cavalo"] .cv-heart.is-lost { color: rgba(255, 255, 255, .35); transform: scale(.85); }

.jpm-game[data-game="cavalo"] .cv-screen { position: absolute; inset: 0; z-index: 4; display: grid; place-items: center; padding: 12px; }
.jpm-game[data-game="cavalo"] .cv-intro, .jpm-game[data-game="cavalo"] .cv-over, .jpm-game[data-game="cavalo"] .cv-paused { background: rgba(23, 27, 52, .35); }
.jpm-game[data-game="cavalo"] .cv-card { width: min(92%, 420px); padding: clamp(14px, 3.4cqw, 28px); border-radius: var(--r-card, 16px); background: var(--surface, #fff); color: var(--ink, #172033); text-align: center; box-shadow: var(--shadow2, 0 18px 44px rgba(23, 32, 51, .16)); }
.jpm-game[data-game="cavalo"] .cv-card--small { width: auto; padding: 16px 22px; }
.jpm-game[data-game="cavalo"] .cv-kicker { margin: 0; font-size: clamp(10px, 1.8cqw, 13px); font-weight: 900; letter-spacing: .1em; text-transform: uppercase; color: var(--muted, #606B80); }
.jpm-game[data-game="cavalo"] .cv-title { margin: 4px 0 6px; font-size: clamp(20px, 4.6cqw, 34px); line-height: 1.05; letter-spacing: -.04em; font-weight: 900; }
.jpm-game[data-game="cavalo"] .cv-text { margin: 0 0 14px; color: var(--muted, #606B80); font-weight: 600; font-size: clamp(12px, 2.2cqw, 16px); }
.jpm-game[data-game="cavalo"] .cv-btn { min-height: 46px; padding: 0 26px; border: 0; border-radius: var(--r-pill, 999px); background: var(--primary, #6046FF); color: var(--surface, #fff); font: inherit; font-weight: 900; font-size: clamp(15px, 2.6cqw, 19px); cursor: pointer; box-shadow: 0 8px 18px rgba(96, 70, 255, .3); }
.jpm-game[data-game="cavalo"] .cv-btn:focus-visible { outline: 3px solid var(--ink, #172033); outline-offset: 3px; }
.jpm-game[data-game="cavalo"] .cv-results { display: flex; justify-content: center; gap: clamp(12px, 4cqw, 30px); margin: 10px 0; }
.jpm-game[data-game="cavalo"] .cv-num { display: block; font-size: clamp(20px, 4.4cqw, 32px); font-weight: 900; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.jpm-game[data-game="cavalo"] .cv-lbl { font-size: clamp(11px, 1.8cqw, 13px); color: var(--muted, #606B80); font-weight: 700; }
.jpm-game[data-game="cavalo"] .cv-best { margin: 0 0 14px; font-weight: 800; color: var(--primary, #6046FF); min-height: 1.2em; }

.jpm-game[data-game="cavalo"] .cv-ready { pointer-events: none; align-content: center; gap: 12px; }
.jpm-game[data-game="cavalo"] .cv-howto { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.jpm-game[data-game="cavalo"] .cv-howto-item { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: var(--r-pill, 999px); background: var(--cavalo-glass); color: var(--surface, #fff); font-weight: 700; font-size: clamp(12px, 2.1cqw, 16px); }
.jpm-game[data-game="cavalo"] .cv-key { padding: 3px 9px; border-radius: 8px; background: var(--surface, #fff); color: var(--ink, #172033); font-weight: 900; }
.jpm-game[data-game="cavalo"] .cv-touch-only { display: none; }
.jpm-game[data-game="cavalo"] .cv-count { font-size: clamp(48px, 14cqw, 120px); font-weight: 900; color: var(--surface, #fff); text-shadow: 0 6px 0 rgba(23, 27, 52, .35); line-height: 1; animation: cavalo-pop .8s ease-out infinite; }
@keyframes cavalo-pop { from { transform: scale(1.25); opacity: .4; } 30% { transform: scale(1); opacity: 1; } }

.jpm-game[data-game="cavalo"] .cv-touch { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; display: flex; justify-content: space-between; align-items: flex-end; padding: 10px; pointer-events: none; }
.jpm-game[data-game="cavalo"] .cv-tbtn { pointer-events: auto; width: clamp(48px, 13cqw, 76px); height: clamp(48px, 13cqw, 76px); border: 0; border-radius: 50%; background: rgba(23, 27, 52, .45); color: var(--surface, #fff); display: grid; place-items: center; touch-action: none; }
.jpm-game[data-game="cavalo"] .cv-tbtn svg { width: 55%; height: 55%; }
.jpm-game[data-game="cavalo"] .cv-tbtn--jump { background: rgba(96, 70, 255, .7); }
.jpm-game[data-game="cavalo"] .cv-tbtn:active { transform: scale(.94); }

@media (pointer: coarse) {
  .jpm-game[data-game="cavalo"] .cv-touch-only { display: inline-flex; }
}
@media (prefers-reduced-motion: reduce) {
  .jpm-game[data-game="cavalo"] .cv-count { animation: none; }
}

/* garante [hidden] mesmo fora do portal (harness, prévias) */
.jpm-game[data-game="cavalo"] [hidden] { display: none; }
