/* POLÍGONO — estande dark premium, mobile-first (polish 390×844) */
:root {
  --bg: #0a0908;
  --bg-deep: #050403;
  --panel: rgba(18, 16, 14, 0.92);
  --amber: #c4893a;
  --amber-bright: #e8b86a;
  --copper: #8a5a2b;
  --text: #e8e0d4;
  --muted: #8a8278;
  --danger: #a84838;
  --line: rgba(196, 137, 58, 0.28);
  --safe-t: env(safe-area-inset-top, 0px);
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-l: env(safe-area-inset-left, 0px);
  --safe-r: env(safe-area-inset-right, 0px);
  --font: "Segoe UI", system-ui, -apple-system, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
  background: var(--bg-deep);
  color: var(--text);
  font-family: var(--font);
  -webkit-tap-highlight-color: transparent;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  position: fixed;
  inset: 0;
}

#app {
  position: fixed;
  inset: 0;
  background: var(--bg);
}

#app::after {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    radial-gradient(ellipse at center, transparent 48%, rgba(0,0,0,0.38) 100%),
    url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  opacity: 1;
}

#game {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
  cursor: none;
}

#fx {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 3;
  pointer-events: none;
}

.hidden { display: none !important; }

/* HUD */
.hud {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: calc(10px + var(--safe-t)) 12px 8px;
  padding-left: calc(12px + var(--safe-l));
  padding-right: calc(12px + var(--safe-r));
  pointer-events: none;
  background: linear-gradient(180deg, rgba(5,4,3,0.75) 0%, transparent 100%);
}

.hud-left {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
}

.hud-block { display: flex; flex-direction: column; min-width: 52px; }

.hud-label {
  font-size: 0.62rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
}

.hud-value {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  color: var(--amber-bright);
  font-weight: 600;
}

.hud-sub {
  font-size: 0.62rem;
  letter-spacing: 0.08em;
  color: var(--copper);
  margin-top: 1px;
}

.hud-right {
  display: flex;
  gap: 8px;
  pointer-events: auto;
}

.icon-btn {
  min-width: 44px;
  min-height: 44px;
  width: 44px;
  height: 44px;
  padding: 0 8px;
  border: 1px solid var(--line);
  background: rgba(12, 10, 8, 0.75);
  color: var(--amber);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  border-radius: 8px;
  cursor: pointer;
  font-family: inherit;
  touch-action: manipulation;
}

.icon-btn:active { background: rgba(196, 137, 58, 0.2); }

/* First-minute onboarding (some após 1ª ação) */
.hint-bar {
  position: absolute;
  top: calc(58px + var(--safe-t));
  left: 50%;
  transform: translateX(-50%);
  z-index: 11;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--amber-bright);
  background: rgba(12, 10, 8, 0.72);
  border: 1px solid rgba(196, 137, 58, 0.28);
  padding: 6px 14px;
  border-radius: 999px;
  white-space: nowrap;
  pointer-events: none;
  max-width: calc(100vw - 28px);
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: 0 6px 18px rgba(0,0,0,0.35);
  transition: opacity 0.28s ease, transform 0.28s ease;
}
.hint-bar.is-leaving {
  opacity: 0;
  transform: translateX(-50%) translateY(-6px);
}

/* Combo HUD pop */
.hud-value.combo-pop {
  animation: combo-pop 0.38s ease-out;
  color: var(--amber-bright) !important;
}
@keyframes combo-pop {
  0% { transform: scale(1); }
  35% { transform: scale(1.28); }
  100% { transform: scale(1); }
}

