/* Painel LS: sistema de design escuro (SISTEMA-LS-DESIGN, 17/10/2026)
   Tokens do DESIGN-BRIEF secao 2. Celular primeiro. Sem biblioteca. */
:root{
  --noite:#070C1A; --noite-2:#0C1428;
  --vidro:rgba(17,26,46,.72); --vidro-forte:rgba(22,34,60,.86);
  --borda:rgba(91,149,242,.22); --borda-forte:rgba(143,187,255,.45);
  --blue:#004AAD; --blue-lift:#5B95F2; --blue-claro:#8FBBFF;
  --glow:rgba(91,149,242,.45);
  --paper:#FFFFFF; --bone:#F4F2EE; --dg-fraco:rgba(244,242,238,.62); --dg-mudo:rgba(244,242,238,.4);
  --verde:#2ECC8A; --amarelo:#F5C542; --vermelho:#FF5C5C;
  --f-disp:'Jost',system-ui,sans-serif; --f-body:'Inter',system-ui,sans-serif; --f-hand:'Gochi Hand',cursive;
  --r-sm:10px; --r:16px; --r-lg:22px;
  --e1:4px; --e2:8px; --e3:12px; --e4:16px; --e5:24px; --e6:32px; --e7:48px;
  --lateral:248px; --lateral-mini:76px; --tap:44px;
}
*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;min-height:100vh;font:400 15px/1.5 var(--f-body);color:var(--bone);
  background:radial-gradient(900px 520px at 85% -10%,rgba(0,74,173,.38),transparent 60%),
             radial-gradient(700px 480px at -10% 40%,rgba(91,149,242,.12),transparent 60%),var(--noite);
  background-attachment:fixed;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--f-disp);color:var(--paper);margin:0;font-weight:500;letter-spacing:-.01em}
