/* =========================================================
   ÂNGULO CANETA · ajustes
   ========================================================= */
/* Seletor de momento: 3 opções */
.fases-bt{grid-template-columns:repeat(3,1fr)}
.fases-bt::before{left:16.7%;right:16.7%}
.fases-bt .enche-f{left:16.7%}
.fase b{font-size:clamp(17px,4.4vw,24px);text-align:center}
@media(max-width:599px){.fase{min-height:70px}}
.lista-m{display:grid;gap:10px;margin:4px 0 14px;padding:0;list-style:none}
.lista-m li{position:relative;padding-left:34px;font-size:19px;line-height:1.35}
.lista-m li::before{content:"✓";position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;background:var(--c-acido);color:#000;font-weight:800;font-size:15px;display:grid;place-items:center}
.quem{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.quem span{font-size:16px;font-weight:700;padding:5px 12px;border-radius:999px;border:2px solid var(--c-escuro-3);color:var(--c-suave-esc)}
/* Massa magra: barra para no ponto da gordura */
.colageno.in .medidor .tr i{width:60%}
/* Rosto desenhado que intercala com a foto */
.rosto-dz{position:absolute;inset:0;z-index:2;opacity:0;transition:opacity 1s var(--ease);background:var(--c-escuro-2)}
#rosto.desenho .rosto-dz{opacity:1}
#rosto .tag-stock{transition:opacity .6s}
#rosto.desenho .tag-stock{opacity:0}
.rosto-dz svg{width:100%;height:100%;display:block}
.dz-l{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.dz-fina{stroke-width:2;opacity:.75}
.dz-c,.dz-m{transition:opacity 1.4s var(--ease)}
.dz-m{opacity:0}
.almofadas.mostra .dz-c{opacity:0}
.almofadas.mostra .dz-m{opacity:1}
.dz-a{fill:rgba(var(--rgb-acido),.38);stroke:var(--c-acido);stroke-width:2;transform-box:fill-box;transform-origin:center;transition:transform 1.4s var(--ease),opacity 1.4s}
.almofadas.mostra .dz-a{transform:scale(.4);opacity:.75}
.dz-d{fill:none;stroke:var(--c-acido);stroke-width:3.5;stroke-linecap:round;stroke-dasharray:90;stroke-dashoffset:90;transition:stroke-dashoffset 1.2s .7s var(--ease)}
.almofadas.mostra .dz-d{stroke-dashoffset:0}
.tag-dz{position:absolute;left:12px;bottom:12px;z-index:3;font-size:16px;font-weight:700;color:#000;background:var(--c-aviso);padding:3px 10px;border-radius:999px;opacity:0;transition:opacity .6s}
#rosto.desenho .tag-dz{opacity:1}
.honesto{margin-top:14px;padding:14px 16px;border-radius:18px;border:2px dashed var(--c-acido);font-size:18px;font-weight:700}

/* ===== Ajustes v2 · ângulo caneta ===== */
.etiquetas li:not([data-pos="0"]) .tag>*{opacity:1}
.etiquetas li:not([data-pos="0"]):not([data-pos="1"]) .tag>*{opacity:0}
@media(min-width:900px){.almofadas{grid-template-columns:320px 1fr}}
#rosto .pino{white-space:nowrap;font-size:15px}
#rosto .tag-stock,#rosto .tag-dz{top:12px;bottom:auto}
.tripti{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;aspect-ratio:1/1;max-width:520px;margin:6px auto 18px;border-radius:26px;overflow:hidden}
.tp{position:relative;border:0;padding:0;overflow:hidden;background:var(--c-escuro-2);cursor:pointer}
.tp img{width:100%;height:100%;object-fit:cover;filter:grayscale(.9) brightness(.55);transition:filter .7s,transform 1s var(--ease)}
.tp.on img{filter:none;transform:scale(1.06)}
.tp-l{position:absolute;left:6px;right:6px;bottom:10px;font-family:var(--f-titulo);font-size:clamp(14px,3.6vw,19px);line-height:1.15;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.8);text-align:center}
.tp::after{content:"";position:absolute;inset:0;border:4px solid transparent;transition:border-color .5s}
.tp.on::after{border-color:var(--c-acido)}
.tp .tag-stock{top:8px;bottom:auto;left:50%;transform:translateX(-50%);font-size:10px;padding:2px 6px;white-space:nowrap}
.cn{width:58px;height:20px;display:block;margin:0 auto 6px}
.cn-c{fill:none;stroke:currentColor;stroke-width:2}
.cn-l{fill:var(--c-acido);stroke:none}
.cn-t{fill:currentColor}
.cn-a{stroke:currentColor;stroke-width:2;stroke-linecap:round}
.painel-f.pg-out{transform-origin:left center;animation:pgOut .32s ease-in forwards}
.painel-f.pg-in{transform-origin:right center;animation:pgIn .5s var(--ease)}
@keyframes pgOut{to{transform:perspective(1400px) rotateY(-70deg);opacity:0}}
@keyframes pgIn{from{transform:perspective(1400px) rotateY(60deg);opacity:0}to{transform:none;opacity:1}}
.decifra{min-height:270px}
.decifra.troca{animation:fadeD .7s ease}
@keyframes fadeD{from{opacity:0}to{opacity:1}}
.decifra .medo,.decifra .desejo{display:block;margin-top:10px;padding:10px 12px;border-radius:12px;font-size:17px;line-height:1.4}
.decifra .medo{background:rgba(255,255,255,.08)}
.decifra .desejo{background:rgba(var(--rgb-acido),.16)}
.decifra .medo b,.decifra .desejo b{display:inline;font-family:inherit;font-size:inherit;font-weight:800;margin:0;color:#fff}
.rodape a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.rodape .links{display:flex;flex-wrap:wrap;gap:16px}
.ajuda a{font-weight:800;color:inherit;text-decoration:underline;text-underline-offset:3px}