.hud-value.combo-hot {
  color: var(--amber-bright) !important;
  text-shadow: 0 0 12px rgba(232,184,106,0.45);
}
.hud-value.combo-broken {
  color: #d46858 !important;
  animation: combo-break 0.4s ease-out;
}
@keyframes combo-break {
  0% { transform: scale(1.15); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

/* Accuracy meter pulse (perfect-center / streak) */
.hud-value.acc-pulse {
  animation: acc-pulse 0.48s ease-out;
}
.hud-value.acc-perfect {
  color: #ffe6a8 !important;
  text-shadow: 0 0 14px rgba(255,230,168,0.55);
}
@keyframes acc-pulse {
  0% { transform: scale(1); }
  40% { transform: scale(1.22); }
  100% { transform: scale(1); }
}

/* Pause overlay clarity (mobile) */
.pause-panel {
  border-color: rgba(232,184,106,0.45);
  box-shadow:
    0 20px 50px rgba(0,0,0,0.6),
    0 0 0 1px rgba(232,184,106,0.12),
    inset 0 1px 0 rgba(232,184,106,0.12);
}
.pause-panel.pause-enter {
  animation: pause-enter 0.32s ease-out;
}
@keyframes pause-enter {
  0% { transform: scale(0.96); opacity: 0.6; }
  100% { transform: scale(1); opacity: 1; }
}
.pause-badge {
  color: var(--amber-bright);
  letter-spacing: 0.2em;
}
.pause-hint {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.4;
  margin: 0 0 16px;
}
.pause-hint strong { color: var(--amber-bright); font-weight: 600; }
#screen-pause.overlay {
  background: rgba(5, 4, 3, 0.86);
}
#btn-resume {
  box-shadow: 0 0 0 2px rgba(232,184,106,0.22), 0 8px 22px rgba(0,0,0,0.4);
  min-height: 48px;
}

/* Fire button — mobile one-handed */
.fire-zone {
  position: absolute;
  right: calc(16px + var(--safe-r));
  bottom: calc(20px + var(--safe-b));
  z-index: 12;
  pointer-events: none;
}

