/* HemoLab · Circuito — marca e motion compartilhados (portal, LP, reset).
   Tokens próprios com prefixo --hl-; cada página mapeia os seus nomes para estes. */
:root{
  --hl-blood:#b10d2c; --hl-blood-fill:#a30b28; --hl-blood-hover:#8a0921; --hl-blood-soft:#fbe9ea;
  --hl-placa:#2a0109; --hl-placa-2:#3d020c; --hl-on-placa:#fbeef0; --hl-placa-muted:#d7b8bf;
  --hl-trilha:#ff6b86; --hl-node:#ffc2cf;
  --hl-ground:#f6f0ea; --hl-surface:#efe6e0; --hl-raised:#ffffff; --hl-ink:#1d1215; --hl-ink-2:#43363a; --hl-muted:#6b5e62; --hl-line:#e6dad5;
  --hl-ok:#2f7d4f; --hl-ok-soft:#e3f1e8; --hl-warn:#9a5b00; --hl-warn-soft:#fbefd9;
  --hl-out:cubic-bezier(.2,.8,.2,1); --hl-in:cubic-bezier(.4,0,1,1); --hl-spring:cubic-bezier(.34,1.56,.64,1); --hl-reveal:cubic-bezier(.65,0,.35,1);
  --hl-display:'Motive',Georgia,'Times New Roman',serif; --hl-script:'The Shuffle','Motive',cursive;
  --hl-body:'Sora',system-ui,-apple-system,'Segoe UI',sans-serif; --hl-mono:'DM Mono',ui-monospace,Menlo,monospace;
}

