/* ───────────────────────── Equipe: Casas, Colaboradores e Entrar ────────────
   As telas da equipe do Marketing (04/10/2026), no desenho do app Comercial.
   Primeiro o esqueleto (o mesmo do index.html: tokens claros, barra azul,
   cabeçalho comum; o escuro vem do identidade.css, que entra depois); depois
   as peças trazidas do painel.css do Comercial: botões, campos, o modal, os
   cartões de pessoa, o perfil e a porta de entrada. */

:root{
  color-scheme: light;
  --brand:#055FFB; --brand-600:#0a4fd8; --brand-50:#EAF1FE;
  --ink:#1B1E22; --navy:#040D1B; --mist:#F3F4F6; --line:#E7E9EE; --muted:#5B6472;
  --ring:#E1E4EA; --ring-hover:#c7cdd8;
  --shadow-card:0 1px 2px rgba(16,24,40,.05), 0 18px 34px -20px rgba(5,95,251,.20);
  --shadow-float:0 10px 22px -8px rgba(16,24,40,.12), 0 34px 60px -26px rgba(5,95,251,.28);
  --hairline:0 0 0 1px rgba(16,24,40,.06);
  --bg:#ffffff; --bg-2:#F3F4F6; --card:#ffffff; --card-2:#F7F8FA;
  --border:#E7E9EE; --text:#1B1E22; --text-dim:#5B6472;
  --erro:#b42323;
}
:root[data-tema="escuro"]{--hairline:0 0 0 1px rgba(255,255,255,.08);--erro:#F0908A;}
*{box-sizing:border-box;margin:0;padding:0;}
/* `hidden` vale sempre: sem isto, o display de .campo e companhia ganhava do
   atributo, e o campo Usuário continuava na tela no modo senha-mestra. */
[hidden]{display:none!important;}
body{font-family:'Inter',system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.5;
  background:radial-gradient(60% 420px at 50% 0%, rgba(var(--brand-rgb),.07), transparent 70%),var(--bg);
  color:var(--text);min-height:100vh;padding:0 0 56px;}
.wrap{max-width:1200px;margin:0 auto;padding-inline:24px;}
@media (max-width:560px){ .wrap{padding-inline:16px;} }
.serif{font-family:'Times New Roman',Times,serif;font-style:italic;font-weight:400;font-size:1.2em;letter-spacing:-.04em;}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,label:focus-within{outline:none;box-shadow:0 0 0 3px rgba(var(--brand-rgb),.35);}
.topbar{background:var(--brand);color:var(--on-brand);font-size:13px;}
.topbar .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:4px 20px;padding-block:11px;}
.topbar b{font-weight:700;letter-spacing:.04em;}
.topbar span{opacity:.88;}
.topbar .sep{display:inline-block;width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.6;margin:0 10px;vertical-align:middle;}
.topbar .quem{margin-left:auto;display:flex;align-items:center;gap:10px;opacity:1;}
.topbar .quem button{border:1px solid currentColor;background:none;color:inherit;font:inherit;font-size:12px;font-weight:600;
  border-radius:999px;padding:3px 11px;cursor:pointer;opacity:.9;}
.topbar .quem button:hover{opacity:1;}
header{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-top:20px;}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;border-radius:999px;}
.brand img{width:44px;height:44px;border-radius:50%;flex:none;}
.spacer{flex:1;}
.intro{padding:34px 0 22px;}
.olho{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);margin-bottom:8px;}
.intro h1{font-size:clamp(34px,4.6vw,52px);line-height:1.06;letter-spacing:-.035em;font-weight:500;}
.sub{color:var(--text-dim);font-size:14.5px;margin-top:8px;max-width:640px;}
.painel{background:var(--card);border-radius:24px;padding:22px 24px;box-shadow:var(--shadow-card),var(--hairline);margin-bottom:18px;}
.painel h2{font-size:16px;font-weight:600;letter-spacing:-.02em;margin-bottom:4px;}
.cap{color:var(--text-dim);font-size:13.5px;margin:0 0 16px;line-height:1.55;}
.dica{color:var(--text-dim);font-size:12.5px;line-height:1.5;}
.secao{margin-top:22px;}
.secao-tit{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);margin:26px 0 12px;}
.aviso{background:var(--mist);border-radius:14px;padding:12px 16px;font-size:13px;color:var(--text-dim);margin-top:18px;}
.vazio{color:var(--text-dim);font-size:14px;padding:26px 0;text-align:center;}
.erro{color:var(--erro);font-size:13.5px;font-weight:500;}
.linha{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

/* botões e campos */
.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:10px 18px;font:inherit;font-size:14px;font-weight:600;
  cursor:pointer;background:var(--card);color:var(--text);box-shadow:inset 0 0 0 1px var(--ring);
  transition:transform .28s var(--ease),box-shadow .25s ease,background-color .25s ease;}