.fire-btn {
  pointer-events: auto;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  border: 2px solid var(--amber);
  background: radial-gradient(circle at 35% 30%, #3a2a18 0%, #1a120c 70%);
  color: var(--amber-bright);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  box-shadow: 0 0 0 4px rgba(196,137,58,0.12), 0 8px 24px rgba(0,0,0,0.55);
  cursor: pointer;
  font-family: inherit;
  touch-action: manipulation;
}

.fire-btn:active {
  transform: scale(0.94);
  background: radial-gradient(circle at 35% 30%, #5a3a1a 0%, #2a1a10 70%);
}

/* Overlays */
.overlay {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(16px + var(--safe-t)) 16px calc(16px + var(--safe-b));
  background: rgba(5, 4, 3, 0.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.panel {
  width: min(92vw, 380px);
  padding: 28px 22px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 20px 50px rgba(0,0,0,0.55), inset 0 1px 0 rgba(232,184,106,0.08);
  text-align: center;
}

.eyebrow {
  font-size: 0.68rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--copper);
  margin-bottom: 8px;
}

.logo {
  font-size: clamp(2rem, 8vw, 2.6rem);
  font-weight: 700;
  letter-spacing: 0.18em;
  color: var(--amber-bright);
  margin-bottom: 8px;
}

.tagline {
  color: var(--muted);
  font-size: 0.95rem;
  margin-bottom: 6px;
}

.rule {
  font-size: 0.75rem;
  color: var(--copper);
  margin-bottom: 22px;
}

.panel h2 {
  font-size: 1.35rem;
  letter-spacing: 0.06em;
  color: var(--amber-bright);
  margin-bottom: 18px;
}

.btn {
  display: block;
  width: 100%;
  min-height: 48px;
  min-width: 44px;
  margin-top: 10px;
  padding: 12px 16px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: rgba(30, 24, 18, 0.9);
  color: var(--text);
  font-size: 0.95rem;
  font-family: inherit;
  cursor: pointer;
  letter-spacing: 0.04em;
  touch-action: manipulation;
}

.btn.primary {
  background: linear-gradient(180deg, #8a5a2b 0%, #5c3a18 100%);
  border-color: var(--amber);
  color: #fff8ee;
  font-weight: 600;
}

.btn.ghost {
  background: transparent;
  color: var(--muted);
}

.btn:active { filter: brightness(1.08); }

.mode-btn {
  text-align: left;
  padding: 14px 16px;
}

.mode-title {
  display: block;
  font-weight: 600;
  color: var(--amber-bright);
  margin-bottom: 4px;
}

.mode-desc {
  display: block;
  font-size: 0.78rem;
  color: var(--muted);
}

.tips {
  list-style: none;
  text-align: left;
  margin: 0 0 18px;
  font-size: 0.88rem;
  line-height: 1.55;
  color: var(--text);
}

.tips li {
  padding: 8px 0;
  border-bottom: 1px solid rgba(196,137,58,0.12);
}

.tips li:last-child { border-bottom: none; }

.c-amber { color: var(--amber-bright); }


.daily-meta {
  margin: 10px 0 14px;
  font-size: 0.78rem;
  letter-spacing: 0.02em;
  color: var(--muted);
  line-height: 1.4;
}
.daily-meta.soft { opacity: 0.9; }

.results-summary {
  margin: 0 0 14px;
  font-size: 0.86rem;
  color: var(--text);
  line-height: 1.45;
  opacity: 0.92;
}

.results-panel .results-grid { margin-bottom: 10px; }

.res-cell { min-width: 0; }
.res-note {
  display: block;
  margin-top: 2px;
  font-size: 0.68rem;
  color: var(--muted);
  letter-spacing: 0.01em;
  min-height: 1em;
}
.res-note.is-record {
  color: var(--amber-bright);
  font-weight: 600;
}

.acc-bar {
  height: 4px;
  border-radius: 999px;
  background: rgba(196,137,58,0.12);
  overflow: hidden;
  margin: 0 0 12px;
}
.acc-bar-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: rgba(196,137,58,0.55);
  transition: width 0.35s ease-out;
}
.acc-bar-fill.is-good { background: rgba(120, 180, 110, 0.7); }
.acc-bar-fill.is-ok { background: rgba(232, 184, 106, 0.7); }
.acc-bar-fill.is-low { background: rgba(168, 72, 56, 0.65); }

.results-panel.results-enter {
  animation: results-enter 0.32s ease-out;
}
@keyframes results-enter {
  from { opacity: 0.55; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}


.results-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 12px;
  margin-bottom: 18px;
  text-align: left;
}

.results-grid .hud-value {
  display: block;
  margin-top: 2px;
}

/* Desktop mouse: hide FOGO. Touch / híbrido: body.touch-ui força o botão. */
body.desktop-aim .fire-zone { display: none !important; }
body.desktop-aim #game { cursor: crosshair; }
body.touch-ui .fire-zone:not(.hidden) { display: block !important; }
body.touch-ui #game { cursor: none; }

@media (hover: hover) and (pointer: fine) {
  body:not(.touch-ui) .fire-zone { display: none !important; }
  body:not(.touch-ui) #game { cursor: crosshair; }
}

/* Portrait estreito (~390px): HUD compacto, alvos ≥44px */
@media (max-width: 420px), (orientation: portrait) and (max-width: 430px) {
  .hud {
    padding: calc(8px + var(--safe-t)) 10px 6px;
    padding-left: calc(10px + var(--safe-l));
    padding-right: calc(10px + var(--safe-r));
  }
  .hud-left { gap: 8px 12px; }
  .hud-block { min-width: 44px; }
  .hud-label { font-size: 0.58rem; }
  .hud-value { font-size: 0.95rem; }
  .icon-btn { width: 44px; height: 44px; min-width: 44px; min-height: 44px; }
  .hint-bar { top: calc(52px + var(--safe-t)); font-size: 0.68rem; padding: 5px 12px; }
  .fire-btn { width: 88px; height: 88px; font-size: 0.8rem; }
  .combo-meter, .goal-meter { width: 44px; height: 2px; }
  .fire-btn.is-ready::after { font-size: 0.55rem; padding: 2px 6px; }
  .panel { width: min(92vw, 360px); padding: 22px 18px; }
}

@media (max-height: 700px) and (max-width: 500px) {
  .fire-zone { bottom: calc(14px + var(--safe-b)); right: calc(12px + var(--safe-r)); }
  .fire-btn { width: 84px; height: 84px; }
  .hud-value { font-size: 0.92rem; }
}

/* Paisagem baixa (~390px de altura) */
@media (orientation: landscape) and (max-height: 430px) {
  .hud {
    padding: calc(4px + var(--safe-t)) 8px 4px;
    padding-left: calc(8px + var(--safe-l));
    padding-right: calc(8px + var(--safe-r));
  }
  .hud-left { gap: 6px 10px; }
  .hud-block { min-width: 40px; }
  .hud-label { font-size: 0.55rem; }
  .hud-value { font-size: 0.85rem; }
  .icon-btn { width: 44px; height: 44px; min-width: 44px; min-height: 44px; font-size: 0.62rem; }
  .hint-bar { top: calc(42px + var(--safe-t)); font-size: 0.62rem; padding: 3px 10px; }
  .fire-zone { bottom: calc(8px + var(--safe-b)); right: calc(10px + var(--safe-r)); }
  .fire-btn { width: 72px; height: 72px; font-size: 0.72rem; }
  .panel { padding: 14px 14px 12px; max-height: min(92dvh, 360px); overflow: auto; }
  .logo { font-size: clamp(1.6rem, 7vw, 2.2rem); margin-bottom: 4px; }
  .btn { min-height: 44px; padding: 10px 14px; }
  .overlay { padding: calc(8px + var(--safe-t)) 12px calc(8px + var(--safe-b)); }
}


/* —— Wave 3: countdown, aim-ready FOGO, combo/goal meters —— */
.countdown {
  position: absolute;
  inset: 0;
  z-index: 15;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(5,4,3,0.35) 0%, transparent 62%);
}
.countdown.hidden { display: none !important; }
.countdown span {
  font-size: clamp(3.2rem, 22vw, 5.6rem);
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--amber-bright);
  text-shadow: 0 0 28px rgba(232,184,106,0.55), 0 6px 0 rgba(0,0,0,0.45);
}
.countdown.is-go span {
  font-size: clamp(2.4rem, 16vw, 4.2rem);
  letter-spacing: 0.18em;
  color: #ffe6a8;
  text-shadow: 0 0 36px rgba(255,230,168,0.75), 0 6px 0 rgba(0,0,0,0.5);
}
.countdown.is-tick span {
  animation: poligono-count 0.38s cubic-bezier(.2, 1.4, .4, 1);
}
.countdown.is-out {
  opacity: 0;
  transition: opacity 0.25s ease-out;
}
@keyframes poligono-count {
  0% { transform: scale(0.55); opacity: 0.35; }
  55% { transform: scale(1.12); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

.combo-meter,
.goal-meter {
  display: block;
  margin-top: 4px;
  height: 3px;
  width: 52px;
  max-width: 100%;
  border-radius: 999px;
  background: rgba(196,137,58,0.14);
  overflow: hidden;
}
.combo-meter-fill,
.goal-meter-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: rgba(232,184,106,0.75);
  transition: width 0.18s ease-out;
}
.combo-meter-fill.is-full {
  background: #ffe6a8;
  box-shadow: 0 0 8px rgba(255,230,168,0.55);
}
.goal-meter.is-hot .goal-meter-fill {
  background: rgba(232,184,106,0.95);
}
.goal-meter.is-done .goal-meter-fill {
  background: rgba(120, 180, 110, 0.85);
}

.hud-time.time-urgent {
  color: #d46858 !important;
  text-shadow: 0 0 10px rgba(212,104,88,0.45);
  animation: time-urgent-pulse 0.9s ease-in-out infinite;
}
.time-urgent-wrap .hud-label {
  color: #d46858;
}
@keyframes time-urgent-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.72; }
}