a{color:var(--blue-claro);text-decoration:none}
:focus-visible{outline:2px solid var(--blue-claro);outline-offset:2px;border-radius:6px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:var(--blue);color:#fff;padding:8px 12px;border-radius:8px}
.ico{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.nota{font-family:var(--f-hand);color:var(--blue-claro);font-size:20px;transform:rotate(-2deg);display:inline-block}
.mudo{color:var(--dg-fraco)}.pequeno{font-size:12.5px}

/* cartao de vidro */
.vidro{background:var(--vidro);border:1px solid var(--borda);border-radius:var(--r);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 10px 40px -12px rgba(0,30,90,.7),inset 0 1px 0 rgba(255,255,255,.05);
  transition:border-color .2s,box-shadow .2s,transform .2s}
.vidro:hover{border-color:var(--borda-forte);box-shadow:0 14px 44px -10px var(--glow),inset 0 1px 0 rgba(255,255,255,.07)}
.vidro--foco{border-color:var(--borda-forte);box-shadow:0 0 36px -6px var(--glow)}
.cartao{padding:var(--e4) var(--e5)}
.cartao h2{font-size:18px;margin-bottom:var(--e3)}

/* botoes e chips */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);padding:0 var(--e5);
  border:1px solid transparent;border-radius:999px;font:600 14px var(--f-body);cursor:pointer;color:#fff;
  background:linear-gradient(135deg,var(--blue),#2F78E0);box-shadow:0 0 24px -4px var(--glow);transition:box-shadow .2s,transform .2s}
.btn:hover{box-shadow:0 0 36px 0 var(--glow);transform:translateY(-1px)}
.btn--fantasma{background:rgba(91,149,242,.1);border-color:var(--borda);box-shadow:none;color:var(--bone)}
.btn--fantasma:hover{background:rgba(91,149,242,.2);box-shadow:none}
.btn--pequeno{min-height:36px;padding:0 var(--e4);font-size:13px}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 12px;border-radius:999px;font:500 12.5px var(--f-body);
  color:var(--dg-fraco);background:rgba(91,149,242,.08);border:1px solid var(--borda)}
.chip--ativo{color:#fff;background:rgba(0,74,173,.55);border-color:var(--blue-lift)}

/* semaforo com halo */
.sem{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 22%,transparent),0 0 14px 2px color-mix(in srgb,var(--c) 70%,transparent)}
.sem--verde{--c:var(--verde)}.sem--amarelo{--c:var(--amarelo)}.sem--vermelho{--c:var(--vermelho)}

/* foto redonda com inicial */
.foto{--t:40px;width:var(--t);height:var(--t);border-radius:50%;flex:none;display:grid;place-items:center;overflow:hidden;
  font:600 calc(var(--t)*.4) var(--f-disp);color:#fff;background:radial-gradient(circle at 30% 25%,#5B95F2,var(--blue) 70%);
  box-shadow:0 0 0 2px rgba(143,187,255,.35),0 0 18px -2px var(--glow)}
.foto img{width:100%;height:100%;object-fit:cover}
.foto--p{--t:28px}.foto--g{--t:56px}

/* esqueleto */
.esq{border-radius:8px;background:linear-gradient(90deg,rgba(91,149,242,.08),rgba(143,187,255,.2),rgba(91,149,242,.08));background-size:200% 100%;animation:esq 1.4s linear infinite}
@keyframes esq{to{background-position:-200% 0}}

/* shell */
.app{display:grid;grid-template-columns:var(--lateral) 1fr;min-height:100vh}
.lateral{position:sticky;top:0;height:100vh;padding:var(--e5) var(--e4);display:flex;flex-direction:column;gap:var(--e4);
  background:linear-gradient(180deg,rgba(12,20,40,.92),rgba(7,12,26,.92));border-right:1px solid var(--borda);overflow:auto}
.marca{display:flex;align-items:center;gap:10px;padding:0 var(--e2) var(--e3)}
.marca b{font:500 19px var(--f-disp);color:#fff;letter-spacing:.01em}.marca small{display:block;font:400 11px var(--f-body);color:var(--blue-claro);letter-spacing:.14em;text-transform:uppercase}
.logo{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font:600 18px var(--f-disp);color:#fff;
  background:linear-gradient(135deg,var(--blue),var(--blue-lift));box-shadow:0 0 22px var(--glow)}
.grupo{font:600 10.5px var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--dg-mudo);padding:var(--e3) var(--e3) 4px}
.nav a{display:flex;align-items:center;gap:12px;min-height:42px;padding:0 var(--e3);border-radius:12px;color:var(--dg-fraco);font-weight:500;transition:all .2s;position:relative}
.nav a:hover{color:#fff;background:rgba(91,149,242,.1)}
.nav a[aria-current=page]{color:#fff;background:linear-gradient(90deg,rgba(0,74,173,.55),rgba(0,74,173,.12));box-shadow:inset 2px 0 0 var(--blue-lift),0 0 24px -8px var(--glow)}
.nav .n{margin-left:auto;font:600 11px var(--f-body);background:rgba(255,92,92,.18);color:#FFB0B0;border-radius:999px;padding:2px 8px}
.lateral .pe{margin-top:auto}
.main{padding:var(--e5) var(--e6) var(--e7);min-width:0}
.topo{display:flex;align-items:center;gap:var(--e4);margin-bottom:var(--e5)}
.busca{flex:1;display:flex;align-items:center;gap:10px;min-height:var(--tap);padding:0 var(--e4);max-width:520px;border-radius:999px;color:var(--dg-fraco)}
.busca input{all:unset;flex:1;color:var(--bone);font:400 14px var(--f-body)}
.sino{position:relative;width:var(--tap);height:var(--tap);border-radius:50%;display:grid;place-items:center;color:var(--bone)}
.sino i{position:absolute;top:4px;right:2px;min-width:18px;height:18px;border-radius:9px;background:var(--vermelho);color:#fff;font:700 10.5px/18px var(--f-body);text-align:center;font-style:normal;box-shadow:0 0 12px var(--vermelho)}
.pessoa{display:flex;align-items:center;gap:10px}.pessoa small{display:block;color:var(--blue-claro);font-size:11.5px}
.topo .btn{margin-left:auto}

/* saudacao e resumo */
.saud{margin-bottom:var(--e5)}.saud h1{font-size:clamp(28px,4vw,40px);font-weight:400}.saud h1 b{font-weight:600;background:linear-gradient(90deg,#fff,var(--blue-claro));-webkit-background-clip:text;background-clip:text;color:transparent}
.saud p{margin:6px 0 0;color:var(--dg-fraco)}
.resumo{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--e4);margin-bottom:var(--e5)}
.kpi{padding:var(--e4) var(--e5);position:relative;overflow:hidden;min-height:132px}
.kpi::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,74,173,.55),rgba(91,149,242,.22) 55%,rgba(143,187,255,.08));opacity:.8;pointer-events:none}
.kpi>*{position:relative}
.kpi .rot{font:500 12.5px var(--f-body);color:var(--dg-fraco);display:flex;align-items:center;gap:8px;letter-spacing:.02em}
.kpi .num{font:500 46px/1.05 var(--f-disp);color:#fff;margin:8px 0 2px;font-variant-numeric:tabular-nums;text-shadow:0 0 28px var(--glow)}
.kpi .var{font-size:12.5px;color:var(--dg-fraco)}
.kpi svg.mini{position:absolute;right:12px;bottom:12px;width:96px;height:36px;opacity:.9}
.kpi--alerta .num{color:#FFD1D1;text-shadow:0 0 28px rgba(255,92,92,.5)}

/* linha de etapas acesa */
.etapas{padding:var(--e5);margin-bottom:var(--e5)}
.etapas header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--e5);gap:12px;flex-wrap:wrap}
.trilha{display:grid;grid-template-columns:repeat(6,1fr);position:relative;gap:var(--e2)}
.trilha::before{content:"";position:absolute;left:8%;right:8%;top:34px;height:2px;background:rgba(91,149,242,.2)}
.trilha::after{content:"";position:absolute;left:8%;right:8%;top:33px;height:4px;border-radius:4px;
  background:linear-gradient(90deg,transparent 0,var(--blue-claro) 18%,transparent 36%) 0 0/60% 100% no-repeat;filter:blur(1px);animation:pulso 6s linear infinite}
@keyframes pulso{from{background-position:-60% 0}to{background-position:160% 0}}
.etapa{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:1}
.etapa .no{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;font:500 24px var(--f-disp);color:#fff;
  background:var(--noite-2);border:1.5px solid var(--borda-forte);box-shadow:0 0 calc(var(--luz,.3)*38px) calc(var(--luz,.3)*4px) var(--glow);
  transition:transform .2s}
.etapa:hover .no{transform:scale(1.06)}
.etapa .no.vazio{color:var(--dg-mudo);font-size:11px;line-height:1.2;text-align:center;box-shadow:none;border-style:dashed}
.etapa--gargalo .no{border-color:var(--blue-claro);background:radial-gradient(circle,rgba(91,149,242,.55),rgba(0,74,173,.4))}
.etapa b{font:500 14px var(--f-body);color:#fff}.etapa small{font-size:11.5px;color:var(--dg-fraco);max-width:130px}
.etapa .tag{font:600 10px var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:#FFD9A0;background:rgba(245,197,66,.14);border-radius:999px;padding:2px 8px}

/* grades */
.duas{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:var(--e4);margin-bottom:var(--e5)}
.agora{display:flex;flex-direction:column;gap:var(--e3)}
.item{display:flex;align-items:center;gap:var(--e3);padding:var(--e3) var(--e4);border-radius:14px;background:rgba(91,149,242,.06);border:1px solid transparent;transition:all .2s}
.item:hover{border-color:var(--borda);background:rgba(91,149,242,.12)}
.item .tx{flex:1;min-width:0}.item .tx b{display:block;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item .tx span{font-size:12.5px;color:var(--dg-fraco)}
.linha-tempo{list-style:none;margin:0;padding:0 0 0 18px;border-left:2px solid rgba(91,149,242,.3);display:flex;flex-direction:column;gap:var(--e4)}
.linha-tempo li{position:relative}.linha-tempo li::before{content:"";position:absolute;left:-25px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--blue-lift);box-shadow:0 0 12px var(--glow)}
.linha-tempo li{min-width:0}.linha-tempo span{overflow-wrap:anywhere}.linha-tempo b{color:#fff;font-weight:600}.linha-tempo span{display:block;font-size:12.5px;color:var(--dg-fraco)}
.sec-titulo{display:flex;justify-content:space-between;align-items:baseline;margin:var(--e6) 0 var(--e3)}
.sec-titulo h2{font-size:22px}
.clientes{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--e4)}
.cli{padding:var(--e4);display:flex;flex-direction:column;gap:var(--e3)}
.cli header{display:flex;align-items:center;gap:var(--e3)}.cli header b{flex:1;color:#fff;font-weight:600;line-height:1.2}
.cli .tres{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;text-align:center}
.cli .tres div{background:rgba(7,12,26,.55);border-radius:10px;padding:8px 4px}.cli .tres strong{display:block;font:500 22px var(--f-disp);color:#fff}.cli .tres span{font-size:10.5px;color:var(--dg-fraco);text-transform:uppercase;letter-spacing:.06em}
.cli .tres .al strong{color:#FFB0B0}
.cli footer{font-size:12.5px;color:var(--dg-fraco);display:flex;align-items:center;gap:6px}

/* entrada das telas */
.surge>*{opacity:0;transform:translateY(10px);animation:surge .5s ease forwards}
.surge>*:nth-child(1){animation-delay:40ms}.surge>*:nth-child(2){animation-delay:80ms}.surge>*:nth-child(3){animation-delay:120ms}
.surge>*:nth-child(4){animation-delay:160ms}.surge>*:nth-child(5){animation-delay:200ms}.surge>*:nth-child(6){animation-delay:240ms}.surge>*:nth-child(n+7){animation-delay:280ms}
@keyframes surge{to{opacity:1;transform:none}}

/* barra inferior (celular) */
.barra{display:none}

/* entrar */
.entrar{min-height:100vh;display:grid;place-items:center;padding:var(--e5);position:relative;overflow:hidden}
.entrar::before,.entrar::after{content:"";position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none}
.entrar::before{width:520px;height:520px;background:rgba(0,74,173,.55);top:-160px;right:-120px}
.entrar::after{width:420px;height:420px;background:rgba(91,149,242,.22);bottom:-140px;left:-100px}
.entrar main{position:relative;z-index:1;width:100%;max-width:420px;padding:var(--e6) var(--e5)}
.entrar .logo{width:52px;height:52px;font-size:26px;border-radius:16px;margin-bottom:var(--e4)}
.entrar h1{font-size:34px;font-weight:400;margin-bottom:6px}.entrar h1 b{font-weight:600}
.campo{display:block;margin-top:var(--e4)}.campo span{display:block;font:500 13px var(--f-body);color:var(--dg-fraco);margin-bottom:6px}
.campo input{width:100%;min-height:48px;padding:0 var(--e4);border-radius:14px;border:1px solid var(--borda);background:rgba(7,12,26,.6);color:#fff;font:400 15px var(--f-body);transition:all .2s}
.campo input:focus{outline:none;border-color:var(--blue-lift);box-shadow:0 0 0 3px rgba(91,149,242,.22),0 0 24px -4px var(--glow)}
.entrar .btn{width:100%;margin-top:var(--e5);min-height:50px;font-size:15px}
.entrar .rodape{margin-top:var(--e5);text-align:center;font-size:12.5px;color:var(--dg-mudo)}

/* responsivo: celular primeiro na pratica (empilha) */
@media (max-width:1100px){.resumo{grid-template-columns:repeat(2,1fr)}.duas{grid-template-columns:minmax(0,1fr)}.app{grid-template-columns:var(--lateral-mini) 1fr}
  .lateral{padding:var(--e4) var(--e2)}.lateral .tx,.lateral .grupo,.lateral .marca>div:not(.logo),.lateral .pe .tx{display:none}.nav a{justify-content:center;padding:0}.nav .n{display:none}}
@media (max-width:720px){
  .app{display:block;padding-bottom:84px}.lateral{display:none}
  .main{padding:var(--e4) 16px}.topo{gap:10px}.busca{display:none}.topo .btn span.t{display:none}.pessoa div{display:none}
  .resumo{grid-template-columns:1fr 1fr;gap:10px}.kpi{padding:14px;min-height:118px}.kpi .num{font-size:36px}.kpi svg.mini{display:none}
  .etapas{padding:var(--e4)}
  .trilha{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e5) var(--e2);overflow:visible;padding-bottom:0;scroll-snap-type:none}
  .trilha::before,.trilha::after{display:none}
  .etapa{min-width:0;scroll-snap-align:none}
  .etapa .no{position:relative;z-index:1;width:56px;height:56px;font-size:22px}
  .etapa .no.vazio{font-size:11px}
  .etapa h3{min-height:2.8em;font-size:12px;line-height:1.4}
  .etapa small{font-size:11px;line-height:1.45;min-height:0;max-width:none}
  .etapa .tag{font-size:9px;letter-spacing:.04em;padding:2px 6px;max-width:100%}
  .etapa:nth-child(3n+1)::before,.etapa:nth-child(3n+1)::after{content:"";position:absolute;left:50%;width:calc(200% + var(--e2) + var(--e2));pointer-events:none}
  .etapa:nth-child(3n+1)::before{top:27px;height:2px;background:var(--borda)}
  .etapa:nth-child(3n+1)::after{top:26px;height:4px;border-radius:4px;background:linear-gradient(90deg,transparent 0,var(--blue-claro) 18%,transparent 36%) 0 0/60% 100% no-repeat;filter:blur(1px);animation:pulso 6s linear infinite}
  .etapa:nth-child(4)::after{animation-delay:-3s}
  .clientes{grid-template-columns:1fr}
  .barra{display:flex;position:fixed;left:10px;right:10px;bottom:10px;z-index:20;justify-content:space-around;padding:6px;border-radius:22px;background:rgba(12,20,40,.92);border:1px solid var(--borda-forte);backdrop-filter:blur(14px);box-shadow:0 0 30px -6px var(--glow)}
  .barra a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:56px;min-height:var(--tap);font-size:10.5px;color:var(--dg-fraco);border-radius:14px}
  .barra a[aria-current=page]{color:#fff;background:rgba(0,74,173,.5);box-shadow:0 0 18px -4px var(--glow)}
  .saud h1{font-size:28px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.surge>*{opacity:1;transform:none}}

/* Portagem para os formularios e listas existentes. Sem estilos inline. */
html { scroll-padding-top: 24px; }
body { overflow-wrap: anywhere; }
a:hover { color: var(--paper); }
.skip-link { z-index: 99; }
.app { grid-template-columns: var(--lateral) minmax(0, 1fr); }
.main { width: 100%; max-width: 1800px; margin: 0 auto; }
.painel-content { min-width: 0; }
.marca { text-decoration: none; flex-shrink: 0; }
.marca-nome { min-width: 0; }
.marca-nome b { white-space: nowrap; }
.nav a { min-height: var(--tap); }
.nav a .tx { overflow-wrap: normal; }
.sidebar-account .item { padding: var(--e3) 0; }
.sidebar-account .item .tx b { font-size: 13px; }
.sidebar-logout { width: 100%; }
.sidebar-account .foto { --t: 36px; }
.topo { flex-wrap: wrap; }
.topo .pessoa { margin-left: auto; color: var(--bone); min-width: 0; }
.topo .pessoa > div { max-width: 180px; min-width: 0; }
.topo .pessoa b { font-size: 13px; }
.topo .btn { margin-left: 0; }
.busca { gap: var(--e2); padding-right: var(--e2); }
.busca input[type=search] { min-width: 0; width: 100%; min-height: var(--tap); }
.busca input[type=hidden] { display: none; }
.search-submit { display: grid; place-items: center; width: var(--tap); min-height: var(--tap); flex: 0 0 var(--tap); border: 0; border-radius: 50%; color: var(--blue-claro); background: transparent; }
.search-submit:hover { background: var(--vidro-forte); }
.mobile-action-label { display: none; }
.foto { position: relative; isolation: isolate; }
.foto-inicial { grid-area: 1 / 1; }
.foto img { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.person-inline { display: inline-flex; align-items: center; gap: var(--e2); max-width: 100%; vertical-align: middle; }
.person-inline > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.people-inline { display: flex; flex-wrap: wrap; gap: var(--e3); }
.signal-label { display: inline-flex; align-items: center; gap: 9px; font-size: 12px; color: var(--dg-fraco); }
.signal-label .sem { flex: 0 0 10px; }
.btn, .button { min-height: var(--tap); padding: 10px var(--e5); font: 600 14px/1.35 var(--f-body); letter-spacing: normal; text-transform: none; border-radius: 999px; color: var(--paper); border: 1px solid transparent; background: linear-gradient(135deg, var(--blue), var(--blue-lift)); box-shadow: 0 0 24px -4px var(--glow); }
.btn:hover, .button:hover { color: var(--paper); border-color: var(--blue-lift); background: var(--blue); }
.btn--fantasma, .btn--ghost, .button-quiet { color: var(--bone); border-color: var(--borda-forte); background: var(--vidro); box-shadow: none; }
.btn--fantasma:hover, .btn--ghost:hover, .button-quiet:hover { color: var(--paper); background: var(--vidro-forte); }
.btn:focus-visible, .button:focus-visible { outline: 2px solid var(--blue-claro); outline-offset: 3px; }
.btn--pequeno { min-height: var(--tap); }
.btn .link-arrow { display: none; }
.eyebrow, .record-client { color: var(--blue-claro); }
.page-heading p:last-child, .muted, .field-help, .field label, .field-label, .count-label, .record-description, .record-meta dt, .detail-list dt, .sources, .sources li, .page-footer { color: var(--dg-fraco); }
.panel, .metric, .filters, .auth-card, .approval-card, .agenda-day, .onboarding-progress, .error-state { color: var(--bone); background: var(--vidro); border-color: var(--borda); border-radius: var(--r); }
.panel, .filters { backdrop-filter: blur(14px); }
.section-heading, .record + .record, .client-row + .client-row, .detail-list > div, .grouped-list + .grouped-list, .question-block, .onboarding-review + .onboarding-review, .sources, .approval-status, .form-group, .attachment-list li { border-color: var(--borda); }
.grouped-list > header, th, .kanban-column, .upload-form { background: var(--noite-2); border-color: var(--borda); color: var(--dg-fraco); }
th, td { border-color: var(--borda); }
tbody tr:hover, .step-list a:hover { background: var(--vidro-forte); }
.kanban-column .record { background: var(--vidro); border-color: var(--borda); }
.record-title, .metric-total, .client-row h3 a, .step-number { color: var(--paper); }
.metric { border-top-color: var(--blue-lift); }
.metric h2, .metric-details dt { color: var(--dg-fraco); }
.badge, .view-label, .view-nav a, .invite-result, .step-list a[aria-current=step] { color: var(--blue-claro); background: var(--noite-2); border-color: var(--borda-forte); border-radius: var(--r-sm); }
.badge-good { color: var(--verde); border-color: var(--verde); }
.badge-wait { color: var(--amarelo); border-color: var(--amarelo); }
.badge-alert { color: var(--vermelho); border-color: var(--vermelho); }
.sources .source-warning, .notice-error { color: var(--bone); background: var(--noite-2); border-color: var(--amarelo); }
.notice-success { color: var(--bone); background: var(--noite-2); border-color: var(--verde); }
.field input, .field select, .field textarea, .campo input { color: var(--paper); background: var(--noite-2); border: 1px solid var(--blue-lift); border-radius: var(--r-sm); }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible, .campo input:focus-visible { outline: 2px solid var(--blue-claro); outline-offset: 2px; }
.field select option { color: var(--bone); background: var(--noite-2); }
.step-number { background: var(--noite-2); border-color: var(--borda); }
.step-list small, .approval-status { color: var(--verde); }
.step-list a[aria-current=step] .step-number { background: var(--blue); }
.onboarding-progress progress, .onboarding-progress progress::-webkit-progress-bar { background: var(--noite-2); }
.onboarding-progress progress::-webkit-progress-value { background: var(--blue-lift); }
.onboarding-progress progress::-moz-progress-bar { background: var(--blue-lift); }
.welcome-panel { border-top-color: var(--blue-lift); }
.auth-welcome { margin: 0 0 var(--e2); }
.auth-description { margin: var(--e2) 0 0; }
.auth-error { margin-top: var(--e4); color: var(--vermelho); font-size: 14px; }
.auth-email { margin: var(--e4) 0 0; }
.entrar main { max-width: 440px; }
.entrar h1 { line-height: 1.2; }
.login-form .field-help { font-size: 12px; }
.entrar .rodape { color: var(--dg-fraco); margin-bottom: 0; }
.resumo { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpi { min-width: 0; display: flex; flex-direction: column; }
.kpi .rot { margin-bottom: 0; min-height: 40px; line-height: 1.4; }
.kpi .num { margin: var(--e2) 0; }
.kpi .num--empty { font-size: 25px; line-height: 1.5; }
.kpi .var { margin: 0 0 var(--e2); }
.kpi-link { display: inline-flex; align-items: center; min-height: var(--tap); margin-top: auto; font-size: 12px; font-weight: 500; }
.kpi svg.mini { position: relative; right: auto; bottom: auto; align-self: flex-end; margin: 0 0 var(--e2); }
.kpi .mini rect { fill: var(--blue-claro); }
.kpi--alerta .mini rect { fill: var(--vermelho); }
.luz25 { --luz: .25; }.luz50 { --luz: .5; }.luz75 { --luz: .75; }.luz100 { --luz: 1; }
.etapas h2 { font-size: 20px; }
.etapa { min-width: 0; }
.etapa h3 { margin: 0; font: 500 13px/1.4 var(--f-body); color: var(--paper); }
.etapa small { min-height: 34px; }
.etapa .tag { color: var(--amarelo); }
.attention-item { align-items: flex-start; flex-wrap: wrap; }
.attention-item .tx { flex-basis: 120px; }
.attention-item h3, .linha-tempo h3 { font: 600 14px/1.45 var(--f-body); margin: 0 0 4px; overflow-wrap: anywhere; }
.attention-item p { font-size: 12px; color: var(--dg-fraco); margin: 0 0 var(--e2); }
.attention-item .btn { padding: 10px 16px; font-size: 12px; }
.linha-tempo .signal-label { display: inline-flex; margin-top: 6px; }
.linha-tempo .sem { display: inline-block; }
.linha-tempo .text-link { display: flex; }
.sec-titulo { gap: var(--e3); flex-wrap: wrap; }
.sec-titulo .text-link { gap: 8px; }
.cli h3 { flex: 1; font: 600 15px/1.3 var(--f-body); }
.cli h3 a { color: var(--paper); }
.cli .tres dd { font: 500 22px/1.3 var(--f-disp); color: var(--paper); }
.cli .tres dt { color: var(--dg-fraco); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; }
.cli .tres .al dd { color: var(--vermelho); }
.cli .client-person { margin: 0; font-size: 12px; }
.cli footer { margin-top: auto; }
.operational-summary { margin: var(--e5) 0; padding: var(--e4); }
.operational-summary > summary { min-height: var(--tap); cursor: pointer; color: var(--blue-claro); font-weight: 500; }
.operational-summary > .metrics { margin: var(--e3) 0 0; }
.more-menu > summary { list-style: none; cursor: pointer; }
.more-menu > summary::-webkit-details-marker { display: none; }
.more-title { margin: 0 0 var(--e3); font: 500 18px var(--f-disp); color: var(--paper); }
.more-panel { position: fixed; left: 16px; right: 16px; bottom: calc(86px + env(safe-area-inset-bottom, 0px)); max-height: min(70vh, 34rem); overflow-y: auto; padding: var(--e4); background: var(--noite-2); }
.barra .more-panel a { flex-direction: row; gap: var(--e3); justify-content: flex-start; padding: 10px; font-size: 14px; min-height: var(--tap); }
.more-panel form { margin-top: var(--e3); }
.more-panel .btn { width: 100%; }
@media (max-width:1100px) {
  .app { grid-template-columns: var(--lateral-mini) minmax(0, 1fr); }
  .lateral .marca-nome { display: none; }
  .marca { padding-left: var(--e2); }
  .sidebar-account .item { justify-content: center; }
  .sidebar-logout { padding: 10px; }
  .resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:720px) {
  .app { display: block; padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
  .main { padding: var(--e4); }
  .topo { gap: var(--e3); }
  .topo .busca { display: flex; order: 3; flex: 1 1 100%; max-width: none; }
  .topo .pessoa { margin-left: 0; margin-right: auto; }
  .mobile-action-label { display: inline; }
  .resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi { padding: 12px; }
  .kpi .rot { font-size: 11px; gap: 6px; }
  .kpi .rot .ico { width: 16px; height: 16px; }
  .kpi .var, .kpi-link { font-size: 11px; }
  .cartao { padding: var(--e4); }
  .barra { bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
  .barra > a, .more-menu { flex: 1 1 0; min-width: 0; }
  .barra > a { padding: 4px 2px; font-size: 9px; min-width: 0; text-align: center; overflow-wrap: normal; }
  .more-menu > summary { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: var(--tap); color: var(--bone); font-size: 10px; border-radius: 14px; }
  .more-menu[open] > summary { background: var(--blue); }
  .entrar { padding: 16px; }
  .entrar main { padding: var(--e5) var(--e4); }
  .entrar h1 { font-size: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}
@media print {
  .lateral, .topo, .barra { display: none; }
  .app { display: block; padding-bottom: 0; }
  .main { padding: 0; }
  body { background: var(--noite); color: var(--bone); }
}
/* Foco da busca e agrupamento dos perfis autenticados. */
.busca input[type=search]:focus-visible { outline: 2px solid var(--blue-claro); outline-offset: 2px; border-radius: 6px; }
.agenda-day > h3 { color: var(--blue-claro); border-color: var(--borda); }
.profile-heading { display: flex; align-items: center; gap: var(--e4); margin-bottom: var(--e5); }
.profile-heading h2 { margin-bottom: var(--e2); }
.profile-heading p { margin-bottom: 0; }
.panel:has(> .profile-heading) { padding: var(--e5); }
.panel:has(> .profile-heading) > .record-meta { margin: 0 0 var(--e5); }
@media (max-width: 720px) { .panel:has(> .profile-heading) { padding: var(--e4); } }.topo .pessoa { min-height: var(--tap); }
.cli h3 a { display: flex; align-items: center; min-height: var(--tap); }
/* Legendas pequenas com contraste AA sobre o fundo azul-noite. */
.grupo, .etapa .no.vazio { color: var(--dg-fraco); }

/* Periodos informados pelo servidor e identidade das publicacoes. */
.kpi-periods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e3); margin: var(--e2) 0; }
.kpi-periods > div { min-width: 0; }
.kpi-periods dt { color: var(--dg-fraco); font-size: 12px; line-height: 1.4; }
.kpi-periods dd { margin-top: 4px; color: var(--paper); font: 500 30px/1.15 var(--f-disp); font-variant-numeric: tabular-nums; text-shadow: 0 0 28px var(--glow); }
.kpi-periods dd.period-empty { font: 500 14px/1.4 var(--f-body); text-shadow: none; }
.kpi-total, .kpi-period-note { margin: 0 0 var(--e2); color: var(--dg-fraco); font-size: 12px; line-height: 1.5; }
.publication-client, .linha-tempo .publication-client { display: inline-flex; align-items: center; gap: var(--e2); max-width: 100%; color: inherit; font: inherit; vertical-align: middle; }
.publication-client .foto { display: grid; color: var(--paper); font-size: calc(var(--t) * .4); }
.publication-client .foto-inicial { color: inherit; font: inherit; }
.publication-client > span:last-child { min-width: 0; color: inherit; font: inherit; overflow-wrap: anywhere; }
@media (max-width: 720px) {
  .kpi-periods { grid-template-columns: minmax(0, 1fr); gap: var(--e2); }
  .kpi-periods > div { display: flex; align-items: center; justify-content: space-between; gap: var(--e2); }
  .kpi-periods dt { font-size: 11px; }
  .kpi-periods dd { margin-top: 0; font-size: 24px; }
  .kpi-periods dd.period-empty { font-size: 11px; }
  .kpi-total, .kpi-period-note { font-size: 11px; }
}