/* [1.5.911] Primitivas partilhadas do desenho novo do painel do artista (prefixo vx-).
   Dono: fundação (F0). As outras folhas usam estas classes e nunca as redefinem. Tudo dentro de #rmbz-vip.
   Bolacha, curvas e keyframes copiados do protótipo do titular (handoff do site, spec §2, §5, §6, §7). */

/* ── Raiz: forma da bolacha, curvas e multiplicador de tempo; transição do fundo ao trocar de tema ── */
#rmbz-vip{
  --cookie:polygon(100.0% 50.0%,98.1% 54.2%,93.3% 57.6%,88.4% 60.3%,85.7% 63.0%,86.0% 66.8%,88.1% 72.0%,89.5% 77.7%,88.3% 82.1%,84.1% 84.1%,78.3% 83.7%,72.8% 82.6%,69.0% 82.9%,66.8% 86.0%,65.0% 91.3%,62.5% 96.6%,58.7% 99.2%,54.2% 98.1%,50.0% 94.0%,46.5% 89.6%,43.4% 87.4%,39.7% 88.4%,35.0% 91.3%,29.6% 93.7%,25.0% 93.3%,22.3% 89.5%,21.7% 83.7%,21.9% 78.1%,20.9% 74.4%,17.4% 72.8%,11.9% 72.0%,6.3% 70.4%,3.0% 67.1%,3.4% 62.5%,6.7% 57.6%,10.4% 53.5%,12.0% 50.0%,10.4% 46.5%,6.7% 42.4%,3.4% 37.5%,3.0% 32.9%,6.3% 29.6%,11.9% 28.0%,17.4% 27.2%,20.9% 25.6%,21.9% 21.9%,21.7% 16.3%,22.3% 10.5%,25.0% 6.7%,29.6% 6.3%,35.0% 8.7%,39.7% 11.6%,43.4% 12.6%,46.5% 10.4%,50.0% 6.0%,54.2% 1.9%,58.7% 0.8%,62.5% 3.4%,65.0% 8.7%,66.8% 14.0%,69.0% 17.1%,72.8% 17.4%,78.3% 16.3%,84.1% 15.9%,88.3% 17.9%,89.5% 22.3%,88.1% 28.0%,86.0% 33.2%,85.7% 37.0%,88.4% 39.7%,93.3% 42.4%,98.1% 45.8%);
  --k:1;
  --spring-fast:cubic-bezier(.42,1.67,.21,.9);
  --spring:cubic-bezier(.38,1.21,.22,1);
  --spring-slow:cubic-bezier(.39,1.29,.35,.98);
  --ease-effect:cubic-bezier(.34,.8,.34,1);
  transition:background-color calc(300ms*var(--k)) var(--ease-effect);
}

/* ── Keyframes (spec §6.1, com o prefixo vx-) ── */
@keyframes vx-spin{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
@keyframes vx-breathe{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.06); } }
@keyframes vx-live{ 0%,100%{ opacity:1; transform:scale(1); } 50%{ opacity:.35; transform:scale(.8); } }
/* a/b: cópias iguais; trocar o nome reinicia a animação uma vez a cada mudança de estado. */
@keyframes vx-pop-a{ 0%{ transform:scale(.4) rotate(-30deg); opacity:0; } 100%{ transform:none; opacity:1; } }
@keyframes vx-pop-b{ 0%{ transform:scale(.4) rotate(-30deg); opacity:0; } 100%{ transform:none; opacity:1; } }
@keyframes vx-sheen-a{ 0%{ transform:translateX(-120%) skewX(-18deg); } 100%{ transform:translateX(420%) skewX(-18deg); } }
@keyframes vx-sheen-b{ 0%{ transform:translateX(-120%) skewX(-18deg); } 100%{ transform:translateX(420%) skewX(-18deg); } }
@keyframes vx-ring{ 0%{ box-shadow:0 0 0 2px var(--bg),0 0 0 2px rgba(196,45,53,.35); } 100%{ box-shadow:0 0 0 2px var(--bg),0 0 0 7px rgba(196,45,53,0); } }
@keyframes vx-msg{ 0%{ opacity:0; transform:translateY(8px) scale(.96); } 100%{ opacity:1; transform:none; } }
@keyframes vx-morph{ 0%{ border-radius:30%; transform:rotate(0) scale(1); } 25%{ border-radius:50% 20% 50% 20%; transform:rotate(90deg) scale(.85); } 50%{ border-radius:50%; transform:rotate(180deg) scale(1); } 75%{ border-radius:20% 50% 20% 50%; transform:rotate(270deg) scale(.85); } 100%{ border-radius:30%; transform:rotate(360deg) scale(1); } }
@keyframes vx-rise{ 0%{ opacity:0; transform:translateY(14px); } 100%{ opacity:1; transform:none; } }
@keyframes vx-grow{ 0%{ transform:scaleX(0); } 100%{ transform:scaleX(1); } }