/* FOGO ready (mira no alvo) + kick */
.fire-btn.is-ready {
  border-color: #ffe6a8;
  color: #ffe6a8;
  box-shadow:
    0 0 0 5px rgba(255,230,168,0.18),
    0 0 22px rgba(232,184,106,0.45),
    0 8px 24px rgba(0,0,0,0.55);
  animation: fire-ready-glow 1.1s ease-in-out infinite;
}
.fire-btn.is-ready::after {
  content: "PRONTO";
  position: absolute;
  left: 50%;
  bottom: calc(100% + 6px);
  transform: translateX(-50%);
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  color: #ffe6a8;
  background: rgba(12,10,8,0.78);
  border: 1px solid rgba(255,230,168,0.35);
  padding: 3px 8px;
  border-radius: 999px;
  pointer-events: none;
  white-space: nowrap;
}
.fire-zone { position: absolute; } /* keep stacking context for ::after */
.fire-btn { position: relative; }
@keyframes fire-ready-glow {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.12); }
}
.fire-btn.is-kick {
  animation: fire-kick 0.22s ease-out;
}
@keyframes fire-kick {
  0% { transform: scale(1); }
  35% { transform: scale(0.88); }
  100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .btn, .icon-btn, .fire-btn, .hint-bar { transition: none !important; animation: none !important; }
  .fire-btn:active, .btn:active, .icon-btn:active { transform: none !important; }
  .hud-value.combo-pop,
  .hud-value.combo-broken,
  .hud-value.acc-pulse,
  .pause-panel.pause-enter,
  .results-panel.results-enter,
  .countdown.is-tick span,
  .fire-btn.is-ready,
  .fire-btn.is-kick,
  .hud-time.time-urgent { animation: none !important; }
  .acc-bar-fill,
  .combo-meter-fill,
  .goal-meter-fill { transition: none !important; }
  .countdown.is-out { opacity: 0; transition: none !important; }
  .fire-btn.is-ready { filter: none; box-shadow: 0 0 0 4px rgba(255,230,168,0.22), 0 8px 24px rgba(0,0,0,0.55); }
  .hint-bar.is-leaving { opacity: 0; transform: translateX(-50%); }
  .overlay { backdrop-filter: none; -webkit-backdrop-filter: none; }
  .hud-value.combo-hot { text-shadow: none; }
  .hud-value.acc-perfect { text-shadow: none; }
}


