/* Montagens Casa Light — visual portado do protótipo v5.
   Layout: no celular, coluna única com barra de ação fixa embaixo; no computador, o gerente vê lista e detalhe lado a lado.
   Fontes: Barlow / Barlow Semi Condensed se estiverem instaladas; senão, a fonte do sistema (nada é baixado de fora). */
:root{
  --bg:#e8eeec;--surface:#fff;--surface-2:#f2f6f5;--ink:#12201e;--muted:#53635f;--line:#d0dad7;
  --accent:#0a6b5a;--accent-ink:#fff;--accent-soft:#d9efe9;--danger:#b3261e;--danger-soft:#fbe6e4;
  --kraft:#7d5020;--kraft-bg:#f5e9d7;
  --c-agendada:#2c5d8f;--c-agendada-bg:#e3edf8;--c-andamento:#8f5400;--c-andamento-bg:#fdefd3;
  --c-concluida:#1c6e38;--c-concluida-bg:#def3e4;--c-pendencia:#a8231b;--c-pendencia-bg:#fbe3e1;
  --c-cancelada:#55616b;--c-cancelada-bg:#e6e9ec;
  --r:12px;
  --f:"Barlow",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --fd:"Barlow Semi Condensed","Barlow",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0c1413;--surface:#15201e;--surface-2:#1b2927;--ink:#e6efed;--muted:#97aaa5;--line:#2a3b38;
  --accent:#3fcab0;--accent-ink:#03221c;--accent-soft:#12332d;--danger:#ff8a80;--danger-soft:#3a1c1a;
  --kraft:#e0b27a;--kraft-bg:#33271a;
  --c-agendada:#8ab8ee;--c-agendada-bg:#1c2e42;--c-andamento:#f2b45a;--c-andamento-bg:#3a2c12;
  --c-concluida:#6fd391;--c-concluida-bg:#15321f;--c-pendencia:#ff9a92;--c-pendencia-bg:#3a1c1a;
  --c-cancelada:#a2afb9;--c-cancelada-bg:#232f38;color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0c1413;--surface:#15201e;--surface-2:#1b2927;--ink:#e6efed;--muted:#97aaa5;--line:#2a3b38;
  --accent:#3fcab0;--accent-ink:#03221c;--accent-soft:#12332d;--danger:#ff8a80;--danger-soft:#3a1c1a;
  --kraft:#e0b27a;--kraft-bg:#33271a;
  --c-agendada:#8ab8ee;--c-agendada-bg:#1c2e42;--c-andamento:#f2b45a;--c-andamento-bg:#3a2c12;
  --c-concluida:#6fd391;--c-concluida-bg:#15321f;--c-pendencia:#ff9a92;--c-pendencia-bg:#3a1c1a;
  --c-cancelada:#a2afb9;--c-cancelada-bg:#232f38;color-scheme:dark}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.4 var(--f);
  padding-left:max(0px,env(safe-area-inset-left,0px));padding-right:max(0px,env(safe-area-inset-right,0px))}
h1,h2,h3,p,ol,ul,dl,fieldset{margin:0}
h1,h2,h3,.hora,.kpi b,.vol,.marcador,.destino,.proxima .end{font-family:var(--fd)}
h1{font-size:1.75rem;line-height:1.1;font-weight:700;text-wrap:balance}
h2{font-size:1.2rem;font-weight:700;line-height:1.2}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
.sub{color:var(--muted);font-size:.95rem}
.i{width:1.2em;height:1.2em;flex:none}

/* ---------- barra superior ---------- */
.topo{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--ink);color:var(--bg);
  padding:10px max(16px,env(safe-area-inset-right,0px)) 10px max(16px,env(safe-area-inset-left,0px))}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--ink)}
