/* Base compartilhada do app Escolho Ser Pai: cores, tipos, botões, trilha de 21 dias e barra de abas. */
:root{
  --noite:#16120F; --carvao:#211B17; --linha:#3A302A; --areia:#F1E6D8; --cinza:#B9AA98;
  --brasa:#E8893A; --brilho:#F4B860; --dusk:#2A1D33;
  --display:'Archivo',system-ui,sans-serif; --body:'Source Sans 3',system-ui,sans-serif;
  --tab:64px; --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--noite);color:var(--areia);font-family:var(--body);font-size:17px;line-height:1.55;-webkit-tap-highlight-color:transparent;padding-bottom:calc(var(--tab) + var(--safe-b))}
img{max-width:100%}
a{color:var(--brilho)}
.wrap{max-width:520px;margin:0 auto;padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* títulos: Archivo expandida, a voz do perfil */
.titulo{font-family:var(--display);font-variation-settings:'wdth' 125;font-weight:800;text-transform:uppercase;line-height:.98;letter-spacing:-.01em;margin:0;text-wrap:balance}
.t1{font-size:clamp(34px,10vw,50px)}
.t2{font-size:clamp(24px,7vw,32px)}
.t3{font-size:19px;letter-spacing:0}
.mao{font-family:var(--display);font-variation-settings:'wdth' 112;font-weight:700;color:var(--brilho);font-size:18px;line-height:1.3}
.cinza{color:var(--cinza)}
.peq{font-size:14px}

/* céu de fim de tarde */
.ceu{background:linear-gradient(180deg,var(--dusk) 0%,#5A2E22 34%,#A9542A 60%,var(--noite) 100%)}

/* botões */
.btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:60px;border-radius:18px;padding:16px 20px;font:inherit;font-weight:700;font-size:18px;text-decoration:none;cursor:pointer;border:1px solid var(--brasa);background:var(--brasa);color:#1B120B;text-align:center;transition:transform .12s ease,background .2s}
.btn:active{transform:scale(.98)}
.btn.sec{background:transparent;color:var(--brilho)}
.btn[aria-disabled=true]{opacity:.55;pointer-events:none}
:where(a,button,summary,input):focus-visible{outline:2px solid var(--brilho);outline-offset:3px;border-radius:10px}

/* trilha de 21 dias: 3 semanas de 7 */
.trilha{display:grid;gap:9px}
.semana{display:grid;grid-template-columns:78px repeat(7,1fr);align-items:center;gap:6px}
.semana span{font-size:13px;color:var(--cinza)}
.ponto{aspect-ratio:1;border-radius:50%;border:1.5px solid var(--linha);background:transparent;max-width:30px;justify-self:center;width:100%}
.ponto.feito{background:var(--brasa);border-color:var(--brasa)}
.ponto.hoje{border-color:var(--brilho);box-shadow:0 0 0 4px rgba(244,184,96,.18),0 0 18px rgba(244,184,96,.55);background:radial-gradient(circle,var(--brilho) 0 35%,transparent 36%)}

/* barra de abas */
.abas{position:fixed;left:0;right:0;bottom:0;z-index:20;background:rgba(22,18,15,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--linha);padding-bottom:var(--safe-b)}
.abas nav{max-width:520px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);height:var(--tab)}
.abas a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--cinza);text-decoration:none;font-size:12px;font-weight:600}
.abas svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.abas a[aria-current=page]{color:var(--brilho)}
.abas .clube{position:relative}
.abas .clube::before{content:'';position:absolute;top:9px;left:calc(50% + 8px);width:7px;height:7px;border-radius:50%;background:var(--brasa)}
.abas a[aria-current=page].clube::before{display:none}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