/* —— Wave 4: urgency cue, near-miss, FOGO recover, centros, onda banner —— */
.fire-btn .fire-label {
  position: relative;
  z-index: 2;
  pointer-events: none;
}
.fire-recover {
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  background: conic-gradient(
    from -90deg,
    rgba(232,184,106,0.85) 0deg,
    rgba(232,184,106,0.85) var(--recover, 0deg),
    rgba(20,16,12,0.15) var(--recover, 0deg),
    rgba(20,16,12,0.15) 360deg
  );
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
  transition: opacity 0.12s ease-out;
}
.fire-btn.is-recovering {
  filter: brightness(0.92);
  box-shadow: 0 0 0 3px rgba(196,137,58,0.22), 0 8px 24px rgba(0,0,0,0.55);
}
.fire-btn.is-recovering.is-ready {
  animation: none;
}
.fire-btn.is-recovering.is-ready::after {
  opacity: 0.35;
}

.hud-centros-block .hud-value {
  color: #e8b86a;
  letter-spacing: 0.02em;
}
.hud-centros-block .hud-value.centros-hot {
  color: #ffe6a8;
  text-shadow: 0 0 10px rgba(255,230,168,0.45);
}

.wave-banner {
  position: absolute;
  left: 50%;
  top: calc(18% + var(--safe-t));
  transform: translateX(-50%) scale(0.92);
  z-index: 14;
  pointer-events: none;
  padding: 10px 22px;
  border-radius: 999px;
  background: rgba(12,10,8,0.78);
  border: 1px solid rgba(232,184,106,0.45);
  box-shadow: 0 8px 28px rgba(0,0,0,0.45), 0 0 24px rgba(196,137,58,0.18);
  opacity: 0;
}
.wave-banner.hidden { display: none !important; }
.wave-banner span {
  font-size: clamp(0.95rem, 4.2vw, 1.25rem);
  font-weight: 800;
  letter-spacing: 0.22em;
  color: #ffe6a8;
  text-shadow: 0 0 16px rgba(255,230,168,0.35);
}
.wave-banner.is-in {
  opacity: 1;
  transform: translateX(-50%) scale(1);
  transition: opacity 0.22s ease-out, transform 0.28s cubic-bezier(.2,1.3,.4,1);
}
.wave-banner.is-out {
  opacity: 0;
  transform: translateX(-50%) scale(0.96);
  transition: opacity 0.25s ease-out, transform 0.25s ease-out;
}

@media (max-width: 420px), (orientation: portrait) and (max-width: 430px) {
  .hud-centros-block { min-width: 44px; }
  .wave-banner { top: calc(16% + var(--safe-t)); padding: 8px 16px; }
  .wave-banner span { letter-spacing: 0.16em; font-size: 0.9rem; }
}

