/* File: pve.css
   CAREER — a carreira PvE (ver pve.js).

   Mesmos tokens Amber/Asphalt do resto do app (style.css :root) e a mesma regra do PvP: o
   jogador é âmbar, o rival é vermelho. Duas cores, uma para cada lado, em toda a página. */
.pve-body { --pve-rival: #d8553f; padding: 0 0 40px; }
.pve-dim { color: var(--text-dim); font-size: 12px; }
.pve-empty { margin: 60px auto; max-width: 420px; text-align: center; color: var(--text-dim); }
.pve-empty h3 { font-family: var(--font-display); font-style: italic; letter-spacing: 1.5px; color: var(--text); margin: 0 0 8px; }
.pve-empty .btn-pink { margin-top: 14px; }
.pve-link {
  padding: 0; background: none; border: 0; cursor: pointer;
  font-family: var(--font-ui); font-weight: 700; font-size: 10.5px; letter-spacing: 1.2px; color: var(--accent);
}
.pve-link:hover { color: var(--accent-soft); }

/* Tabela de prêmios da seção CAREER do FAQ (main.js: buildCareerFaq). Mora aqui porque é
   a única tabela do FAQ e só existe por causa da carreira. */
.faq-callout {
  margin: 0 0 12px; padding: 14px 16px; border-radius: 12px;
  border: 1px solid var(--accent); background: linear-gradient(100deg, rgba(233,161,59,0.2), rgba(233,161,59,0.04));
  box-shadow: 0 0 26px rgba(233,161,59,0.15);
}
.faq-callout > b { display: block; font-family: var(--font-display); font-style: italic; font-size: 14px; letter-spacing: 1.2px; color: var(--accent); }
.faq-callout > b span { color: var(--success); }
.faq-callout p { margin: 7px 0 0; font-size: 13px; line-height: 1.6; color: var(--text); }
.faq-callout em { display: inline-block; padding: 0 6px; margin: 0 2px; border-radius: 4px; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: 0.6px; color: #0b0b0e; }
.faq-callout em.is-fresh { background: var(--success); }
.faq-callout em.is-used { background: var(--accent); }
.faq-callout em.is-nopay { background: #d8553f; color: #fff; }
.faq-qa.is-key { border-color: var(--accent); box-shadow: 0 0 18px rgba(233,161,59,0.14); }
.faq-qa.is-key > summary { color: var(--accent); }
.faq-ul { margin: 0 0 10px; padding-left: 18px; font-size: 13px; line-height: 1.7; color: var(--text); }
.faq-ul b { color: var(--accent); }
.faq-table { width: 100%; max-width: 460px; margin: 4px 0 12px; border-collapse: collapse; font-size: 12.5px; }
.faq-table th { text-align: left; font-size: 9.5px; letter-spacing: 1.4px; font-weight: 700; color: var(--text-dim); padding: 6px 8px; border-bottom: 1px solid var(--border-strong); }
.faq-table td { padding: 7px 8px; border-bottom: 1px solid var(--border); color: var(--text); }
.faq-table td:nth-child(3), .faq-table td:nth-child(4) { font-weight: 700; color: var(--success); font-variant-numeric: tabular-nums; }

/* ---- HUD: tickets, combustível, progresso, caixas ---- */
.pve-hud { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 2.1fr); gap: 12px; margin-bottom: 16px; }
.pve-chip, .pve-shelf {
  display: flex; flex-direction: column; gap: 6px; min-width: 0;
  padding: 12px 14px; border-radius: 14px;
  background: var(--surface); border: 1px solid var(--border);
}
.pve-chip-k {
  display: flex; justify-content: space-between; gap: 8px;
  font-family: var(--font-ui); font-weight: 700; font-size: 9.5px; letter-spacing: 1.6px; color: var(--text-dim);
}
.pve-chip-k em { font-style: normal; letter-spacing: 0.4px; text-transform: none; }
.pve-chip-s { font-size: 11.5px; color: var(--text-dim); }
.pve-chip-s b { color: var(--text); font-variant-numeric: tabular-nums; }
.pve-fuel, .pve-prog { font-size: 12.5px; color: var(--text-dim); }
.pve-fuel b, .pve-prog b { color: var(--text); font-size: 15px; }
.pve-pips { display: inline-flex; gap: 5px; }
.pve-pips i {
  width: 22px; height: 9px; transform: skewX(-18deg);
  background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.14);
}
.pve-pips i.on { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 10px var(--accent-glow); }

.pve-crates { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
/* Cada caixa: a arte da caixa dentro de um anel de progresso, o nome e o relógio. A cor
   vem do tier (âmbar comum, roxo chefe), as mesmas da cerimônia de abrir. */
.pve-crate {
  --cr: var(--accent); --cr-2: #ffd27a; --cr-glow: rgba(233,161,59,0.45);
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 4px;
  min-height: 132px; padding: 10px 6px 10px; border-radius: 14px; cursor: default; overflow: hidden;
  font-family: var(--font-ui); color: var(--text);
  background: radial-gradient(120% 90% at 50% 0%, color-mix(in srgb, var(--cr) 14%, transparent), transparent 60%), var(--surface-2);
  border: 1px solid color-mix(in srgb, var(--cr) 30%, var(--border));
}
.pve-crate.is-boss { --cr: #a77bff; --cr-2: #ff5c9a; --cr-glow: rgba(139,92,246,0.5); }
.pve-crate-art { position: relative; width: 74px; height: 74px; flex: 0 0 auto; }
.pve-crate-ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.pve-crate-ring circle { fill: none; stroke-width: 6; }
.pve-crate-ring .bg { stroke: rgba(255,255,255,0.08); }
.pve-crate-ring .fg {
  stroke: var(--cr); stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--p, 0) * 100);
  filter: drop-shadow(0 0 4px var(--cr-glow)); transition: stroke-dashoffset 900ms linear;
}
.pve-crate-box { position: absolute; inset: 13px; filter: drop-shadow(0 4px 8px rgba(0,0,0,0.5)); }
.pve-crate-box svg { width: 100%; height: 100%; overflow: visible; }
/* a caixa desenhada usa as mesmas classes da cerimônia (.pve-cr-*), que leem --cr/--cr-2 */
.pve-crate .pve-cr-back { fill: #1d1a24; }
.pve-crate .pve-cr-left { fill: color-mix(in srgb, var(--cr) 70%, #000); }
.pve-crate .pve-cr-right { fill: color-mix(in srgb, var(--cr) 45%, #000); }
.pve-crate .pve-cr-lid path:first-child { fill: var(--cr); }
.pve-crate .pve-cr-band { fill: none; stroke: var(--cr-2); stroke-width: 5; stroke-linecap: round; }
.pve-crate > b { font-family: var(--font-display); font-style: italic; font-size: 9.5px; letter-spacing: 0.8px; color: var(--cr); white-space: nowrap; }
.pve-crate-t {
  padding: 2px 9px; border-radius: 99px; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums;
  color: var(--text); background: rgba(255,255,255,0.07);
}
/* pronta: ela pula, brilha e pede o toque */
.pve-crate.is-ready {
  cursor: pointer; border-color: var(--cr);
  box-shadow: 0 0 22px var(--cr-glow), inset 0 0 30px color-mix(in srgb, var(--cr) 18%, transparent);
}
.pve-crate.is-ready .pve-crate-box { animation: pveCrateHop 1.4s ease-in-out infinite; }
.pve-crate.is-ready .pve-crate-ring .fg { filter: drop-shadow(0 0 8px var(--cr)); }
.pve-crate.is-ready .pve-crate-t { color: #0b0b0e; background: var(--cr); letter-spacing: 1px; font-size: 10px; }
.pve-crate.is-ready::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,0.16) 50%, transparent 65%);
  animation: pveSheen 2.4s ease-in-out infinite;
}
.pve-crate.is-ready:hover { transform: translateY(-2px); }
@keyframes pveCrateHop {
  0%, 60%, 100% { transform: translateY(0) rotate(0); }
  70% { transform: translateY(-6px) rotate(-6deg); }
  80% { transform: translateY(0) rotate(5deg); }
  90% { transform: translateY(-3px) rotate(-3deg); }
}
.pve-crate.is-empty {
  justify-content: center; gap: 6px; cursor: default; opacity: 0.6;
  background: transparent; border: 1.5px dashed rgba(255,255,255,0.16);
}
.pve-crate-plus {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  font-style: normal; font-size: 20px; color: var(--text-dim); border: 1.5px dashed rgba(255,255,255,0.2);
}
.pve-crate.is-empty span { font-size: 9px; letter-spacing: 1.4px; font-weight: 700; color: var(--text-dim); }

/* ---- tickets: impossível não ver quando acabam ---- */
.pve-chip-k em { color: var(--text); font-weight: 800; }
.pve-tickets.is-last { border-color: rgba(233,161,59,0.6); }
.pve-tickets.is-last .pve-pips i.on { animation: pveReady 1.2s ease-in-out infinite; }
@keyframes pveReady { 50% { opacity: 0.45; transform: skewX(-18deg) translateY(-2px); } }
.pve-tickets.is-out { border-color: #ff6a52; background: linear-gradient(160deg, rgba(216,85,63,0.22), var(--surface)); box-shadow: 0 0 22px rgba(216,85,63,0.25); }
.pve-tickets.is-out .pve-chip-k, .pve-tickets.is-out .pve-chip-k em { color: #ff8a73; }
.pve-tickets.is-out .pve-pips i { border-color: rgba(255,106,82,0.5); }
.pve-tickets.is-out .pve-chip-s b { color: #ff8a73; font-size: 14px; }
.pve-outbanner {
  display: flex; align-items: center; gap: 14px; margin: -4px 0 16px; padding: 14px 18px; border-radius: 14px;
  border: 1px solid #ff6a52; background: linear-gradient(100deg, rgba(216,85,63,0.28), rgba(216,85,63,0.08));
  box-shadow: 0 0 30px rgba(216,85,63,0.2);
  animation: pveOut 2.4s ease-in-out infinite;
}
@keyframes pveOut { 50% { box-shadow: 0 0 44px rgba(216,85,63,0.38); } }
.pve-outbanner svg { width: 34px; height: 34px; flex: 0 0 auto; color: #ff8a73; }
.pve-outbanner div { display: flex; flex-direction: column; gap: 3px; }
.pve-outbanner b { font-family: var(--font-display); font-style: italic; font-size: 17px; letter-spacing: 1.6px; color: #ffb3a5; }
.pve-outbanner span { font-size: 12.5px; color: var(--text); }
.pve-outbanner em { font-style: normal; font-weight: 800; color: #ff8a73; font-variant-numeric: tabular-nums; }
.pve-outbanner.is-last { border-color: var(--accent); background: linear-gradient(100deg, rgba(233,161,59,0.22), rgba(233,161,59,0.05)); animation: none; box-shadow: none; }
.pve-outbanner.is-last svg, .pve-outbanner.is-last b, .pve-outbanner.is-last em { color: var(--accent); }
.pve-start { display: inline-flex; flex-direction: column; align-items: center; line-height: 1.1; }
.pve-start small { font-family: var(--font-ui); font-style: normal; font-size: 9.5px; letter-spacing: 1px; font-weight: 700; opacity: 0.8; margin-top: 2px; }
.pve-start.is-noticket {
  padding: 10px 22px; border-radius: 12px; cursor: not-allowed;
  color: #ffb3a5; background: rgba(216,85,63,0.16); border: 1px solid #ff6a52;
}
.pve-start.is-noticket small { opacity: 1; font-size: 10px; letter-spacing: 1.6px; }
.pve-start.is-noticket b { font-family: var(--font-display); font-style: italic; font-size: 18px; font-variant-numeric: tabular-nums; }
.pve-cost { color: var(--text); }

/* ---- capítulos ---- */
.pve-chapters { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.pve-chapter {
  display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; text-align: left; cursor: pointer;
  border-radius: 12px; color: var(--text-dim);
  background: var(--surface); border: 1px solid var(--border);
  transition: border-color 180ms, color 180ms, background 180ms;
}
.pve-chapter small { font-size: 9px; letter-spacing: 1.6px; font-weight: 700; }
.pve-chapter b { font-family: var(--font-display); font-style: italic; font-size: 13px; letter-spacing: 0.8px; color: var(--text); }
.pve-chapter em { font-style: normal; font-size: 11px; }
.pve-chapter:hover { border-color: var(--border-strong); }
.pve-chapter.is-on { border-color: var(--accent); background: rgba(233,161,59,0.10); }
.pve-chapter.is-on small { color: var(--accent); }
.pve-chapter.is-closed b { color: var(--text-dim); }

/* ---- fases + painel de preparo ---- */
.pve-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 16px; align-items: start; }
.pve-stages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.pve-stage {
  position: relative; display: flex; flex-direction: column; gap: 3px; min-height: 86px;
  padding: 11px 13px; text-align: left; cursor: pointer; overflow: hidden;
  border-radius: 13px; color: var(--text);
  background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--border-strong);
  transition: border-color 180ms, transform 180ms, background 180ms;
}
.pve-stage:hover:not(:disabled) { border-color: var(--accent); background: rgba(233,161,59,0.06); }
.pve-stage-n { font-size: 9px; letter-spacing: 1.6px; font-weight: 700; color: var(--text-dim); }
.pve-stage b { font-family: var(--font-display); font-style: italic; font-size: 13.5px; letter-spacing: 0.6px; }
.pve-stage-r { font-size: 11px; color: var(--text-dim); }
.pve-stage-pay { margin-top: auto; font-size: 11px; font-weight: 700; color: var(--success); }
.pve-stage .pve-stars { margin-top: auto; }
.pve-stage.is-cleared { border-left-color: var(--accent); }
.pve-stage.is-on { border-color: var(--accent); background: rgba(233,161,59,0.10); }
.pve-stage.is-closed { cursor: default; opacity: 0.45; }
.pve-stage.is-closed .pve-stage-pay { color: var(--text-dim); font-weight: 600; font-size: 9.5px; letter-spacing: 0.8px; }
.pve-stage.is-boss {
  grid-column: 1 / -1; min-height: 104px; padding-right: 120px;
  border-left-color: var(--pve-rival);
  background: linear-gradient(100deg, var(--surface), rgba(216,85,63,0.14));
}
.pve-stage.is-boss .pve-stage-n { color: var(--pve-rival); }
.pve-stage.is-boss b { font-size: 17px; }
.pve-stage-face {
  position: absolute; right: 0; top: 0; width: 108px; height: 100%;
  object-fit: cover; object-position: 50% 15%;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 45%); mask-image: linear-gradient(90deg, transparent, #000 45%);
  display: flex; align-items: center; justify-content: center;
}

.pve-stars { display: inline-flex; gap: 3px; }
.pve-star {
  width: 14px; height: 14px; background: rgba(255,255,255,0.14);
  clip-path: polygon(50% 0, 62% 35%, 100% 38%, 70% 60%, 80% 100%, 50% 77%, 20% 100%, 30% 60%, 0 38%, 38% 35%);
}
.pve-star.on { background: var(--accent); }

.pve-prep {
  display: flex; flex-direction: column; gap: 14px; padding: 16px 18px;
  border-radius: 16px; background: var(--surface); border: 1px solid var(--border);
  position: sticky; top: 0;
}
.pve-prep.is-idle { min-height: 180px; align-items: center; justify-content: center; color: var(--text-dim); font-size: 13px; }
.pve-prep-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.pve-prep-head small { font-size: 9.5px; letter-spacing: 1.6px; font-weight: 700; color: var(--text-dim); }
.pve-prep-head h3 { margin: 3px 0 0; font-family: var(--font-display); font-style: italic; font-size: 20px; letter-spacing: 0.8px; }
.pve-pay { font-size: 9.5px; letter-spacing: 1.4px; font-weight: 700; color: var(--text-dim); text-align: right; }
.pve-pay b { display: block; font-size: 15px; letter-spacing: 0.4px; color: var(--success); }

.pve-vs { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 12px; align-items: center; }
.pve-vs-mid { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 13px; color: var(--text-dim); }
.pve-diff { display: inline-block; padding: 5px 9px; transform: skewX(-10deg); font-size: 10px; letter-spacing: 1.2px; color: #0b0b0e; background: var(--text-dim); }
.pve-diff.is-easy { background: var(--success); }
.pve-diff.is-even { background: var(--accent); }
.pve-diff.is-hard { background: #e07a3b; }
.pve-diff.is-wall { background: var(--pve-rival); color: #fff; }
.pve-side { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 8px 10px; align-items: center; min-width: 0; }
.pve-side-art { width: 54px; height: 54px; border-radius: 12px; object-fit: cover; border: 2px solid var(--accent); background: var(--surface-2); }
.pve-side.is-rival .pve-side-art { border-color: var(--pve-rival); }
.pve-rival-noart {
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 22px; color: var(--pve-rival);
  background: rgba(216,85,63,0.12);
}
.pve-side-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.pve-side-txt b { font-family: var(--font-display); font-style: italic; font-size: 15px; }
.pve-side-txt span { font-size: 11px; color: var(--text-dim); overflow: hidden; text-overflow: ellipsis; }
.pve-bars { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 4px; }
.pve-bar { display: grid; grid-template-columns: 58px minmax(0, 1fr) 26px; gap: 8px; align-items: center; font-size: 9.5px; letter-spacing: 1px; color: var(--text-dim); }
.pve-bar b { height: 6px; border-radius: 99px; background: rgba(255,255,255,0.08); overflow: hidden; }
.pve-bar b i { display: block; height: 100%; background: var(--accent); }
.pve-bar.is-rival b i { background: var(--pve-rival); }
.pve-bar em { font-style: normal; text-align: right; color: var(--text); font-variant-numeric: tabular-nums; }

.pve-prep-row { display: flex; flex-direction: column; gap: 7px; }
.pve-layout { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.pve-sec {
  display: flex; flex-direction: column; gap: 1px; padding: 7px 8px; min-width: 0;
  border-radius: 9px; background: var(--surface-2); border: 1px solid var(--border); border-top: 3px solid var(--border-strong);
}
.pve-sec small { font-size: 8.5px; letter-spacing: 1.2px; color: var(--text-dim); }
.pve-sec b { font-size: 10px; letter-spacing: 0.6px; overflow: hidden; text-overflow: ellipsis; }
.pve-sec em { font-style: normal; font-size: 10.5px; font-variant-numeric: tabular-nums; }
.pve-sec.is-straight { border-top-color: #4aa3d8; }
.pve-sec.is-corner { border-top-color: #b07ae0; }
.pve-sec.is-mixed { border-top-color: var(--text-dim); }
.pve-sec.is-won em { color: var(--success); }
.pve-sec.is-lost em { color: var(--pve-rival); }
.pve-sec.is-now { border-color: var(--accent); box-shadow: 0 0 14px rgba(233,161,59,0.25); }

.pve-racers { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.pve-racer {
  flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 2px; width: 74px; padding: 6px;
  cursor: pointer; border-radius: 11px; color: var(--text);
  background: var(--surface-2); border: 1px solid var(--border);
}
.pve-racer-art { width: 100%; aspect-ratio: 1; border-radius: 8px; object-fit: cover; background: #111; }
.pve-racer b { font-family: var(--font-display); font-style: italic; font-size: 13px; }
.pve-racer small { font-size: 9px; color: var(--text-dim); }
.pve-racer.is-on { border-color: var(--accent); background: rgba(233,161,59,0.12); }
/* FRESH / USED: se o Racerz ainda paga as fases da carreira. */
.pve-racer { position: relative; }
.pve-rtag {
  position: absolute; top: 4px; left: 4px; right: 4px; padding: 2px 3px; border-radius: 4px; text-align: center;
  font-style: normal; font-size: 8px; font-weight: 800; letter-spacing: 0.6px; white-space: nowrap; overflow: hidden;
}
.pve-rtag.is-fresh { color: #0b0b0e; background: var(--success); }
.pve-rtag.is-used { color: #0b0b0e; background: var(--accent); }
.pve-rtag.is-nopay { color: #fff; background: #d8553f; }
.pve-racer.is-nopay .pve-racer-art { filter: grayscale(0.7) brightness(0.75); }
.pve-racer.is-nopay.is-on { border-color: #ff6a52; background: rgba(216,85,63,0.14); }
.pve-chip-k.is-inline { justify-content: flex-start; align-items: center; }
.pve-help {
  position: relative; display: inline-grid; place-items: center; width: 17px; height: 17px; margin-left: 6px; padding: 0;
  border-radius: 50%; cursor: help; vertical-align: middle;
  font-family: var(--font-ui); font-size: 11px; font-weight: 800; letter-spacing: 0;
  color: #0b0b0e; background: var(--accent); border: 0;
  box-shadow: 0 0 0 3px rgba(233,161,59,0.22); animation: pveHelp 2.2s ease-in-out infinite;
}
@keyframes pveHelp { 50% { box-shadow: 0 0 0 6px rgba(233,161,59,0.08); } }
.pve-help-pop {
  position: absolute; z-index: 40; left: -8px; top: calc(100% + 10px); width: min(330px, calc(100vw - 60px));
  display: flex; flex-direction: column; gap: 7px; padding: 13px 14px; border-radius: 12px; text-align: left; cursor: default;
  font-family: var(--font-ui); font-size: 12px; font-weight: 500; line-height: 1.45; letter-spacing: 0; text-transform: none;
  color: var(--text); background: #121217; border: 1px solid var(--accent);
  box-shadow: 0 18px 40px rgba(0,0,0,0.6), 0 0 24px rgba(233,161,59,0.2);
  opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity 160ms, transform 160ms, visibility 0s 160ms;
  pointer-events: none;
}
.pve-help-pop::before {
  content: ""; position: absolute; left: 12px; top: -6px; width: 10px; height: 10px; transform: rotate(45deg);
  background: #121217; border-left: 1px solid var(--accent); border-top: 1px solid var(--accent);
}
.pve-help:hover .pve-help-pop, .pve-help:focus .pve-help-pop, .pve-help:focus-within .pve-help-pop {
  opacity: 1; visibility: visible; transform: none; transition: opacity 160ms, transform 160ms, visibility 0s; pointer-events: auto;
}
.pve-help-title { font-family: var(--font-display); font-style: italic; font-size: 12.5px; letter-spacing: 1px; color: var(--accent); }
.pve-help-pop b { color: var(--text); font-weight: 800; }
.pve-help-row { display: flex; align-items: center; gap: 8px; }
.pve-help-row .pve-rtag { position: static; flex: 0 0 74px; }
.pve-help-warn { padding: 8px 10px; border-radius: 8px; color: #ffd2c9; background: rgba(216,85,63,0.18); border: 1px solid rgba(255,106,82,0.5); }
.pve-help-warn b { color: #fff; }
.pve-rtag-help { margin: 4px 0 0; font-size: 10.5px; color: var(--text-dim); }
.pve-rtag-help b { font-weight: 800; }
.pve-rtag-help .is-fresh { color: var(--success); }
.pve-rtag-help .is-used { color: var(--accent); }
.pve-nopay {
  display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 12px;
  border: 1px solid #ff6a52; background: linear-gradient(100deg, rgba(216,85,63,0.25), rgba(216,85,63,0.06));
}
.pve-nopay svg { width: 26px; height: 26px; flex: 0 0 auto; color: #ff8a73; }
.pve-nopay div { display: flex; flex-direction: column; gap: 5px; }
.pve-nopay b { font-family: var(--font-display); font-style: italic; font-size: 13.5px; letter-spacing: 1.2px; color: #ffb3a5; }
.pve-nopay span { font-size: 12.5px; line-height: 1.45; color: var(--text); }
.pve-nopay .pve-link { align-self: flex-start; color: #ff8a73; }
.pve-start.is-nopay { filter: saturate(0.4); }
.pve-grades { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.pve-grade {
  display: flex; flex-direction: column; gap: 1px; padding: 8px 10px; text-align: left; cursor: pointer;
  border-radius: 10px; color: var(--text); background: var(--surface-2); border: 1px solid var(--border);
}
.pve-grade b { font-size: 12px; }
.pve-grade small { font-size: 10px; color: var(--text-dim); }
.pve-grade.is-on { border-color: var(--accent); background: rgba(233,161,59,0.12); }
.pve-prep-foot { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.pve-start, .pve-go { padding: 13px 30px; font-family: var(--font-display); font-style: italic; font-size: 14px; letter-spacing: 2px; }
.pve-start:disabled, .pve-go:disabled { opacity: 0.4; cursor: default; }

/* ---- a corrida: o palco do PvP, ao vivo ----
   A pista, os painéis, o HUD e o ticker são as classes .pvp-* do pvp.css, sem cópia. O
   que mora aqui é só o que o PvE acrescenta: o painel de decisão e os efeitos. */
body.is-pve #screen-app {
  background-image:
    linear-gradient(rgba(11, 11, 14, 0.55), rgba(11, 11, 14, 0.75)),
    url("assets/bg-pve.jpg");
  background-position: center 42%;
}
body.is-pve .app-overlay { background: transparent; }

.pve-live .pve-layout { margin-top: 10px; }
.pve-screen { position: relative; overflow: hidden; border-radius: 14px; }
/* Com o palco no ar o cabeçalho da página sai: a corrida é a página. */
.app-page[data-page="pve"]:has(.pve-live) .sim-head { display: none; }
.pve-hud-speed { font-variant-numeric: tabular-nums; }

/* rastro dos carros */
.pve-trail { pointer-events: none; }
.pve-trail.is-a { fill: var(--accent); }
.pve-trail.is-b { fill: var(--danger); }

/* camada de efeitos por cima da pista */
.pve-fx { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; border-radius: inherit; }
.pve-streaks {
  position: absolute; inset: -20% -40%; opacity: 0;
  background: repeating-linear-gradient(100deg, transparent 0 46px, rgba(255,255,255,0.10) 46px 49px, transparent 49px 120px);
  transition: opacity 260ms;
}
.fx-attack .pve-streaks { opacity: 0.55; animation: pveStreak 520ms linear infinite; }
.fx-nitro .pve-streaks {
  opacity: 1; animation: pveStreak 240ms linear infinite;
  background: repeating-linear-gradient(100deg, transparent 0 30px, rgba(90,190,255,0.30) 30px 34px, transparent 34px 78px);
}
@keyframes pveStreak { to { transform: translateX(-120px); } }
.fx-nitro { box-shadow: inset 0 0 0 2px rgba(90,190,255,0.75), inset 0 0 70px rgba(74,163,216,0.45); }
.fx-attack { box-shadow: inset 0 0 0 2px rgba(233,161,59,0.55), inset 0 0 50px rgba(233,161,59,0.22); }
.fx-save { box-shadow: inset 0 0 40px rgba(79,180,119,0.22); }
.fx-spin { box-shadow: inset 0 0 0 3px rgba(216,85,63,0.9), inset 0 0 90px rgba(216,85,63,0.5); }
.fx-nitro .pvp-car.is-a { stroke: #9fdcff; stroke-width: 2.2; }
.fx-nitro .pve-trail.is-a { fill: #6cc8ff; }
.fx-spin .pvp-car.is-a { animation: pveSpin 420ms linear 3; transform-box: fill-box; transform-origin: center; }
@keyframes pveSpin { 50% { stroke: #fff; stroke-width: 3; opacity: 0.5; } }

.pve-flash { position: absolute; inset: 0; opacity: 0; }
.pve-flash.is-nitro { background: radial-gradient(circle, rgba(120,205,255,0.75), transparent 70%); animation: pveFlash 520ms ease-out; }
.pve-flash.is-spin { background: rgba(216,85,63,0.6); animation: pveFlash 620ms ease-out; }
.pve-flash.is-gain { background: radial-gradient(circle, rgba(233,161,59,0.6), transparent 72%); animation: pveFlash 620ms ease-out; }
@keyframes pveFlash { from { opacity: 1; } to { opacity: 0; } }

/* números que sobem do meio da pista */
.pve-pops { position: absolute; left: 0; right: 0; top: 38%; z-index: 4; display: flex; flex-direction: column; align-items: center; pointer-events: none; }
.pve-pop {
  position: absolute;
  font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: clamp(26px, 4.2vw, 46px); letter-spacing: 1px;
  text-shadow: 0 3px 0 rgba(0,0,0,0.6), 0 0 26px currentColor;
  animation: pvePop 1500ms cubic-bezier(0.2, 0.9, 0.3, 1) both;
}
.pve-pop.is-good { color: var(--success); }
.pve-pop.is-bad { color: #ff6a52; }
@keyframes pvePop {
  0% { opacity: 0; transform: translateY(18px) scale(0.6); }
  18% { opacity: 1; transform: translateY(0) scale(1.12); }
  70% { opacity: 1; transform: translateY(-26px) scale(1); }
  100% { opacity: 0; transform: translateY(-58px) scale(0.96); }
}

/* a janela aberta pulsa a moldura da pista */
.pve-live.is-choosing .pve-screen::after {
  content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; border-radius: inherit;
  box-shadow: inset 0 0 0 2px rgba(233,161,59,0.0);
  animation: pveBeat 620ms ease-in-out infinite;
}
@keyframes pveBeat { 50% { box-shadow: inset 0 0 0 2px rgba(233,161,59,0.75), inset 0 0 34px rgba(233,161,59,0.25); } }

/* ---- painel de decisão ---- */
.pve-deck {
  margin-top: 10px; padding: 14px 16px 12px; border-radius: 16px;
  background: rgba(14, 14, 18, 0.94); border: 1px solid var(--border);
  opacity: 0.62; transition: opacity 180ms, border-color 180ms, box-shadow 180ms;
}
.pve-deck.is-open { opacity: 1; border-color: var(--accent); box-shadow: 0 0 34px rgba(233,161,59,0.22); }
.pve-deck.is-urgent { border-color: #ff6a52; box-shadow: 0 0 40px rgba(255,106,82,0.35); animation: pveUrgent 300ms ease-in-out infinite; }
@keyframes pveUrgent { 50% { transform: translateY(-1px) scale(1.004); } }
.pve-deck.is-over { display: none; }
.pve-deck-head { display: flex; align-items: baseline; gap: 12px; }
.pve-deck-k {
  padding: 3px 9px; transform: skewX(-12deg); white-space: nowrap;
  font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 10.5px; letter-spacing: 1.6px;
  color: var(--text-dim); background: rgba(255,255,255,0.08);
}
.pve-deck.is-open .pve-deck-k { color: #0b0b0e; background: var(--accent); }
.pve-deck.is-urgent .pve-deck-k { background: #ff6a52; }
.pve-deck-sec { font-family: var(--font-display); font-style: italic; font-size: 20px; letter-spacing: 1.2px; white-space: nowrap; }
.pve-deck-tip { font-size: 12px; color: var(--text-dim); }
.pve-deck-clock {
  margin-left: auto; min-width: 54px; text-align: right;
  font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 26px; color: var(--accent);
  font-variant-numeric: tabular-nums;
}
.pve-deck.is-urgent .pve-deck-clock { color: #ff6a52; }
.pve-timer { height: 7px; margin: 9px 0 11px; border-radius: 99px; background: rgba(255,255,255,0.08); overflow: hidden; }
.pve-timer i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--accent-strong), var(--accent-soft)); box-shadow: 0 0 14px var(--accent-glow); }
.pve-deck.is-urgent .pve-timer i { background: #ff6a52; box-shadow: 0 0 16px rgba(255,106,82,0.7); }

.pve-deck-btns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.15fr); gap: 9px; }
.pve-pace, .pve-nitro {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-height: 66px;
  padding: 11px 12px 10px; text-align: left; cursor: pointer;
  border-radius: 13px; color: var(--text); background: var(--surface-2); border: 2px solid var(--border);
  transition: border-color 120ms, background 120ms, transform 90ms, box-shadow 120ms;
  -webkit-tap-highlight-color: transparent;
}
.pve-pace b, .pve-nitro b { font-family: var(--font-display); font-style: italic; font-size: 17px; letter-spacing: 1.4px; }
.pve-pace small { font-size: 10.5px; line-height: 1.3; color: var(--text-dim); }
.pve-pace kbd, .pve-nitro kbd {
  position: absolute; top: 7px; right: 8px; padding: 1px 6px; border-radius: 5px;
  font-family: var(--font-ui); font-size: 9.5px; font-weight: 700; color: var(--text-dim);
  background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.12);
}
.pve-pace:active, .pve-nitro:active { transform: scale(0.96); }
.pve-pace.is-attack.is-on { border-color: #ff6a52; background: rgba(216,85,63,0.22); box-shadow: 0 0 22px rgba(216,85,63,0.4); }
.pve-pace.is-hold.is-on { border-color: var(--accent); background: rgba(233,161,59,0.18); box-shadow: 0 0 22px rgba(233,161,59,0.3); }
.pve-pace.is-save.is-on { border-color: var(--success); background: rgba(79,180,119,0.18); box-shadow: 0 0 22px rgba(79,180,119,0.3); }
.pve-nitro { flex-direction: row; align-items: center; gap: 9px; }
.pve-nitro svg { width: 24px; height: 24px; color: #6cc8ff; flex: 0 0 auto; }
.pve-nitro .pve-pips { margin-left: auto; margin-right: 46px; }
.pve-nitro .pve-pips i.on { background: #6cc8ff; border-color: #6cc8ff; box-shadow: 0 0 10px rgba(108,200,255,0.6); }
.pve-nitro.is-on { border-color: #6cc8ff; background: rgba(74,163,216,0.24); box-shadow: 0 0 26px rgba(74,163,216,0.5); animation: pveArmed 500ms ease-in-out infinite; }
@keyframes pveArmed { 50% { box-shadow: 0 0 38px rgba(108,200,255,0.75); } }
.pve-nitro:disabled { opacity: 0.35; cursor: default; }

.pve-deck-foot { display: flex; align-items: center; gap: 16px; margin-top: 11px; }
.pve-gauge { flex: 1 1 auto; display: grid; grid-template-columns: 50px minmax(0, 1fr) 40px; gap: 9px; align-items: center; font-size: 9.5px; letter-spacing: 1.4px; font-weight: 700; color: var(--text-dim); }
.pve-gauge b { height: 9px; border-radius: 99px; background: rgba(255,255,255,0.08); overflow: hidden; }
.pve-gauge b i { display: block; height: 100%; width: 100%; background: var(--success); transition: width 500ms var(--ease-smooth); }
.pve-gauge.is-low b i { background: #ff6a52; }
.pve-gauge em { font-style: normal; color: var(--text); text-align: right; }
.pve-locked { font-family: var(--font-display); font-style: italic; font-size: 11px; letter-spacing: 1.2px; color: var(--text-dim); white-space: nowrap; }

/* ---- o toque nos botões ----
   Três momentos, três respostas: escolher (o botão afunda e volta com um anel que se
   abre), armar o nitro (choque azul) e TRAVAR a escolha quando a janela fecha (carimbo
   SET! sobre o botão — nunca "locked", que em cripto lê como fundo travado). É o que diz ao jogador, sem ler nada, que o clique valeu. */
.pve-pace::after, .pve-nitro::after {
  content: ""; position: absolute; inset: -2px; border-radius: inherit; pointer-events: none;
  border: 2px solid currentColor; opacity: 0;
}
.pve-pace.is-attack { color: #ff8a73; }
.pve-pace.is-hold { color: var(--accent-soft); }
.pve-pace.is-save { color: #7fd6a2; }
.pve-pace b, .pve-pace small { color: var(--text); }
.pve-pace small { color: var(--text-dim); }
.pve-nitro { color: #6cc8ff; }
.pve-nitro b { color: var(--text); }
.pve-pace.is-tap, .pve-nitro.is-tap { animation: pveTap 480ms cubic-bezier(0.2, 1.6, 0.4, 1); }
.pve-pace.is-tap::after, .pve-nitro.is-tap::after { animation: pveRing 480ms ease-out; }
@keyframes pveTap { 0% { transform: scale(0.9); } 55% { transform: scale(1.05); } 100% { transform: scale(1); } }
@keyframes pveRing { from { opacity: 0.9; transform: scale(1); } to { opacity: 0; transform: scale(1.18); } }
.pve-nitro.is-zap { animation: pveZap 520ms ease-out; }
.pve-nitro.is-zap::after { animation: pveRing 520ms ease-out; }
.pve-nitro.is-zap svg { animation: pveBolt 520ms ease-out; }
@keyframes pveZap { 0% { transform: scale(0.92); filter: brightness(1.8); } 40% { transform: scale(1.06) translateX(-2px); } 60% { transform: translateX(2px); } 100% { transform: none; filter: none; } }
@keyframes pveBolt { 0% { transform: scale(1.6) rotate(-14deg); } 100% { transform: none; } }
.pve-pace:not(.is-on) { opacity: 0.86; }
.pve-deck.is-open .pve-pace:not(.is-on) { opacity: 0.7; }
.pve-pace:hover { opacity: 1; border-color: currentColor; }
/* o carimbo */
.pve-pace.is-stamp::before, .pve-nitro.is-stamp::before {
  content: "SET!"; position: absolute; left: 50%; top: 50%; z-index: 2; padding: 3px 10px;
  font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 13px; letter-spacing: 2px;
  color: #0b0b0e; background: currentColor; border-radius: 4px;
  transform: translate(-50%, -50%) rotate(-8deg); animation: pveStamp 700ms cubic-bezier(0.2, 1.4, 0.4, 1) both;
}
@keyframes pveStamp {
  0% { opacity: 0; transform: translate(-50%, -50%) rotate(-8deg) scale(2.2); }
  25% { opacity: 1; transform: translate(-50%, -50%) rotate(-8deg) scale(1); }
  80% { opacity: 1; }
  100% { opacity: 0; }
}
.pve-deck.is-locking .pve-timer i { background: #fff; box-shadow: 0 0 18px #fff; }

.pve-deck-prize {
  margin-bottom: 10px; font-size: 10px; letter-spacing: 1.6px; font-weight: 700; color: var(--text-dim);
  display: flex; align-items: center; gap: 8px;
}
.pve-deck-prize b { color: var(--success); font-size: 13px; letter-spacing: 0.4px; display: inline-flex; }

/* ---- DESKTOP: sem as fichas, o painel vira uma coluna ao lado da pista ----
   As duas fichas e o pote saem: durante a corrida ninguém lê barra de atributo. A pista
   fica com a largura toda menos uma coluna à direita, e é nessa coluna que estão os
   botões — no mesmo lugar o tempo todo, ao alcance do olho que está na pista. */
@media (min-width: 721px) {
  .pve-live .pvp-stage-side, .pve-live .pvp-car-panel { display: none; }
  .pve-live .pvp-stage-grid { grid-template-columns: minmax(0, 1fr); }
  .pve-live .pvp-track-wrap {
    display: grid; gap: 12px; align-items: start;
    grid-template-columns: minmax(0, 1fr) 300px;
    grid-template-areas: "screen deck" "hud deck" "chips deck" "feed deck";
  }
  .pve-live .pve-screen { grid-area: screen; }
  .pve-live .pvp-hud { grid-area: hud; }
  .pve-live .pve-layout { grid-area: chips; margin-top: 0; }
  .pve-live .pvp-feed { grid-area: feed; }
  .pve-live .pve-deck {
    grid-area: deck; margin-top: 0; position: sticky; top: 0;
    display: flex; flex-direction: column;
  }
  .pve-live .pve-deck-head { flex-wrap: wrap; row-gap: 4px; }
  .pve-live .pve-deck-sec { order: 3; flex: 1 0 100%; font-size: 22px; }
  .pve-live .pve-deck-tip { order: 4; flex: 1 0 100%; }
  .pve-live .pve-deck-clock { font-size: 30px; }
  .pve-live .pve-deck-btns { grid-template-columns: minmax(0, 1fr); gap: 9px; }
  .pve-live .pve-pace { min-height: 70px; justify-content: center; }
  .pve-live .pve-pace b { font-size: 20px; }
  .pve-live .pve-nitro { min-height: 78px; margin-top: 4px; }
  .pve-live .pve-nitro b { font-size: 20px; }
  .pve-live .pve-deck-foot { flex-direction: column; align-items: stretch; gap: 8px; }
  .pve-live .pve-locked { white-space: normal; }
}

/* ---- FASE DE CHEFE: outra tela ----
   O chefe tem cara, nome e cor própria. Vermelho e roxo no lugar do âmbar, uma aura que
   pulsa sobre a pista, o chefe fixo no topo e uma apresentação "VS" antes das luzes. */
.pve-live.is-boss { --pve-boss: #ff3b5c; --pve-boss-2: #8b5cf6; }
.pve-live.is-boss .pvp-stage-head h3 { color: var(--pve-boss); text-shadow: 0 0 18px rgba(255,59,92,0.5); }
.pve-live.is-boss .pve-screen { box-shadow: 0 0 0 2px rgba(255,59,92,0.55), 0 0 40px rgba(139,92,246,0.35); }
.pve-live.is-boss .pve-deck.is-open { border-color: var(--pve-boss); box-shadow: 0 0 34px rgba(255,59,92,0.3); }
.pve-live.is-boss .pve-deck.is-open .pve-deck-k { background: var(--pve-boss); color: #fff; }
.pve-live.is-boss .pvp-car.is-b { fill: var(--pve-boss); stroke: #e3d4ff; stroke-width: 1.8; }
.pve-live.is-boss .pve-trail.is-b { fill: var(--pve-boss-2); }
.pve-live.is-boss .pvp-tag.is-b { fill: var(--pve-boss); font-weight: 800; }
.pve-boss-aura {
  position: absolute; inset: 0;
  background: radial-gradient(120% 90% at 50% 50%, transparent 55%, rgba(139,92,246,0.35) 85%, rgba(255,59,92,0.45) 100%);
  animation: pveAura 1.6s ease-in-out infinite;
}
@keyframes pveAura { 50% { opacity: 0.45; } }
.pve-flash.is-boss { background: radial-gradient(circle, rgba(255,59,92,0.7), rgba(139,92,246,0.4) 50%, transparent 75%); animation: pveFlash 700ms ease-out; }
.pve-pop.is-boss { color: #ff5c79; }

.pve-boss-bar {
  grid-area: boss; position: relative; overflow: hidden;
  display: flex; align-items: center; gap: 14px; margin-bottom: 10px; padding: 10px 14px;
  border-radius: 14px; border: 1px solid rgba(255,59,92,0.55);
  background: linear-gradient(100deg, rgba(255,59,92,0.22), rgba(139,92,246,0.18) 60%, rgba(14,14,18,0.9));
}
.pve-boss-bar::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(100deg, transparent 30%, rgba(255,255,255,0.12) 45%, transparent 60%);
  animation: pveSheen 3.2s ease-in-out infinite;
}
@keyframes pveSheen { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.pve-boss-face { width: 64px; height: 64px; border-radius: 12px; object-fit: cover; object-position: 50% 15%; border: 2px solid var(--pve-boss); box-shadow: 0 0 20px rgba(255,59,92,0.55); flex: 0 0 auto; }
.pve-boss-who { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.pve-boss-who small { font-size: 9.5px; letter-spacing: 1.8px; font-weight: 800; color: #ff8aa0; }
.pve-boss-who b { font-family: var(--font-display); font-style: italic; font-size: 22px; letter-spacing: 1px; color: #fff; }
.pve-boss-who span { font-size: 11px; color: #d7c8ff; }
.pve-boss-meter { margin-left: auto; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.pve-boss-meter span { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 12px; letter-spacing: 2px; color: var(--pve-boss); }
.pve-boss-skull { font-style: normal; font-size: 22px; color: #fff; text-shadow: 0 0 14px var(--pve-boss); animation: pveAura 1.2s ease-in-out infinite; }

/* a apresentação */
.pve-boss-intro {
  position: absolute; inset: 0; z-index: 30; border-radius: inherit; overflow: hidden;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; padding: 30px 24px;
  background: radial-gradient(circle at 50% 45%, rgba(139,92,246,0.35), rgba(8,6,12,0.97) 70%);
  opacity: 0; transition: opacity 260ms;
}
.pve-boss-intro.is-in { opacity: 1; }
.pve-boss-intro.is-out { opacity: 0; transition: opacity 500ms; }
.pve-bi-side { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.pve-bi-side b { font-family: var(--font-display); font-style: italic; font-size: clamp(14px, 2vw, 22px); letter-spacing: 1px; }
.pve-bi-side em { font-style: normal; font-size: 12px; color: var(--text-dim); letter-spacing: 1px; }
.pve-bi-art { width: clamp(110px, 18vw, 220px); aspect-ratio: 1; height: auto; border-radius: 18px; object-fit: cover; object-position: 50% 15%; }
.pve-bi-side.is-me .pve-bi-art { border: 3px solid var(--accent); box-shadow: 0 0 34px var(--accent-glow); }
.pve-bi-side.is-boss .pve-bi-art { border: 3px solid #ff3b5c; box-shadow: 0 0 44px rgba(255,59,92,0.7); }
.pve-bi-side.is-boss b { color: #ff5c79; }
.pve-boss-intro.is-in .pve-bi-side.is-me { animation: pveSlamL 520ms cubic-bezier(0.2, 1.3, 0.4, 1) both; }
.pve-boss-intro.is-in .pve-bi-side.is-boss { animation: pveSlamR 520ms 160ms cubic-bezier(0.2, 1.3, 0.4, 1) both; }
@keyframes pveSlamL { from { transform: translateX(-120%) skewX(-10deg); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes pveSlamR { from { transform: translateX(120%) skewX(10deg); opacity: 0; } to { transform: none; opacity: 1; } }
.pve-bi-mid { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.pve-bi-mid small { font-size: 10px; letter-spacing: 2.4px; font-weight: 800; color: #ff8aa0; white-space: nowrap; }
.pve-bi-mid strong {
  font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: clamp(48px, 8vw, 96px); line-height: 1;
  background: linear-gradient(180deg, #fff, #ff3b5c); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 22px rgba(255,59,92,0.7));
}
.pve-boss-intro.is-in .pve-bi-mid strong { animation: pveVs 700ms 420ms cubic-bezier(0.2, 1.6, 0.4, 1) both; }
@keyframes pveVs { from { transform: scale(3) rotate(-12deg); opacity: 0; } to { transform: none; opacity: 1; } }
.pve-bi-line {
  grid-column: 1 / -1; margin: 0; text-align: center; font-family: var(--font-display); font-style: italic; font-size: 15px; color: #e3d4ff;
}
.pve-boss-intro.is-in .pve-bi-line { animation: pveFadeUp 500ms 1100ms both; }
@keyframes pveFadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

.pve-result.is-boss { border-color: #ff3b5c; box-shadow: 0 0 40px rgba(255,59,92,0.3); }
.pve-result.is-boss.is-won h3 { color: #ff5c79; }
.pve-result-boss { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.pve-result-face { width: 92px; height: 92px; border-radius: 16px; object-fit: cover; object-position: 50% 15%; border: 3px solid #ff3b5c; box-shadow: 0 0 30px rgba(255,59,92,0.55); }
.pve-result.is-won .pve-result-face { filter: grayscale(0.85) brightness(0.7); }
.pve-result-boss small { margin-top: 6px; font-size: 9.5px; letter-spacing: 1.8px; font-weight: 800; color: #ff8aa0; }
.pve-result-boss b { font-family: var(--font-display); font-style: italic; font-size: 15px; }

@media (min-width: 721px) {
  .pve-live.is-boss .pvp-track-wrap { grid-template-areas: "boss boss" "screen deck" "hud deck" "chips deck" "feed deck"; }
  .pve-live.is-boss .pve-boss-bar { margin-bottom: 0; }
}
@media (max-width: 720px) {
  .pve-boss-intro { grid-template-columns: 1fr; padding: 22px 16px; gap: 6px; align-content: center; }
  .pve-bi-side { flex-direction: row; justify-content: center; }
  .pve-bi-art { width: 72px; }
  .pve-boss-face { width: 48px; height: 48px; }
  .pve-boss-who b { font-size: 17px; }
}

/* ---- bandeirada: o resultado entra por cima da pista ---- */
.pve-live { position: relative; }
.pve-finish {
  position: absolute; inset: 0; z-index: 20; display: flex; align-items: flex-start; justify-content: center; padding: 70px 16px 16px;
  border-radius: inherit;
  background: rgba(6, 6, 9, 0.78); opacity: 0; transition: opacity 320ms var(--ease-smooth);
}
.pve-finish[hidden] { display: none; }
.pve-finish.is-in { opacity: 1; }
.pve-finish .pve-result { width: min(460px, 100%); transform: scale(0.92); transition: transform 380ms cubic-bezier(0.2, 1.3, 0.4, 1); }
.pve-finish.is-in .pve-result { transform: none; }

/* ---- resultado ---- */
.pve-result {
  display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 22px 20px; text-align: center;
  border-radius: 16px; background: var(--surface); border: 1px solid var(--border);
}
.pve-result h3 { margin: 0; font-family: var(--font-display); font-style: italic; font-size: 24px; letter-spacing: 2px; }
.pve-result.is-won { border-color: var(--accent); box-shadow: 0 0 30px rgba(233,161,59,0.18); }
.pve-result.is-won h3 { color: var(--accent); }
.pve-result.is-lost h3 { color: var(--pve-rival); }
.pve-result .pve-star { width: 26px; height: 26px; }
.pve-result p { margin: 0; font-size: 13.5px; color: var(--text-dim); max-width: 480px; }
.pve-result-list { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 5px; font-size: 13px; }
.pve-result-list b { color: var(--success); }
.pve-result-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; margin-top: 6px; }
.pve-proof { margin-top: 6px; font-size: 11px; color: var(--text-dim); max-width: 100%; }
.pve-proof summary { cursor: pointer; letter-spacing: 1px; }
.pve-proof code { display: block; margin-top: 4px; font-size: 10px; word-break: break-all; color: var(--text-dim); }

/* ---- ABRIR CAIXA: a cerimônia (ver crateShow em pve.js) ----
   Âmbar para a caixa comum, roxo para a de chefe. Treme → estoura → itens entram. */
.pve-open {
  --cr: var(--accent); --cr-2: #ffd27a; --cr-glow: rgba(233,161,59,0.55);
  position: fixed; inset: 0; z-index: 200; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  padding: 24px; overflow: hidden; background: rgba(5,5,8,0.9); cursor: pointer;
  opacity: 0; transition: opacity 240ms;
}
.pve-open.is-boss { --cr: #a77bff; --cr-2: #ff5c9a; --cr-glow: rgba(139,92,246,0.6); }
.pve-open.is-in { opacity: 1; }
.pve-open.is-out { opacity: 0; }
.pve-open-rays {
  position: absolute; width: 160vmax; height: 160vmax; left: 50%; top: 50%; margin: -80vmax 0 0 -80vmax;
  background: repeating-conic-gradient(from 0deg, var(--cr-glow) 0 6deg, transparent 6deg 18deg);
  -webkit-mask-image: radial-gradient(circle, #000 0, transparent 55%); mask-image: radial-gradient(circle, #000 0, transparent 55%);
  opacity: 0; transform: scale(0.4);
}
.pve-open-glow {
  position: absolute; width: 520px; height: 520px; left: 50%; top: 50%; margin: -300px 0 0 -260px; border-radius: 50%;
  background: radial-gradient(circle, var(--cr-glow), transparent 65%); opacity: 0.35;
}
.pve-open-crate { position: relative; width: 190px; height: 190px; filter: drop-shadow(0 0 26px var(--cr-glow)); }
.pve-open-crate svg { width: 100%; height: 100%; overflow: visible; }
.pve-cr-back { fill: #1d1a24; }
.pve-cr-left { fill: color-mix(in srgb, var(--cr) 70%, #000); }
.pve-cr-right { fill: color-mix(in srgb, var(--cr) 45%, #000); }
.pve-cr-lid path:first-child { fill: var(--cr); }
.pve-cr-band { fill: none; stroke: var(--cr-2); stroke-width: 4; stroke-linecap: round; }
.pve-cr-lid { transform-origin: 60px 42px; transform-box: view-box; }
.pve-open-k { position: relative; font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 13px; letter-spacing: 3px; color: var(--cr); }
.pve-open-items { position: relative; list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; max-width: 560px; }
.pve-open-ok, .pve-open-skip { position: relative; }
.pve-open-ok { display: none; padding: 13px 34px; font-family: var(--font-display); font-style: italic; letter-spacing: 2px; }
.pve-open-skip { margin: 0; font-size: 10px; letter-spacing: 2px; color: var(--text-dim); text-transform: uppercase; }

/* ato 1: treme, cada vez mais forte, e a luz cresce */
.pve-open.is-shake .pve-open-crate { animation: pveCrShake 1.5s ease-in both; }
.pve-open.is-shake .pve-open-glow { animation: pveCrGlow 1.5s ease-in both; }
@keyframes pveCrShake {
  0% { transform: scale(0.6) translateY(40px); opacity: 0; }
  14% { transform: scale(1) translateY(0); opacity: 1; }
  30% { transform: rotate(-3deg); } 38% { transform: rotate(3deg); }
  50% { transform: rotate(-5deg) scale(1.03); } 58% { transform: rotate(5deg) scale(1.04); }
  70% { transform: rotate(-8deg) scale(1.06); } 76% { transform: rotate(8deg) scale(1.07); }
  84% { transform: rotate(-10deg) scale(1.1); } 90% { transform: rotate(10deg) scale(1.12); }
  100% { transform: rotate(0) scale(1.16); }
}
@keyframes pveCrGlow { to { opacity: 1; transform: scale(1.5); } }
/* ato 2: a tampa voa, clarão, raios girando */
.pve-open.is-burst .pve-open-crate { transform: scale(1.16); }
.pve-open.is-burst .pve-cr-lid { animation: pveCrLid 620ms cubic-bezier(0.2, 0.9, 0.3, 1) both; }
@keyframes pveCrLid { to { transform: translate(34px, -120px) rotate(38deg); opacity: 0; } }
.pve-open.is-burst .pve-open-rays { animation: pveRaysIn 600ms ease-out both, pveRaysSpin 9s linear infinite; }
@keyframes pveRaysIn { to { opacity: 0.6; transform: scale(1); } }
@keyframes pveRaysSpin { to { rotate: 360deg; } }
.pve-open.is-burst .pve-open-glow { animation: pveCrFlash 700ms ease-out both; }
@keyframes pveCrFlash { 0% { opacity: 1; transform: scale(1.5); filter: brightness(2.4); } 100% { opacity: 0.7; transform: scale(2.2); } }
.pve-open.is-burst::after {
  content: ""; position: absolute; inset: 0; background: #fff; pointer-events: none; animation: pveWhite 520ms ease-out both;
}
@keyframes pveWhite { from { opacity: 0.85; } to { opacity: 0; } }
/* ato 3: a caixa encolhe para cima e os itens entram */
.pve-open.is-reveal { cursor: default; }
.pve-open.is-reveal .pve-open-crate { animation: pveCrAway 500ms ease-out both; }
@keyframes pveCrAway { from { transform: scale(1.16); } to { transform: scale(0.55); margin-bottom: -50px; opacity: 0.85; } }
.pve-open.is-reveal .pve-open-ok { display: inline-flex; animation: pveFadeUp 400ms 900ms both; }
.pve-open.is-reveal .pve-open-skip { display: none; }
.pve-open-items li {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-width: 128px; padding: 14px 16px;
  border-radius: 14px; background: rgba(20,20,26,0.95); border: 1px solid rgba(255,255,255,0.14);
  animation: pveItemIn 560ms var(--d, 0ms) cubic-bezier(0.2, 1.4, 0.4, 1) both;
}
@keyframes pveItemIn { from { opacity: 0; transform: translateY(40px) scale(0.6) rotateX(70deg); } to { opacity: 1; transform: none; } }
.pve-open-items b { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 26px; letter-spacing: 0.5px; font-variant-numeric: tabular-nums; }
.pve-open-items span { font-size: 11px; letter-spacing: 1.2px; color: var(--text-dim); text-transform: uppercase; }
.pve-open-items .is-cazh { border-color: rgba(79,180,119,0.6); box-shadow: 0 0 26px rgba(79,180,119,0.25); }
.pve-open-items .is-cazh b { color: var(--success); }
.pve-open-items .is-fuel b { color: #6cc8ff; }
.pve-open-items .is-card { min-width: 170px; }
.pve-open-items .is-card img { width: 92px; height: 120px; object-fit: cover; border-radius: 9px; margin-bottom: 6px; }
.pve-open-items .is-card b { font-size: 15px; letter-spacing: 1.5px; }
.pve-open-items .is-card span { text-transform: none; letter-spacing: 0.4px; color: var(--text); }
.pve-open-items .is-rare { border-color: #4aa3d8; box-shadow: 0 0 30px rgba(74,163,216,0.4); }
.pve-open-items .is-rare b { color: #6cc8ff; }
.pve-open-items .is-epic { border-color: #a77bff; box-shadow: 0 0 36px rgba(139,92,246,0.55); }
.pve-open-items .is-epic b { color: #c6a8ff; }
.pve-open-items .is-legendary { border-color: #ffc23d; box-shadow: 0 0 44px rgba(255,194,61,0.6); animation: pveItemIn 560ms var(--d, 0ms) cubic-bezier(0.2, 1.4, 0.4, 1) both, pveLegend 1.4s 1s ease-in-out infinite; }
.pve-open-items .is-legendary b { color: #ffd46b; }
@keyframes pveLegend { 50% { box-shadow: 0 0 70px rgba(255,194,61,0.9); } }

/* ---- telas estreitas ---- */
@media (max-width: 1050px) {
  .pve-hud { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pve-shelf { grid-column: 1 / -1; }
  .pve-cols { grid-template-columns: minmax(0, 1fr); }
  .pve-prep { position: static; order: -1; }
  .pve-prep.is-idle { display: none; }
}
@media (max-width: 720px) {
  .pve-hud { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .pve-chip:nth-child(3) { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: space-between; }
  .pve-pips i { width: 16px; }
  .pve-crates { gap: 6px; }
  .pve-crate { min-height: 112px; padding: 8px 3px; }
  .pve-crate-art { width: 56px; height: 56px; }
  .pve-crate-box { inset: 10px; }
  .pve-crate > b { font-size: 8.5px; letter-spacing: 0.6px; }
  .pve-crate-t { font-size: 10px; padding: 2px 6px; }
  .pve-crate.is-ready .pve-crate-t { font-size: 8.5px; }
  .pve-chapters { display: flex; overflow-x: auto; scrollbar-width: none; }
  .pve-chapters::-webkit-scrollbar { display: none; }
  .pve-chapter { flex: 0 0 132px; }
  .pve-vs { grid-template-columns: minmax(0, 1fr); }
  .pve-vs-mid { justify-self: center; }
  .pve-layout { gap: 4px; }
  .pve-sec { padding: 6px 5px; }
  .pve-sec b { font-size: 8.5px; letter-spacing: 0; }
  .pve-prep-foot { flex-direction: column; align-items: stretch; }
  /* No telefone a pista e o painel sobem para o topo; as fichas dos dois carros descem. */
  .pve-live .pvp-track-wrap { order: -1; }
  .pve-deck { padding: 12px; }
  .pve-deck-btns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pve-nitro { grid-column: 1 / -1; min-height: 54px; }
  .pve-pace { min-height: 62px; padding: 10px 8px 8px; }
  .pve-pace b { font-size: 12px; letter-spacing: 0.3px; }
  .pve-pace { align-items: center; text-align: center; }
  .pve-deck-head { gap: 8px; align-items: center; }
  .pve-deck-k { font-size: 9px; letter-spacing: 1px; }
  .pve-deck-clock { font-size: 22px; min-width: 44px; }
  .pve-pace small { font-size: 9.5px; }
  .pve-pace kbd, .pve-nitro kbd { display: none; }
  .pve-nitro .pve-pips { margin-right: 0; }
  .pve-deck-tip { display: none; }
  .pve-deck-sec { font-size: 14px; letter-spacing: 0.6px; }
  .pve-locked { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .pve-help,
  .pve-crate.is-ready .pve-crate-box, .pve-crate.is-ready::after,
  .pve-outbanner, .pve-tickets.is-last .pve-pips i.on,
  .pve-open *, .pve-open::after,
  .pve-boss-aura, .pve-boss-bar::after, .pve-boss-skull, .pve-boss-intro.is-in *,
  .pve-pace.is-tap, .pve-nitro.is-tap, .pve-nitro.is-zap, .pve-pace.is-tap::after, .pve-nitro.is-tap::after,
  .pve-crate.is-ready, .pve-streaks, .pve-deck.is-urgent, .pve-nitro.is-on,
  .pve-live.is-choosing .pve-screen::after, .fx-spin .pvp-car.is-a { animation: none; }
  .pve-gauge b i { transition: none; }
  .pve-pop { animation-duration: 900ms; }
}

/* ============================================================
   TELA DE SELEÇÃO v2 — capítulos | fases | painel da fase
   ============================================================
   Layout do mockup do fundador (2026-10-05). Tudo aqui é escopado em `.pve2`, que só
   existe na tela de seleção: a corrida (`.pve-live`), a cerimônia das caixas e os avisos
   continuam com as regras de cima. Onde uma classe antiga é reaproveitada (.pve-chapter,
   .pve-stage, .pve-prep…), é porque o tutorial e os cliques apontam para ela. */
.app-page[data-page="pve"]:has(.pve2) .sim-head { display: none; }
.pve2 {
  --p2-bg: rgba(12, 12, 16, 0.94); --p2-line: rgba(233, 161, 59, 0.34); --p2-line-dim: rgba(255, 255, 255, 0.09);
  --p2-label: "Rajdhani", var(--font-ui);
}

/* ---- faixa do topo ---- */
.pve2-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.pve2-title { display: flex; align-items: center; gap: 14px; min-width: 0; }
.pve2-title > i { width: 6px; height: 46px; background: linear-gradient(180deg, var(--accent), var(--accent-strong)); transform: skewX(-12deg); flex: 0 0 auto; }
.pve2-title b { display: block; font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 30px; letter-spacing: 1px; line-height: 1; }
.pve2-title small { font-size: 10px; letter-spacing: 0.4em; color: var(--text-dim); }
.pve2-prog { display: flex; flex-direction: column; gap: 2px; padding-left: 14px; border-left: 1px solid var(--p2-line-dim); font-family: var(--p2-label); font-weight: 700; font-size: 13px; letter-spacing: 1.2px; color: var(--text-dim); }
.pve2-prog b { font-size: 17px; color: var(--text); }
.pve2-prog-stars { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; }
.pve2-prog-stars svg { width: 12px; height: 12px; color: var(--accent); }
.pve2-howto { margin-left: 4px; }
.pve2-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.pve2-chip {
  display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 6px 16px 6px 10px; cursor: default; text-align: left;
  color: var(--text); background: var(--p2-bg); border: 1px solid var(--p2-line-dim); border-radius: 4px;
  transform: skewX(-8deg);
}
.pve2-chip > * { transform: skewX(8deg); }
button.pve2-chip { cursor: pointer; transition: border-color 160ms, background 160ms; }
button.pve2-chip:hover { border-color: var(--accent); }
.pve2-chip-ico { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 auto; }
.pve2-chip-ico svg { width: 26px; height: 26px; }
.pve2-chip-ico.is-red { color: #ff5a4a; } .pve2-chip-ico.is-blue { color: #4aa3ff; } .pve2-chip-ico.is-gold { color: var(--accent); }
.pve2-chip-txt { display: flex; flex-direction: column; line-height: 1.15; }
.pve2-chip-txt b { font-family: var(--font-display); font-style: italic; font-size: 15px; white-space: nowrap; }
.pve2-chip-txt b i { font-family: var(--p2-label); font-style: normal; font-size: 10px; letter-spacing: 1px; color: var(--text-dim); }
.pve2-chip-txt small { font-family: var(--p2-label); font-weight: 700; font-size: 10.5px; letter-spacing: 1.4px; color: var(--text-dim); white-space: nowrap; }
.pve2-chip-txt small em { font-style: normal; color: var(--text); font-variant-numeric: tabular-nums; }
.pve2-chip.pve-tickets.is-out { border-color: #ff6a52; background: linear-gradient(160deg, rgba(216,85,63,0.3), var(--p2-bg)); box-shadow: 0 0 22px rgba(216,85,63,0.25); }
.pve2-chip.pve-tickets.is-out small, .pve2-chip.pve-tickets.is-out small em { color: #ff8a73; }
.pve2-chip.pve-tickets.is-last { border-color: var(--accent); }
.pve2-crates.is-open { border-color: var(--accent); background: rgba(233,161,59,0.12); }
.pve2-crates.is-ready { border-color: var(--accent); animation: pve2Ready 1.8s ease-in-out infinite; }
@keyframes pve2Ready { 0%, 100% { box-shadow: 0 0 12px rgba(233,161,59,0.25); } 50% { box-shadow: 0 0 30px rgba(233,161,59,0.6); } }
@media (prefers-reduced-motion: reduce) { .pve2-crates.is-ready { animation: none; } }
.pve2-crates.is-ready small { color: var(--accent); }
.pve2 .pve-shelf { margin: -4px 0 14px; padding: 12px 14px; border-radius: 6px; background: var(--p2-bg); border: 1px solid var(--p2-line); }
.pve2 .pve-crates { max-width: 560px; }
.pve2 .pve-outbanner { margin: 0 0 14px; }

/* ---- as três colunas ---- */
.pve2-cols { display: grid; grid-template-columns: 190px 270px minmax(0, 1fr); gap: 14px; align-items: start; }

.pve2 .pve-chapters { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.pve2 .pve-chapter {
  position: relative; display: flex; flex-direction: column; gap: 3px; min-height: 92px; justify-content: center; padding: 12px 14px;
  border-radius: 4px; background: var(--p2-bg); border: 1px solid var(--p2-line-dim); color: var(--text-dim);
}
.pve2 .pve-chapter small { font-family: var(--p2-label); font-size: 12px; font-weight: 700; letter-spacing: 1.6px; }
.pve2 .pve-chapter b { font-family: var(--font-display); font-style: italic; font-size: 15px; letter-spacing: 0.6px; text-transform: uppercase; color: var(--text); line-height: 1.15; }
.pve2 .pve-chapter em { font-family: var(--p2-label); font-weight: 700; font-size: 13px; }
.pve2 .pve-chapter.is-on { border: 2px solid var(--accent); background: linear-gradient(135deg, rgba(233,161,59,0.28), rgba(233,161,59,0.06)); }
.pve2 .pve-chapter.is-on small, .pve2 .pve-chapter.is-on b, .pve2 .pve-chapter.is-on em { color: var(--accent-soft); }
.pve2 .pve-chapter.is-closed b { color: var(--text-dim); }

.pve2 .pve-stages { display: flex; flex-direction: column; gap: 8px; max-height: calc(100vh - 170px); overflow-y: auto; padding-right: 4px; scrollbar-width: thin; }
.pve2 .pve-stage {
  position: relative; display: flex; flex-direction: column; justify-content: center; gap: 2px; flex: 0 0 auto;
  min-height: 82px; padding: 10px 104px 10px 14px; overflow: hidden; text-align: left;
  border-radius: 4px; background: var(--p2-bg); border: 1px solid var(--p2-line-dim); border-left: 1px solid var(--p2-line-dim);
}
.pve2 .pve-stage-thumb {
  position: absolute; right: 0; top: 0; bottom: 0; width: 118px; background-size: cover; background-position: center;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 55%); mask-image: linear-gradient(90deg, transparent, #000 55%);
  opacity: 0.85;
}
.pve2 .pve-stage-face { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 15%; -webkit-mask-image: none; mask-image: none; }
.pve2 .pve-stage-n { position: relative; font-family: var(--p2-label); font-size: 12px; font-weight: 700; letter-spacing: 1.6px; color: var(--text-dim); }
.pve2 .pve-stage b { position: relative; font-family: var(--p2-label); font-style: normal; font-weight: 700; font-size: 18px; letter-spacing: 0.4px; }
.pve2 .pve-stage .pve-stars, .pve2 .pve-stage-pay { position: relative; margin-top: 2px; }
.pve2 .pve-stage-pay { font-family: var(--p2-label); font-size: 12px; letter-spacing: 0.6px; }
.pve2 .pve-stage.is-on { border: 2px solid var(--accent); background: linear-gradient(100deg, rgba(233,161,59,0.22), var(--p2-bg) 70%); }
.pve2 .pve-stage.is-on .pve-stage-n { color: var(--accent); }
.pve2 .pve-stage.is-boss { min-height: 96px; padding-right: 104px; border-color: rgba(255,59,92,0.5); background: linear-gradient(100deg, rgba(255,59,92,0.18), var(--p2-bg) 70%); grid-column: auto; }
.pve2 .pve-stage.is-boss .pve-stage-n { color: #ff5c79; }
.pve2 .pve-stage.is-boss b { font-size: 20px; }
.pve2 .pve-stage.is-closed .pve-stage-thumb { filter: grayscale(1) brightness(0.5); }

/* ---- painel da fase ---- */
.pve2 .pve-prep.pve2-panel {
  position: relative; top: auto; display: flex; flex-direction: column; gap: 10px; padding: 0;
  background: none; border: 0; border-radius: 0;
}
.pve2-box, .pve2-hero, .pve2-fuel {
  position: relative; background: var(--p2-bg); border: 1px solid var(--p2-line); border-radius: 4px;
}
/* cantos dourados, como no mockup: dois "L" desenhados nos cantos opostos */
.pve2-box::before, .pve2-hero::before {
  content: ""; position: absolute; left: -1px; top: -1px; width: 16px; height: 16px; pointer-events: none;
  border-left: 3px solid var(--accent); border-top: 3px solid var(--accent);
}
.pve2-box::after, .pve2-hero::after {
  content: ""; position: absolute; right: -1px; bottom: -1px; width: 16px; height: 16px; pointer-events: none;
  border-right: 3px solid var(--accent); border-bottom: 3px solid var(--accent);
}
.pve2-box { padding: 14px 16px; min-width: 0; }
.pve2-box-k {
  display: flex; align-items: center; gap: 8px; margin-bottom: 10px;
  font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 14px; letter-spacing: 1.2px; text-transform: uppercase;
}
.pve2-box-k svg { width: 18px; height: 18px; color: var(--text); }
.pve2-row { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 10px; }

.pve2-hero {
  display: flex; align-items: stretch; justify-content: space-between; gap: 16px; min-height: 250px; padding: 20px 22px; overflow: hidden;
  background-size: cover; background-position: center;
}
.pve2-hero-txt { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.pve2-hero-txt > small { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 17px; letter-spacing: 1.2px; color: var(--accent); }
.pve2-hero-txt h3 { margin: 2px 0 0; font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: clamp(34px, 4.4vw, 62px); line-height: 0.95; letter-spacing: 0.5px; text-transform: uppercase; text-shadow: 0 3px 0 rgba(0,0,0,0.5); }
.pve2-hero-txt > span { margin-top: 6px; font-family: var(--p2-label); font-weight: 600; font-size: 18px; color: var(--text); }
.pve2-hero .pve-diff { margin-top: 10px; font-family: var(--font-display); font-style: italic; font-weight: 800; }
.pve2-nums { display: flex; gap: 8px; margin-top: auto; padding-top: 14px; flex-wrap: wrap; }
.pve2-nums > div { min-width: 118px; padding: 9px 14px; border-radius: 4px; background: rgba(10,10,13,0.86); border: 1px solid rgba(255,255,255,0.16); }
.pve2-nums small { display: block; font-family: var(--p2-label); font-weight: 700; font-size: 11px; letter-spacing: 1.4px; color: var(--text-dim); }
.pve2-nums b { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 26px; line-height: 1.1; white-space: nowrap; }
.pve2-nums b i { font-family: var(--p2-label); font-style: normal; font-size: 11px; letter-spacing: 1px; color: var(--text-dim); }

.pve2-rival {
  align-self: flex-end; display: grid; grid-template-columns: 76px auto; gap: 4px 12px; align-items: center; padding: 10px 16px 12px 12px;
  background: rgba(10,10,13,0.9); border: 1px solid var(--p2-line); border-radius: 4px; min-width: 220px;
}
.pve2-rival-k { grid-column: 1 / -1; display: flex; align-items: center; gap: 7px; font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 13px; letter-spacing: 1.4px; }
.pve2-rival-k svg { width: 16px; height: 16px; }
.pve2-rival-art { width: 76px; height: 76px; border-radius: 4px; object-fit: cover; border: 2px solid var(--accent); font-size: 30px; }
.pve2-rival div { display: flex; flex-direction: column; line-height: 1.2; }
.pve2-rival b { font-family: var(--font-display); font-style: italic; font-size: 17px; text-transform: uppercase; }
.pve2-rival small { font-family: var(--p2-label); font-weight: 600; font-size: 12px; color: var(--text-dim); }
.pve2-rival em { font-style: normal; font-family: var(--p2-label); font-weight: 700; font-size: 13px; color: var(--text-dim); }
.pve2-rival em i { font-family: var(--font-display); font-style: italic; font-size: 22px; color: var(--accent); }

.pve2-portrait { flex: 0 0 auto; width: clamp(150px, 24vw, 300px); align-self: stretch; margin: -8px -10px -8px 0; border: 3px solid var(--accent); border-radius: 4px; overflow: hidden; background: #14121c; box-shadow: 0 0 34px rgba(0,0,0,0.6); }
.pve2-portrait-art { width: 100%; height: 100%; min-height: 220px; object-fit: cover; object-position: 50% 12%; display: flex; font-size: 80px; }
.pve2-hero.is-boss { border-color: rgba(255,59,92,0.6); }
.pve2-hero.is-boss::before, .pve2-hero.is-boss::after { border-color: #ff3b5c; }
.pve2-hero.is-boss .pve2-hero-txt > small { color: #ff5c79; }

/* chefe */
.pve2-row.is-boss { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
.pve2-bossbox { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 0.9fr); gap: 6px 14px; align-items: start; border-color: rgba(255,59,92,0.5); }
.pve2-bossbox::before, .pve2-bossbox::after { border-color: #ff3b5c; }
.pve2-boss-ico { grid-row: span 2; width: 46px; height: 46px; color: #fff; }
.pve2-boss-ico svg { width: 100%; height: 100%; }
.pve2-boss-id { display: flex; flex-direction: column; line-height: 1.05; }
.pve2-boss-id small { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 14px; letter-spacing: 1.4px; color: #ff3b5c; }
.pve2-boss-id b { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 32px; text-transform: uppercase; }
.pve2-boss-id em { font-family: var(--p2-label); font-style: italic; font-weight: 700; font-size: 15px; letter-spacing: 2px; color: var(--text-dim); }
.pve2-bossbox blockquote { margin: 4px 0 0; font-family: var(--font-display); font-style: italic; font-size: 14px; line-height: 1.35; letter-spacing: 0.6px; text-transform: uppercase; text-align: right; color: var(--text); }
.pve2-bossbox p { grid-column: 2 / -1; margin: 0; font-size: 13px; line-height: 1.5; color: var(--text-dim); }
.pve2-bossstats { border-color: var(--p2-line); }
.pve2-bossstats .pve2-box-k { color: var(--accent); }
.pve2-bossstats .pve-bar { grid-template-columns: 70px minmax(0, 1fr) 30px; font-family: var(--p2-label); font-weight: 700; font-size: 12px; }
.pve2-bossstats .pve-bar b { height: 11px; border-radius: 2px; }
.pve2-bossstats .pve-bar:nth-child(1) b i { background: #ff3b5c; } .pve2-bossstats .pve-bar:nth-child(2) b i { background: #3da9ff; }
.pve2-bossstats .pve-bar:nth-child(3) b i { background: #f2b33d; } .pve2-bossstats .pve-bar:nth-child(4) b i { background: #a45cff; }
.pve2-bossstats .pve-bar em { font-family: var(--font-display); font-style: italic; font-size: 14px; }
.pve2-bossnote { margin: 9px 0 0; font-family: var(--p2-label); font-weight: 700; font-size: 12px; letter-spacing: 1px; color: #ff8aa0; text-transform: uppercase; }

/* objetivos e pista */
.pve2-goals { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.pve2-goals li { display: flex; align-items: center; gap: 10px; font-family: var(--p2-label); font-weight: 600; font-size: 17px; color: var(--text-dim); }
.pve2-goals svg { width: 18px; height: 18px; flex: 0 0 auto; color: rgba(255,255,255,0.2); }
.pve2-goals li.is-done { color: var(--text); }
.pve2-goals li.is-done svg { color: var(--accent); filter: drop-shadow(0 0 6px var(--accent-glow)); }
.pve2-blurb { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--text-dim); }
.pve2-track { display: grid; grid-template-columns: minmax(0, 1fr) 130px; gap: 12px; align-items: center; margin-bottom: 10px; }
.pve2-meters { display: flex; flex-direction: column; gap: 7px; }
.pve2-meter { display: grid; grid-template-columns: 84px minmax(0, 1fr) 30px; gap: 9px; align-items: center; font-family: var(--p2-label); font-weight: 700; font-size: 13px; letter-spacing: 1px; color: var(--text-dim); }
.pve2-meter b { height: 9px; background: rgba(255,255,255,0.08); border-radius: 2px; overflow: hidden; }
.pve2-meter b i { display: block; height: 100%; background: var(--accent); }
.pve2-meter.is-straight b i { background: #4aa3d8; } .pve2-meter.is-corner b i { background: #b07ae0; } .pve2-meter.is-mixed b i { background: #9a9aa2; }
.pve2-meter em { font-style: normal; color: var(--text); text-align: right; }
.pve2-mini { width: 100%; height: auto; }
.pve2-mini path { fill: none; stroke: rgba(255,255,255,0.55); stroke-width: 5; stroke-linejoin: round; stroke-linecap: round; }

/* Racerz + recompensas */
.pve2 .pve-chip-k.is-inline, .pve2-box-k.is-inline { justify-content: flex-start; }
.pve2-auto {
  margin-left: auto; padding: 5px 12px; cursor: pointer; border-radius: 3px;
  font-family: var(--p2-label); font-style: normal; font-weight: 700; font-size: 12px; letter-spacing: 1.2px;
  color: var(--text); background: rgba(255,255,255,0.05); border: 1px solid var(--p2-line);
}
.pve2-auto:hover { background: rgba(233,161,59,0.16); border-color: var(--accent); }
.pve2 .pve-racer { width: 92px; border-radius: 4px; }
.pve2 .pve-racer.is-on { border: 2px solid var(--accent); }
.pve2 .pve-racer b { font-size: 16px; }
.pve2-rewards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.pve2-reward {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 96px; padding: 10px 4px; text-align: center;
  border-radius: 4px; background: rgba(255,255,255,0.03); border: 1px solid var(--p2-line-dim);
}
.pve2-reward svg { width: 30px; height: 30px; }
.pve2-reward b { font-family: var(--font-display); font-style: italic; font-size: 14px; white-space: nowrap; }
.pve2-reward small { font-family: var(--p2-label); font-weight: 700; font-size: 10px; letter-spacing: 0.8px; color: var(--text-dim); }
.pve2-reward.is-cazh { border-color: rgba(79,180,119,0.5); } .pve2-reward.is-cazh svg, .pve2-reward.is-cazh b { color: var(--success); }
.pve2-reward.is-crate svg { color: var(--accent); } .pve2-reward.is-bosscrate { border-color: rgba(167,123,255,0.6); } .pve2-reward.is-bosscrate svg, .pve2-reward.is-bosscrate b { color: #b79cff; }
.pve2-reward.is-card svg { color: #6cc8ff; } .pve2-reward.is-stars svg { color: var(--accent); }
.pve2-reward.is-off { opacity: 0.45; filter: grayscale(0.8); }

/* combustível + largada */
.pve2-row.is-go { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: stretch; }
.pve2-fuel { padding: 12px 14px; border-color: var(--p2-line-dim); }
.pve2-fuel .pve2-box-k { margin-bottom: 8px; }
.pve2 .pve-grades { gap: 8px; }
.pve2 .pve-grade { border-radius: 4px; border-width: 2px; padding: 8px 10px; gap: 0; }
.pve2 .pve-grade b { font-family: var(--p2-label); font-weight: 700; font-size: 15px; letter-spacing: 0.6px; text-transform: uppercase; }
.pve2 .pve-grade em { font-style: normal; font-family: var(--p2-label); font-weight: 700; font-size: 12.5px; letter-spacing: 0.4px; }
.pve2 .pve-grade.is-regular { border-color: rgba(233,161,59,0.45); } .pve2 .pve-grade.is-regular em { color: var(--accent); }
.pve2 .pve-grade.is-premium { border-color: rgba(74,163,255,0.5); } .pve2 .pve-grade.is-premium em { color: #6cb8ff; }
.pve2 .pve-grade.is-race { border-color: rgba(255,90,74,0.55); } .pve2 .pve-grade.is-race em { color: #ff7a6b; }
.pve2 .pve-grade:not(.is-on) { opacity: 0.6; }
.pve2 .pve-grade.is-on { opacity: 1; box-shadow: 0 0 18px rgba(233,161,59,0.2); background: rgba(255,255,255,0.05); }
.pve2-go {
  position: relative; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0 14px; padding: 14px 26px; cursor: pointer;
  color: #0b0b0e; border: 0; border-radius: 4px; transform: skewX(-8deg);
  background: linear-gradient(100deg, #f7c64a, var(--accent) 55%, #e58a1f);
  box-shadow: 0 0 34px rgba(233,161,59,0.35); transition: filter 160ms, transform 120ms;
}
.pve2-go > * { transform: skewX(8deg); }
.pve2-go b { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: clamp(22px, 2.6vw, 34px); letter-spacing: 1px; text-align: center; white-space: nowrap; }
.pve2-go i { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 34px; line-height: 1; }
.pve2-go small { grid-column: 1 / -1; font-family: var(--p2-label); font-style: normal; font-weight: 700; font-size: 12px; letter-spacing: 0.8px; text-align: center; opacity: 0.75; margin: 0; }
.pve2-go:hover:not(:disabled) { filter: brightness(1.08); }
.pve2-go:active:not(:disabled) { transform: skewX(-8deg) scale(0.985); }
.pve2-go:disabled { filter: grayscale(0.8) brightness(0.6); cursor: not-allowed; box-shadow: none; }
.pve2-go.is-boss { background: linear-gradient(100deg, #ff6a7f, #ff3b5c 55%, #b3123a); color: #fff; box-shadow: 0 0 34px rgba(255,59,92,0.4); }
.pve2-go.is-nopay { filter: saturate(0.35); }
.pve2 .pve-start.is-noticket { border-radius: 4px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.pve2 .pve-nopay { border-radius: 4px; }

/* ---- TABLET: capítulos viram uma faixa; fases + painel lado a lado ---- */
@media (max-width: 1180px) {
  .pve2-cols { grid-template-columns: 240px minmax(0, 1fr); }
  .pve2 .pve-chapters { grid-column: 1 / -1; flex-direction: row; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
  .pve2 .pve-chapters::-webkit-scrollbar { display: none; }
  .pve2 .pve-chapter { flex: 1 0 150px; min-height: 68px; }
}

/* ---- TELEFONE ----
   Uma coluna, na ordem em que se decide: capítulo → fase → painel. Capítulos e fases são
   faixas que rolam de lado (com encaixe), então o painel da fase escolhida fica sempre a
   um polegar de distância. O botão de largada gruda no rodapé: é a única ação que importa
   e não pode estar a três telas de rolagem. */
@media (max-width: 760px) {
  .pve2-top { gap: 10px; margin-bottom: 10px; }
  .pve2-title b { font-size: 24px; }
  .pve2-title > i { height: 36px; }
  .pve2-howto { margin-left: auto; }
  .pve2-title { width: 100%; }
  .pve2-chips { width: 100%; flex-wrap: nowrap; gap: 6px; }
  .pve2-chip { flex: 1 1 0; min-width: 0; min-height: 48px; padding: 5px 8px 5px 6px; gap: 6px; transform: none; }
  .pve2-chip > * { transform: none; }
  .pve2-chip-ico { width: 24px; height: 24px; } .pve2-chip-ico svg { width: 20px; height: 20px; }
  .pve2-chip-txt { min-width: 0; }
  .pve2-chip-txt b { font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; }
  .pve2-chip-txt b i { display: none; }
  .pve2-chip-txt small { font-size: 9px; letter-spacing: 0.6px; overflow: hidden; text-overflow: ellipsis; }

  .pve2-cols { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .pve2 .pve-chapters { gap: 6px; scroll-snap-type: x proximity; }
  .pve2 .pve-chapter { flex: 0 0 132px; min-height: 60px; padding: 8px 10px; scroll-snap-align: start; }
  .pve2 .pve-chapter b { font-size: 12.5px; } .pve2 .pve-chapter small, .pve2 .pve-chapter em { font-size: 11px; }
  .pve2 .pve-stages { flex-direction: row; max-height: none; overflow-x: auto; overflow-y: hidden; gap: 8px; padding: 0 0 4px; scroll-snap-type: x proximity; scrollbar-width: none; }
  .pve2 .pve-stages::-webkit-scrollbar { display: none; }
  .pve2 .pve-stage, .pve2 .pve-stage.is-boss { flex: 0 0 176px; min-height: 84px; padding: 9px 74px 9px 11px; scroll-snap-align: start; }
  .pve2 .pve-stage-thumb { width: 84px; }
  .pve2 .pve-stage b { font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .pve2 .pve-stage-pay { font-size: 10.5px; }
  .pve2 .pve-stage.is-closed .pve-stage-pay { font-size: 8.5px; }

  .pve2-row, .pve2-row.is-boss, .pve2-row.is-go { grid-template-columns: minmax(0, 1fr); }
  .pve2-hero { flex-direction: column; min-height: 0; padding: 14px; gap: 12px; }
  .pve2-hero-txt > small { font-size: 14px; }
  .pve2-hero-txt > span { font-size: 15px; }
  .pve2-nums { gap: 6px; width: 100%; }
  .pve2-nums > div { flex: 1 1 0; min-width: 0; padding: 7px 9px; }
  .pve2-nums small { font-size: 9.5px; letter-spacing: 0.8px; }
  .pve2-nums b { font-size: 19px; } .pve2-nums b i { font-size: 9px; }
  .pve2-rival { align-self: stretch; min-width: 0; grid-template-columns: 56px minmax(0, 1fr); padding: 8px 10px; }
  .pve2-rival-art { width: 56px; height: 56px; }
  /* chefe: o retrato sobe para o lado do nome, sem ocupar a tela inteira */
  .pve2-hero.is-boss { flex-direction: row; align-items: flex-start; }
  .pve2-hero.is-boss .pve2-hero-txt { flex: 1 1 auto; }
  .pve2-portrait { width: 112px; margin: 0; align-self: flex-start; }
  .pve2-portrait-art { min-height: 0; height: 140px; }
  .pve2-hero.is-boss .pve2-nums > div:nth-child(3) { display: none; }
  .pve2-bossbox { grid-template-columns: auto minmax(0, 1fr); }
  .pve2-bossbox blockquote { grid-column: 1 / -1; text-align: left; font-size: 13px; }
  .pve2-bossbox p { grid-column: 1 / -1; }
  .pve2-boss-ico { grid-row: auto; width: 36px; height: 36px; }
  .pve2-boss-id b { font-size: 24px; }
  .pve2-box { padding: 12px; }
  .pve2-goals li { font-size: 15px; }
  .pve2-track { grid-template-columns: minmax(0, 1fr) 96px; }
  .pve2 .pve-racers { gap: 6px; }
  .pve2 .pve-racer { width: 80px; }
  .pve2-rewards { gap: 6px; }
  .pve2-reward { min-height: 82px; }
  .pve2-reward svg { width: 24px; height: 24px; }
  .pve2-reward b { font-size: 11.5px; } .pve2-reward small { font-size: 8.5px; letter-spacing: 0.3px; }
  .pve2 .pve-grades { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .pve2 .pve-grade { padding: 7px 6px; }
  .pve2 .pve-grade b { font-size: 12.5px; } .pve2 .pve-grade em { font-size: 10.5px; } .pve2 .pve-grade small { font-size: 9px; }
  /* o botão de largada gruda acima da faixa de avisos */
  .pve2 .pve-start { position: sticky; bottom: 84px; z-index: 8; transform: none; box-shadow: 0 10px 30px rgba(0,0,0,0.7), 0 0 30px rgba(233,161,59,0.35); }
  body.no-ticker .pve2 .pve-start { bottom: 10px; }
  .pve2-go > * { transform: none; }
  .pve2-go:active:not(:disabled) { transform: scale(0.985); }
  .pve2-go b { font-size: 22px; }
  .pve2 .pve-help-pop { left: -60px; }
  .pve2 .pve-help-pop::before { left: 64px; }
}

/* ajustes de encaixe da tela de seleção (depois de ver no preview) */
.pve2-prog span { white-space: nowrap; }
.pve2-hero { min-height: 214px; padding: 16px 20px; }
.pve2-reward b { font-size: 12.5px; white-space: normal; line-height: 1.1; }
.pve2 .pve-sec { padding: 6px 5px; }
.pve2 .pve-sec b { font-size: 9px; letter-spacing: 0; overflow: visible; text-overflow: clip; }
.pve2 .pve-racer { width: 84px; }
.pve2 .pve-rtag-help { font-size: 10px; }
.pve2-box { padding: 12px 14px; }
@media (max-width: 760px) {
  .pve2-hero { min-height: 0; padding: 14px; }
  .pve2 .pve-sec b { font-size: 8px; }
}
.pve2 .pve-stages, .pve2 .pve-chapters { position: relative; }
/* A barra de largada (combustível + botão) fica NO LUGAR dela, no fim do painel, e rola
   junto com a página. Ela chegou a ser presa ao rodapé (sticky), mas flutuando por cima
   do conteúdo enquanto se rola ela parecia solta — o fundador preferiu parada. No
   telefone o botão continua grudado (regra mais abaixo): lá o painel é longo demais. */
.pve2-chip-txt small u { text-decoration: none; }
/* A regra antiga punha o painel ANTES da lista em tela estreita (order:-1). Na tela nova
   a ordem é a de leitura: capítulos, fases, painel. */
.pve2 .pve-prep { order: 0; }
@media (max-width: 760px) {
  .pve2-chip-txt small u { display: none; }
  .pve2-nums > div:nth-child(3) { flex: 1 1 100%; }
  .pve2-nums > div:nth-child(3) b { font-size: 16px; }
  .pve2-prog b { font-size: 15px; }
}
/* Sem isto um item do grid nunca fica mais estreito que o conteúdo dele, e a faixa de
   fases (que rola por dentro) empurrava a página inteira para o lado no telefone. */
.pve2-cols > * { min-width: 0; }
.pve2 .pve-prep.pve2-panel { min-width: 0; }
@media (max-width: 760px) {
  /* A linha vira "transparente" para o layout: assim o botão passa a ser filho direto do
     painel (que é alto) e o `position: sticky` dele tem por onde grudar. Dentro de uma
     linha da própria altura, ele só grudaria quando já estivesse na tela. */
  .pve2-row.is-go { display: contents; }
}
@media (max-width: 760px) {
  /* No telefone o balão do "?" se ancora na CAIXA, de borda a borda, e não no botão: preso
     ao botão ele saía pela direita e alargava a página inteira. */
  .pve2 .pve-help { position: static; }
  .pve2 .pve-help-pop { left: 0; right: 0; top: 44px; width: auto; }
  .pve2 .pve-help-pop::before { display: none; }
}

/* O TEXTO DO BOTÃO DE LARGADA SE MEDE PELO BOTÃO, não pela janela.
   O tamanho vinha em `vw`, e a coluna do botão pode ser estreita numa janela larga —
   "START BOSS RACE" (o texto mais comprido) saía para fora. Com o botão como container,
   a letra é uma fração da largura DELE (cqw), então cabe em qualquer largura; e, se
   mesmo assim faltar espaço, o texto quebra em duas linhas em vez de vazar. */
.pve2-go { container-type: inline-size; grid-template-columns: minmax(0, 1fr) auto; overflow: hidden; }
.pve2-go b { min-width: 0; font-size: clamp(15px, 6.4cqw, 34px); white-space: normal; text-wrap: balance; line-height: 1.05; }
.pve2-go i { font-size: clamp(18px, 7cqw, 34px); }
@media (max-width: 760px) {
  .pve2-go b { font-size: clamp(15px, 6.4cqw, 26px); }
}

/* ---- ADMIN › CAREER: o fundo e a foto do rival de cada fase ---- */
.pve-art-count { font-family: var(--font-ui); font-size: 11px; letter-spacing: 1px; color: var(--text-dim); }
.pve-art-hint { margin: 0 0 12px; max-width: 900px; }
.pve-art-hint b { color: var(--text); }
.pve-art-tools {
  position: sticky; top: 0; z-index: 3; display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  padding: 10px; margin: 0 -10px 8px; border-radius: 12px; background: rgba(14,14,18,0.94); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.07);
}
.pve-art-search { flex: 1 1 260px; display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 12px; border-radius: 10px; background: rgba(0,0,0,0.35); border: 1px solid rgba(255,255,255,0.12); transition: border-color 160ms, box-shadow 160ms; }
.pve-art-search:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(233,161,59,0.18); }
.pve-art-search svg { width: 16px; height: 16px; flex: 0 0 auto; color: var(--text-dim); }
.pve-art-search input { flex: 1; min-width: 0; height: 100%; background: none; border: 0; outline: 0; color: var(--text); font-size: 14px; }
.pve-art-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pve-art-chips button { margin: 0; padding: 8px 11px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.04); color: var(--text-dim); font-size: 10.5px; font-weight: 700; letter-spacing: 0.8px; cursor: pointer; transition: all 150ms; }
.pve-art-chips button:hover { color: var(--text); border-color: rgba(255,255,255,0.3); }
.pve-art-chips button.is-on { color: #111; background: var(--accent); border-color: var(--accent); }

.pve-art-list { display: flex; flex-direction: column; gap: 8px; }
.pve-art-chapter { margin: 16px 0 4px; font-family: var(--font-display); font-style: italic; font-size: 13px; letter-spacing: 1.5px; color: var(--accent); }
.pve-art-chapter:first-child { margin-top: 6px; }
/* A faixa do capítulo: as duas figuras que valem para as dez fases de uma vez. */
.pve-art-chapter-bar {
  display: grid; grid-template-columns: minmax(0, 1fr) 150px 84px; align-items: center; gap: 14px;
  margin-top: 14px; padding: 12px; border-radius: 12px;
  border: 1px solid rgba(233,161,59,0.4); background: linear-gradient(90deg, rgba(233,161,59,0.14), rgba(233,161,59,0.03));
}
.pve-art-chapter-bar:first-child { margin-top: 4px; }
.pve-art-chapter-txt h4 { margin: 0 0 4px; font-family: var(--font-display); font-style: italic; font-size: 15px; letter-spacing: 1.5px; color: var(--accent); }
.pve-art-chapter-txt p { margin: 0; font-size: 12px; line-height: 1.45; color: var(--text-dim); max-width: 520px; }
.pve-art-chapter-txt p b { color: var(--text); }
.pve-art-img.is-plus { font-size: 30px; font-style: normal; color: rgba(233,161,59,0.7); }
.pve-art-slot.is-shared .pve-art-drop { border-style: solid; border-color: rgba(233,161,59,0.3); }
.pve-art-slot.is-shared .pve-art-img { opacity: 0.8 !important; filter: none !important; }
.pve-art-slot.is-shared small { color: rgba(233,161,59,0.75); }
.pve-art-row {
  display: grid; grid-template-columns: 44px minmax(0, 1fr) 150px 84px; align-items: center; gap: 14px;
  padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07);
  transition: border-color 160ms, background 160ms;
}
.pve-art-row:hover { border-color: rgba(255,255,255,0.18); background: rgba(255,255,255,0.05); }
.pve-art-row.is-boss { border-color: rgba(255,59,92,0.35); background: linear-gradient(90deg, rgba(255,59,92,0.08), rgba(255,255,255,0.03) 40%); }
.pve-art-num { font-family: var(--font-display); font-style: italic; font-size: 24px; color: var(--text-dim); text-align: center; }
.pve-art-who { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pve-art-who strong { font-family: var(--font-display); font-style: italic; font-size: 15px; letter-spacing: 0.6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pve-art-who strong i { margin-left: 6px; padding: 2px 6px; border-radius: 3px; background: #ff3b5c; color: #fff; font-family: var(--font-ui); font-style: normal; font-size: 9px; letter-spacing: 1px; vertical-align: middle; }
.pve-art-who span { font-size: 12px; color: var(--text-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.pve-art-slot { position: relative; display: flex; flex-direction: column; gap: 5px; }
.pve-art-slot small { font-size: 9px; font-weight: 700; letter-spacing: 1px; color: var(--text-dim); text-align: center; white-space: nowrap; }
.pve-art-slot.is-custom small { color: var(--accent); }
.pve-art-drop {
  position: relative; display: block; width: 100%; margin: 0; padding: 0; overflow: hidden; cursor: pointer;
  border-radius: 8px; border: 1px dashed rgba(255,255,255,0.22); background: #0b0b0e;
  transition: border-color 160ms, box-shadow 160ms, transform 160ms;
}
.pve-art-slot.is-stage .pve-art-drop { aspect-ratio: 16 / 9; }
.pve-art-slot.is-rival .pve-art-drop { aspect-ratio: 1 / 1; }
.pve-art-slot.is-custom .pve-art-drop { border-style: solid; border-color: rgba(233,161,59,0.6); }
.pve-art-img { position: absolute; inset: 0; background: center / cover no-repeat; }
.pve-art-slot:not(.is-custom) .pve-art-img { opacity: 0.45; filter: grayscale(0.5); }
.pve-art-img.is-empty { display: flex; align-items: center; justify-content: center; text-align: center; font-family: var(--font-display); font-style: italic; font-size: 30px; line-height: 1.1; color: rgba(255,255,255,0.35); }
.pve-art-row.is-boss .pve-art-img.is-empty { font-size: 11px; letter-spacing: 1px; }
.pve-art-over {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.62); color: #fff; font-family: var(--font-display); font-style: italic; font-size: 11px; letter-spacing: 1.5px;
  opacity: 0; transition: opacity 150ms;
}
.pve-art-drop:hover, .pve-art-drop:focus-visible { border-color: var(--accent); box-shadow: 0 0 18px rgba(233,161,59,0.3); outline: 0; }
.pve-art-drop:hover .pve-art-over, .pve-art-drop:focus-visible .pve-art-over { opacity: 1; }
.pve-art-slot.is-over .pve-art-drop { border-style: solid; border-color: #8fe3ff; box-shadow: 0 0 22px rgba(98,210,255,0.55); transform: scale(1.04); }
.pve-art-slot.is-over .pve-art-over { opacity: 1; background: rgba(20,60,90,0.75); }
.pve-art-slot.is-busy { pointer-events: none; }
.pve-art-slot.is-busy .pve-art-over { opacity: 1; animation: pve-art-busy 900ms ease-in-out infinite alternate; }
@keyframes pve-art-busy { from { background: rgba(0,0,0,0.75); } to { background: rgba(233,161,59,0.35); } }
.pve-art-x {
  position: absolute; top: -7px; right: -7px; z-index: 2; width: 22px; height: 22px; margin: 0; padding: 0; border-radius: 50%; cursor: pointer;
  border: 1px solid rgba(255,255,255,0.3); background: #1a1a20; color: #fff; font-size: 14px; line-height: 1;
  transition: background 150ms, transform 150ms;
}
.pve-art-x:hover { background: #ff3b5c; transform: scale(1.12); }
.pve-art-none { padding: 22px 0; text-align: center; }
.pve-art-clear { background: none; border: 0; padding: 0; color: var(--accent); text-decoration: underline; cursor: pointer; font: inherit; }
@media (max-width: 720px) {
  .pve-art-chapter-bar { grid-template-columns: minmax(0, 1fr) 76px; grid-template-areas: "txt txt" "stage rival"; gap: 10px; }
  .pve-art-chapter-txt { grid-area: txt; }
  .pve-art-chapter-bar .is-stage { grid-area: stage; }
  .pve-art-chapter-bar .is-rival { grid-area: rival; align-self: start; }
  .pve-art-row { grid-template-columns: 34px minmax(0, 1fr) 76px; grid-template-areas: "n who who" "stage stage rival"; gap: 10px; }
  .pve-art-num { grid-area: n; font-size: 20px; }
  .pve-art-who { grid-area: who; }
  .pve-art-slot.is-stage { grid-area: stage; }
  .pve-art-slot.is-rival { grid-area: rival; align-self: start; }
}

/* ---- PRÊMIO EM ETH: o bilhete na caixa, a raspadinha e a faixa da carreira ---- */
.pve-open-items .is-eth { border-color: rgba(98,210,255,0.6); box-shadow: 0 0 26px rgba(98,210,255,0.35); }
.pve-open-items .is-eth b { color: #8fe3ff; letter-spacing: 1.5px; }

.pve-eth {
  position: fixed; inset: 0; z-index: 210; display: flex; align-items: center; justify-content: center; padding: 18px;
  background: radial-gradient(ellipse at center, #10283c, #04050a 70%);
  opacity: 0; transition: opacity 240ms;
}
.pve-eth.is-in { opacity: 1; }
.pve-eth-card { width: min(100%, 460px); display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.pve-eth-k { font-family: var(--font-display); font-style: italic; font-size: 12px; letter-spacing: 3px; color: #8fe3ff; }
.pve-eth-ticket {
  position: relative; width: 100%; aspect-ratio: 56 / 26; border-radius: 12px; overflow: hidden;
  border: 1px solid rgba(143,227,255,0.55); box-shadow: 0 0 46px rgba(98,210,255,0.3), inset 0 0 40px rgba(98,210,255,0.12);
  background: linear-gradient(135deg, #0d1b2a, #132c44 55%, #0b1420);
}
.pve-eth-under { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.pve-eth-under em { font-family: var(--font-ui); font-style: normal; font-weight: 700; font-size: 12px; letter-spacing: 4px; color: rgba(255,255,255,0.7); }
.pve-eth-under b { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: clamp(30px, 9vw, 46px); line-height: 1; color: #fff; text-shadow: 0 0 22px rgba(98,210,255,0.8); }
.pve-eth-under b i { font-size: 0.5em; color: #8fe3ff; }
.pve-eth-under code { margin-top: 6px; padding: 5px 12px; border-radius: 6px; background: rgba(0,0,0,0.45); border: 1px dashed rgba(143,227,255,0.5); font-family: ui-monospace, Menlo, monospace; font-size: 16px; letter-spacing: 2px; color: #dff6ff; user-select: all; }
.pve-eth-foil { position: absolute; inset: 0; width: 100%; height: 100%; cursor: grab; touch-action: none; transition: opacity 500ms; }
.pve-eth.is-open .pve-eth-foil { opacity: 0; pointer-events: none; }
.pve-eth.is-pop .pve-eth-ticket { animation: pve-eth-pop 620ms cubic-bezier(.2,1.4,.4,1); }
@keyframes pve-eth-pop { 0% { transform: scale(1); } 35% { transform: scale(1.06); box-shadow: 0 0 90px rgba(98,210,255,0.8); } 100% { transform: scale(1); } }
.pve-eth-hint { margin: 0; font-family: var(--font-ui); font-size: 13px; letter-spacing: 1px; color: var(--text-dim); }
.pve-eth.is-open .pve-eth-hint, .pve-eth.is-open .pve-eth-skip { display: none; }
.pve-eth-after { display: none; flex-direction: column; gap: 10px; }
.pve-eth.is-open .pve-eth-after { display: flex; animation: pve-eth-in 360ms 200ms both; }
@keyframes pve-eth-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.pve-eth-after p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--text); }
.pve-eth-after .pve-eth-dim { font-size: 12.5px; color: var(--text-dim); }
.pve-eth-after .pve-eth-paid { color: #7be0a0; font-weight: 700; }
.pve-eth-acts { display: flex; gap: 10px; justify-content: center; margin-top: 4px; }
.pve-eth-acts button { margin: 0; min-height: 44px; padding: 0 22px; font-family: var(--font-display); font-style: italic; letter-spacing: 1.5px; font-size: 12px; }
.pve-eth-skip { background: none; border: 0; padding: 6px 10px; color: var(--text-dim); font-size: 12px; text-decoration: underline; cursor: pointer; }

.pve-eth-strip { display: flex; flex-direction: column; gap: 8px; margin: 0 0 12px; }
.pve-eth-row {
  display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 14px; border-radius: 8px; cursor: pointer; text-align: left;
  border: 1px solid rgba(143,227,255,0.5); background: linear-gradient(90deg, rgba(98,210,255,0.16), rgba(98,210,255,0.04)); color: var(--text);
}
.pve-eth-row:hover { border-color: #8fe3ff; }
.pve-eth-gem { color: #8fe3ff; }
.pve-eth-row b { font-family: var(--font-display); font-style: italic; font-size: 15px; white-space: nowrap; }
.pve-eth-row code { font-family: ui-monospace, Menlo, monospace; font-size: 13px; letter-spacing: 1px; color: #dff6ff; white-space: nowrap; }
.pve-eth-row em { flex: 1; min-width: 0; font-family: var(--font-ui); font-style: normal; font-weight: 700; font-size: 11px; letter-spacing: 1px; color: #8fe3ff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pve-eth-row i { font-family: var(--font-ui); font-style: normal; font-weight: 700; font-size: 11px; letter-spacing: 1px; color: var(--text-dim); }
.pve-eth-row.is-paid { border-color: rgba(123,224,160,0.4); background: rgba(123,224,160,0.07); }
.pve-eth-row.is-paid em, .pve-eth-row.is-paid .pve-eth-gem { color: #7be0a0; }
@media (max-width: 640px) {
  .pve-eth-row { flex-wrap: wrap; gap: 6px 10px; }
  .pve-eth-row em { flex: 1 0 100%; order: 5; white-space: normal; }
  .pve-eth-row i { margin-left: auto; }
}

/* ---- ADMIN › CAREER: o prêmio em ETH ---- */
.pve-ethadm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 6px 0 18px; }
.pve-ethadm-stats > div {
  position: relative; padding: 12px 14px; border-radius: 10px; overflow: hidden;
  background: linear-gradient(160deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02)); border: 1px solid rgba(255,255,255,0.08);
  transition: transform 180ms, border-color 180ms, box-shadow 180ms;
}
.pve-ethadm-stats > div:hover { transform: translateY(-2px); border-color: rgba(143,227,255,0.45); box-shadow: 0 8px 24px rgba(0,0,0,0.35); }
.pve-ethadm-stats small { display: block; margin-bottom: 4px; font-size: 10px; letter-spacing: 1.1px; color: var(--text-dim); font-weight: 700; }
.pve-ethadm-stats b { display: flex; align-items: baseline; gap: 6px; font-family: var(--font-display); font-style: italic; font-size: 20px; }
.pve-ethadm-stats b em { font-size: 12px; color: var(--text-dim); font-style: italic; }
.pve-ethadm-dot { width: 9px; height: 9px; border-radius: 50%; background: #6b7080; align-self: center; }
.pve-ethadm-stats .is-status.is-on { border-color: rgba(123,224,160,0.5); background: linear-gradient(160deg, rgba(123,224,160,0.16), rgba(123,224,160,0.03)); }
.pve-ethadm-stats .is-status.is-on b { color: #7be0a0; }
.pve-ethadm-stats .is-status.is-on .pve-ethadm-dot { background: #7be0a0; animation: pve-ethadm-pulse 1.8s infinite; }
@keyframes pve-ethadm-pulse { 0% { box-shadow: 0 0 0 0 rgba(123,224,160,0.6); } 100% { box-shadow: 0 0 0 10px rgba(123,224,160,0); } }
.pve-ethadm-stats .is-due { border-color: rgba(245,196,81,0.5); }
.pve-ethadm-stats .is-due b { color: #f5c451; }
.pve-ethadm-bar { display: block; height: 4px; margin-top: 8px; border-radius: 4px; background: rgba(255,255,255,0.08); overflow: hidden; }
.pve-ethadm-bar i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, #62d2ff, #8fe3ff); transition: width 500ms; }

.pve-ethadm-forms { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
.pve-ethadm-form {
  padding: 16px; border-radius: 12px; display: flex; flex-direction: column; gap: 12px;
  background: rgba(255,255,255,0.025); border: 1px solid rgba(255,255,255,0.08); transition: border-color 200ms;
}
.pve-ethadm-form:focus-within { border-color: rgba(233,161,59,0.45); }
.pve-ethadm-form h4 { margin: 0 0 2px; display: flex; align-items: center; gap: 8px; font-family: var(--font-ui); font-size: 12px; letter-spacing: 1.4px; color: var(--text); }
.pve-ethadm-form h4 span { font-family: var(--font-display); font-style: italic; color: var(--accent); }
.pve-ethadm-form p { margin: 0; font-size: 12px; line-height: 1.45; color: var(--text-dim); }
.pve-ethadm-form p b { color: var(--text); }

.pve-ethadm-switch { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; background: rgba(0,0,0,0.25); cursor: pointer; }
.pve-ethadm-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pve-ethadm-track { flex: 0 0 auto; width: 46px; height: 26px; border-radius: 26px; padding: 3px; background: rgba(255,255,255,0.12); transition: background 220ms, box-shadow 220ms; }
.pve-ethadm-track i { display: block; width: 20px; height: 20px; border-radius: 50%; background: #c9cede; transition: transform 220ms cubic-bezier(.3,1.5,.5,1), background 220ms; }
.pve-ethadm-switch input:checked + .pve-ethadm-track { background: #2f9e62; box-shadow: 0 0 16px rgba(123,224,160,0.45); }
.pve-ethadm-switch input:checked + .pve-ethadm-track i { transform: translateX(20px); background: #fff; }
.pve-ethadm-switch input:focus-visible + .pve-ethadm-track { outline: 2px solid var(--accent); outline-offset: 2px; }
.pve-ethadm-switch-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pve-ethadm-switch-txt b { font-size: 14px; color: var(--text); }
.pve-ethadm-switch-txt small { font-size: 11.5px; color: var(--text-dim); }

.pve-ethadm-field { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--text-dim); }
.pve-ethadm-input { display: flex; align-items: center; width: 150px; border-radius: 9px; background: rgba(0,0,0,0.35); border: 1px solid rgba(255,255,255,0.12); transition: border-color 160ms, box-shadow 160ms; }
.pve-ethadm-input:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(233,161,59,0.18); }
.pve-ethadm-input input { flex: 1; min-width: 0; height: 40px; padding: 0 0 0 12px; background: none; border: 0; outline: 0; color: var(--text); font-family: var(--font-display); font-style: italic; font-size: 15px; }
.pve-ethadm-input em { padding: 0 12px 0 6px; font-style: normal; font-weight: 700; font-size: 11px; letter-spacing: 1px; color: var(--text-dim); }
.pve-ethadm-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pve-ethadm-chips button { margin: 0; padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.04); color: var(--text-dim); font-size: 11px; font-weight: 700; cursor: pointer; transition: all 150ms; }
.pve-ethadm-chips button:hover { color: var(--text); border-color: rgba(255,255,255,0.3); }
.pve-ethadm-chips button.is-on { color: #111; background: var(--accent); border-color: var(--accent); }
.pve-ethadm-preview { padding: 12px; border-radius: 10px; text-align: center; border: 1px dashed rgba(255,255,255,0.14); transition: border-color 200ms, background 200ms, box-shadow 200ms; }
.pve-ethadm-preview small { display: block; font-size: 10px; letter-spacing: 1.2px; font-weight: 700; color: var(--text-dim); }
.pve-ethadm-preview b { font-family: var(--font-display); font-style: italic; font-size: 22px; color: var(--text-dim); }
.pve-ethadm-preview.is-set { border-style: solid; border-color: rgba(143,227,255,0.6); background: rgba(98,210,255,0.08); box-shadow: 0 0 24px rgba(98,210,255,0.18); }
.pve-ethadm-preview.is-set b { color: #dff6ff; text-shadow: 0 0 14px rgba(98,210,255,0.6); }
.pve-ethadm-btn {
  margin: auto 0 0; min-height: 44px; border-radius: 10px; cursor: pointer;
  border: 1px solid rgba(255,255,255,0.16); background: rgba(255,255,255,0.05); color: var(--text);
  font-family: var(--font-display); font-style: italic; font-size: 12px; letter-spacing: 1.6px;
  transition: transform 140ms, border-color 160ms, box-shadow 160ms, background 160ms;
}
.pve-ethadm-btn:hover { border-color: var(--accent); box-shadow: 0 0 18px rgba(233,161,59,0.25); transform: translateY(-1px); }
.pve-ethadm-btn:active { transform: translateY(0) scale(0.99); }
.pve-ethadm-btn.is-main { border-color: transparent; color: #14110a; background: linear-gradient(100deg, #ffd27a, var(--accent)); }
.pve-ethadm-btn.is-main:hover { box-shadow: 0 0 26px rgba(233,161,59,0.5); }
@media (prefers-reduced-motion: reduce) { .pve-ethadm-dot { animation: none !important; } }
.pve-ethadm-list { margin-top: 18px; }
.pve-ethadm-list-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.pve-ethadm-list-head h4 { margin: 0; font-family: var(--font-ui); font-size: 11px; letter-spacing: 1.2px; color: var(--accent); }
.pve-ethadm-scroll { overflow-x: auto; }
.pve-ethadm-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.pve-ethadm-table th { text-align: left; font-size: 10px; letter-spacing: 1px; color: var(--text-dim); padding: 6px 8px; white-space: nowrap; }
.pve-ethadm-table td { padding: 8px; border-top: 1px solid rgba(255,255,255,0.07); white-space: nowrap; vertical-align: middle; }
.pve-ethadm-table code { font-family: ui-monospace, Menlo, monospace; font-size: 12px; user-select: all; }
.pve-ethadm-table .is-pending { color: #f5c451; font-weight: 700; }
.pve-ethadm-table .is-paid { color: #7be0a0; font-weight: 700; }
.pve-ethadm-table button { margin: 0; min-height: 30px; padding: 0 10px; font-size: 10px; letter-spacing: 1px; }