/* ── Tons: --tone (preenchimento), --tone-soft (fundo), --tone-ink (texto), --tone-on (conteúdo sobre a cor) ── */
#rmbz-vip .vx-t-brand{ --tone:var(--brand); --tone-soft:var(--brand-soft); --tone-ink:var(--brand-ink); --tone-on:var(--on-brand); }
#rmbz-vip .vx-t-success{ --tone:var(--success); --tone-soft:var(--success-soft); --tone-ink:var(--success-ink); --tone-on:#FFFFFF; }
#rmbz-vip .vx-t-info{ --tone:var(--info); --tone-soft:var(--info-soft); --tone-ink:var(--info-ink); --tone-on:#FFFFFF; }
#rmbz-vip .vx-t-warning{ --tone:var(--warning); --tone-soft:var(--warning-soft); --tone-ink:var(--warning-ink); --tone-on:#FFFFFF; }
#rmbz-vip .vx-t-danger{ --tone:var(--danger); --tone-soft:var(--danger-soft); --tone-ink:var(--danger-ink); --tone-on:#FFFFFF; }
#rmbz-vip .vx-t-neutral{ --tone:var(--muted); --tone-soft:var(--elev); --tone-ink:var(--text2); --tone-on:#FFFFFF; }
/* [1.5.915] Violeta: segunda cor das divisões por categoria (vistorias da equipa em «O que estás a pagar»). */
#rmbz-vip .vx-t-violet{ --tone:#7A4FD6; --tone-soft:rgba(122,79,214,.12); --tone-ink:#5B36B0; --tone-on:#FFFFFF; }
#rmbz-vip[data-theme="oled"] .vx-t-violet{ --tone:#A58BFF; --tone-soft:rgba(165,139,255,.16); --tone-ink:#B9A4FF; --tone-on:#16092E; }

/* ── Bolacha: só a camada de fundo roda; o conteúdo (ícone, iniciais, imagem) fica parado ──
   <span class="vx-cookie vx-t-info" style="--s:56px;--spin:12s">
     <span class="vx-cookie__bg" aria-hidden="true"></span>
     <span class="vx-cookie__fg vx-breathe"><span class="ms vx-fill" aria-hidden="true">videocam</span></span>
   </span> */
#rmbz-vip .vx-cookie{ position:relative; width:var(--s,48px); height:var(--s,48px); display:inline-flex; align-items:center; justify-content:center; flex:none; color:var(--tone-on,#FFFFFF); }
#rmbz-vip .vx-cookie__bg{ position:absolute; inset:0; background:var(--cookie-c,var(--tone,var(--brand))); clip-path:var(--cookie); animation:vx-spin calc(var(--spin,14s)*var(--k)) linear infinite var(--spin-dir,normal); will-change:transform; }
#rmbz-vip .vx-cookie--still .vx-cookie__bg{ animation:none; }
#rmbz-vip .vx-cookie__fg{ position:relative; display:flex; align-items:center; justify-content:center; }
#rmbz-vip .vx-cookie__img{ position:absolute; inset:4px; width:calc(100% - 8px); height:calc(100% - 8px); border-radius:50%; object-fit:cover; display:block; }
/* Bolacha decorativa de fundo (posição por style). */
#rmbz-vip .vx-deco{ position:absolute; pointer-events:none; width:var(--s,160px); height:var(--s,160px); background:var(--cookie-c,var(--tone,var(--brand))); opacity:var(--o,.12); clip-path:var(--cookie); animation:vx-spin calc(var(--spin,24s)*var(--k)) linear infinite var(--spin-dir,normal); will-change:transform; }