.topo-in{max-width:1240px;margin:0 auto;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.marca{display:flex;align-items:center;gap:10px;margin-right:auto}
.logo{width:34px;height:34px;border-radius:9px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center}
.logo .i{width:20px;height:20px}
.marca b{font-family:var(--fd);font-size:1.2rem;line-height:1;display:block}
.marca small{display:block;font-size:.75rem;opacity:.7;line-height:1.2}
.verc{font-size:.8rem;opacity:.7;font-weight:600}
.papel{display:flex;gap:3px;padding:3px;border-radius:11px;background:color-mix(in srgb,var(--bg) 16%,transparent)}
.papel button{border:0;background:transparent;color:inherit;padding:8px 14px;border-radius:8px;font-weight:700;cursor:pointer;min-height:40px}
.papel button[aria-pressed="true"]{background:var(--bg);color:var(--ink)}

/* ---------- páginas ---------- */
.pagina{max-width:980px;margin:0 auto;padding:22px max(16px,env(safe-area-inset-right,0px)) 130px max(16px,env(safe-area-inset-left,0px));display:grid;gap:16px}
.pagina.larga{max-width:1240px}
.cabeca{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cabeca-t{display:grid;gap:4px;min-width:0}
.voltar{display:inline-flex;align-items:center;gap:4px;min-height:44px;font-weight:700;color:var(--accent);background:none;border:0;cursor:pointer;padding:0;justify-self:start}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:10px 18px;border-radius:var(--r);
  border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font-weight:700;text-decoration:none;cursor:pointer;text-align:center;
  transition:transform .08s,border-color .15s}
.btn:hover{border-color:var(--muted)}
.btn:active{transform:scale(.98)}
.btn.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.per{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 55%,var(--line))}
.btn.peq{min-height:42px;padding:6px 14px;font-size:.95rem}
.btn.bloco{width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.acoes{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- cartões, pílulas, trilha de andamento ---------- */
.cartao{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:grid;gap:14px}
.cartao>h2{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 11px;border-radius:999px;font-size:.85rem;font-weight:700;white-space:nowrap}
.pill .i{width:1em;height:1em}
.pill.e{background:transparent;border:1.5px solid currentColor;padding:2px 10px}
.s-agendada{background:var(--c-agendada-bg);color:var(--c-agendada)}.s-em_andamento{background:var(--c-andamento-bg);color:var(--c-andamento)}
.s-concluida{background:var(--c-concluida-bg);color:var(--c-concluida)}.s-pendencia{background:var(--c-pendencia-bg);color:var(--c-pendencia)}
.s-cancelada{background:var(--c-cancelada-bg);color:var(--c-cancelada)}
.pill.e.s-agendada,.pill.e.s-concluida,.pill.e.s-pendencia{background:transparent}

.trilha{display:flex;gap:6px;flex-wrap:wrap;list-style:none;padding:0;margin:6px 0 0}
.passo{display:inline-flex;align-items:center;gap:6px;padding:3px 11px 3px 3px;border-radius:999px;font-size:.88rem;font-weight:700;
  border:1.5px solid var(--line);color:var(--muted);white-space:nowrap}
.passo .chip{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);color:var(--muted)}
.passo .chip .i{width:14px;height:14px}
.passo.ok{border-color:transparent;background:var(--c-concluida-bg);color:var(--c-concluida)}
.passo.ok .chip{background:var(--c-concluida);color:var(--surface)}
.passo.now{border-color:transparent;background:var(--c-andamento-bg);color:var(--c-andamento)}
.passo.now .chip{background:var(--c-andamento);color:var(--surface)}
.passo.bad{border-color:transparent;background:var(--c-pendencia-bg);color:var(--c-pendencia)}
.passo.bad .chip{background:var(--c-pendencia);color:var(--surface)}
.passo.off{opacity:.5}
.trilha.grande .passo{padding:5px 14px 5px 5px;font-size:.98rem}
.trilha.grande .chip{width:28px;height:28px}

.vchip{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:8px;background:var(--kraft-bg);color:var(--kraft);font-weight:700;font-size:.9rem;width:fit-content}

/* ---------- resumo do gerente ---------- */
.kpis{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;display:grid;gap:4px;text-align:left;cursor:pointer;align-content:start}
.kpi:hover{border-color:var(--muted)}
.kpi small{color:var(--muted);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em}
.kpi b{font-size:2rem;line-height:1;font-weight:700}
.kpi b span{font-size:1.1rem;color:var(--muted);font-weight:600}
.kpi.risco b{color:var(--danger)}
.kpi.estatico{cursor:default}
.barra{height:8px;border-radius:999px;background:var(--line);overflow:hidden}
.barra>i{display:block;height:100%;background:var(--accent);border-radius:999px}

.dual{display:grid;gap:18px;grid-template-columns:minmax(0,1fr)}
.col-lista,.col-det{display:grid;gap:14px;align-content:start;min-width:0}
.col-vazia{display:none}
@media (min-width:980px){
  .dual{grid-template-columns:minmax(380px,450px) minmax(0,1fr);align-items:start}
  .col-det{position:sticky;top:84px;max-height:calc(100vh - 104px);overflow-y:auto;padding-right:4px}
  .col-vazia{display:grid;place-items:center;text-align:center;color:var(--muted);min-height:280px;border:1.5px dashed var(--line);border-radius:var(--r);padding:24px;gap:8px}
  .so-mobile{display:none!important}
}
@media (max-width:979px){
  .dual.com-detalhe .col-lista{display:none}
  .dual:not(.com-detalhe) .col-det{display:none}
}

/* ---------- listas ---------- */
.tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.tabs a{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 14px;border-radius:999px;background:var(--surface);
  border:1.5px solid var(--line);font-weight:700;cursor:pointer}
.tabs a[aria-current="page"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tabs .n{font-size:.82rem;opacity:.8}
.lista{display:grid;gap:10px;list-style:none;margin:0;padding:0}
.servico{display:grid;grid-template-columns:78px minmax(0,1fr);gap:14px;align-items:start;width:100%;text-align:left;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);padding:14px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.servico:hover{border-color:var(--muted)}
.servico[aria-current="true"]{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.servico.solo{grid-template-columns:minmax(0,1fr)}
.quando{border-right:1px solid var(--line);padding-right:12px;display:grid;gap:4px;align-content:start;justify-items:center;text-align:center}
.quando .hora{font-size:1.55rem;font-weight:700;line-height:1}
.quando .dia{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.corpo{display:grid;gap:4px;min-width:0}
.corpo strong{font-size:1.12rem;line-height:1.25;overflow-wrap:anywhere}
.l{display:flex;gap:6px;align-items:flex-start;color:var(--muted);font-size:.95rem;overflow-wrap:anywhere;line-height:1.3}
.l .i{margin-top:.12em;width:1.05em;height:1.05em}
.sec{font-size:.8rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:700;margin-top:6px;font-family:var(--f)}
.sec.al{color:var(--danger)}
.vazio{text-align:center;color:var(--muted);padding:32px 16px;background:var(--surface);border:1.5px dashed var(--line);border-radius:var(--r)}

/* ---------- rota do entregador ---------- */
.proxima{background:var(--accent);color:var(--accent-ink);border-radius:var(--r);padding:16px;display:grid;gap:12px}
.proxima .kick{font-size:.78rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;opacity:.85}
.proxima .end{font-size:1.65rem;font-weight:700;line-height:1.15;overflow-wrap:anywhere}
.proxima .quem{font-size:1.05rem;font-weight:600}
.proxima .vchip{background:color-mix(in srgb,var(--accent-ink) 18%,transparent);color:inherit}
.proxima .btn{background:var(--accent-ink);color:var(--accent);border-color:transparent}
.proxima .btn.sec2{background:transparent;color:inherit;border-color:color-mix(in srgb,var(--accent-ink) 55%,transparent)}
.rota{list-style:none;padding:0;display:grid}
.parada{display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;position:relative;padding-bottom:10px}
.parada:not(:last-child)::before{content:"";position:absolute;left:20px;top:42px;bottom:-2px;width:2px;background:var(--line)}
.marcador{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:1.2rem;background:var(--surface);border:2px solid var(--line);position:relative;z-index:1}
.marcador .i{width:20px;height:20px}
.parada.ok .marcador{background:var(--c-concluida);border-color:var(--c-concluida);color:var(--surface)}
.parada.bad .marcador{border-color:var(--c-pendencia);color:var(--c-pendencia)}
.parada.prox .marcador{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.parada.ok .servico{opacity:.72}

/* ---------- formulários ---------- */
label.campo{display:grid;gap:6px;font-weight:600;font-size:.95rem}
label.campo .dica{font-weight:500;color:var(--muted);font-size:.85rem}
input[type=text],input[type=tel],input[type=date],input[type=time],input[type=number],select,textarea{width:100%;min-height:50px;padding:10px 12px;border-radius:var(--r);
  border:1.5px solid var(--line);background:var(--surface);font-weight:500}
textarea{min-height:92px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--accent)}
.grade{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}.grade .largo{grid-column:1/-1}
fieldset{border:0;padding:0;display:grid;gap:14px;min-width:0}
fieldset+fieldset{border-top:1px solid var(--line);padding-top:18px}
legend{padding:0;margin-bottom:12px;font-family:var(--fd);font-weight:700;font-size:1.15rem;display:flex;align-items:center;gap:8px;float:left;width:100%}
legend+*{clear:both}

/* ---------- detalhes ---------- */
.dados{display:grid;gap:14px 20px;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));margin:0}
.dados dt{font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
.dados dd{margin:2px 0 0;font-weight:600;overflow-wrap:anywhere}.dados .largo{grid-column:1/-1}
.alerta{padding:12px 14px;border-radius:var(--r);background:var(--c-pendencia-bg);color:var(--c-pendencia);font-weight:600;display:flex;gap:10px;align-items:flex-start}
.alerta .i{margin-top:.15em}
.nota{padding:12px 14px;border-radius:var(--r);background:var(--surface-2);border:1px solid var(--line)}
.ok-msg{padding:12px 14px;border-radius:var(--r);background:var(--c-concluida-bg);color:var(--c-concluida);font-weight:700;display:flex;gap:10px;align-items:center}
.hist{list-style:none;padding:0;display:grid;gap:10px;font-size:.95rem}
.hist li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px}.hist time{color:var(--muted)}
.destino{font-size:1.45rem;font-weight:700;line-height:1.2;overflow-wrap:anywhere}
.atalhos{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr))}
.vol{font-size:1.9rem;font-weight:700;display:flex;align-items:center;gap:10px;color:var(--kraft);line-height:1}
.vol .i{width:1.1em;height:1.1em}