@media (prefers-reduced-motion: reduce) {
  .wave-banner.is-in,
  .wave-banner.is-out,
  .fire-recover { transition: none !important; }
  .hud-centros-block .hud-value.centros-hot { text-shadow: none; }
}


/* —— Wave 5: FOGO combo ring, press spring, score ticker, Galaxy deadzone cues —— */
.fire-combo {
  position: absolute;
  inset: -9px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  background: conic-gradient(
    from -90deg,
    rgba(120, 180, 110, 0.9) 0deg,
    rgba(120, 180, 110, 0.9) var(--combo, 0deg),
    rgba(20, 16, 12, 0.12) var(--combo, 0deg),
    rgba(20, 16, 12, 0.12) 360deg
  );
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 4px), #000 calc(100% - 3px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 4px), #000 calc(100% - 3px));
  transition: opacity 0.14s ease-out;
}
.fire-btn.has-combo {
  box-shadow:
    0 0 0 4px rgba(120, 180, 110, 0.18),
    0 0 20px rgba(120, 180, 110, 0.22),
    0 8px 24px rgba(0, 0, 0, 0.55);
}
.fire-btn.combo-full .fire-combo {
  background: conic-gradient(
    from -90deg,
    rgba(255, 230, 168, 0.95) 0deg,
    rgba(255, 230, 168, 0.95) 360deg
  );
  filter: drop-shadow(0 0 6px rgba(255, 230, 168, 0.35));
}
.fire-btn.is-press {
  transform: scale(0.9);
  filter: brightness(1.08);
  transition: transform 0.08s ease-out, filter 0.08s ease-out;
}
.fire-btn.is-press.is-kick {
  animation: none;
}

.hud-score-block .hud-value.score-pop {
  animation: score-pop 0.36s cubic-bezier(.2, 1.35, .4, 1);
  color: #ffe6a8;
}
@keyframes score-pop {
  0% { transform: scale(1); }
  40% { transform: scale(1.18); }
  100% { transform: scale(1); }
}

/* Extra Galaxy / gesture-nav clearance for FOGO (portrait) */
@media (max-width: 430px) and (orientation: portrait) {
  .fire-zone {
    bottom: calc(18px + var(--safe-b) + 6px);
    right: calc(14px + var(--safe-r));
  }
  .fire-btn { width: 92px; height: 92px; }
}

@media (prefers-reduced-motion: reduce) {
  .hud-score-block .hud-value.score-pop { animation: none !important; }
  .fire-btn.is-press { transform: none; transition: none !important; }
  .fire-combo { transition: none !important; }
}

/* Onda 6: classificação + agrupamento (sóbrio, estande) */
.res6 { display: grid; gap: 8px; margin: 10px 0 6px; }
.res6[hidden] { display: none; }
.res6-rank, .res6-group { display: flex; align-items: center; gap: 12px; padding: 8px 12px; border-radius: 10px; border: 1px solid rgba(200,210,220,.18); background: rgba(10,14,18,.55); text-align: left; }
.res6 small { display: block; font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; opacity: .6; }
.res6 b { font-size: 1.02rem; letter-spacing: .02em; }
.res6 span { display: block; font-size: .78rem; opacity: .75; }
.res6-ico { font-size: 1.1rem; min-width: 44px; text-align: center; color: #9aa4ae; letter-spacing: 2px; }
.res6-rank.is-elite .res6-ico, .res6-rank.is-elite b { color: #d9b45a; }
.res6-rank.is-elite { border-color: rgba(217,180,90,.45); box-shadow: 0 0 18px rgba(217,180,90,.18); }
.res6-rank.is-esp .res6-ico { color: #c8d0d8; }
.res6-group svg { flex: none; }
.res6-group .ring { fill: none; stroke: rgba(220,226,232,.35); stroke-width: 1; }
.res6-group .ring.r3 { fill: rgba(217,180,90,.12); stroke: rgba(217,180,90,.6); }
.res6-group circle:not(.ring) { fill: #e6eaee; }
.res6-group circle.is-c { fill: #d9b45a; }