/* PELE v3 (08/08): as regras de hero, semana, abas, restrição e popup
   MORRERAM aqui — moram em css/ficha_v3.css (porte da entrega do Design).
   Este arquivo segue dono da LISTA DE EXERCÍCIOS (rodada 2) e do que
   a pele não cobre: painéis, séries, timer, config, splash. */

:root{
  --topo-seguro:calc(env(safe-area-inset-top, 0px) + 32px); /* regra topo-seguro 27/09 */
  --bg:#252422; --bg2:#2E2C29; --bg3:#333129; --bg4:#1C1B18; --bg5:#3A3830;
  --gold:#C9963A; --gold2:#B8832A; --gold3:#9A6C1E; --gold4:#E2B45A; --gold5:#F0CC80;
  --bronze:#8B6332; --bronze2:#7A5425; --bronze3:#A07840;
  --text:#F0EBE0; --text2:#C8BFB0; --text3:#7A7060; --text4:#4A4438;
  --line:rgba(201,150,58,0.2); --line2:rgba(201,150,58,0.12);
  --green:#4CAF50; --green2:#2E7D32;
}





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





/* Regra defensiva final — oculta qualquer FAB antigo de calendário que
   ainda seja criado por cache de JS desatualizado (calUiFab e agFab
   removidos do código-fonte, mas dispositivos podem servir versões antigas). */
#calUiFab,.cal-ui-fab,.calendar-fab,#agFab,.ag-fab{display:none!important;visibility:hidden!important;pointer-events:none!important;}





/* Achado do dono, 25/08: fundo BRANCO aparecendo embaixo e na lateral ao
   dar scroll, no iPhone. A cor de fundo só estava no `body` — no bounce do
   iOS (chegar no fim do scroll e continuar arrastando, ou o scroll lateral
   de sobra) é o `<html>` que aparece por baixo, e sem `background` nele o
   navegador pinta branco por padrão. `overflow-x:hidden` também precisa
   estar aqui: o `body` já tinha, mas no iOS quem rola de verdade é o
   documento (`html`), não o `body` — só no `body` não bastava para travar
   o arrasto lateral. */
html{scroll-behavior:smooth;background:var(--bg);overflow-x:hidden}





body{background:var(--bg);color:var(--text);font-family:'Jost',sans-serif;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;}





body::before{content:'';position:fixed;inset:0;background:radial-gradient(ellipse 80% 50% at 50% -10%,rgba(201,150,58,0.04),transparent 60%);pointer-events:none;z-index:0;}





.wrap{position:relative;z-index:1;max-width:720px;margin:0 auto;padding:0 20px 80px}





header::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:60px;height:3px;background:linear-gradient(90deg,transparent,var(--gold),transparent);}





.monogram-svg{display:block;filter:drop-shadow(0 4px 16px rgba(0,0,0,0.6))}





.brand-name{font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:400;font-style:italic;letter-spacing:4px;text-transform:uppercase;color:var(--gold4);margin-bottom:3px;}





.brand-role{font-size:9px;font-weight:600;letter-spacing:4px;text-transform:uppercase;color:var(--text3);}





.brand-slogan{font-size:8px;font-weight:400;letter-spacing:3px;text-transform:uppercase;color:var(--text4);font-style:italic;margin-top:2px;}





.meta-pill{border-radius:4px;padding:5px 14px;font-size:10px;font-weight:500;letter-spacing:1.5px;text-transform:uppercase;}





.pill-gold{background:rgba(201,150,58,0.15);border:1px solid rgba(201,150,58,0.4);color:var(--gold4);}





.pill-dark{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);color:var(--text2);}






/* ─── PANEL ── */
.panel{display:none}




.panel.active{display:block}




.panel.hidden-panel{display:none!important}






/* ─── INSTAGRAM ── */
.insta-wrap{margin-top:32px;background:var(--bg4);border:1px solid var(--line);border-radius:12px;padding:14px 20px;display:flex;align-items:center;gap:14px;}