/* ---------- fotos em blocos ---------- */
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (min-width:700px){.tiles{grid-template-columns:repeat(4,minmax(0,1fr))}.tiles.um{grid-template-columns:minmax(0,260px)}}
.tiles.um{grid-template-columns:minmax(0,1fr)}
@media (min-width:700px){.tiles.um{grid-template-columns:minmax(0,260px)}}
.tile{display:grid;gap:8px;align-content:start;cursor:pointer;min-width:0;background:none;border:0;padding:0;text-align:left}
.tile.so-ver{cursor:zoom-in}
.tile-img{position:relative;aspect-ratio:1/1;border-radius:var(--r);overflow:hidden;border:2px dashed var(--line);background:var(--surface-2);display:grid;place-items:center;
  align-content:center;gap:6px;text-align:center;padding:10px;color:var(--muted);transition:border-color .15s}
.tile:hover .tile-img{border-color:var(--accent)}
.tile.ok .tile-img{border-style:solid;border-color:var(--c-concluida);padding:0}
.tile-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tile-img .i-cam{width:38px;height:38px;color:var(--accent)}
.tile-img small{font-size:.82rem;line-height:1.25}
.tile .feito{position:absolute;top:8px;right:8px;width:30px;height:30px;border-radius:50%;background:var(--c-concluida);color:#fff;display:grid;place-items:center;
  animation:pop .25s ease-out}