/* ── Respirar, ícone cheio, entradas, pops ── */
#rmbz-vip .vx-breathe{ animation:vx-breathe calc(var(--breathe,2.4s)*var(--k)) ease-in-out infinite; }
#rmbz-vip .vx-fill{ font-variation-settings:'FILL' 1; }
#rmbz-vip .vx-rise{ animation:vx-rise calc(500ms*var(--k)) var(--spring) var(--d,0ms) backwards; }
#rmbz-vip .vx-grow{ transform-origin:left center; animation:vx-grow calc(700ms*var(--k)) var(--spring-slow) var(--d,0ms) both; }
#rmbz-vip .vx-pop-a{ animation:vx-pop-a calc(var(--pop,550ms)*var(--k)) var(--pop-ease,var(--spring)) both; }
#rmbz-vip .vx-pop-b{ animation:vx-pop-b calc(var(--pop,550ms)*var(--k)) var(--pop-ease,var(--spring)) both; }

/* ── Brilho (spec §6.4): faixa dentro de um contentor com overflow:hidden ── */
#rmbz-vip .vx-sheen{ position:absolute; top:0; bottom:0; left:0; width:24%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent); transform:translateX(-120%); pointer-events:none; }
#rmbz-vip .vx-sheen.is-run-a{ animation:vx-sheen-a calc(1400ms*var(--k)) var(--ease-effect) 400ms 1 both; }
#rmbz-vip .vx-sheen.is-run-b{ animation:vx-sheen-b calc(1400ms*var(--k)) var(--ease-effect) 400ms 1 both; }

/* ── Pontos «a escrever», botão a carregar, anel do contador, ponto ao vivo ── */
#rmbz-vip .vx-dots{ display:inline-flex; align-items:center; gap:4px; color:var(--text2); }
#rmbz-vip .vx-dots i{ display:block; width:7px; height:7px; border-radius:50%; background:currentColor; animation:vx-live calc(1s*var(--k)) ease-in-out infinite; }
#rmbz-vip .vx-dots i:nth-child(2){ animation-delay:.15s; }
#rmbz-vip .vx-dots i:nth-child(3){ animation-delay:.3s; }
#rmbz-vip .vx-morph{ display:block; width:24px; height:24px; border-radius:30%; background:var(--on-brand); animation:vx-morph calc(1100ms*var(--k)) linear infinite; }
#rmbz-vip .vx-ring{ box-shadow:0 0 0 2px var(--bg); animation:vx-ring calc(1800ms*var(--k)) ease-out infinite; }
#rmbz-vip .vx-live-dot{ display:inline-block; flex:none; width:var(--dot,8px); height:var(--dot,8px); border-radius:50%; background:var(--tone,currentColor); animation:vx-live calc(1s*var(--k)) ease-in-out infinite; }

/* ── Texto só para leitores de ecrã ── */
#rmbz-vip .vx-sr{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ── Pausa das animações de um bloco fora do ecrã (IntersectionObserver põe/tira .vx-paused) ── */
#rmbz-vip .vx-paused .vx-cookie__bg,
#rmbz-vip .vx-paused .vx-deco,
#rmbz-vip .vx-paused .vx-breathe,
#rmbz-vip .vx-paused.vx-deco{ animation-play-state:paused; }

/* ── Zona do desenho novo: foco visível e [hidden] sempre escondido ── */
#rmbz-vip .vx-scope :focus-visible{ outline:2px solid var(--brand); outline-offset:2px; }
#rmbz-vip .vx-scope [hidden]{ display:none !important; }

/* ── Pausa por trás do ecrã de carregamento: as entradas, os pops e o brilho só começam quando ele sai ── */
html.rmbz-vip-loading #rmbz-vip .vx-scope,
html.rmbz-vip-loading #rmbz-vip .vx-scope *{ animation-play-state:paused !important; }

/* ── Movimento reduzido (sistema ou data-motion="reduce" na pré-visualização). Anula também os atrasos das
   entradas, para não ficarem cartões invisíveis. Os relógios continuam a contar (são dados, não animação). ── */
@media (prefers-reduced-motion: reduce){
  #rmbz-vip, #rmbz-vip .vx-scope, #rmbz-vip .vx-scope *{ transition-duration:1ms !important; transition-delay:0s !important; animation-duration:1ms !important; animation-iteration-count:1 !important; animation-delay:0s !important; scroll-behavior:auto !important; }
}
#rmbz-vip[data-motion="reduce"], #rmbz-vip[data-motion="reduce"] .vx-scope, #rmbz-vip[data-motion="reduce"] .vx-scope *{ transition-duration:1ms !important; transition-delay:0s !important; animation-duration:1ms !important; animation-iteration-count:1 !important; animation-delay:0s !important; scroll-behavior:auto !important; }