.insta-label{font-size:8px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--text3);margin-bottom:2px;}





.insta-handle{font-family:'Cormorant Garamond',serif;font-size:17px;font-weight:400;font-style:italic;color:var(--gold4);letter-spacing:1px;}






/* ─── FOOTER ── */
footer{margin-top:28px;display:flex;flex-direction:column;align-items:center;gap:6px;border-top:1px solid var(--line2);padding-top:28px;}





.footer-orn{display:flex;align-items:center;gap:10px;margin-bottom:6px;}





.footer-orn-line{height:1px;width:32px;background:var(--line);}





.footer-orn-diamond{width:6px;height:6px;background:var(--gold);transform:rotate(45deg);opacity:0.7;}





.footer-name{font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:400;font-style:italic;color:var(--gold4);letter-spacing:1px;}





.footer-role{font-size:9px;font-weight:600;letter-spacing:4px;text-transform:uppercase;color:var(--text3);}





.footer-slogan{font-size:9px;font-weight:400;letter-spacing:3px;text-transform:uppercase;color:var(--text4);font-style:italic;margin-top:4px;}






/* ─── ANIMAÇÕES ── */
@keyframes riseUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}





.cal-future-notice{
  grid-column:1/-1;text-align:center;font-size:11px;
  color:var(--text4);padding:4px 0 6px;letter-spacing:0.3px;
}





.cal-detail-item{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;
  background:var(--bg4);border-radius:8px;
  border-left:3px solid var(--gold3);
}





