/* SEG Design System (amostra): camada comum de movimento, vidro, grão e tema claro/escuro.
   Vem depois de app.css e das folhas de cada tela. Não muda o conteúdo, só o acabamento. */

/* ---------- tema claro ---------- */
html[data-theme="light"]{--navy-deep:#F2F4F8;--navy:#FFFFFF;--ink:#1B2438;--muted:#55627A;--line:rgba(27,36,56,.16);--card:#FFFFFF;--sky:#0043FD;--green:#0b6e38;--amber:#7a5000;--good:#0b6e38;--warn:#7a5000;--bad:#b52f20;color-scheme:light}
html[data-theme="light"] body{background:#F2F4F8}
html[data-theme="light"] .top,html[data-theme="light"] .dtop{background:rgba(244,247,255,.86)}
html[data-theme="light"] .ticker{background:rgba(244,247,255,.95)}
html[data-theme="light"] .tvbar{background:rgba(244,247,255,.9)}
html[data-theme="light"] .hero{background:radial-gradient(900px 480px at 85% 10%,rgba(0,67,253,.16),transparent 60%),linear-gradient(180deg,#F2F4F8,#E6EAF1)}
html[data-theme="light"] .dash-body{background:radial-gradient(1000px 520px at 90% -10%,rgba(0,67,253,.12),transparent 60%),#F2F4F8}
html[data-theme="light"] .feature{background:linear-gradient(135deg,rgba(0,67,253,.12),#fff);border-color:var(--blue)}
html[data-theme="light"] .champ{background:linear-gradient(160deg,rgba(0,67,253,.12),#fff);border-color:var(--blue)}
html[data-theme="light"] .bar,html[data-theme="light"] .fbar,html[data-theme="light"] .rbar,html[data-theme="light"] .pbar{background:rgba(27,36,56,.1)}
html[data-theme="light"] .ring-bg{stroke:rgba(27,36,56,.12)}
html[data-theme="light"] .ev-grid{stroke:rgba(27,36,56,.1)}
html[data-theme="light"] .ring-fg{filter:none}
html[data-theme="light"] .card,html[data-theme="light"] .panel{box-shadow:0 12px 32px -22px rgba(27,36,56,.45)}
html[data-theme="light"] .gates .now,html[data-theme="light"] .chip.on{color:#fff}
html[data-theme="light"] .cele{--ink:#F9F2F2;--muted:#A7B2C7;--sky:#9FB0D0;--green:#4AD892;--amber:#FFC24B}
html[data-theme="light"] .brand img.lg-d{display:none}
.lg-l{display:none}
html[data-theme="light"] .lg-l{display:block}

/* ---------- grão, progresso e vidro ---------- */
.ds-grain{position:fixed;inset:0;z-index:3;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>")}
html[data-theme="light"] .ds-grain{opacity:.03}
.ds-prog{position:fixed;left:0;top:0;height:3px;width:100%;z-index:70;background:linear-gradient(90deg,var(--blue),var(--sky));transform-origin:left;transform:scaleX(var(--p,0))}
.top,.dtop{transition:background .3s,box-shadow .3s}
.top.ds-sc,.dtop.ds-sc{box-shadow:0 12px 30px -22px rgba(0,0,0,.6)}

/* ---------- botão de tema ---------- */
.ds-thm{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;border-radius:12px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;transition:border-color .2s,background .2s,transform .2s}
.ds-thm:hover{border-color:var(--sky)}
.ds-thm:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.ds-thm svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ds-thm .i-sun{display:none}
html[data-theme="light"] .ds-thm .i-sun{display:block}html[data-theme="light"] .ds-thm .i-moon{display:none}
.top-in .ds-thm{margin-left:8px}

/* ---------- cartões: brilho que segue o cursor e inclinação ---------- */
.card:not(.locked),.feature,.panel{position:relative;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .25s ease,border-color .2s,box-shadow .25s ease;will-change:transform}
.card.ds-hot:not(.locked):not(.champ){background:radial-gradient(280px circle at var(--gx,50%) var(--gy,-60%),rgba(148,163,194,.16),transparent 62%),var(--card)}
html[data-theme="light"] .card.ds-hot:not(.locked):not(.champ){background:radial-gradient(280px circle at var(--gx,50%) var(--gy,-60%),rgba(0,67,253,.07),transparent 62%),var(--card)}
.card.ds-hot,.feature.ds-hot,.panel.ds-hot{box-shadow:0 26px 60px -28px rgba(0,67,253,.75)}
.dash-body .card{animation-fill-mode:backwards}
.card:not(.locked):hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-3px)}

/* ---------- reveal ---------- */
.ds-rv{opacity:0;transform:translateY(18px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.ds-rv.in{opacity:1;transform:none}
html.ds-static .ds-rv{opacity:1!important;transform:none!important;transition:none!important}

/* ---------- hero: partículas e paralaxe ---------- */
.ds-fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.hero-art{translate:calc(var(--mx,0)*18px) calc(var(--my,0)*12px);transition:translate .4s ease-out}
.hero-in{z-index:1}
.hero h1 .w{display:inline-block;opacity:0;transform:translateY(.5em);animation:dsw .8s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(var(--i,0)*70ms + 120ms)}
@keyframes dsw{to{opacity:1;transform:none}}
html.ds-static .hero h1 .w{opacity:1;transform:none;animation:none}

/* ---------- botões magnéticos ---------- */
.btn{transition:transform .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .25s ease,translate .2s ease-out}
.btn-primary:hover{box-shadow:0 0 0 4px rgba(0,67,253,.25),0 14px 34px -10px rgba(0,67,253,.85)}

@media (prefers-reduced-motion:reduce){
  .ds-rv{opacity:1;transform:none;transition:none}
  .hero h1 .w{opacity:1;transform:none;animation:none}
  .hero-art{translate:none;transition:none}
  .card:not(.locked),.feature,.panel{transform:none!important}
}
@media (hover:none){.card:not(.locked),.feature,.panel{transform:none!important}}
@media print{.ds-grain,.ds-prog,.ds-thm,.ds-fx{display:none}}
[hidden]{display:none!important}
.btn-ghost{background:transparent}

/* ---------- telas de gestão: Admin, Integrações, Funil e painel ---------- */
.bar-top.ds-sc{box-shadow:0 12px 30px -22px rgba(0,0,0,.6)}
.bar-top{transition:background .3s,box-shadow .3s}
.bar-top .ds-thm{margin-left:4px}
.kpi,.person,.cardx,.node{position:relative;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .25s ease,border-color .2s,box-shadow .25s ease;will-change:transform}
.kpi.ds-hot,.person.ds-hot,.cardx.ds-hot,.node.ds-hot{background:radial-gradient(260px circle at var(--gx,50%) var(--gy,-60%),rgba(148,163,194,.15),transparent 62%),var(--card)}
.kpi.ds-hot,.person.ds-hot,.cardx.ds-hot,.node.ds-hot{box-shadow:0 22px 50px -28px rgba(0,67,253,.75)}
html[data-theme="light"] .bar-top{background:rgba(244,247,255,.9)}
html[data-theme="light"] .side{background:#fff}
html[data-theme="light"] .side a:hover{background:rgba(0,67,253,.07)}
html[data-theme="light"] .scrim{background:rgba(27,36,56,.35)}
html[data-theme="light"] .kpi.ds-hot,html[data-theme="light"] .person.ds-hot,html[data-theme="light"] .cardx.ds-hot,html[data-theme="light"] .node.ds-hot{background:radial-gradient(260px circle at var(--gx,50%) var(--gy,-60%),rgba(0,67,253,.07),transparent 62%),var(--card);box-shadow:0 10px 28px -22px rgba(27,36,56,.45)}
html[data-theme="light"] .tag.bad,html[data-theme="light"] .mini.danger{color:#b52f20;border-color:rgba(201,58,42,.45)}
html[data-theme="light"] .tag.warn{border-color:rgba(154,101,0,.45)}
html[data-theme="light"] .st-meta code,html[data-theme="light"] .mr-top code{background:rgba(0,67,253,.08)}
html[data-theme="light"] .warnbox{background:rgba(250,178,25,.14);border-color:rgba(154,101,0,.45)}
html[data-theme="light"] .pvf .bar2{background:rgba(27,36,56,.1)}
html[data-theme="light"] dialog::backdrop{background:rgba(27,36,56,.45)}
@media (prefers-reduced-motion:reduce){.kpi,.person,.cardx,.node{transform:none!important}}
@media (hover:none){.kpi,.person,.cardx,.node{transform:none!important}}


/* documento limpo: sem brilho, sombra azul nem inclinacao ao imprimir ou exportar PDF */
@media print{.card,.feature,.panel,.kpi,.person,.cardx,.node,.rx-t,.rx-k,.rx-chr{box-shadow:none!important;transform:none!important;background-image:none!important;filter:none!important}}
html.prn .card,html.prn .feature,html.prn .panel,html.prn .rx-t,html.prn .rx-k{box-shadow:none!important;transform:none!important;background-image:none!important}

/* ---------- barras de rolagem discretas (sem setas) e cor dos controles do sistema ---------- */
html{color-scheme:dark}
@supports selector(::-webkit-scrollbar){
  ::-webkit-scrollbar{width:10px;height:10px}
  ::-webkit-scrollbar-track{background:transparent}
  ::-webkit-scrollbar-thumb{border:3px solid transparent;border-radius:99px;background:rgba(148,163,194,.42);background-clip:padding-box}
  html[data-theme="light"] ::-webkit-scrollbar-thumb{background:rgba(27,36,56,.32);background-clip:padding-box}
  ::-webkit-scrollbar-thumb:hover{background:rgba(148,163,194,.7);background-clip:padding-box}
  ::-webkit-scrollbar-button{display:none;width:0;height:0}
  ::-webkit-scrollbar-corner{background:transparent}
}
@supports not selector(::-webkit-scrollbar){
  *{scrollbar-width:thin;scrollbar-color:rgba(148,163,194,.42) transparent}
  html[data-theme="light"] *{scrollbar-color:rgba(27,36,56,.32) transparent}
}

/* sem efeito que siga o mouse: nenhum bloco inclina, levanta ou se move com o cursor */
.card:not(.locked),.feature,.panel,.kpi,.person,.cardx,.node,[data-tilt],.card:not(.locked):hover,.feature:hover{transform:none!important;will-change:auto}
.btn[style*="translate"]{translate:none!important}

/* rede de seguranca: nenhum bloco se move, inclina ou levanta quando o mouse passa por cima, em qualquer tela */
:is([class*="card"],[class*="kpi"],.lk,.orb,.s4,.node,.person,.cardx,.feature,.panel,.paper,.tk-row,.bb-card):not(dialog):is(:hover,:focus-visible){transform:none!important;translate:none!important;rotate:none!important;scale:none!important}