.btn:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 1px var(--ring-hover);}
.btn.pri{background:var(--brand);color:var(--on-brand);box-shadow:0 8px 18px -8px rgba(var(--brand-rgb),.6);}
.btn:disabled{opacity:.6;cursor:not-allowed;transform:none;}
.tgl{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;padding:8px 14px;font:inherit;font-size:13.5px;font-weight:600;
  cursor:pointer;background:var(--card);color:var(--text);box-shadow:inset 0 0 0 1px var(--ring);text-decoration:none;}
.tgl:hover{box-shadow:inset 0 0 0 1px var(--ring-hover);}
label.campo{display:block;}
label.campo>span{display:block;font-size:12.5px;font-weight:600;color:var(--text-dim);margin-bottom:5px;}
.campo input,.campo select{width:100%;font:inherit;font-size:14.5px;color:var(--text);background:var(--card);border:0;border-radius:12px;
  padding:11px 14px;box-shadow:inset 0 0 0 1px var(--ring);}
.campo input:focus,.campo select:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--brand),0 0 0 3px rgba(var(--brand-rgb),.18);}
.paleta{display:flex;gap:8px;flex-wrap:wrap;}
.paleta button{width:28px;height:28px;border-radius:50%;border:3px solid transparent;cursor:pointer;box-shadow:var(--hairline);}
.paleta button[aria-pressed="true"]{border-color:var(--text);}
.selo-senha{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:2px 8px;border-radius:999px;
  background:var(--mist);color:var(--text-dim);margin-top:8px;}