.cal-detail-item.cardio-item{border-left-color:#4CAF50;}





.cal-detail-item.rest-item{border-left-color:rgba(255,255,255,0.2);}





.cal-detail-icon{font-size:18px;line-height:1;flex-shrink:0;}





.cal-detail-text{}





.cal-detail-title{
  font-size:12px;font-weight:600;color:var(--text);
  letter-spacing:0.5px;
}





.cal-detail-sub{
  font-size:10px;color:var(--text3);margin-top:2px;
  letter-spacing:0.5px;
}







/* ─── AVALIAÇÃO FÍSICA ──────────────────────────────
   O CSS legado desta seção foi REMOVIDO (2026-07-16). A ficha de avaliação
   (M2: etapas + comparativo ao vivo) vive dentro do hub de Avaliações e tem
   estilo próprio em js/financial/ui/assessmentBundle.js (_injectCSS, escopo
   #asmOverlay) + js/avaliacao.js (bloco aval-import-style).
   ─────────────────────────────────────────────────── */

/* ─── PAINEL DE CONFIGURAÇÃO (só personal) — REMOVIDO 30/08 (C-415) ──
   Todo o bloco .config-toggle, .config-overlay, .config-panel, .config-opt,
   .config-div-x, .config-apply, .config-version-x, .config-update-btn era
   CSS do painel de Objetivo/Nível/Divisão (config-overlay em index.html),
   removido no mesmo commit por não ter mais HTML nenhum que o use — ver o
   comentário que ficou no lugar dele em index.html. */

/* ===== RN Personal · abertura v2 · T3 «A jóia na caixa» · lapidação final · porte 21/09/2026 (noite) =====
   Cópia literal de docs/abertura_v2-CSS-joia-lapidacao.html (bloco <style id="rn-splash-css">,
   prancha do Jean Claude + correção do brilho: luz difusa externa ZERO, flash emana das letras,
   aprovada por Raphael 21/09 à noite). T_SAIDA no index.html: completa 3100 · curta 600 · reduzida 400. */
.rn-splash{position:fixed;inset:0;z-index:9999;background:#0a0806;overflow:hidden;
  --curva:cubic-bezier(.23,1,.32,1);--t0:0ms;
  --dx:0px;--dy:0px;--escala:1;--wm-dx:0px;--wm-dy:0px;--bloom-dy:0px;--luz-fim:0;--roxo-fim:0;
  transition:opacity 300ms ease}
.rn-splash.hidden{opacity:0;pointer-events:none}
.rn-splash:not(.rodando) *{animation-play-state:paused}   /* o JS liga .rodando no 2º rAF */
.rn-splash.saida-dourada{--roxo-fim:0;--luz-fim:0}
/* ---- os céus: chave dourada baixa à direita, contraluz roxo raso à esquerda. Camada de fora =
   intensidade final (transição na saída) + DERIVA subliminar (7px/16s, cinema — o ar da sala);
   camada de dentro = acende (keyframes). As máscaras são EXTENSÃO (geometria estática) —
   a intensidade segue sendo contrato com a Home via K. ---- */
.rn-splash-ceu,.rn-splash-ceu > div,.rn-splash-ceu > div > div{position:absolute;inset:0;pointer-events:none}
.rn-ceu-roxo,.rn-ceu-ouro{opacity:1;transition:opacity 900ms var(--curva);
  animation:rn-splash-deriva 16s ease-in-out calc(var(--t0) + 1200ms) infinite alternate}
.rn-ceu-ouro{animation-duration:19s;animation-delay:calc(var(--t0) + 1600ms)}   /* dessincronizados: nunca respiram juntos */
.rn-ceu-roxo > div{opacity:0;
  background:linear-gradient(166deg,rgba(157,92,255,.288) 0,rgba(155,84,200,.288) 11%,rgba(155,82,149,.234) 18%,rgba(186,108,115,.216) 23%,rgba(186,108,115,0) 30%);
  -webkit-mask-image:linear-gradient(96deg,#000 26%,rgba(0,0,0,.2) 66%,transparent 94%);
  mask-image:linear-gradient(96deg,#000 26%,rgba(0,0,0,.2) 66%,transparent 94%);
  animation:rn-splash-acende 620ms var(--curva) calc(var(--t0) + 1160ms) both}
.rn-ceu-ouro > div{opacity:.12;
  background:
    radial-gradient(48% 30% at 72% 104%,rgba(226,194,94,.53),rgba(202,125,68,.22) 46%,rgba(201,162,39,0) 70%),
    linear-gradient(173deg,rgba(201,162,39,0) 68%,rgba(202,125,68,.31) 83%,rgba(201,162,39,.40) 95%,rgba(201,162,39,.40) 100%);
  -webkit-mask-image:linear-gradient(90deg,transparent 3%,#000 38%,#000 92%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 3%,#000 38%,#000 92%,transparent 100%);
  animation:rn-splash-acende-ouro 620ms var(--curva) calc(var(--t0) + 1080ms) both}
.rn-splash.saindo .rn-ceu-roxo{opacity:calc(var(--roxo-fim,0) / 1.8)}   /* K de hoje */
.rn-splash.saindo .rn-ceu-ouro{opacity:calc(var(--luz-fim,0) / 2.2)}    /* K de hoje */
/* ---- a vinheta: a moldura de obsidian, estática (só gradientes, zero animação).
   Na saída abre em 640ms junto da viagem — o fade cruzado encontra o assentamento limpo. ---- */
.rn-splash-vinheta{position:absolute;inset:0;pointer-events:none;transition:opacity 640ms var(--curva);
  background:
    linear-gradient(118deg,transparent 34%,rgba(238,231,218,.028) 46%,rgba(238,231,218,.012) 54%,transparent 66%),
    radial-gradient(46% 32% at 0% 0%,rgba(10,8,6,.85),rgba(10,8,6,0) 74%),
    radial-gradient(44% 30% at 100% 0%,rgba(10,8,6,.66),rgba(10,8,6,0) 72%),
    radial-gradient(52% 28% at 0% 100%,rgba(10,8,6,.82),rgba(10,8,6,0) 76%),
    radial-gradient(46% 24% at 100% 100%,rgba(10,8,6,.6),rgba(10,8,6,0) 72%)}
.rn-splash.saindo .rn-splash-vinheta{opacity:0}
/* ---- o bloom: a luz difusa externa SAIU (correção pós-prancha, pedido de Raphael — brilho só
   por dentro do traço, saindo das letras). O elemento e o --bloom-dy FICAM: viaja invisível,
   o contrato do JS não muda. ---- */
.rn-splash-bloom{position:absolute;left:50%;top:42%;width:360px;height:360px;border-radius:50%;pointer-events:none;
  transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,rgba(226,194,94,.26),rgba(201,162,39,.09) 40%,transparent 62%);
  opacity:0;
  animation:none;
  transition:transform 640ms var(--curva)}
.rn-splash.saindo .rn-splash-bloom{transform:translate(-50%,calc(-50% + var(--bloom-dy)))}
/* ---- o símbolo ---- */
.rn-splash-inner{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:36px;padding-bottom:14%}
.rn-splash-marca{position:relative;width:clamp(140px,38vw,184px);aspect-ratio:1;transform-origin:0 0;transition:transform 640ms var(--curva)}
.rn-splash.saindo .rn-splash-marca{transform:translate(var(--dx),var(--dy)) scale(var(--escala))}
.rn-splash-logo{display:block;width:100%;height:100%;overflow:visible}
.rn-hex{stroke-dasharray:312;stroke-dashoffset:312;animation:rn-splash-traco 880ms var(--curva) calc(var(--t0) + 200ms) both}   /* o risco do ourives: 130ms mais lapidado */
.rn-hex-fechado{opacity:0;animation:rn-splash-acende 160ms var(--curva) calc(var(--t0) + 1080ms) both}   /* o elo fecha: o hexágono inteiro acende por cima quando o traço termina */
.rn-rn{opacity:0;animation:rn-splash-acende 300ms var(--curva) calc(var(--t0) + 1100ms) both,
  rn-splash-flash-letras 900ms var(--curva) calc(var(--t0) + 1100ms) both}   /* o flash emana das LETRAS, contido pelo traço — bem discreto */
/* (a cópia borrada das letras — .rn-rn-coroa — saiu no v3 e segue fora; o material + o facho respondem pelo brilho delas) */
.rn-glint{opacity:0}
.rn-glint-1{animation:rn-splash-glint 520ms var(--curva) calc(var(--t0) + 1080ms) both}
.rn-glint-2{animation:rn-splash-glint 460ms var(--curva) calc(var(--t0) + 1150ms) both}
.rn-glint-3{animation:rn-splash-glint 400ms var(--curva) calc(var(--t0) + 1210ms) both}
.rn-facho{opacity:0;transform:translateX(-60px) rotate(-22deg);animation:rn-splash-facho 460ms ease-in-out calc(var(--t0) + 1560ms) both}   /* depois do flash cair: ~300ms de silêncio, e a luz corre o ouro mais devagar */
/* ---- o wordmark: os valores do topo da Home (.hv-name / .hv-role), pra viajar sem escalar ---- */
.rn-splash-wordmark{display:flex;flex-direction:column;align-items:center;gap:3px;transform-origin:0 0;transition:transform 640ms var(--curva)}
.rn-splash.saindo .rn-splash-wordmark{transform:translate(var(--wm-dx),var(--wm-dy))}
.rn-nome{font-family:'Playfair Display',Georgia,'Times New Roman',serif;font-size:15px;line-height:1.2;letter-spacing:.22em;text-transform:uppercase;color:#eee7da;white-space:nowrap;opacity:0;
  animation:rn-splash-sobe 500ms var(--curva) calc(var(--t0) + 2050ms) both}
.rn-papel{font-family:'Jost',sans-serif;font-size:9px;line-height:1.4;letter-spacing:.34em;text-transform:uppercase;color:#9a9384;white-space:nowrap;opacity:0;
  animation:rn-splash-sobe 500ms var(--curva) calc(var(--t0) + 2200ms) both}
/* ---- keyframes ---- */
@keyframes rn-splash-acende{from{opacity:0}to{opacity:1}}
@keyframes rn-splash-acende-ouro{from{opacity:.12}to{opacity:1}}
@keyframes rn-splash-traco{to{stroke-dashoffset:0}}
@keyframes rn-splash-glint{0%{opacity:0}30%{opacity:1}100%{opacity:0}}      /* joalheria: acende e decai, sem loop */
@keyframes rn-splash-flash-letras{
  0%{filter:drop-shadow(0 0 0 rgba(242,216,170,0))}
  25%{filter:drop-shadow(0 0 6px rgba(242,216,170,.32))}
  100%{filter:drop-shadow(0 0 3px rgba(242,216,170,.14))}}   /* flash das letras, bem discreto (pedido de Raphael: nada muito forte) */
@keyframes rn-splash-facho{0%{opacity:0;transform:translateX(-60px) rotate(-22deg)}10%{opacity:1}72%{opacity:.92}100%{opacity:0;transform:translateX(175px) rotate(-22deg)}}   /* a luz escorre na saída, não corta */
@keyframes rn-splash-sobe{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes rn-splash-deriva{from{transform:translateY(0) scale(1)}to{transform:translateY(-7px) scale(1.015)}}   /* o ar da sala: subliminar */
/* ---- .abertura-curta — reabertura, ~600ms: símbolo já aceso, céu junto (tempos do molde), wordmark, saída ---- */
.rn-splash.abertura-curta .rn-hex{stroke-dashoffset:0;opacity:0;animation:rn-splash-acende 260ms var(--curva) var(--t0) both}
.rn-splash.abertura-curta .rn-rn,.rn-splash.abertura-curta .rn-hex-fechado{animation-delay:var(--t0)}
.rn-splash.abertura-curta .rn-glint{animation:none;opacity:0}
.rn-splash.abertura-curta .rn-ceu-ouro > div{animation-duration:360ms;animation-delay:calc(var(--t0) + 120ms)}
.rn-splash.abertura-curta .rn-ceu-roxo > div{animation-duration:360ms;animation-delay:calc(var(--t0) + 180ms)}
.rn-splash.abertura-curta .rn-splash-bloom{animation:none}
.rn-splash.abertura-curta .rn-facho{animation:none;opacity:0}
.rn-splash.abertura-curta .rn-nome{animation-duration:300ms;animation-delay:calc(var(--t0) + 200ms)}
.rn-splash.abertura-curta .rn-papel{animation-duration:300ms;animation-delay:calc(var(--t0) + 260ms)}
/* ---- .abertura-reduzida — prefers-reduced-motion: só fade, 400ms; sem traço, facho, glint, deriva ou viagem ---- */
.rn-splash.abertura-reduzida .rn-hex{stroke-dashoffset:0;opacity:0;animation:rn-splash-acende 400ms ease var(--t0) both}
.rn-splash.abertura-reduzida .rn-rn,.rn-splash.abertura-reduzida .rn-hex-fechado,
.rn-splash.abertura-reduzida .rn-ceu-roxo > div,.rn-splash.abertura-reduzida .rn-ceu-ouro > div{animation-duration:400ms;animation-delay:var(--t0);animation-timing-function:ease}
.rn-splash.abertura-reduzida .rn-ceu-roxo,.rn-splash.abertura-reduzida .rn-ceu-ouro{animation:none}
.rn-splash.abertura-reduzida .rn-glint{animation:none;opacity:0}
.rn-splash.abertura-reduzida .rn-splash-bloom{animation:none}
.rn-splash.abertura-reduzida .rn-facho{animation:none;opacity:0}
.rn-splash.abertura-reduzida .rn-nome,.rn-splash.abertura-reduzida .rn-papel{animation:rn-splash-acende 400ms ease var(--t0) both}
.rn-splash.abertura-reduzida.saindo{opacity:0;transition:opacity 400ms ease}
.rn-splash.abertura-reduzida.saindo .rn-splash-marca,.rn-splash.abertura-reduzida.saindo .rn-splash-wordmark{transform:none}
.rn-splash.abertura-reduzida.saindo .rn-splash-bloom{transform:translate(-50%,-50%)}