.tile .feito .i{width:18px;height:18px}
.tile .trocar{position:absolute;left:8px;bottom:8px;background:rgba(0,0,0,.62);color:#fff;border-radius:8px;padding:3px 9px;font-size:.82rem;font-weight:700;display:flex;gap:6px;align-items:center}
.tile-t{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-weight:700;line-height:1.2}
.tag{font-size:.68rem;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent);text-transform:uppercase;letter-spacing:.05em}
.tag.opc{background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}
@keyframes pop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}

/* ---------- barra fixa, avisos, ampliação ---------- */
.fixa{position:fixed;left:0;right:0;bottom:0;z-index:15;background:var(--surface);border-top:1px solid var(--line);
  padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.fixa-in{max-width:980px;margin:0 auto;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.fixa-in .btn{flex:1 1 220px}
.prog{display:flex;align-items:center;gap:10px;font-weight:700;font-size:.95rem;flex:1 1 200px;min-width:0}
.pts{display:flex;gap:5px}
.pts i{width:14px;height:14px;border-radius:50%;border:2px solid var(--line);background:transparent;display:block}
.pts i.on{background:var(--c-concluida);border-color:var(--c-concluida)}
.chk{display:inline-flex;align-items:center;gap:5px;font-weight:700;font-size:.9rem;color:var(--muted)}
.chk .i{width:1.1em;height:1.1em;border:2px solid var(--line);border-radius:50%;padding:1px;color:transparent}
.chk.on{color:var(--c-concluida)}
.chk.on .i{background:var(--c-concluida);border-color:var(--c-concluida);color:var(--surface)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(104px + env(safe-area-inset-bottom,0px));z-index:40;background:var(--ink);color:var(--bg);
  padding:11px 18px;border-radius:999px;font-weight:700;display:flex;gap:8px;align-items:center;box-shadow:0 8px 24px rgba(0,0,0,.25);animation:pop .2s ease-out;max-width:calc(100vw - 32px)}
.zoom{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.86);display:grid;place-items:center;padding:20px;cursor:zoom-out}
.zoom img{max-width:min(100%,960px);max-height:86vh;border-radius:10px;object-fit:contain}
.zoom .btn{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:14px;min-height:44px;padding:8px 12px}
details summary{cursor:pointer;font-weight:700;min-height:44px;display:flex;align-items:center;gap:8px;color:var(--danger)}
details[open] summary{margin-bottom:8px}

@media (max-width:520px){
  h1{font-size:1.55rem}
  .servico{grid-template-columns:minmax(0,1fr)}
  .quando{border-right:0;border-bottom:1px solid var(--line);padding:0 0 8px;grid-template-columns:auto 1fr;justify-items:start;text-align:left;gap:10px;align-items:baseline}
  .papel button{padding:8px 10px;font-size:.92rem}
  .verc{display:none}
  .hist li{grid-template-columns:minmax(0,1fr);gap:0}
}
/* ---------- painel do administrador ---------- */
.adm{display:grid;gap:18px;grid-template-columns:minmax(0,1fr);align-items:start}
@media (min-width:980px){.adm{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.col{display:grid;gap:16px;align-content:start;min-width:0}
.vivo{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.85rem;padding:4px 12px;border-radius:999px;background:var(--c-concluida-bg);color:var(--c-concluida)}
.vivo i{width:9px;height:9px;border-radius:50%;background:currentColor;animation:pulsa 1.6s ease-in-out infinite}
@keyframes pulsa{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}
.equipe{list-style:none;padding:0;display:grid;gap:10px}
.pessoa{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.pessoa:first-child{border-top:0;padding-top:0}
.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-family:var(--fd);font-weight:700;color:var(--muted);position:relative}
.avatar::after{content:"";position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:50%;border:2px solid var(--surface);background:var(--line)}
.avatar.now::after{background:var(--c-andamento)}.avatar.wait::after{background:var(--c-agendada)}.avatar.ok::after{background:var(--c-concluida)}
.pessoa b{display:block;line-height:1.2}
.pessoa .sub{overflow-wrap:anywhere}
.feed{list-style:none;padding:0;display:grid;gap:0}
.feed li{display:grid;grid-template-columns:86px minmax(0,1fr);gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.feed li:first-child{border-top:0;padding-top:0}
.feed time{color:var(--muted);font-weight:600;font-size:.9rem}
.feed .ver{display:inline;background:none;border:0;padding:0;color:var(--accent);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.metr{display:grid;gap:6px}
.metr-t{display:flex;justify-content:space-between;gap:10px;font-weight:600;font-size:.95rem}
.barra.cr>i{background:var(--c-andamento)}
.rotina{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:10px 0;border-top:1px solid var(--line);align-items:center}
.rotina:first-of-type{border-top:0}
.rotina .sub{grid-column:1/-1}
.bk{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.bk:first-child{border-top:0}
.bk b{display:block;line-height:1.25}
.imp{border:2px dashed var(--line);border-radius:var(--r);padding:16px;display:grid;gap:10px;text-align:center;justify-items:center;cursor:pointer;color:var(--muted)}
.imp:hover{border-color:var(--accent)}
.imp b{color:var(--ink)}
.imp .i{width:30px;height:30px;color:var(--accent)}
.sim{font-size:.85rem;color:var(--muted)}
@media (max-width:520px){.papel{width:100%}.papel button{flex:1;padding:8px 4px}.pessoa{grid-template-columns:40px minmax(0,1fr)}.pessoa .pill{grid-column:2}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}


/* ---------- específico do app (não existia no protótipo) ---------- */
a{color:var(--accent)}
.marca{color:inherit;text-decoration:none}
.nav{display:flex;gap:4px;flex-wrap:wrap}
.nav a{color:inherit;text-decoration:none;font-weight:700;padding:8px 12px;border-radius:8px;min-height:40px;display:inline-flex;align-items:center;opacity:.8}
.nav a[aria-current="page"]{background:var(--bg);color:var(--ink);opacity:1}
.topo-quem{font-weight:600;font-size:.95rem;opacity:.85}
.sair{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:6px 12px;border-radius:8px;border:1.5px solid color-mix(in srgb,var(--bg) 35%,transparent);background:transparent;color:inherit;font-weight:700;cursor:pointer}
a.servico,a.kpi,a.tile{color:inherit;text-decoration:none}
.tabs a{color:inherit;text-decoration:none}
.quando .hora.dia-todo{font-size:1.05rem;line-height:1.1}
.pilha{display:grid;gap:14px}
.pilha-g{display:grid;gap:16px}
.cartao.folga{gap:20px}
.filtros{display:flex;gap:8px;flex-wrap:wrap}
.filtros select{width:auto;flex:1 1 180px}
.login{max-width:440px;width:100%;margin:6vh auto 0}
.seg{display:flex;gap:3px;padding:3px;border-radius:11px;background:var(--surface-2);border:1px solid var(--line)}
.seg a{flex:1;text-align:center;padding:10px 8px;border-radius:8px;font-weight:700;color:var(--muted);text-decoration:none;min-height:44px;display:grid;place-items:center;line-height:1.15}
.seg a[aria-current="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
input[type=password]{width:100%;min-height:50px;padding:10px 12px;border-radius:var(--r);border:1.5px solid var(--line);background:var(--surface);font-weight:500}
.msg{font-size:.92rem;font-weight:600;color:var(--muted);min-height:0}
.msg:empty{display:none}
.msg.erro{color:var(--danger)}
.fixa-in .msg{flex-basis:100%;text-align:center}
.slot{display:grid;gap:6px;align-content:start;min-width:0}
.slot .barra,#entrega .barra,#problema .barra{height:6px}
.tile[aria-busy="true"]{opacity:.6;pointer-events:none}
.normal{font-weight:500}
.com-ico{display:flex;gap:8px;align-items:center}
.h-menor{font-size:1rem;margin-top:4px}
.alerta-txt{color:var(--danger);font-weight:600}
.so-desktop{}
@media (max-width:979px){.so-desktop{display:none!important}}
.linha-form{display:flex;gap:8px;flex:1 1 260px}
.linha-form input{min-height:42px;flex:1;min-width:0}
.pessoa-card{gap:10px}
.pessoa-card strong{font-size:1.1rem}
.pessoa-card.inativo{opacity:.65}
code{font-size:.9em;background:var(--surface-2);padding:1px 6px;border-radius:6px}
#ocorrencia summary,#problema summary{color:var(--danger)}
/* confirmação na própria tela, sem alert/confirm */
details.confirma{display:contents}
details.confirma>summary{list-style:none;color:var(--danger)}
details.confirma>summary::-webkit-details-marker{display:none}
details.confirma[open]>summary{margin-bottom:0;background:var(--danger-soft)}
.confirma-in{flex-basis:100%;display:grid;gap:10px;padding:12px 14px;border-radius:var(--r);background:var(--danger-soft);color:var(--ink)}
/* avisos (flash) */
.toasts{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(104px + env(safe-area-inset-bottom,0px));z-index:40;display:grid;gap:8px;width:max-content;max-width:calc(100vw - 32px)}
.toasts .toast{position:static;transform:none;transition:opacity .4s;animation:none}
.toast.erro{background:var(--danger);color:#fff}
.toast.some{opacity:0}
.ver{color:var(--accent);font-weight:700;text-underline-offset:3px}
.pessoa a{color:inherit}
@media (max-width:520px){
  .topo-in{gap:8px}
  .sair span,.topo-quem{display:none}
  .sair{padding:6px 10px}
  .nav a{padding:8px 10px}
  .topo-in:has(.nav) .marca>span:not(.logo){display:none}
  .topo-in{flex-wrap:nowrap}
  .kpi{padding:10px 12px}
  .kpi b{font-size:1.7rem}
}
.filiais-l{list-style:none;padding:0;margin:0;display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.filiais-l a{display:grid;gap:6px;padding:10px 12px;border-radius:var(--r);border:1.5px solid var(--line);color:inherit;text-decoration:none;background:var(--surface-2)}
.filiais-l a:hover{border-color:var(--muted)}
.filiais-l a[aria-current="true"]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.filiais-t{display:flex;justify-content:space-between;gap:8px;font-weight:700}
.lista>li>h2.sec{display:flex;align-items:center;gap:6px;margin-top:8px}
.linha-form select{min-height:42px;flex:1}
/* ---------- relatórios ---------- */
.filtros-rel{gap:12px}
.atalhos-per{display:flex;gap:6px;flex-wrap:wrap}
.tabela-rolar{overflow-x:auto;margin:0 -4px;padding:0 4px}
.tabela{width:100%;border-collapse:collapse;font-size:.95rem;min-width:520px}
.tabela th,.tabela td{padding:9px 8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.tabela th:first-child{text-align:left;white-space:normal}
.tabela thead th{font-size:.74rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}
.tabela tbody th{font-weight:700}
.tabela tr.total th,.tabela tr.total td{font-weight:700;border-top:2px solid var(--line);border-bottom:0}
.tabela tr.inativo{opacity:.6}
.tabela td.risco{color:var(--danger);font-weight:700}
.mini-barra{display:inline-block;vertical-align:middle;width:48px;height:6px;border-radius:999px;background:var(--line);overflow:hidden;margin-right:8px}
.mini-barra i{display:block;height:100%;background:var(--accent)}
.motivos{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.motivos li{display:grid;gap:5px}
details.aberto{border-top:1px solid var(--line);padding-top:6px}
details.aberto>summary{color:var(--ink);justify-content:space-between}
.com-ficha{display:grid;gap:6px}
.com-ficha>.btn{justify-self:start}
.campo-linha{display:flex!important;align-items:center;gap:8px;flex-wrap:wrap}
.campo-linha input{width:90px;min-height:42px}
input[type=search]{width:100%;min-height:42px;padding:8px 12px;border-radius:var(--r);border:1.5px solid var(--line);background:var(--surface);font-weight:500;flex:1;min-width:0}
.cartao>h2 .btn{font-family:var(--f)}
.cartao>h2>span{display:inline-flex;align-items:center;gap:8px}
.fotos-ficha{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.fotos-ficha figure{margin:0;display:grid;gap:6px;break-inside:avoid}
.fotos-ficha img{width:100%;border-radius:10px;border:1px solid var(--line)}
.fotos-ficha figcaption{font-size:.85rem;color:var(--muted);font-weight:600}
.ficha{display:grid;gap:14px}
@media print{
  :root{--bg:#fff;--surface:#fff;--ink:#000;--muted:#444;--line:#ccc}
  body{background:#fff;font-size:12pt}
  .topo,.nao-imprime,.toasts,body::before{display:none!important}
  .pagina{padding:0;max-width:none}
  .cartao{border:0;padding:0;break-inside:avoid-page}
  .fotos-ficha{grid-template-columns:repeat(2,1fr)}
  .pill{border:1px solid #999}
}
@media (max-width:520px){
  .nav{flex-wrap:nowrap;overflow-x:auto;min-width:0;flex:1;scrollbar-width:none}
  .nav::-webkit-scrollbar{display:none}
  .nav a{flex:none;padding:8px 9px}
}
/* ---------- importar planilha ---------- */
.imp input[type=file]{max-width:100%;font-size:.9rem}
.imp-lista{gap:8px}
.imp-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.imp-item.existe,.imp-item.outra_filial,.imp-item.erro{opacity:.7}
.imp-l{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;padding:12px 14px;cursor:pointer;align-items:start}
.imp-l input{width:24px;height:24px;margin:2px 0 0;accent-color:var(--accent)}
.imp-c{display:grid;gap:3px;min-width:0}
.imp-t{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.imp-t a.pill{text-decoration:none}
.imp-c .sub{overflow-wrap:anywhere}
.imp-prod{font-weight:600;font-size:.95rem;overflow-wrap:anywhere}
.imp-av{display:flex;gap:6px;align-items:flex-start;color:var(--c-andamento);font-weight:600;font-size:.88rem}
.sel-todos{margin-bottom:10px}
/* ---------- alertas, rotinas e Drive ---------- */
.badge{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--danger);color:#fff;font-size:.75rem;margin-left:4px}
.lista-alertas{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.lista-alertas .alerta{align-items:center}
.lista-alertas .alerta>span{flex:1}
.cartao.alertas{border-color:var(--danger)}
.rotina-btn{grid-column:1/-1}
.cartao-in{border:1px solid var(--line);border-radius:var(--r);padding:10px 14px;background:var(--surface-2)}
.cartao-in>summary{color:var(--accent)}
.passos{margin:0 0 12px;padding-left:20px;display:grid;gap:6px}
.passos code,.cartao code{overflow-wrap:anywhere}
/* "Renomear" na equipe: mesmo comportamento, sem a cor de perigo */
details.confirma.neutro>summary{color:inherit}
details.confirma.neutro[open]>summary,details.confirma.neutro .confirma-in{background:var(--surface-2, rgba(127,127,127,.12))}