.selo-senha.tem{background:color-mix(in srgb,#1baf7a 16%,transparent);color:#0f7a54;}
:root[data-tema="escuro"] .selo-senha.tem{color:#5FD195;}

/* o modal */
/* margin:auto é o que centraliza o <dialog> aberto com showModal(); o reset
   `*{margin:0}` lá em cima o tinha zerado e a janela grudava no canto. */
dialog.modal{margin:auto;max-height:calc(100dvh - 32px);overflow:auto;border:0;border-radius:24px;padding:0;background:var(--card);color:var(--text);width:min(520px,calc(100vw - 32px));
  box-shadow:var(--shadow-float),var(--hairline);}
dialog.modal::backdrop{background:rgba(4,13,27,.45);backdrop-filter:blur(3px);}
.modal-topo{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 0;}
.modal-topo h2{font-size:19px;font-weight:600;letter-spacing:-.02em;}
.fechar{border:0;background:var(--mist);color:var(--text);width:36px;height:36px;border-radius:999px;font-size:20px;cursor:pointer;}
.modal-corpo{padding:16px 22px 22px;display:grid;gap:14px;}

/* Colaboradores — o desenho do APP COLABORADORES na identidade AMF (do Comercial) */
.grade-pessoas{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;}
/* flex-column: <button> centraliza na vertical, e a capa descolaria do topo nos
   cartões mais baixos da linha (o motivo está no painel.css do Comercial). */
.pessoa{background:var(--card);border:0;border-radius:18px;padding:0;overflow:hidden;cursor:pointer;text-align:left;
  display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
  font:inherit;color:inherit;width:100%;box-shadow:var(--shadow-card),var(--hairline);transition:transform .32s var(--ease),box-shadow .32s ease;}
.pessoa:hover{transform:translateY(-3px);box-shadow:var(--shadow-float),var(--hairline);}
.pessoa-capa{height:64px;flex:0 0 64px;}
.pessoa-corpo{padding:0 18px 18px;}
.pessoa-av{width:62px;height:62px;border-radius:50%;border:3px solid var(--card);margin-top:-32px;display:grid;place-items:center;position:relative;
  font-size:22px;font-weight:700;color:#fff;background-size:cover;background-position:center;}
.pessoa-nome{font-size:15.5px;font-weight:600;letter-spacing:-.02em;margin-top:9px;}
.usuario{font-size:12.5px;font-weight:500;color:var(--brand-600,var(--brand));margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.perfil .usuario{font-size:14px;margin-top:4px;}
.pessoa-cargo{font-size:12.5px;color:var(--text-dim);margin-top:2px;}
.pessoa-nova{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:200px;
  background:transparent;border:2px dashed var(--ring);box-shadow:none;color:var(--text-dim);font-weight:600;}
.pessoa-nova:hover{border-color:var(--brand);color:var(--brand);box-shadow:none;}
.pessoa-nova b{font-size:28px;line-height:1;}
/* o selo da casa preso na foto, no canto de baixo à direita (a câmera vai para a esquerda) */
.moeda.selo-na-foto{position:absolute;right:-6px;bottom:-4px;}   /* .moeda (casas.css) é relative e carrega depois */
.capa-av .moeda.selo-na-foto{right:-10px;bottom:-2px;}
.capa-av .av-cam{right:auto;left:2px;}

.capa{height:170px;position:relative;border-radius:24px 24px 0 0;display:grid;place-items:end center;}
.capa-av{width:108px;height:108px;border-radius:50%;border:4px solid var(--card);margin-bottom:-54px;display:grid;place-items:center;
  font-size:38px;font-weight:700;color:#fff;background-size:cover;background-position:center;position:relative;
  box-shadow:0 8px 24px rgba(16,24,40,.25);}
label.capa-av{cursor:pointer;}
.capa-av input,.capa-btn input{display:none;}
.av-cam{position:absolute;right:2px;bottom:2px;width:30px;height:30px;border-radius:50%;background:var(--brand);
  border:3px solid var(--card);display:grid;place-items:center;font-size:13px;transition:transform .2s var(--ease);}
.capa-av:hover .av-cam{transform:scale(1.1);}
.capa-acoes{position:absolute;top:12px;right:12px;display:flex;gap:8px;z-index:1;}
.capa-btn{background:rgba(4,13,27,.5);color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:7px 13px;
  font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
.capa-btn:hover{background:rgba(4,13,27,.75);border-color:#fff;}
.perfil{background:var(--card);border-radius:0 0 24px 24px;padding:66px 22px 26px;text-align:center;box-shadow:var(--shadow-card),var(--hairline);}
.perfil h2{font-size:24px;font-weight:600;letter-spacing:-.03em;margin:0;}
.perfil .id{font-size:12px;color:var(--brand);text-transform:uppercase;letter-spacing:.09em;margin-top:6px;font-weight:600;}
.chip-casa{text-decoration:none;display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:11px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;padding:3px 10px;border-radius:999px;color:var(--c);background:color-mix(in srgb,var(--c) 13%,transparent);}
.lema-casa{font-family:'Times New Roman',Times,Georgia,serif;font-style:italic;color:var(--text-dim);margin:8px 0 0;font-size:15.5px;}

/* ───────────────────────── A porta (entrar.html) ──────────────────────────
   Uma coluna centralizada: o brasão, o nome da faculdade e "Marketing" em
   Times itálico; o login num cartão; e as seis casas por último. */
body.entrar-pg{padding:0;}
.entrar{position:relative;min-height:100vh;min-height:100dvh;display:flex;justify-content:center;background:var(--bg);
  background-image:radial-gradient(80% 50% at 50% 0%,var(--brand-50),transparent 70%);padding-inline:16px;}
.entrar::after{content:"";position:absolute;left:0;right:0;bottom:0;height:16px;opacity:.22;background:var(--brand);
  -webkit-mask:var(--friso) repeat-x;-webkit-mask-size:32px 16px;mask:var(--friso) repeat-x;mask-size:32px 16px;}
.entrar-tema{position:absolute;top:20px;right:20px;}
.entrar-col{width:100%;max-width:980px;display:flex;flex-direction:column;align-items:center;text-align:center;padding-block:44px 64px;}
.entrar-logo{width:120px;height:auto;display:block;animation:entrarSobe .6s var(--ease) both;}
.entrar-titulo{margin:20px 0 30px;font-size:clamp(28px,4.4vw,52px);font-weight:500;line-height:1.1;letter-spacing:-.035em;color:var(--text);text-wrap:balance;}
.entrar-titulo span{display:block;animation:entrarSobe .6s var(--ease) both;}
/* No Marketing a itálica é a PRIMEIRA linha ("Setor de Marketing"); no Comercial, a segunda. */
.entrar-titulo .l1{animation-delay:.08s;font-family:'Times New Roman',Times,serif;font-style:italic;font-weight:400;font-size:1.08em;letter-spacing:-.025em;}
.entrar-titulo .l2{animation-delay:.18s;}
@keyframes entrarSobe{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.entrar-cartao{width:100%;max-width:420px;text-align:left;background:var(--card);border-radius:24px;padding:28px 28px 22px;
  box-shadow:var(--shadow-float),var(--hairline);display:flex;flex-direction:column;gap:6px;animation:entrarSobe .6s .26s var(--ease) both;}
.entrar-h2{margin:2px 0 0;font-size:clamp(22px,2.4vw,27px);font-weight:500;letter-spacing:-.035em;line-height:1.1;}
.entrar-cartao .sub{margin:2px 0 16px;}
.entrar-form{display:grid;gap:12px;}
.entrar-form .erro:empty{display:none;}
.entrar-senha{position:relative;display:block;}
.entrar-senha input{width:100%;padding-right:92px;}
.entrar-olhar{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;border-radius:999px;padding:6px 12px;
  background:var(--mist);color:var(--text-dim);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;}
.entrar-olhar:hover{color:var(--text);}
.entrar-btn{width:100%;justify-content:center;padding-block:13px;margin-top:4px;font-size:15px;}
.entrar-ajuda{margin-top:12px;font-size:13.5px;color:var(--text-dim);}
.entrar-ajuda summary{cursor:pointer;font-weight:600;color:var(--brand);width:max-content;max-width:100%;}
.entrar-ajuda p{margin:8px 0 0;line-height:1.55;}
.entrar-mestra{align-self:flex-start;margin-top:6px;border:0;background:none;padding:0;font:inherit;font-size:12.5px;color:var(--text-dim);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer;}
.entrar-mestra:hover{color:var(--text);}
.entrar-casas{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 18px;margin-top:36px;}
.entrar-casa{display:flex;flex-direction:column;align-items:center;gap:7px;width:76px;animation:entrarSobe .6s var(--ease) both;}
.entrar-casa:nth-child(1){animation-delay:.34s} .entrar-casa:nth-child(2){animation-delay:.38s} .entrar-casa:nth-child(3){animation-delay:.42s}
.entrar-casa:nth-child(4){animation-delay:.46s} .entrar-casa:nth-child(5){animation-delay:.5s} .entrar-casa:nth-child(6){animation-delay:.54s}
.entrar-casa i{font-style:normal;font-size:11px;font-weight:600;color:var(--text-dim);white-space:nowrap;}
.entrar-pe{margin:22px 0 0;font-size:12px;color:var(--text-dim);}
@media (max-width:560px){
  .entrar-col{padding-block:56px 48px;}
  .entrar-logo{width:84px;}
  .entrar-titulo{margin:14px 0 22px;}
  .entrar-cartao{padding:22px 18px 18px;}
  .entrar-casas{gap:10px 8px;}
  .entrar-casa{width:56px;} .entrar-casa .moeda{width:36px!important;height:36px!important;}
  .entrar-casa i{font-size:10px;}
  .entrar-tema{top:12px;right:12px;}
}
@media (prefers-reduced-motion:reduce){ .entrar-logo,.entrar-titulo span,.entrar-cartao,.entrar-casa{animation:none;} }

/* ───────────────────────── Foguinho (do painel.css do Comercial) ──
   O laranja do fogo e o verde do "bateu" são fixos nos dois temas: são
   semáforo, não cor de marca. O resto usa os tokens, para acompanhar o tema. */
.fogo{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;font-weight:700;
  margin-left:7px;padding:1px 7px;border-radius:999px;vertical-align:middle;
  background:var(--mist);color:var(--text-dim);}
.fogo.on{background:#FFF1E6;color:#C2410C;}
:root[data-tema="escuro"] .fogo.on{background:#43200c;color:#FDBA74;}

.metas{margin-bottom:18px;}
.metas-topo{display:flex;gap:18px;flex-wrap:wrap;align-items:flex-start;}
/* o texto cede espaço; sem isto o parágrafo longo empurra os números para a linha de baixo */
.metas-topo>div:first-child{flex:1 1 320px;min-width:0;}
.metas-topo .cap{max-width:62ch;}
.metas-topo h2{font-size:16px;font-weight:600;}
.metas-nums{display:flex;gap:22px;margin-left:auto;flex:0 0 auto;}
.metas-nums b{display:block;font-size:24px;font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums;}
.metas-nums span{font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;}
.rk-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:18px;}
.rk-tit{font-size:11.5px;font-weight:700;color:var(--text-dim);text-transform:uppercase;
  letter-spacing:.06em;margin-bottom:8px;}
.rk-linha{display:flex;align-items:center;gap:10px;width:100%;background:none;border:0;
  padding:7px 8px;border-radius:10px;cursor:pointer;font:inherit;color:inherit;text-align:left;
  text-decoration:none;}   /* é <a> para dar clique-do-meio e "abrir em nova aba" */
.rk-linha:hover{background:var(--mist);}
.rk-linha.eu{background:var(--brand-50);box-shadow:inset 3px 0 0 var(--brand);}
.rk-voce{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--brand-600,var(--brand));margin-left:4px;}
.rk-pos{width:22px;text-align:center;font-size:14px;flex:0 0 auto;}
.rk-pos .pos{font-size:12px;font-weight:700;color:var(--text-dim);font-variant-numeric:tabular-nums;}
.rk-av{width:28px;height:28px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  font-size:11.5px;font-weight:700;color:#fff;background-size:cover;background-position:center;}
.rk-nome{flex:1;min-width:0;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rk-val{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;}
.rk-val i{font-style:normal;font-size:11.5px;font-weight:400;color:var(--text-dim);}

.meta-perfil{display:flex;gap:22px;flex-wrap:wrap;align-items:center;}
.mp-fogo{text-align:center;padding:4px 18px 4px 0;border-right:1px solid var(--line);flex:0 0 auto;}
.mp-fogo b{display:block;font-size:30px;font-weight:600;line-height:1.1;color:var(--text-dim);}
.mp-fogo.on b{color:#C2410C;}
:root[data-tema="escuro"] .mp-fogo.on b{color:#FDBA74;}
.mp-fogo span{font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;}
.mp-hoje{flex:1;min-width:220px;}
.mp-hoje-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13.5px;}
.mp-hoje-top span{font-variant-numeric:tabular-nums;color:var(--text-dim);}
.mp-barra{height:8px;border-radius:999px;background:var(--mist);margin-top:8px;overflow:hidden;}
.mp-barra i{display:block;height:100%;border-radius:999px;background:var(--brand);transition:width .4s var(--ease);}
.mp-barra i.on{background:#15803D;}
:root[data-tema="escuro"] .mp-barra i.on{background:#4ADE80;}
.mp-pe{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;font-size:12px;color:var(--text-dim);}

/* a tirinha de dias: verde = tudo no prazo, verde-claro = nada vencia, laranja = hoje
   ainda falta marcar, vermelho = passou do prazo */
.tira{display:flex;gap:5px;margin-top:14px;flex-wrap:wrap;}
.tira-d{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;
  background:var(--mist);color:var(--text-dim);font-size:11px;font-weight:600;
  border:1px solid var(--line);}
.tira-d i{font-style:normal;}
.tira-d.meio{background:#FFF1E6;color:#C2410C;border-color:#FDBA74;}
.tira-d.on{background:#15803D;color:#fff;border-color:transparent;}
:root[data-tema="escuro"] .tira-d.meio{background:#43200c;color:#FDBA74;border-color:#7c3a12;}
:root[data-tema="escuro"] .tira-d.on{background:#166534;color:#DCFCE7;}
/* Dia sem demanda vencendo: não conta (07/10/2026) — neutro, e não verde de "acertou". */
.tira-d.livre{background:var(--mist);color:var(--muted);border-color:var(--line);}
.tira-d.perdeu{background:#d03b3b;color:#fff;border-color:transparent;}
:root[data-tema="escuro"] .tira-d.livre{background:rgba(255,255,255,.04);color:var(--text-dim);border-color:rgba(255,255,255,.08);}
.perdidas{margin-top:12px;display:grid;gap:6px;}
.perdidas-tit{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#d03b3b;}
.perdida{background:var(--card-2);border-left:4px solid #d03b3b;border-radius:10px;padding:8px 12px;box-shadow:inset 0 0 0 1px var(--line);}
.perdida b{display:block;font-size:13.5px;font-weight:600;}
.perdida span{font-size:12px;color:var(--text-dim);}

/* As demandas da pessoa, no perfil (do painel.css do Comercial) */
.dem-lista{display:flex;flex-direction:column;gap:8px;}
.dem-item{display:block;text-decoration:none;color:var(--text);background:var(--card-2);border-left:4px solid var(--brand);
  border-radius:12px;padding:10px 14px;box-shadow:inset 0 0 0 1px var(--line);transition:transform .28s var(--ease),box-shadow .25s ease;}
.dem-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-card),var(--hairline);}
.dem-item .t{font-size:14px;font-weight:600;}
.dem-item.done .t{text-decoration:line-through;opacity:.65;}
.dem-item .m{display:flex;gap:8px 12px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--text-dim);margin-top:5px;}
.kb-proj{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;
  padding:1px 8px;border-radius:999px;background:var(--mist);color:var(--text);}
.kb-proj::before{content:"";width:7px;height:7px;border-radius:50%;flex:none;background:var(--c, var(--muted));box-shadow:inset 0 0 0 1px rgba(16,24,40,.15);}
.det-st{font-size:11.5px;font-weight:700;border-radius:999px;padding:2px 10px;}
.dem-filtro{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;}
.dem-filtro button{border:0;border-radius:999px;padding:6px 12px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;background:var(--mist);color:var(--text-dim);}
.dem-filtro button[aria-pressed="true"]{background:var(--brand);color:var(--on-brand);}
/* as semanas da lista de demandas */
.dem-semana+.dem-semana{margin-top:18px;}
.dem-semana-tit{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px;
  padding-bottom:6px;border-bottom:1px solid var(--line);}
.dem-semana-tit b{font-size:13px;font-weight:700;color:var(--text);}
.dem-semana-tit span{font-size:12px;color:var(--text-dim);}
.dem-semana.atual .dem-semana-tit b{color:var(--brand);}
/* o pop-up da demanda */
.dem-pop .m{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.dem-pop a.btn{text-decoration:none;}
.dem-pop-dados{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:0;}
.dem-pop-dados dt,.dem-pop-tit{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);margin-bottom:3px;}
.dem-pop-dados dd{margin:0;font-size:14px;}
.dem-pop-desc{margin:0;font-size:14px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;}
.dem-pop-chk{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:14px;}
.dem-pop-chk li.feito{text-decoration:line-through;opacity:.6;}

/* 🛡️ O escudo do foguinho (05/10/2026): quem adianta ganha; num dia em que algo
   passa do prazo, um é gasto e o foguinho não zera. Azul, para não se misturar
   com o verde do "no prazo" nem com o vermelho do "passou". */
.mp-escudos{display:block;margin-top:6px;font-style:normal;font-size:11.5px;font-weight:600;color:var(--text-dim);}
.mp-escudos.on{color:var(--brand);}
.fogo-escudo{font-size:.9em;font-weight:600;color:var(--brand);white-space:nowrap;}
.rk-val i.rk-escudo{color:var(--brand);font-weight:600;}
.tira-d.salvo{background:#E8F0FF;color:var(--brand);border-color:#9DBBFF;}
:root[data-tema="escuro"] .tira-d.salvo{background:#0e2350;border-color:#2a4f9e;}
.escudos{margin-top:12px;display:grid;gap:6px;}
.escudos-tit{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--brand);}
.escudo{background:var(--card-2);border-left:4px solid var(--brand);border-radius:10px;padding:8px 12px;box-shadow:inset 0 0 0 1px var(--line);}
.escudo.gastou{border-left-color:#9DBBFF;}
.escudo b{display:block;font-size:13.5px;font-weight:600;}
.escudo span{font-size:12px;color:var(--text-dim);}
.perdida.salva{border-left-color:#9DBBFF;}
/* O "✓ Foi no prazo" do gestor (08/10/2026) e a lista do que ele ajustou. */
.perdida:has(.bt-ajuste){display:flex;align-items:center;gap:10px;}
.perdida-txt{flex:1;min-width:0;}
.perdida.ajustada{border-left-color:#2fa36b;}
.ajustadas-tit{color:#2fa36b;}
.bt-ajuste{flex:none;border:1px solid #2fa36b;background:transparent;color:#2fa36b;font:inherit;font-size:12px;font-weight:700;
  padding:5px 10px;border-radius:999px;cursor:pointer;white-space:nowrap;}
.bt-ajuste:hover{background:#2fa36b;color:#fff;}
.bt-ajuste.desfazer{border-color:var(--line);color:var(--text-dim);}
.bt-ajuste.desfazer:hover{background:var(--line);color:var(--text);}
.bt-ajuste:disabled{opacity:.6;cursor:progress;}
/* ⚡ adiantou: o raio no canto do dia em que a pessoa entregou antes do prazo */
.tira-d{position:relative;}
.tira-raio{position:absolute;top:-7px;right:-6px;font-size:12px;line-height:1;filter:drop-shadow(0 0 1px var(--card));}
.escudo.adiantou{border-left-color:#F5B700;}