/* ---------- logo ---------- */
.hl-mk{display:block;overflow:visible;flex:none}
.hl-l{clip-path:url(#hl-hL)}.hl-r{clip-path:url(#hl-hR)}
.hl-mk .seam{fill:none;stroke:#ffd1db;stroke-width:.7;opacity:.5}
.hl-mk .r-rim{fill:none;stroke:#ffb3c0;stroke-width:1.6;stroke-linecap:round;opacity:.35}
.hl-mk .r-soft{filter:url(#hl-rBlur)}
.hl-mk .rd,.hl-mk .r-spec,.hl-mk .r-glow,.hl-mk .bld,.hl-mk .brd,.hl-mk .hg,.hl-mk .outs{transform-box:fill-box}
.hl-mk .hg{transform-origin:50% 100%}
.hl-mk .ct-dim{fill:none;stroke:#ff6b86;stroke-width:.9;opacity:.5;stroke-linejoin:round;transition:stroke .3s,opacity .3s}
.hl-mk .ct-pulse{fill:none;stroke:#ffe0e7;stroke-width:1.3;stroke-linecap:round;stroke-dasharray:14 100;stroke-dashoffset:114;opacity:0}
.hl-mk .ct-node{fill:#ffc2cf;transform-box:fill-box;transform-origin:center}
.hl-mk .ct-via{fill:#ff8fa3;opacity:.6}
.hl-mk .scnb{opacity:0}
.fv-t{fill:none;stroke:#ff6b86;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.fv-n{fill:#ffc2cf}
@keyframes hlSig{from{stroke-dashoffset:114}to{stroke-dashoffset:0}}
@keyframes hlNode{0%,55%,100%{transform:none;fill:#ffc2cf}70%{transform:scale(1.9);fill:#fff}}
@keyframes hlJig{0%,100%{transform:none}8%{transform:scale(1.02,.98)}16%{transform:scale(.99,1.01)}24%,100%{transform:none}}
@keyframes hlSpec{0%,100%{transform:none}50%{transform:translate(1.5px,-1.5px)}}
/* repouso (sempre) e hover (em qualquer ancestral .hl-hov) */
.c-rest .ct-pulse,.hl-hov:hover .ct-pulse,.hl-hov:focus-visible .ct-pulse{opacity:1;animation:hlSig 1.8s linear infinite}
.c-rest .ct-node,.hl-hov:hover .ct-node,.hl-hov:focus-visible .ct-node{animation:hlNode 1.8s ease-out infinite}
.c-rest .hg{animation:hlJig 4s ease-in-out infinite}
.c-rest .r-spec{animation:hlSpec 4s ease-in-out infinite}
/* carregando */
.c-load .ct-pulse{opacity:1;animation:hlSig .7s linear infinite}
.c-load .ct-node{animation:hlNode .7s ease-out infinite}
.c-load .ct-dim{opacity:.85}
.c-load .hg{animation:hlBreathe 1.4s ease-in-out infinite}
@keyframes hlBreathe{0%,100%{transform:none}50%{transform:scale(.985)}}
/* IA pensando */
.c-scan .scnb{opacity:1;animation:hlScan 2.2s var(--hl-reveal) infinite}
@keyframes hlScan{from{transform:translateY(0)}to{transform:translateY(170px)}}
.c-scan .ct-pulse{opacity:1;animation:hlSig 1.1s linear infinite}
.c-scan .ct-node{animation:hlBlink 1.1s steps(2) infinite}
@keyframes hlBlink{0%,100%{fill:#ffc2cf}50%{fill:#fff}}
/* sucesso (uma vez; reinicie com HL.restart) */
.c-ok .ct-dim{stroke:#ffd1db;opacity:.95}
.c-ok.run .ct-node{animation:hlOkN .9s ease-out both}
@keyframes hlOkN{0%{transform:none;fill:#ffc2cf}25%{transform:scale(2.3);fill:#fff}70%{transform:scale(1.3);fill:#fff}100%{transform:none;fill:#ffc2cf}}
.c-ok.run .hg{animation:hlOkG .9s var(--hl-out) both}
@keyframes hlOkG{0%{transform:none;filter:drop-shadow(0 0 0 rgba(255,107,134,0))}25%{transform:scale(1.04);filter:drop-shadow(0 0 14px rgba(255,107,134,.75))}100%{transform:none;filter:drop-shadow(0 0 0 rgba(255,107,134,0))}}
/* erro (uma vez) */
.c-err .ct-dim{stroke:#6e4450;opacity:.9}
.c-err .ct-node{fill:#6e4450}
.c-err .bld{filter:saturate(.55) brightness(.85)}
.c-err.run .brd,.c-err.run .outs{animation:hlGlitch .6s steps(1) both}
@keyframes hlGlitch{0%{transform:none;opacity:1}15%{transform:translateX(1.5px);opacity:.55}30%{transform:translateX(-1px);opacity:1}45%{opacity:.35}60%,100%{opacity:1;transform:none}}
.c-err.run .hg{animation:hlShk .6s both}
@keyframes hlShk{0%,100%{transform:none}15%,45%,75%{transform:translateX(-2.5px)}30%,60%,90%{transform:translateX(2.5px)}}
/* entrada (uma vez) */
.c-in.run .bld{animation:hlInL .6s var(--hl-out) .05s backwards}
@keyframes hlInL{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.c-in.run .seam{animation:hlInS 1.3s ease backwards}
@keyframes hlInS{0%,30%{opacity:0}40%{opacity:1;stroke:#fff;stroke-width:1.4}100%{opacity:.5}}
.c-in.run .brd{animation:hlInR .8s var(--hl-reveal) .45s backwards}
@keyframes hlInR{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.c-in.run .outs{animation:hlInO .5s ease 1.1s backwards}
@keyframes hlInO{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
.c-in .ct-pulse{opacity:1;animation:hlSig 1.8s linear infinite}
.c-in .ct-node{animation:hlNode 1.8s ease-out infinite}

/* ---------- utilitários de motion ---------- */
@keyframes hlSobe{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes hlFade{from{opacity:0}to{opacity:1}}
@keyframes hlTrace{0%{transform:scaleX(0);opacity:1}70%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes hlNodeOn{0%{transform:scale(.3);box-shadow:0 0 0 0 rgba(255,107,134,.7)}60%{transform:scale(1.5);box-shadow:0 0 0 6px rgba(255,107,134,0)}100%{transform:none}}
@keyframes hlShake{10%,90%{transform:translateX(-1px)}20%,80%{transform:translateX(3px)}30%,50%,70%{transform:translateX(-6px)}40%,60%{transform:translateX(6px)}}
@keyframes hlReveal{from{opacity:.35;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes hlPop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.hl-sobe{animation:hlSobe .42s var(--hl-out) backwards}
.hl-reveal{animation:hlReveal .42s var(--hl-reveal) backwards}
.hl-shake{animation:hlShake .42s cubic-bezier(.36,.07,.19,.97) both}
.hl-pop{display:inline-flex;animation:hlPop .42s var(--hl-spring)}
.hl-traced{position:relative}
.hl-traced::before{content:'';position:absolute;left:18px;right:18px;top:-1px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--hl-blood),var(--hl-trilha));transform-origin:left;animation:hlTrace .9s var(--hl-reveal) .12s both;pointer-events:none;z-index:1}

/* sinal dentro de botões */
.sig{position:relative;display:inline-block;width:28px;height:2px;border-radius:2px;background:rgba(255,255,255,.3);overflow:hidden;flex:none;vertical-align:middle}
.sig i{position:absolute;top:0;bottom:0;width:11px;border-radius:2px;background:#fff;animation:hlSigM .7s linear infinite}
.sig.dark{background:color-mix(in srgb,var(--hl-blood) 18%,transparent)}.sig.dark i{background:var(--hl-blood)}
@keyframes hlSigM{from{left:-11px}to{left:28px}}

/* linha de sinal no topo (troca de tela) */
.hl-topsig{position:absolute;left:0;right:0;bottom:-1px;height:2px;overflow:hidden;opacity:0;transition:opacity .2s;pointer-events:none}
.hl-topsig.on{opacity:1}
.hl-topsig i{position:absolute;top:0;bottom:0;width:30%;background:linear-gradient(90deg,transparent,var(--hl-blood),var(--hl-trilha));animation:hlTop 1.4s linear infinite}
@keyframes hlTop{from{left:-30%}to{left:100%}}

/* varredura (skeleton) */
.hl-skel{display:grid;gap:10px;padding:4px 0}
.hl-skel span{display:block;height:12px;border-radius:7px;background:color-mix(in srgb,var(--hl-ink) 7%,transparent);position:relative;overflow:hidden}
.hl-skel span.big{height:44px;border-radius:12px}
.hl-skel span::after{content:'';position:absolute;top:0;bottom:0;left:-35%;width:35%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.85));border-right:1.5px solid color-mix(in srgb,var(--hl-trilha) 70%,transparent);animation:hlSkx 1.3s linear infinite}
@keyframes hlSkx{from{left:-35%}to{left:100%}}

/* loader com o logo */
.hl-loader{display:flex;flex-direction:column;align-items:center;gap:12px;padding:26px 0;color:var(--hl-muted);font-size:13px}

/* splash de entrada no portal */
.hl-splash{position:fixed;inset:0;z-index:300;background:var(--hl-placa);color:var(--hl-on-placa);display:grid;place-items:center;transition:clip-path .7s var(--hl-reveal)}
.hl-splash.go{clip-path:inset(0 0 0 100%)}
.hl-splash .ct{display:grid;justify-items:center;gap:16px}
.hl-splash .wm{font-family:var(--hl-display);font-size:34px;line-height:1}.hl-splash .wm b{color:var(--hl-trilha);font-weight:700}
.hl-splash .track{position:relative;width:160px;height:2px;background:rgba(255,194,207,.18);border-radius:2px;overflow:hidden}
.hl-splash .track i{position:absolute;top:0;bottom:0;left:0;width:0;background:linear-gradient(90deg,var(--hl-blood),var(--hl-trilha));transition:width .7s var(--hl-reveal)}
.hl-splash .cap{font-size:12.5px;color:var(--hl-placa-muted);min-height:18px}

/* trilhas de fundo (painel do login, LP) */
.hl-bgtr{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hl-bgtr .t{fill:none;stroke:rgba(255,107,134,.22);stroke-width:1.2}
.hl-bgtr .p{fill:none;stroke:#ffc2cf;stroke-width:1.6;stroke-linecap:round;stroke-dasharray:6 100;animation:hlSig 2.6s linear infinite}
.hl-bgtr .n{fill:rgba(255,194,207,.5)}
.hl-bgtr.light .t{stroke:color-mix(in srgb,var(--hl-blood) 16%,transparent)}
.hl-bgtr.light .p{stroke:var(--hl-trilha)}
.hl-bgtr.light .n{fill:color-mix(in srgb,var(--hl-trilha) 60%,transparent)}

@media (prefers-reduced-motion:reduce){
  .hl-mk *,.hl-sobe,.hl-reveal,.hl-shake,.hl-pop,.hl-traced::before,.sig i,.hl-topsig i,.hl-skel span::after,.hl-bgtr .p{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important}
  .hl-splash{transition-duration:.01ms}
}