/* Painel da equipe (desktop primeiro, funciona no celular) */
#shell { display: grid; grid-template-columns: 236px 1fr; min-height: 100dvh; }
#side { position: sticky; top: 0; height: 100dvh; overflow: auto; border-right: 1px solid var(--line); padding: 22px 14px; display: flex; flex-direction: column; background: #0f1012; }
#side .brand { width: 150px; margin: 0 8px 26px; }
#nav { flex: 1; }
#nav a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; border-radius: 9px; color: var(--muted); font-size: 14px; margin-bottom: 1px; }
#nav a:hover { color: var(--text); background: rgba(255,255,255,.03); }
#nav a.on { color: var(--text); background: var(--raised); }
#nav .grp { font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--faint); margin: 18px 12px 6px; }
#nav .n { background: var(--gold); color: var(--on-accent); border-radius: 9px; font: 700 10.5px/18px var(--sans); min-width: 18px; text-align: center; padding: 0 5px; }
.me { border-top: 1px solid var(--line); padding: 14px 8px 0; font-size: 13px; }
#menuBtn { display: none; }
#view { padding: 26px 32px 60px; min-width: 0; max-width: 1400px; }
.ph { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; flex-wrap: wrap; }
.ph h1 { margin: 0; font-size: 24px; flex: 1; min-width: 200px; }
.kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; margin-bottom: 22px; }
.kpi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; }
.kpi .v { font: 600 26px/1.1 var(--display); margin: 6px 0 2px; font-variant-numeric: tabular-nums; }
.kpi .l { font-size: 12px; color: var(--muted); letter-spacing: .02em; }
.kpi small { font-size: 12px; }
.cols { display: grid; grid-template-columns: 1.6fr 1fr; gap: 16px; align-items: start; }
.cols.even { grid-template-columns: 1fr 1fr; }
table.t { width: 100%; border-collapse: collapse; font-size: 14px; }
.t th { text-align: left; font: 600 11px var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--faint); padding: 10px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.t td { padding: 11px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.t tr.click { cursor: pointer; } .t tr.click:hover td { background: rgba(255,255,255,.02); }
.t tr:last-child td { border-bottom: 0; }
.tablewrap { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: auto; }
.toolbar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.toolbar input, .toolbar select { width: auto; min-width: 180px; padding: 10px 12px; }
/* agenda por box */
.board { display: grid; gap: 10px; overflow-x: auto; }
.lane { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); min-width: 220px; }
.lane > h4 { margin: 0; padding: 12px 14px; border-bottom: 1px solid var(--line); font: 600 13px var(--sans); display: flex; justify-content: space-between; }
.lane .slot { position: relative; }
.bk { margin: 8px; padding: 10px 12px; border-radius: 10px; background: var(--raised); border-left: 3px solid var(--info); cursor: pointer; font-size: 13px; }
.bk:hover { background: #26272c; }
.bk.em_execucao { border-left-color: var(--gold); } .bk.pronto { border-left-color: var(--ok); } .bk.entregue { opacity: .55; border-left-color: var(--faint); } .bk.cancelado { opacity: .35; border-left-color: var(--bad); text-decoration: line-through; }
.bk b { display: block; font-size: 13.5px; }
.week { display: grid; grid-template-columns: repeat(7, minmax(150px, 1fr)); gap: 8px; overflow-x: auto; }
.week .day { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); min-height: 200px; }
.week .day h4 { margin: 0; padding: 10px 12px; font: 600 12px var(--sans); border-bottom: 1px solid var(--line); text-transform: capitalize; }
.week .day.today h4 { color: var(--gold); }
.chatbox { display: flex; flex-direction: column; gap: 8px; max-height: 60dvh; overflow: auto; padding: 4px; }
.msg { max-width: 76%; padding: 9px 13px; border-radius: 16px; font-size: 14px; white-space: pre-wrap; }
.msg.client { align-self: flex-start; background: var(--raised); }
.msg.staff { align-self: flex-end; background: var(--gold); color: var(--on-accent); }
.msg small { display: block; font-size: 11px; opacity: .65; margin-top: 2px; }
.itemrow { display: grid; grid-template-columns: 1fr 130px 36px; gap: 8px; margin-bottom: 8px; }
.itemrow input { padding: 10px 12px; }
.iconx { background: none; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); cursor: pointer; }
.login-box { max-width: 380px; margin: 12dvh auto 0; padding: 0 20px; }
.login-box .logo { width: 220px; margin: 0 auto 30px; }
.pill-tabs { display: flex; gap: 4px; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 4px; }
.pill-tabs button, .pill-tabs a { border: 0; background: none; color: var(--muted); padding: 7px 14px; border-radius: 999px; font: 500 13px var(--sans); cursor: pointer; }
.pill-tabs button.on, .pill-tabs a.on { background: var(--raised); color: var(--text); }
.sig-img { background: #f4f1ea; border-radius: 8px; max-height: 80px; padding: 4px; }
.flag { color: var(--bad); font-size: 12px; }
.sheet { max-width: 640px; }
#mbar, #bnav, #sideback { display: none; }
@media (max-width: 900px) {
  #shell { grid-template-columns: 1fr; }
  body.noscroll { overflow: hidden; }
  /* topo fixo */
  #mbar { display: flex; align-items: center; gap: 12px; position: fixed; z-index: 60; top: 0; left: 0; right: 0; padding: calc(10px + env(safe-area-inset-top)) 14px 10px;
    background: var(--glass, rgba(13,14,16,.92)); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid var(--line); }
  #mbar #menuBtn { width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--text); display: grid; place-items: center; cursor: pointer; }
  #mbar button svg, #mbar .mico svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
  #mbar .logo svg { width: 100%; height: auto; display: block; }
  #mbar .logo { width: 118px; color: #fff; margin-right: auto; }
  #mbar .mico { position: relative; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; color: var(--text); }
  #mbar .mico .n { position: absolute; top: -3px; right: -3px; min-width: 17px; height: 17px; border-radius: 9px; background: var(--gold); color: var(--on-accent); font: 700 10px/17px var(--sans); text-align: center; padding: 0 4px; }
  /* menu lateral como gaveta */
  #side { position: fixed; z-index: 80; left: 0; top: 0; bottom: 0; width: min(290px, 84vw); height: 100dvh; transform: translateX(-102%); transition: transform .28s cubic-bezier(.2,.8,.2,1); padding-top: calc(22px + env(safe-area-inset-top)); }
  #side.open { transform: none; box-shadow: var(--shadow); }
  #sideback { display: block; position: fixed; inset: 0; z-index: 70; background: rgba(0,0,0,.55); opacity: 0; pointer-events: none; transition: opacity .25s; }
  #sideback.on { opacity: 1; pointer-events: auto; }
  #nav a { padding: 12px 12px; font-size: 15px; }
  /* barra de atalhos embaixo */
  #bnav { display: flex; position: fixed; z-index: 55; left: 0; right: 0; bottom: 0; justify-content: space-around; padding: 7px 4px calc(7px + env(safe-area-inset-bottom));
    background: var(--glass, rgba(13,14,16,.94)); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-top: 1px solid var(--line); }
  #bnav a { position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; color: var(--faint); font-size: 10.5px; padding: 4px 0; }
  #bnav a.on { color: var(--gold); }
  #bnav svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  #bnav svg.dmk { fill: currentColor; stroke: none; }
  #bnav .n { position: absolute; top: 0; left: 55%; min-width: 16px; height: 16px; border-radius: 8px; background: var(--gold); color: var(--on-accent); font: 700 9.5px/16px var(--sans); font-style: normal; text-align: center; padding: 0 4px; }
  #view { padding: calc(76px + env(safe-area-inset-top)) 14px calc(96px + env(safe-area-inset-bottom)); }
  .ph { gap: 10px; margin-bottom: 16px; }
  .ph h1 { font-size: 21px; flex-basis: 100%; }
  .ph .pill-tabs { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .ph .pill-tabs button { white-space: nowrap; }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .kpi { padding: 13px 14px; } .kpi .v { font-size: 21px; } .kpi small { font-size: 11px; }
  .cols, .cols.even { grid-template-columns: 1fr !important; }
  .toolbar input, .toolbar select { min-width: 0; width: 100%; }
  /* tabelas viram cartões: cada linha um cartão, cada célula com o nome da coluna */
  .tablewrap { background: none; border: 0 !important; overflow: visible; }
  table.t, .t tbody, .t tr, .t td { display: block; width: 100%; }
  .t thead { display: none; }
  .t tr { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 10px 14px; margin-bottom: 10px; }
  .t td { border: 0 !important; padding: 5px 0 !important; display: flex; justify-content: space-between; gap: 14px; text-align: right; font-size: 14px; }
  .t td::before { content: attr(data-label); flex: none; color: var(--faint); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; text-align: left; padding-top: 2px; }
  .t td:not([data-label])::before, .t td[data-label=""]::before { display: none; }
  .t td:first-child { font-weight: 600; font-size: 15px; }
  .t td .row { justify-content: flex-end; flex-wrap: wrap; }
  .t tr.click:active { border-color: var(--gold); }
  /* agenda */
  .board { grid-template-columns: none !important; grid-auto-flow: column; grid-auto-columns: minmax(250px, 86vw); overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 14px; margin: 0 -14px; padding: 0 14px 6px; }
  .lane { scroll-snap-align: start; }
  .week { grid-template-columns: repeat(7, minmax(200px, 78vw)); scroll-snap-type: x mandatory; scroll-padding-inline: 14px; margin: 0 -14px; padding: 0 14px 6px; }
  .week .day { scroll-snap-align: start; }
  .chatbox { max-height: 55dvh; }
  .itemrow { grid-template-columns: 1fr 104px 36px; }
  .sheet { max-height: 88dvh; }
}

.combo { position: relative; }
.combo-list { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 4px); max-height: 240px; overflow: auto; background: var(--raised); border: 1px solid var(--line-strong); border-radius: 12px; box-shadow: var(--shadow); padding: 4px; }
.combo-opt { padding: 9px 12px; border-radius: 8px; font-size: 14px; cursor: pointer; }
.combo-opt:hover, .combo-opt.on { background: var(--gold-soft); color: var(--gold); }
.swatches { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-bottom: 8px; }
.sw { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px 2px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); font: 500 10.5px var(--sans); cursor: pointer; }
.sw i { width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 -3px 6px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.12); }
.sw.other i { background: conic-gradient(#9c2a26, #d9b23a, #3c5a45, #2f4f7f, #5b1f2a, #9c2a26); }
.sw.on { border-color: var(--gold); color: var(--text); background: var(--gold-soft); }
.combo-list { max-height: 300px; }
.combo-h { position: sticky; top: -4px; z-index: 1; padding: 8px 12px 6px; margin: 0 -4px; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--faint); background: var(--raised); }

/* Funcionalidades: interruptores */
.fgroups { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; align-items: start; }
.fgroup h3 { margin: 0 0 6px; }
.frow { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-top: 1px solid var(--line); cursor: pointer; }
.fgroup h3 + .frow { border-top: 0; }
.frow b { display: block; font-size: 14.5px; font-weight: 600; }
.frow small { display: block; color: var(--muted); font-size: 12.5px; line-height: 1.4; margin-top: 2px; }
.switch { position: relative; flex: none; width: 46px; height: 28px; }
.switch input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 1; }
.switch i { position: absolute; inset: 0; border-radius: 14px; background: var(--raised); border: 1px solid var(--line-strong); transition: background .2s, border-color .2s; }
.switch i::after { content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--faint); box-shadow: 0 1px 3px rgba(0,0,0,.4); transition: transform .2s, background .2s; }
.switch input:checked + i { background: var(--gold); border-color: var(--gold); }
.switch input:checked + i::after { transform: translateX(18px); background: #fff; }
.switch input:focus-visible + i { outline: 2px solid var(--gold); outline-offset: 2px; }
.switch input:disabled + i { opacity: .5; }
@media (max-width: 900px) { .fgroups { grid-template-columns: 1fr; } }

/* Equipe › Hierarquia e permissões */
.lvl { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--gold-soft); color: var(--gold); font: 700 11.5px var(--sans); }
.hier { display: grid; gap: 8px; }
.hrow { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--raised); }
.hrow input { flex: 1; min-width: 0; padding: 8px 10px; }
.hrow.fixed { opacity: .85; }
.hbtns { display: flex; gap: 4px; }
.hbtns .btn { padding: 6px 10px; }
.perms td { vertical-align: middle; }
.perms td:first-child { min-width: 230px; }
.perms td small { display: block; color: var(--muted); font-size: 12px; margin-top: 2px; max-width: 320px; }
.perms tr.pgroup td { padding-top: 16px; font: 600 11px var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--gold); border-bottom: 0; }
.plv { width: auto; min-width: 120px; padding: 7px 10px; font-size: 13px; }
.plv.editar { border-color: rgba(91,143,208,.55); color: var(--gold); }
.plv.nenhum { color: var(--faint); }
.pill-tabs a { text-decoration: none; }
@media (max-width: 900px) {
  .perms tr.pgroup { border: 0; background: none; padding: 0; margin: 10px 0 0; box-shadow: none; }
  .perms tr.pgroup td { padding: 0 2px; }
  .perms tr.pgroup td::before, .perms td:first-child::before { display: none; }
  .perms td:first-child { display: block; text-align: left; min-width: 0; padding-bottom: 6px; }
  .perms td:first-child b { font-size: 15px; }
  .perms td:first-child small { max-width: none; }
  .perms td:not(:first-child) { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .plv { width: 150px; flex: none; }
}

/* Análise: Indicadores e Relatórios */
.kpi small { display: block; color: var(--muted); font-size: 12px; }
.kpi b { display: block; font: 600 22px var(--display); margin: 4px 0 2px; }
.kpi small.ok { color: var(--ok); } .kpi small.bad, small.bad { color: var(--bad); } small.ok { color: var(--ok); }
.mtabs { flex-wrap: wrap; }
.hbars { display: grid; gap: 12px; margin-top: 10px; }
.hbar .hl { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; }
.hbar .hl span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hbar .ht { height: 8px; border-radius: 4px; background: var(--raised); margin: 5px 0 2px; overflow: hidden; }
.hbar .ht i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, #2f6aa8, #5b8fd0); }
.hbar small { font-size: 11.5px; }
.colchart { display: flex; align-items: flex-end; height: 160px; gap: 2px; margin-top: 12px; }
.colchart .cc { height: 100%; display: flex; align-items: flex-end; }
.colchart .cc i { display: block; width: 100%; border-radius: 3px 3px 0 0; background: linear-gradient(180deg, #5b8fd0, #2f6aa8); opacity: .9; }
.colchart .cc:hover i { opacity: 1; background: #a9c8ee; }
.ccaxis { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--faint); margin-top: 6px; }
.repgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.rep b { display: block; font-size: 15px; margin-bottom: 4px; }
.rep small { color: var(--muted); font-size: 12.5px; line-height: 1.4; }
.repfilters { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-end; }
.repfilters .field { margin: 0; min-width: 150px; }
.repfilters .grow { flex: 1; min-width: 220px; }
.quickp { display: flex; gap: 6px; flex-wrap: wrap; }
.rep-t td.wrap { white-space: normal; min-width: 220px; font-size: 12.5px; color: var(--muted); }
.rep-t th.r, .rep-t td.r { text-align: right; }
.rgroup summary { display: flex; justify-content: space-between; gap: 12px; cursor: pointer; list-style: none; font-size: 15px; }
.rgroup summary::-webkit-details-marker { display: none; }
.rgroup summary::before { content: '›'; color: var(--gold); margin-right: 8px; transition: transform .2s; display: inline-block; }
.rgroup[open] summary::before { transform: rotate(90deg); }
.rgroup summary b:first-child { flex: 1; }
.gstats { display: flex; flex-wrap: wrap; gap: 18px; margin: 12px 0; }
.gstats small { display: block; color: var(--muted); font-size: 11.5px; }
@media (max-width: 900px) { .repfilters .field, .repfilters .grow { min-width: calc(50% - 6px); flex: 1; } .colchart { height: 120px; } }

.num { white-space: nowrap; }

/* ===================== Computador: layout, menu, busca, agenda, tabelas ===================== */
.sidetop { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 4px 16px 8px; }
.sidetop .brand { margin: 0; width: 146px; }
.collapse { flex: none; width: 30px; height: 30px; border-radius: 8px; border: 1px solid var(--line); background: none; color: var(--muted); cursor: pointer; display: grid; place-items: center; }
.collapse:hover { color: var(--text); border-color: var(--line-strong); }
.collapse svg, .sidesearch svg, .cmdk-in svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sidesearch { display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 12px; margin-bottom: 10px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--faint); font: 400 13.5px var(--sans); cursor: pointer; text-align: left; }
.sidesearch:hover { border-color: var(--line-strong); color: var(--muted); }
.sidesearch span { flex: 1; }
kbd { font: 600 10.5px var(--sans); color: var(--muted); border: 1px solid var(--line-strong); border-bottom-width: 2px; border-radius: 5px; padding: 1px 5px; background: var(--raised); }
.ni { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; opacity: .85; }
#nav a.on .ni { color: var(--gold); opacity: 1; }
.nl { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.meid { display: flex; align-items: center; gap: 10px; min-width: 0; }
.mename { min-width: 0; }
.mename b { display: block; font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mename small { color: var(--muted); font-size: 12px; }
.meact { display: flex; gap: 12px; margin-top: 10px; font-size: 12.5px; }
.meact a { color: var(--muted); } .meact a:hover { color: var(--text); }

/* busca rápida (todas as larguras) */
.cmdk-back { position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,.55); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); display: flex; justify-content: center; align-items: flex-start; padding: 12vh 16px 16px; animation: fadein .15s; }
@keyframes fadein { from { opacity: 0; } }
.cmdk { width: min(640px, 100%); background: var(--surface); border: 1px solid var(--line-strong); border-radius: 16px; box-shadow: 0 30px 80px -20px rgba(0,0,0,.8); overflow: hidden; }
.cmdk-in { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); color: var(--faint); }
.cmdk-in svg { width: 18px; height: 18px; }
.cmdk-in input { flex: 1; border: 0; background: none; padding: 4px 0; font-size: 16px; outline: none; box-shadow: none; }
.cmdk-list { max-height: 52vh; overflow: auto; padding: 6px; }
.cmdk-g { font: 600 10.5px var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--faint); padding: 10px 10px 4px; }
.cmdk-it { display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 10px; color: var(--text); }
.cmdk-it .ni { color: var(--muted); }
.cmdk-it b { display: block; font-size: 14px; font-weight: 500; }
.cmdk-it small { color: var(--muted); font-size: 12px; }
.cmdk-it .faint { opacity: 0; }
.cmdk-it.on { background: var(--raised); } .cmdk-it.on .ni { color: var(--gold); } .cmdk-it.on .faint { opacity: 1; }
.cmdk-empty { padding: 26px; text-align: center; color: var(--muted); font-size: 14px; }
.cmdk-foot { display: flex; gap: 16px; flex-wrap: wrap; padding: 10px 16px; border-top: 1px solid var(--line); font-size: 12px; color: var(--faint); }
.cmdk-foot kbd { margin: 0 2px; }

@media (min-width: 901px) {
  #shell { grid-template-columns: 248px 1fr; transition: grid-template-columns .22s ease; }
  #side { padding: 18px 12px 14px; overflow: hidden; }
  #nav { overflow-y: auto; margin: 0 -6px; padding: 0 6px; scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
  #nav::-webkit-scrollbar { width: 6px; } #nav::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 3px; }
  #nav a { justify-content: flex-start; padding: 8px 10px; font-size: 13.5px; gap: 11px; }
  #nav .grp { margin: 14px 10px 5px; }
  #nav .grp:first-child { margin-top: 4px; }
  .me { padding: 12px 6px 0; margin-top: 8px; }
  /* recolhido: só ícones */
  body.mini #shell { grid-template-columns: 68px 1fr; }
  body.mini .sidetop { flex-direction: column; margin: 0 0 12px; }
  body.mini .sidetop .brand { width: 34px; overflow: hidden; }
  body.mini .sidetop .brand svg { width: 150px; }
  body.mini .collapse svg { transform: rotate(180deg); }
  body.mini .sidesearch { justify-content: center; padding: 9px 0; }
  body.mini .sidesearch span, body.mini .sidesearch kbd, body.mini .nl, body.mini .mename, body.mini .meact, body.mini #nav .grp { display: none; }
  body.mini #nav a { justify-content: center; padding: 10px 0; position: relative; }
  body.mini #nav .n { position: absolute; top: 3px; right: 6px; min-width: 16px; line-height: 16px; font-size: 9.5px; padding: 0 4px; }
  body.mini #nav .grp + a, body.mini #nav a + .grp + a { margin-top: 10px; }
  body.mini .meid { justify-content: center; }
  #view { padding: 28px 36px 64px; max-width: 1480px; width: 100%; }
  .ph h1 { font-size: 26px; letter-spacing: -.01em; }

  /* números: uma fileira que se divide igual, sem cartão sobrando sozinho */
  .kpis { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
  .kpi { position: relative; overflow: hidden; }
  .kpi .v { font-size: 24px; }

  /* tabelas: cabeçalho fixo, linha clicável destacada, sem quebrar botões e nomes curtos */
  .tablewrap { max-height: calc(100dvh - 190px); }
  .t thead th { position: sticky; top: 0; z-index: 1; background: var(--surface); box-shadow: inset 0 -1px 0 var(--line); border-bottom: 0; }
  .t tbody tr:hover td { background: rgba(255,255,255,.025); }
  .t tr.click:hover td:first-child { box-shadow: inset 2px 0 0 var(--gold); }
  .t td .btn, .t td .badge { white-space: nowrap; }
  .t td:has(> .btn) { white-space: nowrap; }
  .t td { line-height: 1.4; }

  /* agenda do dia em linha do tempo */
  .tl { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
  .tl-head, .tl-body { display: grid; grid-template-columns: 64px repeat(var(--cols), minmax(200px, 1fr)); }
  .tl-head { position: sticky; top: 0; z-index: 3; background: var(--surface); border-bottom: 1px solid var(--line); }
  .tl-h { position: relative; padding: 12px 14px 14px; border-left: 1px solid var(--line); }
  .tl-h b { display: block; font-size: 14px; }
  .tl-h small { color: var(--muted); font-size: 12px; }
  .tl-h i { position: absolute; left: 0; bottom: 0; height: 2px; background: var(--gold); opacity: .8; }
  .tl-body { position: relative; overflow: hidden; }
  .tl-axis { position: relative; }
  .tl-axis span { position: absolute; right: 10px; transform: translateY(-50%); font: 500 11.5px var(--sans); color: var(--faint); font-variant-numeric: tabular-nums; }
  .tl-axis span:first-child { transform: none; }
  .tl-lane { position: relative; border-left: 1px solid var(--line); background-image: repeating-linear-gradient(180deg, var(--line) 0 1px, transparent 1px calc(69px / 2), rgba(255,255,255,.018) calc(69px / 2) calc(69px / 2 + 1px), transparent calc(69px / 2 + 1px) 69px); }
  .tl-lane:hover { background-color: rgba(255,255,255,.008); }
  .tl-bk { position: absolute; margin: 0; overflow: hidden; display: flex; flex-direction: column; gap: 1px; padding: 8px 10px; z-index: 1; box-shadow: 0 6px 16px -8px rgba(0,0,0,.7); transition: transform .12s, box-shadow .12s; }
  .tl-bk:hover { z-index: 2; transform: translateY(-1px); box-shadow: 0 12px 26px -10px rgba(0,0,0,.8); }
  .tl-bk .muted, .tl-svc { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .tl-svc { color: var(--faint); }
  .tl-foot { margin-top: auto; padding-top: 4px; }
  .tl-now { position: absolute; left: 64px; right: 0; height: 0; border-top: 2px solid #ef6461; z-index: 2; pointer-events: none; }
  .tl-now span { position: absolute; left: -58px; top: -10px; background: #ef6461; color: #fff; font: 700 10.5px var(--sans); padding: 2px 5px; border-radius: 5px; }
}

@media (min-width: 1200px) {
  /* até 8 números: todos numa fileira, dividindo a largura por igual */
  .kpis:not(:has(> :nth-child(9))) { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
}
@media (min-width: 901px) {
  .t.nowrap td { white-space: nowrap; }
  .kpi .v, .kpi b.num { white-space: nowrap; }
  .kpis:has(> :nth-child(6)) .kpi { padding: 14px 16px; }
  .kpis:has(> :nth-child(6)) .kpi .v { font-size: clamp(18px, 1.45vw, 23px); }
  .kpis:has(> :nth-child(6)) .kpi .l { min-height: 2.6em; }
  .t td:first-child { min-width: 130px; }
  .kpis > .card { margin: 0; }
  .repfilters { margin-bottom: 14px; }
}

/* Menu lateral no azul institucional, logo branco e títulos em selo com borda metálica (computador) */
@media (min-width: 901px) {
  #side { background: linear-gradient(180deg, #0a1c33 0%, #081729 50%, #050f1d 100%); border-right: 1px solid rgba(255,255,255,.08); box-shadow: inset -1px 0 0 rgba(0,0,0,.25); }
  #side .brand, #side .logo { color: #fff; }
  .collapse { border-color: rgba(255,255,255,.22); color: rgba(255,255,255,.8); background: rgba(255,255,255,.04); }
  .collapse:hover { color: #fff; border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.1); }
  .sidesearch { background: rgba(0,0,0,.18); border-color: rgba(255,255,255,.16); color: rgba(255,255,255,.7); }
  .sidesearch:hover { background: rgba(0,0,0,.26); border-color: rgba(255,255,255,.3); color: #fff; }
  #side kbd { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.25); color: rgba(255,255,255,.85); }
  #nav a { color: rgba(255,255,255,.78); }
  #nav a:hover { color: #fff; background: rgba(255,255,255,.08); }
  #nav a.on { color: #fff; background: rgba(255,255,255,.16); box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
  #nav a.on .ni { color: #fff; }
  #nav .n { background: #fff; color: #1c4d7d; }
  /* título do grupo: selo com borda metálica */
  #nav .grp { position: relative; display: inline-block; margin: 16px 6px 7px; padding: 4px 11px 3px; border-radius: 999px; background: linear-gradient(180deg, #34373d, #25272b); color: #e8f0fb; font-weight: 600; font-size: 10px; letter-spacing: .16em; box-shadow: 0 2px 6px -2px rgba(0,0,0,.5); }
  #nav .grp::after { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none;
    background: linear-gradient(135deg, rgba(255,255,255,.85) 0%, rgba(169,200,238,.45) 30%, rgba(91,143,208,.25) 55%, rgba(220,233,248,.8) 100%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); }
  #nav .grp:first-child { margin-top: 4px; }
  #nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.2); }
  .me { border-top-color: rgba(255,255,255,.14); }
  .mename b { color: #fff; } .mename small { color: rgba(255,255,255,.65); }
  .meact a { color: rgba(255,255,255,.7); } .meact a:hover { color: #fff; }
  #side .avatar { box-shadow: 0 0 0 1px rgba(255,255,255,.35); }
}
@media (min-width: 901px) {
  /* serviço curto (até ~45 min): uma linha só, horário + cliente */
  .tl-bk.short { flex-direction: row; align-items: center; gap: 8px; padding: 3px 10px; }
  .tl-bk.short > :not(b):not(.row) { display: none; }
  .tl-bk.short .row { flex: none; } .tl-bk.short .row .badge { display: none; }
  .tl-bk.short b { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .tl-bk.short .num { font-size: 12px; }
}

/* Visão geral: painel "Hoje" */
.sect-t { display: flex; align-items: baseline; justify-content: space-between; margin: 4px 0 10px; }
.sect-t h3 { margin: 0; font-size: 15px; color: var(--muted); font-weight: 600; }
.daybd { position: relative; margin-bottom: 26px; padding: 18px 20px 20px; border-radius: 18px; background: radial-gradient(120% 140% at 0% 0%, rgba(47,106,168,.22), transparent 55%), var(--surface); border: 1px solid var(--line); }
.daybd::after { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none; background: var(--metal); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); }
.db-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.db-head h2 { margin: 4px 0 2px; font-size: 21px; }
.db-head small { font-size: 12.5px; }
.db-live { display: inline-flex; align-items: center; gap: 7px; font: 600 11px var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.db-live i { width: 7px; height: 7px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 0 0 rgba(74,222,128,.6); animation: pulse 2s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 7px rgba(74,222,128,0); } 100% { box-shadow: 0 0 0 0 rgba(74,222,128,0); } }
.db-grid { display: grid; grid-template-columns: 1.15fr 1.6fr .8fr 1.15fr; gap: 12px; }
.db-card { background: rgba(0,0,0,.18); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; min-width: 0; display: flex; flex-direction: column; }
.db-card > small:first-child { color: var(--muted); font-size: 12px; }
.db-money > b { font: 600 26px var(--display); margin: 4px 0 2px; }
.db-card small.ok { color: var(--ok); font-size: 12px; } .db-card small.bad { color: var(--bad); font-size: 12px; }
.db-bar, .db-prog { height: 6px; border-radius: 3px; background: var(--raised); overflow: hidden; margin: 12px 0 10px; }
.db-bar i, .db-prog i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, #2f6aa8, #5b8fd0); }
.db-prog i { background: linear-gradient(90deg, #22c55e, #4ade80); }
.db-split { display: flex; justify-content: space-between; gap: 10px; margin-top: auto; }
.db-split small { display: block; color: var(--muted); font-size: 11.5px; }
.db-split b { font-size: 14.5px; }
.db-steps { display: flex; align-items: stretch; gap: 4px; margin-top: 10px; }
.db-step { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; padding: 10px 10px 9px; border-radius: 10px; background: var(--raised); border-top: 3px solid var(--info); color: var(--text); }
.db-step:hover { background: #26272c; }
.db-step b { font: 600 22px var(--display); }
.db-step span { font-size: 11.5px; color: var(--muted); line-height: 1.25; }
.db-step.em_execucao { border-top-color: var(--gold); } .db-step.pronto { border-top-color: var(--ok); } .db-step.entregue { border-top-color: var(--faint); }
.db-arrow { align-self: center; color: var(--faint); font-style: normal; }
.db-occ { align-items: center; text-align: center; }
.db-occ > small:first-child { align-self: stretch; text-align: left; }
.db-gauge { --p: 0; position: relative; width: 92px; height: 92px; margin: 10px 0 8px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(#5b8fd0 calc(var(--p) * 1%), var(--raised) 0); }
.db-gauge::before { content: ''; position: absolute; inset: 9px; border-radius: 50%; background: #16171a; }
.db-gauge b { position: relative; font: 600 20px var(--display); }
.db-occ small.faint { font-size: 11.5px; }
.db-nextcar { display: flex; align-items: center; gap: 12px; margin: 10px 0 6px; padding: 10px 12px; border-radius: 10px; background: var(--raised); color: var(--text); border-left: 3px solid var(--info); }
.db-nextcar:hover { background: #26272c; }
.db-nextcar > b { font: 600 18px var(--display); }
.db-nextcar span { min-width: 0; } .db-nextcar span b { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-nextcar small { color: var(--muted); font-size: 12px; }
.db-hours { display: flex; align-items: flex-end; gap: 3px; height: 54px; margin-top: auto; padding-top: 8px; }
.db-hours span { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 3px; }
.db-hours i { display: block; width: 100%; min-height: 3px; border-radius: 3px 3px 0 0; background: #2f6aa8; }
.db-hours span.past i { background: rgba(91,143,208,.35); } .db-hours span.now i { background: #a9c8ee; }
.db-hours em { font: 500 9.5px var(--sans); color: var(--faint); font-style: normal; }
@media (max-width: 1250px) { .db-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 900px) { .daybd { padding: 14px; } .db-grid { grid-template-columns: 1fr; } .db-head .btn { display: none; } }

/* Alinhamento: cartões lado a lado em grade não levam a margem de "cartão empilhado" (.card + .card) */
:is(.cols, .kpis, .repgrid, .fgroups, .split, .db-grid, .hier, .board, .week, .tl-head) > .card + .card,
:is(.cols, .kpis, .repgrid, .fgroups, .split, .db-grid) > .card { margin-top: 0; }
/* dentro de cada coluna, cartões empilham com o mesmo espaço do vão entre colunas */
.cols > div:not(.card) { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.cols > .card { min-width: 0; }
.cols > div > .card + .card, .cols > div > * + .card { margin-top: 0; }
.cols > div > h3:first-child, .cols > div > .row:first-child { margin-top: 0; }
/* título de coluna (ex.: "Hoje" e "Pendências"): mesma altura nas duas colunas, para o conteúdo começar na mesma linha */
.cols > div:not(.card) > :is(h3, .row, .sect-t):first-child { margin: 0; min-height: 32px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cols > div:not(.card) > :is(h3, .row, .sect-t):first-child h3 { margin: 0; }
/* proporção fixa das colunas: o conteúdo de uma não empurra a outra */
.cols { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.cols.even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 900px) { .cols, .cols.even { grid-template-columns: 1fr; } }
@media (min-width: 901px) {
  /* tabela "Hoje": só o veículo pode quebrar (placa desce), o resto fica numa linha */
  .t.nowrap td:nth-child(3) { white-space: normal; min-width: 140px; }
  .t.nowrap td, .t.nowrap th { padding-left: 10px; padding-right: 10px; }
  .t.nowrap td:nth-child(3) small { white-space: nowrap; }
}
@media (min-width: 901px) and (max-width: 1199px) { .cols, .cols.even { grid-template-columns: minmax(0, 1fr); } }

/* Barras com aspecto metálico (azul escovado): reflexo em cima, sombra embaixo, trilho afundado */
:root { --bar-metal-h: linear-gradient(180deg, #e3eefb 0%, #a9c8ee 18%, #5b8fd0 42%, #2f6aa8 62%, #3f7cc0 80%, #1c4d7d 100%);
  --bar-metal-v: linear-gradient(90deg, #1c4d7d 0%, #3f7cc0 18%, #a9c8ee 40%, #e3eefb 50%, #7fa9dc 62%, #2f6aa8 82%, #1c4d7d 100%);
  --bar-metal-ok: linear-gradient(180deg, #e2fbe9 0%, #86efac 20%, #22c55e 48%, #15803d 70%, #22c55e 86%, #14532d 100%); }
.hbar .ht, .db-bar, .db-prog { height: 9px; border-radius: 5px; background: linear-gradient(180deg, #0b0c0e, #1d1f24); box-shadow: inset 0 1px 2px rgba(0,0,0,.7), 0 1px 0 rgba(255,255,255,.05); }
.hbar .ht i, .db-bar i { position: relative; background: var(--bar-metal-h); box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.35), 0 0 8px rgba(91,143,208,.35); }
.db-prog i { position: relative; background: var(--bar-metal-ok); box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.35), 0 0 8px rgba(34,197,94,.3); }
/* brilho que passa devagar sobre a barra */
.hbar .ht i::after, .db-bar i::after, .db-prog i::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.45) 48%, transparent 62%); background-size: 250% 100%; animation: sheen 5s ease-in-out infinite; }
@keyframes sheen { 0% { background-position: 150% 0; } 60%, 100% { background-position: -100% 0; } }
@media (prefers-reduced-motion: reduce) { .hbar .ht i::after, .db-bar i::after, .db-prog i::after { animation: none; } }
/* colunas dos gráficos (vendas por dia, serviços por hora): cilindro metálico */
.colchart .cc i, .db-hours i { background: var(--bar-metal-v); box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 0 6px rgba(91,143,208,.25); opacity: 1; }
.colchart .cc:hover i { background: linear-gradient(90deg, #3f7cc0 0%, #a9c8ee 30%, #fff 50%, #a9c8ee 70%, #3f7cc0 100%); }
.db-hours span.past i { opacity: .42; }
.db-hours span.now i { filter: brightness(1.25) saturate(1.1); box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 0 10px rgba(169,200,238,.6); }
/* ocupação de cada box na agenda */
.tl-h i { height: 3px; background: var(--bar-metal-h); box-shadow: 0 0 6px rgba(91,143,208,.4); opacity: 1; }
/* anel de ocupação do painel "Hoje" */
.db-gauge { background: conic-gradient(from 0deg, #a9c8ee 0, #5b8fd0 calc(var(--p) * .5%), #2f6aa8 calc(var(--p) * 1%), #1d1f24 0); box-shadow: 0 0 12px rgba(91,143,208,.25); }
.db-gauge::before { box-shadow: inset 0 2px 6px rgba(0,0,0,.6); }

/* Gráfico de linha (vendas por dia) */
.lchart .lc-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.lchart h3 { margin: 0; }
.lc-leg { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.lc-leg i { display: inline-block; width: 16px; height: 3px; border-radius: 2px; margin-left: 8px; }
.lc-leg i.l { background: linear-gradient(90deg, #3f7cc0, #e3eefb); }
.lc-leg i.a { background: repeating-linear-gradient(90deg, var(--faint) 0 4px, transparent 4px 7px); }
.lc-wrap { display: grid; grid-template-columns: 52px 1fr; gap: 8px; margin-top: 14px; }
.lc-y { display: flex; flex-direction: column; justify-content: space-between; height: 200px; padding: 0; text-align: right; font: 500 11px var(--sans); color: var(--faint); font-variant-numeric: tabular-nums; }
.lc-y span { transform: translateY(-50%); } .lc-y span:first-child { transform: translateY(-10%); } .lc-y span:last-child { transform: translateY(-80%); }
.lc-plot { position: relative; height: 200px; }
.lc-plot svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.lc-g { stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.lc-avg { stroke: var(--faint); stroke-width: 1; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; opacity: .7; }
.lc-line { fill: none; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.lc-glow { fill: none; stroke: #5b8fd0; stroke-width: 9; opacity: .18; vector-effect: non-scaling-stroke; filter: blur(3px); }
.lc-best { position: absolute; transform: translate(-50%, -50%); pointer-events: none; }
.lc-best i { display: block; width: 11px; height: 11px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff, #a9c8ee 45%, #2f6aa8); box-shadow: 0 0 0 3px rgba(91,143,208,.25), 0 0 12px rgba(169,200,238,.7); }
.lc-best span { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); white-space: nowrap; font: 600 11.5px var(--sans); color: #e3eefb; background: rgba(12,35,64,.85); border: 1px solid rgba(169,200,238,.35); padding: 2px 7px; border-radius: 6px; }
.lc-hits { position: absolute; inset: 0; }
.lc-hit { position: absolute; top: 0; bottom: 0; cursor: crosshair; }
.lc-hit b, .lc-hit i, .lc-hit .lc-tip { position: absolute; opacity: 0; pointer-events: none; transition: opacity .12s; }
.lc-hit b { top: 0; bottom: 0; left: calc(var(--x) - var(--x0, 0%)); width: 1px; }
.lc-hit:hover b, .lc-hit:hover i, .lc-hit:hover .lc-tip { opacity: 1; }
.lc-hit:hover ~ * , .lc-hits:hover ~ .lc-best { opacity: 1; }
.lc-plot:has(.lc-hit:hover) .lc-best { opacity: .35; }
.lc-hit b { left: 50%; background: linear-gradient(180deg, transparent, rgba(169,200,238,.55), transparent); }
.lc-hit i { left: 50%; top: var(--y); width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff, #a9c8ee 45%, #2f6aa8); box-shadow: 0 0 10px rgba(169,200,238,.8); }
.lc-tip { left: 50%; top: var(--y); transform: translate(-50%, calc(-100% - 12px)); white-space: nowrap; background: #0c2340; border: 1px solid rgba(169,200,238,.35); border-radius: 8px; padding: 5px 9px; font: 600 12.5px var(--sans); color: #fff; box-shadow: 0 8px 20px -6px rgba(0,0,0,.7); }
.lc-tip small { display: block; font-weight: 500; font-size: 11px; color: #a9c8ee; }
.lc-tip.r { transform: translate(-100%, calc(-100% - 12px)); } .lc-tip.l { transform: translate(0, calc(-100% - 12px)); }
.lchart .ccaxis { margin: 8px 0 0 60px; }
@media (max-width: 900px) { .lc-wrap { grid-template-columns: 40px 1fr; } .lc-y, .lc-plot { height: 150px; } .lchart .ccaxis { margin-left: 48px; } .lc-leg { display: none; } }

/* Conteúdo ocupa toda a largura da tela em qualquer resolução (margem lateral proporcional) */
@media (min-width: 901px) {
  #view { max-width: none; width: 100%; padding-left: clamp(24px, 2.4vw, 48px); padding-right: clamp(24px, 2.4vw, 48px); }
}
/* menu recolhido: no lugar do logo inteiro, só o D */
.brandD { display: none; color: #fff; }
.brandD svg { width: 30px; height: auto; display: block; fill: currentColor; }
@media (min-width: 901px) {
  body.mini .sidetop .brand { display: none; }
  body.mini .brandD { display: block; margin: 2px auto 0; }
}


/* ===================== Tema claro do painel (o menu continua azul-marinho) ===================== */
.themebtn { flex: none; width: 30px; height: 30px; border-radius: 8px; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.04); color: rgba(255,255,255,.8); cursor: pointer; display: grid; place-items: center; }
.themebtn:hover { color: #fff; background: rgba(255,255,255,.1); }
.themebtn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.themebtn .sun { display: none; } :root[data-theme="light"] .themebtn .sun { display: block; } :root[data-theme="light"] .themebtn .moon { display: none; }
.meid { flex: 1; }
.merow { display: flex; align-items: center; gap: 8px; }
body.mini .themebtn { display: none; }
:root[data-theme="light"] body { background: var(--bg); }
:root[data-theme="light"] #side { box-shadow: 4px 0 18px -10px rgba(5,15,29,.45); }
:root[data-theme="light"] .card, :root[data-theme="light"] .tablewrap, :root[data-theme="light"] .kpi, :root[data-theme="light"] .lane, :root[data-theme="light"] .week .day, :root[data-theme="light"] .tl { box-shadow: 0 1px 2px rgba(15,23,34,.04), 0 6px 18px -12px rgba(15,23,34,.18); }
:root[data-theme="light"] .t thead th { background: #f7f9fc; }
:root[data-theme="light"] .t tbody tr:hover td { background: #f3f6fb; }
:root[data-theme="light"] .bk, :root[data-theme="light"] .db-step, :root[data-theme="light"] .db-nextcar { background: #f1f5fa; }
:root[data-theme="light"] .bk:hover, :root[data-theme="light"] .db-step:hover, :root[data-theme="light"] .db-nextcar:hover { background: #e7eef7; }
:root[data-theme="light"] .tl-bk { box-shadow: 0 4px 12px -6px rgba(15,23,34,.25); }
:root[data-theme="light"] .tl-lane { background-image: repeating-linear-gradient(180deg, rgba(12,24,40,.09) 0 1px, transparent 1px calc(69px / 2), rgba(12,24,40,.04) calc(69px / 2) calc(69px / 2 + 1px), transparent calc(69px / 2 + 1px) 69px); }
:root[data-theme="light"] .daybd { background: radial-gradient(120% 140% at 0% 0%, rgba(47,106,168,.10), transparent 55%), #fff; }
:root[data-theme="light"] .db-card { background: #f7f9fc; }
:root[data-theme="light"] .db-gauge::before { background: #f7f9fc; box-shadow: inset 0 2px 5px rgba(15,23,34,.12); }
:root[data-theme="light"] .db-gauge { background: conic-gradient(from 0deg, #5b8fd0 0, #2f6aa8 calc(var(--p) * .5%), #1c4d7d calc(var(--p) * 1%), #e3e9f1 0); }
:root[data-theme="light"] .hbar .ht, :root[data-theme="light"] .db-bar, :root[data-theme="light"] .db-prog { background: linear-gradient(180deg, #dfe6ef, #eef2f7); box-shadow: inset 0 1px 2px rgba(15,23,34,.18); }
:root[data-theme="light"] .cmdk { box-shadow: 0 30px 80px -20px rgba(15,23,34,.35); }
:root[data-theme="light"] .cmdk-back { background: rgba(15,23,34,.35); }
:root[data-theme="light"] .lc-tip, :root[data-theme="light"] .lc-best span { background: #0c2340; }
:root[data-theme="light"] .lc-g { stroke: rgba(12,24,40,.09); }
:root[data-theme="light"] .lc-line { filter: drop-shadow(0 1px 0 rgba(12,24,40,.15)); }
:root[data-theme="light"] .pill-tabs button.on, :root[data-theme="light"] .pill-tabs a.on { background: #fff; box-shadow: 0 1px 3px rgba(15,23,34,.15); }
:root[data-theme="light"] .pill-tabs { background: #eef2f7; }
:root[data-theme="light"] .tl-now span { box-shadow: 0 2px 6px rgba(239,100,97,.35); }
:root[data-theme="light"] .msg.client { background: #eef2f7; }
:root[data-theme="light"] .login-box .logo { color: var(--gold); }
:root[data-theme="light"] .lc-line { stroke: #1c4d7d; stroke-width: 2.4; }
:root[data-theme="light"] .lc-glow { stroke: #2f6aa8; opacity: .12; }
:root[data-theme="light"] .lc-leg i.l { background: #1c4d7d; }
:root[data-theme="light"] .colchart .cc i, :root[data-theme="light"] .db-hours i { box-shadow: inset 0 1px 0 rgba(255,255,255,.6); }

/* logo D | desk: mais curto, largura menor para manter a altura */
.sidetop .brand { width: 112px; }
#mbar .logo { width: 96px; }
.login-box .logo { width: 170px; }

/* logo empilhado (D + desk) */
.sidetop .brand { width: 56px; margin-left: 4px; }
#mbar .logo { width: 30px; }
.login-box .logo { width: 104px; }
/* logo 20% maior e centralizado no menu; o botão de recolher fica no canto direito */
#side .sidetop { position: relative; justify-content: center; margin: 0 0 16px; }
#side .sidetop .brand { width: 46px; margin: 2px auto 0; }
#side .sidetop .collapse { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
body.mini #side .sidetop .collapse { position: static; transform: none; }

/* Logo do menu: azul metálico com brilho neon */
#side .brand svg path, #side .brandD svg path { fill: url(#dmMetal); }

#side .brand svg, #side .brandD svg { filter: none; animation: none; overflow: visible; }
/* neon só no D; o desk com brilho mínimo */
#side .brand svg > g > path, #side .brandD svg path { filter: url(#dmNeon); }
#side .brand svg g[stroke] { filter: none; }
#side .brand svg g.desk-edge { stroke: #fff; filter: none; }

@keyframes neon { 50% { filter: drop-shadow(0 0 1px rgba(214,231,252,.95)) drop-shadow(0 0 7px rgba(100,170,255,.9)) drop-shadow(0 0 20px rgba(40,110,255,.6)); } }
@media (prefers-reduced-motion: reduce) { #side .brand svg, #side .brandD svg { animation: none; } }
/* desk: letras só em traço branco (miolo do "d" vazado), sem efeito */
#side .brand svg g[stroke] path { fill: none; filter: none; }
/* Frente de loja: atalho em destaque no topo do menu, acima de Operação */
#nav a.nav-pdv { font-size: 15.5px; font-weight: 700; color: #fff; margin: 2px 0 6px; }
#nav a.nav-pdv .ni { width: 20px; height: 20px; opacity: 1; stroke-width: 1.9; }

/* Ranking ABC e painel comercial */
.abc { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; font: 700 12px var(--sans); }
.abc-A { background: rgba(34,197,94,.16); color: #4ade80; } .abc-B { background: rgba(91,143,208,.18); color: #8fbaf0; } .abc-C { background: rgba(148,163,184,.14); color: var(--muted); }
.sit { font-size: 12px; font-weight: 600; padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
.sit-ativo { background: rgba(34,197,94,.14); color: #4ade80; } .sit-esfriando { background: rgba(234,179,8,.14); color: #facc15; } .sit-sumido { background: rgba(239,68,68,.14); color: #f87171; }
.cli-link { font-weight: 500; }
.comm { margin-bottom: 26px; }
.comm .card { margin-bottom: 16px; }
.comm .cols { margin-bottom: 16px; } .comm .cols .card { margin: 0; }
.comm tr.tot td { border-top: 2px solid var(--line-strong); background: rgba(255,255,255,.02); }
.mbar { height: 8px; border-radius: 4px; background: var(--raised); overflow: hidden; margin: 2px 0 3px; box-shadow: inset 0 1px 2px rgba(0,0,0,.4); }
.mbar i { display: block; height: 100%; border-radius: 4px; background: var(--bar-metal-h); }
.mbar i.mid { background: linear-gradient(180deg, #fde68a, #eab308 50%, #a16207); } .mbar i.ok { background: var(--bar-metal-ok); }
.kv3 { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin-top: 10px; }
.kv3 > div { padding: 12px; border-radius: 12px; background: var(--raised); display: flex; flex-direction: column; gap: 2px; }
.kv3 > div.hl { box-shadow: inset 0 0 0 1px rgba(91,143,208,.45); background: var(--gold-soft); }
.kv3 small { color: var(--muted); font-size: 12px; } .kv3 b { font: 600 20px var(--display); } .kv3 em { font-style: normal; color: var(--faint); font-size: 11.5px; }
tr.click.open .chev { display: inline-block; transform: rotate(90deg); }
.cons-det td { background: rgba(0,0,0,.12); }
.cons-svc { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 4px 18px; padding: 6px 4px; }
.cons-svc > div { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; font-size: 13px; padding: 4px 0; border-bottom: 1px dashed var(--line); }
.cons-svc small { color: var(--muted); }
:root[data-theme="light"] .abc-A { color: #15803d; } :root[data-theme="light"] .abc-B { color: #1c4d7d; } :root[data-theme="light"] .sit-ativo { color: #15803d; } :root[data-theme="light"] .sit-esfriando { color: #a16207; } :root[data-theme="light"] .sit-sumido { color: #b91c1c; }
:root[data-theme="light"] .cons-det td { background: #f7f9fc; }
/* tabelas de relatório: uma linha por registro (textos longos cortam com reticências) */
.rep-t td { white-space: nowrap; }
.rep-t td.wrap { white-space: normal; }
.rep-t td:last-child:not(.r):not(.num) { max-width: 220px; overflow: hidden; text-overflow: ellipsis; }

/* CRM */
.crm-int { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 16px; }
.crm-int small { flex-basis: 100%; font-size: 12.5px; }
.kanban { display: grid; grid-template-columns: repeat(5, minmax(220px, 1fr)); gap: 12px; overflow-x: auto; align-items: start; }
.kcol { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px; min-height: 240px; transition: box-shadow .15s; }
.kcol.over { box-shadow: inset 0 0 0 2px var(--gold); }
.kcol h4 { display: flex; justify-content: space-between; margin: 2px 4px 10px; font: 600 13px var(--sans); }
.kcol h4 span { color: var(--faint); }
.kcards { display: grid; gap: 8px; }
.lead { background: var(--raised); border-radius: 10px; padding: 10px 12px; border-left: 3px solid var(--info); cursor: grab; }
.lead.drag { opacity: .5; }
.kcol[data-stage="contato"] .lead { border-left-color: var(--gold); } .kcol[data-stage="agendado"] .lead { border-left-color: #a78bfa; } .kcol[data-stage="convertido"] .lead { border-left-color: var(--ok); } .kcol[data-stage="perdido"] .lead { border-left-color: var(--faint); opacity: .7; }
.lead b { font-size: 14px; }
.lead-int { display: block; color: var(--gold); font-size: 12.5px; margin-top: 3px; }
.lead-msg { margin: 6px 0 0; font-size: 12.5px; color: var(--muted); font-style: italic; }
.lead-foot { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin-top: 8px; }
.lead-foot .btn { padding: 4px 8px; font-size: 12px; }
.src { font: 600 10.5px var(--sans); padding: 2px 7px; border-radius: 999px; background: var(--gold-soft); color: var(--gold); white-space: nowrap; }
.src-whatsapp { background: rgba(37,211,102,.14); color: #4ade80; } .src-instagram { background: rgba(225,48,108,.14); color: #f472b6; } .src-campanha { background: rgba(234,179,8,.14); color: #facc15; }
.segpills { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px; }
.segp { display: flex; flex-direction: column; gap: 2px; color: var(--text); margin: 0 !important; }
.segp small { color: var(--muted); font-size: 12px; } .segp b { font: 600 24px var(--display); } .segp em { font-style: normal; color: var(--faint); font-size: 11.5px; }
.segp.on { box-shadow: inset 0 0 0 2px var(--gold); }
small.bad { color: var(--bad); }
@media (max-width: 900px) { .segpills { grid-template-columns: 1fr 1fr; } .kanban { grid-template-columns: repeat(5, 80vw); } }
@media (min-width: 1200px) { .kanban { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.lead b { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

/* Hierarquia: categorias criadas e "visualizar como" */
.hname { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.hname input { width: 100%; }
.hbase { color: var(--gold); font-size: 11px; padding-left: 2px; }
.hdel { padding: 6px 9px; color: var(--bad) !important; }
.viewas { display: flex; align-items: center; gap: 7px; width: 100%; margin-top: 10px; padding: 7px 9px; border-radius: 9px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.05); color: rgba(255,255,255,.8); font: 400 12px var(--sans); cursor: pointer; text-align: left; }
.viewas:hover { background: rgba(255,255,255,.1); color: #fff; }
.viewas svg { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; }
.viewas b { font-weight: 600; color: #fff; }
body.mini .viewas span { display: none; } body.mini .viewas { justify-content: center; }
.va-grp { font: 600 11px var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold); margin: 14px 0 6px; }
.va-list { display: grid; gap: 6px; }
.va-list button, .va-list a { display: block; text-align: left; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--raised); color: var(--text); cursor: pointer; font: inherit; }
.va-list button:hover, .va-list a:hover { border-color: var(--gold); }
.va-list .on { border-color: var(--gold); background: var(--gold-soft); }
.va-list b { display: block; font-size: 14px; } .va-list small { color: var(--muted); font-size: 12px; }
#vabar { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 90; display: flex; align-items: center; gap: 14px; padding: 10px 12px 10px 16px; border-radius: 999px; background: #eab308; color: #1a1300; font: 500 13px var(--sans); box-shadow: 0 12px 30px -10px rgba(0,0,0,.6); max-width: calc(100vw - 32px); }
#vabar button { border: 0; border-radius: 999px; padding: 7px 12px; background: #1a1300; color: #fde68a; font: 600 12.5px var(--sans); cursor: pointer; white-space: nowrap; }
@media (max-width: 900px) { #vabar { bottom: calc(76px + env(safe-area-inset-bottom)); border-radius: 14px; font-size: 12px; } }

/* ---------- Disparos (app + WhatsApp) ---------- */
.dsp-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .9fr); gap: 16px; align-items: start; }
@media (max-width: 1080px) { .dsp-grid { grid-template-columns: 1fr; } }
.dsp-ch { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.dsp-chip { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px 10px 38px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; position: relative; background: var(--surface); }
.dsp-chip input { position: absolute; left: 12px; top: 13px; accent-color: var(--accent, #2f7de1); width: 16px; height: 16px; }
.dsp-chip small { color: var(--muted); font-size: 12px; }
.dsp-chip:has(input:checked) { border-color: var(--accent, #2f7de1); box-shadow: 0 0 0 1px var(--accent, #2f7de1) inset; }
.dsp-count { margin: -4px 0 12px; font-size: 13px; color: var(--muted); }
.dsp-count b { color: var(--text); font-size: 15px; margin-right: 2px; }
.dsp-mpick { display: flex; gap: 8px; flex-wrap: wrap; }
.dsp-thumb { width: 64px; height: 64px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); padding: 0; background: var(--surface); cursor: pointer; display: grid; place-items: center; color: var(--muted); font-size: 20px; line-height: 1; }
.dsp-thumb img, .dsp-thumb video { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.dsp-thumb.add small { display: block; font-size: 11px; margin-top: 2px; }
.dsp-thumb:hover { border-color: var(--accent, #2f7de1); }
.dsp-mcur { display: flex; align-items: flex-end; gap: 10px; }
.dsp-mcur img, .dsp-mcur video { width: 120px; max-height: 150px; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); }
.dsp-hint { margin: -6px 0 12px; align-items: center; }
.dsp-when { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; min-height: 38px; }
.dsp-when label { display: flex; gap: 6px; align-items: center; cursor: pointer; }
.dsp-when input[type=datetime-local] { width: auto; }
.dsp-actions { gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.dsp-prev { display: grid; gap: 14px; position: sticky; top: 14px; }
.dsp-phone { border-radius: 22px; border: 1px solid var(--line); background: var(--bg, #0b1422); padding: 0 12px 14px; overflow: hidden; min-height: 120px; }
.dsp-ph-top { margin: 0 -12px 12px; padding: 10px 14px; font-size: 12px; color: var(--muted); border-bottom: 1px solid var(--line); background: var(--surface); }
.dsp-notif { display: flex; gap: 10px; align-items: flex-start; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 12px; }
.dsp-notif .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent, #2f7de1); margin-top: 6px; flex: none; }
.dsp-notif b { display: block; font-size: 14px; }
.dsp-notif small { display: block; color: var(--muted); white-space: pre-line; margin-top: 2px; }
.dsp-notif .notif-media { display: block; width: 100%; margin-top: 8px; border-radius: 10px; }
.dsp-pts { display: inline-block; margin-top: 8px; font-style: normal; font-size: 12px; color: var(--gold, #c9a45c); }
.dsp-phone.wa { background: #0b141a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Ccircle cx='2' cy='2' r='1' fill='%23ffffff08'/%3E%3C/svg%3E"); }
.dsp-ph-top.wa { background: #202c33; color: #e9edef; font-weight: 600; border-color: #2a3942; }
.dsp-ph-top.wa small { display: block; font-weight: 400; color: #8696a0; font-size: 11px; }
.dsp-bubble { background: #005c4b; color: #e9edef; border-radius: 10px 0 10px 10px; padding: 4px 4px 6px; max-width: 88%; margin-left: auto; font-size: 13.5px; line-height: 1.4; }
.dsp-bubble img, .dsp-bubble video { display: block; width: 100%; border-radius: 8px; }
.dsp-bubble p { margin: 6px 6px 0; word-wrap: break-word; }
.dsp-bubble > small { display: block; text-align: right; color: #ffffff99; font-size: 10.5px; margin: 2px 6px 0; }
.dsp-off { text-align: center; padding: 24px 0 10px; font-size: 13px; }
:root[data-theme="light"] .dsp-phone:not(.wa) { background: #f3f6fa; }
.dsp-txts { display: grid; gap: 8px; max-height: 60vh; overflow: auto; margin-bottom: 10px; }
.dsp-txt { text-align: left; border: 1px solid var(--line); background: var(--surface); border-radius: 12px; padding: 10px 12px; cursor: pointer; color: var(--text); display: grid; gap: 2px; }
.dsp-txt:hover { border-color: var(--accent, #2f7de1); }
.dsp-txt b { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.dsp-txt small { color: var(--muted); }
.dsp-hist tbody tr { cursor: pointer; }
.dsp-tcell { width: 52px; }
.dsp-tmini { width: 40px; height: 40px; border-radius: 8px; object-fit: cover; display: block; border: 1px solid var(--line); }
.dsp-tmini.none { background: var(--surface); }
.dsp-res { font-size: 12.5px; line-height: 1.5; }
.warn-t { color: var(--warn); font-weight: 600; }
.dsp-det { display: flex; gap: 12px; margin: 6px 0 12px; align-items: flex-start; }
.dsp-det-m { width: 110px; border-radius: 10px; flex: none; border: 1px solid var(--line); }
.dsp-q { display: grid; gap: 6px; margin: 10px 0; }
.dsp-q .btn { justify-self: start; }
.dsp-envq { width: 100%; margin: 6px 0 8px; }
.dsp-envs { display: grid; gap: 6px; max-height: 46vh; overflow: auto; }
.dsp-env { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; }
.dsp-env .grow { min-width: 0; }
.dsp-env .grow b, .dsp-env .grow small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dsp-env.enviado { opacity: .7; }
.dsp-lib { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.dsp-cr { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--surface); }
.dsp-cr img, .dsp-cr video { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.dsp-cr .row { padding: 6px 6px 6px 10px; align-items: center; }
.dsp-cr small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.dsp-tedit { display: grid; gap: 12px; }
.dsp-trow { border: 1px solid var(--line); border-radius: 12px; padding: 12px; }
.dsp-steps { padding-left: 18px; margin: 0 0 12px; display: grid; gap: 8px; font-size: 13.5px; color: var(--muted); }
.dsp-steps code, .dsp-trow code { background: var(--surface); padding: 1px 5px; border-radius: 5px; color: var(--text); }

/* ---------- ficha de cadastro de cliente ---------- */
.cf-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 1000px) { .cf-grid { grid-template-columns: 1fr; } }
.cf-grid .check { display: flex; gap: 8px; align-items: flex-start; margin-top: 8px; font-size: 14px; }
.cf-actions { gap: 8px; margin-top: 16px; }
.cf-grid .card { min-width: 0; }
.cf-grid .swatches { grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); }
.nf-alert b + small { margin-left: 8px; }
.cf-addr { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0 12px; }
.cf-cep { grid-column: span 2; } .cf-street { grid-column: span 4; } .cf-num { grid-column: span 2; }
.cf-comp { grid-column: span 4; } .cf-bairro { grid-column: span 3; } .cf-city { grid-column: span 2; } .cf-uf { grid-column: span 1; }
.cf-cep small { display: block; min-height: 16px; font-size: 12px; margin-top: 3px; }
@media (max-width: 560px) { .cf-cep, .cf-street, .cf-bairro { grid-column: span 6; } .cf-num { grid-column: span 2; } .cf-comp { grid-column: span 4; } .cf-city { grid-column: span 4; } .cf-uf { grid-column: span 2; } }

/* ---------- Curva ABC (Pareto) ---------- */
.pareto { margin-bottom: 14px; }
.pa-wrap { position: relative; height: 240px; }
.pa-wrap svg { width: 100%; height: 100%; display: block; overflow: visible; }
.pa-bar.A { fill: #4f8fd9; }
.pa-bar.B { fill: #8aa3c2; }
.pa-bar.C { fill: #4a5566; }
.pa-bar:hover { opacity: .8; }
.pa-line { fill: none; stroke: #e0b46a; stroke-width: 2.2; }
.pa-dot { fill: #e0b46a; stroke: var(--bg, #0b1422); stroke-width: 1.5; }
.pa-cut { stroke: var(--line); stroke-dasharray: 6 6; stroke-width: 1; vector-effect: non-scaling-stroke; }
.pa-lbl { position: absolute; right: 0; transform: translateY(-110%); font-size: 11px; color: var(--muted); }
.pa-x { display: grid; margin-top: 4px; font-size: 10.5px; color: var(--muted); text-align: center; }
.lc-leg .pa { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin: 0 4px 0 10px; vertical-align: -1px; }
.lc-leg .pa.A { background: #4f8fd9; } .lc-leg .pa.B { background: #8aa3c2; } .lc-leg .pa.C { background: #4a5566; }
.lc-leg .pl { display: inline-block; width: 14px; height: 2px; background: #e0b46a; margin: 0 4px 0 10px; vertical-align: 3px; }
:root[data-theme="light"] .pa-bar.C { fill: #b7c1cf; }
.rep-bx { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; }
.rep-note { font-size: 12px; margin: 4px 0 14px; }

/* ---------- versão clara / escura (pé do menu) ---------- */
.themeseg { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; margin-top: 10px; padding: 3px; border-radius: 10px; border: 1px solid rgba(255,255,255,.16); background: rgba(0,0,0,.18); }
.themeseg button { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 6px 4px; border: 0; border-radius: 7px; background: transparent; color: rgba(255,255,255,.7); font: 500 12px var(--sans); cursor: pointer; }
.themeseg button:hover { color: #fff; }
.themeseg button.on { background: rgba(255,255,255,.14); color: #fff; box-shadow: 0 1px 0 rgba(255,255,255,.12) inset; }
.themeseg svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.mini .themeseg { grid-template-columns: 1fr; } body.mini .themeseg span { display: none; }

/* ---------- Funilaria (painel) ---------- */
.fn-who { margin-bottom: 14px; } .fn-who b { font-size: 15px; }
.fn-res { display: grid; gap: 4px; margin: 6px 0; } .fn-res button { text-align: left; border: 1px solid var(--line); background: var(--surface); color: var(--text); border-radius: 10px; padding: 8px 10px; cursor: pointer; display: grid; } .fn-res small { color: var(--muted); }
.fn-tab input[type=number] { width: 92px; text-align: right; padding: 5px 7px; }
#ed.card { margin-bottom: 14px; }

/* ---------- revisão de UX/UI: tamanhos e alinhamento dos cards ---------- */
/* números: o rótulo ocupa sempre 2 linhas nas fileiras longas, para os valores ficarem alinhados */
@media (min-width: 901px) { .kpis:has(> :nth-child(6)) .kpi .l { line-height: 1.3; min-height: 2.6em; } }
/* Hoje (visão geral): quebra em duas linhas em vez de cortar o status */
.db-today td { white-space: normal; vertical-align: middle; } .db-today td:first-child { min-width: 0; width: 64px; }
.db-today .db-sub { display: block; margin-top: 2px; } .db-today .badge.db-sub { display: inline-block; }
/* OS: título e ações da linha do tempo */
.tl-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.tl-acts { display: flex; gap: 6px; flex-wrap: wrap; }
@media (max-width: 600px) { .tl-acts { width: 100%; } .tl-acts .btn { flex: 1 1 auto; } }
/* Clube: planos com largura para a descrição */
.plan-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-bottom: 18px; }
.plan-grid > .card { margin: 0; }
.plan-grid .row.between { flex-wrap: wrap; gap: 4px 10px; }
/* pares de cards lado a lado com a mesma altura */
.cols.even > .card { align-self: stretch; }
/* funcionalidades: grupos em colunas (sem buracos embaixo dos grupos curtos) */
@media (min-width: 901px) { .fgroups { display: block; columns: 3 320px; column-gap: 16px; } .fgroups > .card { break-inside: avoid; margin: 0 0 16px; display: block; } }
/* filtros de relatório no celular */
.repfilters .field { min-width: 0; flex: 1 1 140px; } .repfilters .field.grow { flex: 2 1 220px; } .repfilters input, .repfilters select { width: 100%; min-width: 0; }
.lchart { overflow: hidden; }

/* pé do menu compacto: nome + botões de um toque (visualizar como e tema) */
.merow { justify-content: space-between; }
.mebtns { display: flex; gap: 6px; flex: none; }
.mebtn { width: 30px; height: 30px; border-radius: 8px; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.04); color: rgba(255,255,255,.8); cursor: pointer; display: grid; place-items: center; padding: 0; }
.mebtn:hover { color: #fff; background: rgba(255,255,255,.1); }
.mebtn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.mebtn.on { border-color: #e0b46a; color: #e0b46a; background: rgba(224, 180, 106, .12); }
.meact { margin-top: 8px; }
body.mini .merow { flex-direction: column; gap: 8px; } body.mini .mebtns { flex-direction: column; }
body.mini .mebtn.themebtn { display: grid; }

/* ---------- menu lateral claro (branco → cinza) no tema escuro ---------- */
:root:not([data-theme="light"]) #side {
  background: linear-gradient(180deg, #ffffff 0%, #eef0f3 45%, #d3d8df 100%); border-right: 1px solid rgba(0,0,0,.14); box-shadow: 6px 0 22px -14px rgba(0,0,0,.7); }
:root:not([data-theme="light"]) #side .brand, :root:not([data-theme="light"]) #side .logo, :root:not([data-theme="light"]) .brandD { color: #1b2533; }
:root:not([data-theme="light"]) #side .brand svg g.desk-edge, :root:not([data-theme="light"]) #side .brand svg g[stroke] { stroke: #1b2533; }
:root:not([data-theme="light"]) .collapse, :root:not([data-theme="light"]) #side .mebtn { border-color: rgba(27,37,51,.22); color: #3a4556; background: rgba(255,255,255,.6); }
:root:not([data-theme="light"]) .collapse:hover, :root:not([data-theme="light"]) #side .mebtn:hover { color: #0f1722; background: #fff; border-color: rgba(27,37,51,.4); }
:root:not([data-theme="light"]) #side .mebtn.on { border-color: #b9892f; color: #9a6f1c; background: rgba(224,180,106,.18); }
:root:not([data-theme="light"]) .sidesearch { background: rgba(255,255,255,.75); border-color: rgba(27,37,51,.16); color: #5a6576; }
:root:not([data-theme="light"]) .sidesearch:hover { background: #fff; border-color: rgba(27,37,51,.3); color: #1b2533; }
:root:not([data-theme="light"]) #side kbd { background: rgba(27,37,51,.06); border-color: rgba(27,37,51,.2); color: #3a4556; }
:root:not([data-theme="light"]) #nav a { color: #3a4556; }
:root:not([data-theme="light"]) #nav a .ni { color: #6a7688; }
:root:not([data-theme="light"]) #nav a:hover { color: #0f1722; background: rgba(27,37,51,.06); }
:root:not([data-theme="light"]) #nav a.on { color: #0f2c4d; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.08), inset 0 0 0 1px rgba(28,77,125,.18); }
:root:not([data-theme="light"]) #nav a.on .ni { color: #1c4d7d; }
:root:not([data-theme="light"]) #nav .n { background: #1c4d7d; color: #fff; }
:root:not([data-theme="light"]) #nav .nav-pdv { color: #0f1722; }
:root:not([data-theme="light"]) #nav::-webkit-scrollbar-thumb { background: rgba(27,37,51,.2); }
:root:not([data-theme="light"]) .me { border-top-color: rgba(27,37,51,.14); }
:root:not([data-theme="light"]) #side .mename b { color: #0f1722; } :root:not([data-theme="light"]) #side .mename small { color: #5a6576; }
:root:not([data-theme="light"]) #side .meact a { color: #5a6576; } :root:not([data-theme="light"]) #side .meact a:hover { color: #0f1722; }
:root:not([data-theme="light"]) #side .avatar { box-shadow: 0 0 0 1px rgba(27,37,51,.25); }

/* selos dos grupos do menu (Operação, Análise…) no azul institucional, mantendo a borda metálica */
@media (min-width: 901px) {
  #nav .grp { background: linear-gradient(180deg, #2a64a0 0%, #1c4d7d 55%, #163d64 100%); color: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.18); }
}

/* menu lateral no tema escuro: degradê cinza mais escuro (antes branco → cinza) */
:root:not([data-theme="light"]) #side { background: linear-gradient(180deg, #d9dde3 0%, #c3c9d1 45%, #9ea6b1 100%); border-right-color: rgba(0,0,0,.25); }
:root:not([data-theme="light"]) #nav a { color: #2b3544; } :root:not([data-theme="light"]) #nav a .ni { color: #4b5666; }
:root:not([data-theme="light"]) #nav a:hover { background: rgba(255,255,255,.35); }
:root:not([data-theme="light"]) #nav a.on { background: rgba(255,255,255,.85); }
:root:not([data-theme="light"]) .sidesearch { background: rgba(255,255,255,.55); border-color: rgba(27,37,51,.22); color: #3a4556; }
:root:not([data-theme="light"]) #side .mename small, :root:not([data-theme="light"]) #side .meact a { color: #3a4556; }
:root:not([data-theme="light"]) .me { border-top-color: rgba(27,37,51,.2); }

/* ---------- Emissor: várias empresas (CNPJs) ---------- */
.nf-emps { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; }
.nf-empst { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; } .nf-empst > span:first-child { font-weight: 600; }
.nf-chip { margin: 2px 0; }
.nf-emptabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 14px; }
.nf-emptabs a { display: grid; gap: 1px; padding: 9px 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--text); min-width: 170px; }
.nf-emptabs a small { color: var(--muted); font-size: 11.5px; } .nf-emptabs a.on { border-color: #4f8fd9; box-shadow: inset 0 0 0 1px #4f8fd9; }
.nf-addemp { border: 1px dashed var(--line-strong, var(--line)); background: transparent; color: var(--muted); border-radius: 12px; padding: 9px 14px; cursor: pointer; font: inherit; }
.nf-addemp:hover { color: var(--text); border-color: #4f8fd9; }
.nf-map .nf-maprow { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; }
.nf-map .nf-maprow select { width: auto; min-width: 170px; padding: 5px 8px; }
.nf-map .nf-mapline { border-bottom: 0; padding-bottom: 0; }
.nf-mapcat summary { cursor: pointer; padding: 12px 0 4px; font-weight: 600; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.nf-mapall { margin-left: auto; font-weight: 400; font-size: 12px; color: var(--muted); } .nf-mapall button { border: 0; background: none; color: #4f8fd9; cursor: pointer; font: inherit; padding: 0; }
.nf-munwarn { width: 100%; margin: 4px 0 0; font-size: 13px; }
.tok-mask { -webkit-text-security: disc; font-family: monospace; }
/* emissor: seleção em massa e pedidos de NF */
.nf-bulk { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin: 0 0 10px; } .nf-bulk .check { margin: 0; }
.nf-solic td { background: rgba(224, 180, 106, .06); }
.nf-pedsp { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
.nf-lote { display: grid; gap: 6px; margin: 8px 0; } .nf-lote > div { display: grid; gap: 1px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line); }
.nf-lote > div.ok { border-color: rgba(127,191,154,.45); } .nf-lote > div.err { border-color: rgba(224,122,106,.45); } .nf-lote small { color: var(--muted); }

/* ---------- gestor de OS ---------- */
.gos-f { display: grid; gap: 12px; }
.gos-f .quickp { display: flex; flex-wrap: wrap; gap: 6px; }
.gos-f .chip { padding: 7px 12px; font-size: 12.5px; }
.gos-f .chip b { font-weight: 700; margin-left: 4px; opacity: .8; }
.gos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.gos-grid .field { margin: 0; }
.gos-grid .gos-q { grid-column: span 2; }
.gos-bulk { position: sticky; top: 8px; z-index: 5; margin-bottom: 10px; }
.gos-t td { font-size: 13.5px; }
.gos-t .gos-sv { max-width: 240px; color: var(--muted); font-size: 12.5px; }
.gos-t tr.gos-x td { opacity: .55; }
.gos-t tr.gos-x td:first-child, .gos-t tr.gos-x td:last-child { opacity: 1; }
.gos-menu { display: grid; gap: 8px; }
.mpipe { display: inline-flex; gap: 3px; vertical-align: middle; }
.mpipe i { width: 12px; height: 5px; border-radius: 3px; background: var(--line-strong); }
.mpipe i.d { background: var(--ok); } .mpipe i.c { background: var(--gold); }
.mpipe.x i { background: var(--bad); opacity: .35; }
.mpl { display: block; color: var(--muted); font-size: 11.5px; margin-top: 3px; }
/* pipeline das etapas na OS */
.pipe { list-style: none; margin: 16px 0 2px; padding: 0; display: flex; }
.pipe li { flex: 1; min-width: 0; position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; }
.pipe li::before { content: ''; position: absolute; top: 15px; left: calc(-50% + 18px); right: calc(50% + 18px); height: 2px; background: var(--line-strong); }
.pipe li:first-child::before { display: none; }
.pipe li.done::before, .pipe li.cur::before { background: var(--ok); }
.pipe .pn { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font: 600 13px var(--sans); border: 2px solid var(--line-strong); background: var(--surface); color: var(--muted); padding: 0; }
.pipe button.pn { cursor: pointer; } .pipe button.pn:hover { border-color: var(--gold); color: var(--text); }
.pipe li.done .pn { background: var(--ok); border-color: var(--ok); color: #fff; }
.pipe li.cur .pn { border-color: var(--gold); color: var(--gold); box-shadow: 0 0 0 4px color-mix(in srgb, var(--gold) 18%, transparent); }
.pipe b { font-size: 12.5px; font-weight: 600; color: var(--muted); line-height: 1.2; }
.pipe li.done b, .pipe li.cur b { color: var(--text); }
.pipe small { font-size: 11px; color: var(--faint); }
.pipe.x .pn { opacity: .5; }
@media (max-width: 760px) {
  .gos-grid { grid-template-columns: 1fr 1fr; } .gos-grid .gos-q { grid-column: 1 / -1; }
  .gos-t .gos-sv { max-width: none; }
  .pipe { flex-direction: column; gap: 0; margin-top: 12px; }
  .pipe li { flex-direction: row; text-align: left; gap: 10px; padding: 6px 0; align-items: center; }
  .pipe li::before { top: -10px; bottom: auto; left: 15px; right: auto; width: 2px; height: 20px; }
  .pipe small { margin-left: auto; }
}
@media print {
  #side, #bnav, .topbar, .ph .btn, .gos-f, .gos-bulk, .gos-acts, .gos-t th:first-child, .gos-t td:first-child, .gos-t th:last-child, .gos-t td:last-child { display: none !important; }
  .tablewrap { overflow: visible; border: 0; } body { background: #fff; color: #000; }
}
.gos-more summary { cursor: pointer; font-weight: 600; font-size: 13.5px; list-style: none; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.gos-more summary::before { content: '▸'; color: var(--muted); } .gos-more[open] summary::before { content: '▾'; }
.gos-more summary::-webkit-details-marker { display: none; }
.gos-t .db-sub { display: block; margin: 2px 0 0; font-size: 12px; }
.gos-t td:nth-child(2) .badge { display: table; margin-top: 4px; }
.card .row.mt { flex-wrap: wrap; }

/* ---------- quadro Kanban de OS ---------- */
.okb-f { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-end; }
.okb-f .field { margin: 0; min-width: 150px; } .okb-f .grow { flex: 1; min-width: 200px; }
.okb-opt { margin: 0 0 8px; font-size: 13px; } .okb-sum { margin: 0 0 10px auto; }
.okb { display: grid; grid-template-columns: repeat(var(--n), minmax(236px, 1fr)); gap: 10px; overflow-x: auto; align-items: start; padding-bottom: 6px; }
.okcol { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px; min-height: 280px; transition: box-shadow .15s, background .15s; }
.okcol.over { box-shadow: inset 0 0 0 2px var(--gold); }
.okcol h4 { display: flex; justify-content: space-between; align-items: center; margin: 2px 4px 10px; font: 600 12.5px var(--sans); letter-spacing: .02em; }
.okcol h4 .n { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; display: grid; place-items: center; background: var(--line); color: var(--muted); font-size: 11.5px; }
.okcol[data-col="_ag"] { border-top: 3px solid var(--info, #5b8def); } .okcol[data-col="pronto"] { border-top: 3px solid var(--ok); } .okcol[data-col="_ent"] { border-top: 3px solid var(--faint); }
.okcol:not([data-col="_ag"]):not([data-col="pronto"]):not([data-col="_ent"]) { border-top: 3px solid var(--gold); }
.okcards { display: grid; gap: 8px; }
.okempty { text-align: center; font-size: 12px; margin: 18px 0; }
.okc { background: var(--bg); border: 1px solid var(--line); border-radius: 12px; padding: 10px 11px; cursor: pointer; display: grid; gap: 4px; font-size: 13px; transition: border-color .12s, transform .12s; }
.okc:hover { border-color: var(--line-strong); }
.okc[draggable="true"] { cursor: grab; } .okc.drag { opacity: .45; transform: scale(.98); }
.okc.late { border-left: 3px solid var(--bad); }
.okc-car { font-weight: 600; } .okc-cli { color: var(--muted); font-size: 12.5px; }
.okc-sv { color: var(--faint); font-size: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.okc-tags { display: flex; flex-wrap: wrap; gap: 4px; } .okc-tags:empty { display: none; }
.okc-tags .badge { font-size: 10px; padding: 2px 7px; }
.okc-foot { margin-top: 2px; gap: 6px; } .okc-foot small { font-size: 11.5px; }
.okmv { border: 1px solid var(--line-strong); background: transparent; color: var(--text); border-radius: 8px; width: 28px; height: 26px; cursor: pointer; font-size: 13px; }
.okmv:hover { border-color: var(--gold); }
.okcol[data-col="_ent"] .okc { opacity: .75; }
.bad-t { color: var(--bad) !important; font-weight: 600; }
@media (max-width: 900px) {
  .okb { grid-template-columns: repeat(var(--n), 82vw); scroll-snap-type: x mandatory; margin: 0 -14px; padding: 0 14px 6px; }
  .okcol { scroll-snap-align: start; } .okb-sum { margin-left: 0; }
  .okb-f .field { min-width: calc(50% - 6px); flex: 1; }
}

/* linha do tempo da OS: não herda o cartão da agenda em linha do tempo (mesma classe .tl) */
.timeline .tl, :root[data-theme="light"] .timeline .tl { background: none; border: 0; border-radius: 0; overflow: visible; box-shadow: none; padding: 0 0 18px; }
.timeline .tl:last-child { padding-bottom: 2px; }
.timeline .tl .row small { color: var(--faint); font-size: 12px; text-align: right; }
@media (max-width: 760px) { .timeline .tl .row.between { flex-wrap: wrap; gap: 2px 10px; } }
.cfg-link { display: flex; justify-content: space-between; align-items: center; gap: 12px; color: var(--text); text-decoration: none; }
.cfg-link:hover { border-color: var(--gold); }

/* ---------- ranking de colaboradores ---------- */
.rk-h { gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.rk-cols, .rk-row { display: grid; grid-template-columns: 34px 38px minmax(0, 1fr) 90px 120px; gap: 12px; align-items: center; }
.rk-cols { padding: 0 10px 6px; font: 600 10.5px var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--faint); border-bottom: 1px solid var(--line); }
.rk-cols .r, .rk-v { text-align: right; }
.rk-list { list-style: none; margin: 0; padding: 0; }
.rk-row { padding: 10px; border-bottom: 1px solid var(--line); border-radius: 10px; }
.rk-row:last-child { border-bottom: 0; }
.rk-row.top { background: color-mix(in srgb, var(--gold) 6%, transparent); }
.rk-pos { font: 700 14px var(--sans); color: var(--muted); text-align: center; } .rk-row.top .rk-pos { font-size: 20px; }
.rk-av { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--line); color: var(--text); font: 700 12px var(--sans); }
.rk-row.t1 .rk-av { background: linear-gradient(135deg, #f3d36b, #c9a12f); color: #3a2b00; } .rk-row.t2 .rk-av { background: linear-gradient(135deg, #e4e7ec, #a9b0ba); color: #222; } .rk-row.t3 .rk-av { background: linear-gradient(135deg, #e7b083, #b0703f); color: #2d1606; }
.rk-nm { min-width: 0; display: grid; gap: 2px; } .rk-nm b { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .rk-nm small { font-size: 11.5px; }
.rk-share { display: block; height: 3px; border-radius: 2px; background: var(--line); margin-top: 3px; } .rk-share i { display: block; height: 100%; border-radius: 2px; background: var(--gold); }
.rk-v { display: grid; gap: 1px; } .rk-v b { font-size: 15px; } .rk-v small { font-size: 11px; } .rk-c b { color: var(--ok); }
.rk-more { margin: 8px auto 0; display: block; }
@media (max-width: 760px) {
  .rk-cols { display: none; }
  .rk-row { grid-template-columns: 30px 32px minmax(0, 1fr) auto; grid-template-areas: 'p a n s' 'p a n c'; row-gap: 2px; }
  .rk-pos { grid-area: p; } .rk-av { grid-area: a; width: 30px; height: 30px; } .rk-nm { grid-area: n; } .rk-v:not(.rk-c) { grid-area: s; } .rk-c { grid-area: c; }
  .rk-v small { display: none; }
}

/* ---------- gerenciador de planos do DommoClube ---------- */
.pl-note { display: flex; gap: 8px; flex-wrap: wrap; align-items: baseline; font-size: 13.5px; border-left: 3px solid var(--gold); }
.pl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.pl-card { position: relative; display: flex; flex-direction: column; gap: 12px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 18px 14px; overflow: hidden; }
.pl-card::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--pc, var(--gold)); }
.pl-card.off { opacity: .62; }
.pl-card header { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.pl-card h3 { margin: 0 0 2px; font-size: 17px; } .pl-card header small { font-size: 12.5px; line-height: 1.35; display: block; }
.pl-star { color: #e0b03c; font-size: 14px; }
.pl-price { display: flex; align-items: baseline; gap: 5px; } .pl-price b { font: 700 26px var(--display, var(--sans)); color: var(--pc, var(--gold)); } .pl-price small { color: var(--muted); font-size: 12px; }
.pl-sizes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.pl-sizes span { display: grid; gap: 1px; text-align: center; padding: 6px 4px; border-radius: 9px; background: var(--bg); border: 1px solid var(--line); font-size: 12px; }
.pl-sizes span b { font-size: 11px; color: var(--muted); } .pl-sizes span.no { opacity: .4; }
.pl-days { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.pl-days i { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font: 600 11px var(--sans); font-style: normal; background: var(--bg); color: var(--faint); border: 1px solid var(--line); }
.pl-days i.on { background: var(--pc, var(--gold)); border-color: transparent; color: #fff; }
.pl-days small { margin-left: 6px; color: var(--muted); font-size: 12px; }
.pl-inc { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; font-size: 13.5px; }
.pl-inc li { display: flex; align-items: center; gap: 8px; } .pl-inc li small { margin-left: auto; color: var(--muted); font-size: 12px; white-space: nowrap; }
.pl-ck { width: 20px; height: 20px; flex: none; border-radius: 6px; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: color-mix(in srgb, var(--pc, var(--gold)) 16%, transparent); color: var(--pc, var(--gold)); }
.pl-card footer { margin-top: auto; display: flex; gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.pl-card footer .btn:last-child { margin-left: auto; }
.pl-new { align-items: center; justify-content: center; text-align: center; border-style: dashed; color: var(--text); text-decoration: none; min-height: 260px; gap: 6px; }
.pl-new::before { display: none; } .pl-new span { font-size: 30px; color: var(--gold); } .pl-new:hover { border-color: var(--gold); }
.pl-empty { text-align: center; padding: 28px 18px; } .pl-empty h3 { margin: 0 0 6px; }
.pl-models { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-top: 14px; text-align: left; }
.pl-model { display: grid; gap: 4px; padding: 14px; border-radius: 12px; border: 1px solid var(--line); border-top: 3px solid var(--pc); background: var(--bg); color: var(--text); cursor: pointer; font: inherit; text-align: left; }
.pl-model:hover { border-color: var(--pc); } .pl-model small { color: var(--muted); font-size: 12.5px; } .pl-model span { color: var(--pc); font-weight: 600; font-size: 13px; }
/* editor */
.pl-ed { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 16px; align-items: start; padding-bottom: 16px; }
.pl-side { position: sticky; top: 12px; display: grid; gap: 14px; max-height: calc(100dvh - 24px); overflow: auto; scrollbar-width: thin; }
.pl-sec { display: grid; gap: 12px; }
.pl-sh { display: flex; gap: 12px; align-items: flex-start; } .pl-sh > span { width: 28px; height: 28px; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--gold); color: var(--on-accent, #fff); font: 700 13px var(--sans); }
.pl-sh h3 { margin: 2px 0 2px; font-size: 15.5px; } .pl-sh small { font-size: 12.5px; }
.pl-row { display: flex; gap: 18px; align-items: flex-end; flex-wrap: wrap; } .pl-row .field { margin: 0; }
.pl-cores { display: flex; gap: 8px; } .pl-cor { width: 28px; height: 28px; border-radius: 50%; border: 2px solid transparent; background: var(--c); cursor: pointer; box-shadow: inset 0 0 0 2px var(--surface); }
.pl-cor.on { border-color: var(--text); }
.pl-sw { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; } .pl-sw input { position: absolute; opacity: 0; pointer-events: none; }
.pl-sw > span { width: 38px; height: 22px; border-radius: 11px; background: var(--line-strong); position: relative; transition: background .15s; flex: none; }
.pl-sw > span::after { content: ''; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s; box-shadow: 0 1px 2px rgba(0,0,0,.3); }
.pl-sw input:checked + span { background: var(--gold); } .pl-sw input:checked + span::after { transform: translateX(16px); }
.pl-sw input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 2px; }
.pl-daypick { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.pl-daypick button { padding: 11px 0; border-radius: 10px; border: 1px solid var(--line-strong); background: transparent; color: var(--muted); font: 600 13px var(--sans); cursor: pointer; }
.pl-daypick button.on { background: var(--gold); border-color: var(--gold); color: var(--on-accent, #fff); }
.pl-daypick.sm button { padding: 7px 0; font-size: 12px; } .pl-daypick button.na:not(.on) { opacity: .45; } .pl-daypick.sm button.na.on { background: var(--bad); border-color: var(--bad); }
.pl-presets { display: flex; gap: 6px; flex-wrap: wrap; } .pl-presets .chip { padding: 6px 12px; font-size: 12.5px; }
.pl-err { color: var(--bad); font-size: 13px; margin: 0; }
.pl-tams { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pl-tam { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; }
.pl-tam.on { border-color: color-mix(in srgb, var(--gold) 50%, var(--line)); background: color-mix(in srgb, var(--gold) 5%, transparent); }
.pl-money { display: flex; align-items: center; gap: 6px; } .pl-money span, .pl-money small { color: var(--muted); font-size: 12.5px; } .pl-money input { width: 92px; text-align: right; padding: 8px 10px; }
.pl-money input:disabled { opacity: .4; }
.pl-incs { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pl-incs li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto 30px; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; }
.pl-in { min-width: 0; display: grid; } .pl-in b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pl-in small { font-size: 12px; }
.pl-step { display: inline-flex; align-items: center; border: 1px solid var(--line-strong); border-radius: 10px; overflow: hidden; }
.pl-step button { width: 30px; height: 32px; border: 0; background: transparent; color: var(--text); font-size: 16px; cursor: pointer; } .pl-step span { min-width: 28px; text-align: center; font-weight: 700; }
.pl-step.inf button { opacity: .35; pointer-events: none; }
.pl-seg { display: inline-flex; background: var(--bg); border: 1px solid var(--line); border-radius: 10px; padding: 2px; }
.pl-seg button { border: 0; background: transparent; color: var(--muted); padding: 6px 10px; border-radius: 8px; font: 500 12.5px var(--sans); cursor: pointer; white-space: nowrap; }
.pl-seg button.on { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(0,0,0,.2); font-weight: 600; }
.pl-seg button.na { opacity: .45; text-decoration: line-through; }
.pl-hint { margin: 0; color: var(--muted); font-size: 13.5px; padding: 14px; border: 1px dashed var(--line-strong); border-radius: 12px; text-align: center; }
.pl-add { position: relative; } .pl-add input { width: 100%; }
.pl-res { display: none; position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 12px; box-shadow: 0 12px 30px -10px rgba(0,0,0,.5); max-height: 300px; overflow: auto; padding: 4px; }
.pl-res.on { display: block; } .pl-res button { display: grid; width: 100%; text-align: left; gap: 1px; padding: 9px 10px; border: 0; border-radius: 8px; background: transparent; color: var(--text); cursor: pointer; font: inherit; }
.pl-res button:hover { background: var(--bg); } .pl-res small { font-size: 12px; }
.pl-geral { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 220px) auto; gap: 14px; align-items: center; padding: 12px; border-radius: 12px; background: var(--bg); }
.pl-geral > div { display: grid; } .pl-geral small { font-size: 12px; } .pl-geral input[type=range] { width: 100%; accent-color: var(--gold); }
.pl-pct { display: inline-flex; align-items: center; gap: 4px; } .pl-pct input { width: 70px; text-align: right; padding: 8px; } .pl-pct span { color: var(--muted); }
.pl-exc-h { display: grid; gap: 2px; margin-top: 4px; } .pl-exc-h small { font-size: 12px; }
.pl-exc { display: grid; grid-template-columns: minmax(0, 1fr) auto 30px; gap: 8px; align-items: center; } .pl-exc select { min-width: 0; }
.pl-bar { position: sticky; bottom: 0; z-index: 30; border-radius: 14px 14px 0 0; display: flex; gap: 10px; align-items: center; justify-content: flex-end; padding: 12px 20px; background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(10px); border-top: 1px solid var(--line); }
.pl-bar #pst { margin-right: auto; font-size: 13px; } .pl-dirty { margin-right: auto; font-size: 13px; color: var(--warn); font-weight: 600; }
/* prévia e simulador */
.pl-pv { display: grid; gap: 10px; position: relative; padding-top: 4px; } .pl-pv::before { content: ''; position: absolute; left: -18px; right: -18px; top: -18px; height: 4px; background: var(--pc); border-radius: var(--radius) var(--radius) 0 0; }
.pl-pv h3 { margin: 0; font-size: 18px; } .pl-pv p { margin: 0; font-size: 13px; } .pl-pv-k { font: 600 10.5px var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--faint); }
.pl-sim { display: grid; gap: 12px; } .pl-simf { display: grid; gap: 10px; } .pl-seg-s { display: grid; grid-template-columns: repeat(4, 1fr); } .pl-seg-s button { text-align: center; }
.pl-simsv summary { cursor: pointer; font-size: 13.5px; font-weight: 600; } .pl-simsv summary b { color: var(--gold); margin-left: 4px; }
.pl-simsv > div { max-height: 200px; overflow: auto; display: grid; gap: 2px; margin-top: 8px; padding-right: 4px; } .pl-simsv .check { margin: 0; font-size: 13px; }
.pl-lim { font-size: 13px; margin: 0; }
.pl-warn { margin: 0 0 8px; padding: 8px 10px; border-radius: 10px; font-size: 12.5px; background: color-mix(in srgb, var(--warn) 14%, transparent); color: var(--text); }
.pl-simres { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pl-simres li { display: flex; justify-content: space-between; gap: 10px; padding: 9px 10px; border-radius: 10px; border-left: 3px solid var(--line-strong); background: var(--bg); font-size: 13px; }
.pl-simres li > div { display: grid; min-width: 0; } .pl-simres li small { color: var(--muted); font-size: 11.5px; } .pl-simres li > span { display: grid; text-align: right; white-space: nowrap; } .pl-simres s { color: var(--faint); font-size: 11.5px; }
.pl-simres .t-incluso { border-left-color: var(--ok); } .pl-simres .t-incluso > span b { color: var(--ok); }
.pl-simres .t-desconto { border-left-color: var(--gold); } .pl-simres .t-fora { border-left-color: var(--bad); }
.pl-simtot { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 4px; } .pl-simtot div { display: grid; gap: 1px; padding: 8px; border-radius: 10px; background: var(--bg); text-align: center; }
.pl-simtot small { font-size: 11px; color: var(--muted); } .pl-simtot b { font-size: 14px; } .pl-simtot .eco b { color: var(--ok); }
@media (max-width: 1100px) { .pl-ed { grid-template-columns: 1fr; } .pl-side { position: static; } }
@media (max-width: 760px) {
  .pl-tams { grid-template-columns: 1fr; }
  .pl-incs li { grid-template-columns: minmax(0, 1fr) auto 30px; } .pl-incs .pl-seg { grid-column: 1 / -1; justify-self: start; }
  .pl-geral { grid-template-columns: 1fr auto; } .pl-geral input[type=range] { grid-column: 1 / -1; grid-row: 2; }
  .pl-bar { bottom: 64px; padding: 10px 14px; }
  .pl-daypick button { padding: 10px 0; font-size: 12px; }
}
.pl-start { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; font-size: 13px; } .pl-start .chip { padding: 6px 14px; }

/* ---------- estoque ---------- */
.es-tabs { margin-bottom: 14px; overflow-x: auto; max-width: 100%; scrollbar-width: none; } .es-tabs button { white-space: nowrap; }
.es-filt { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; } .es-filt input[type=search] { flex: 1; min-width: 200px; } .es-filt .check { margin: 0; font-size: 13px; }
.es-bar { display: block; position: relative; height: 4px; border-radius: 2px; background: var(--line); margin-top: 5px; max-width: 160px; }
.es-bar > i { display: block; height: 100%; border-radius: 2px; background: var(--ok); } .es-bar.warn > i { background: var(--warn); } .es-bar.bad > i { background: var(--bad); }
.es-bar > b { position: absolute; top: -3px; width: 2px; height: 10px; background: var(--text); opacity: .5; }
.es-alerts { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 6px; }
.es-alerts li { display: flex; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 10px; background: var(--bg); font-size: 13.5px; cursor: pointer; }
.es-alerts li i { width: 8px; height: 8px; border-radius: 50%; background: var(--info, #5b8def); flex: none; } .es-alerts li.warn i { background: var(--warn); } .es-alerts li.bad i { background: var(--bad); }
.es-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line); cursor: pointer; } .es-row > div { display: grid; min-width: 0; } .es-row small { font-size: 12px; }
.es-ficha { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 14px; align-items: start; }
.es-fl { position: sticky; top: 12px; max-height: calc(100dvh - 24px); overflow: auto; } .es-fl input { width: 100%; margin-bottom: 8px; }
.es-fl ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; } .es-fl li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; cursor: pointer; }
.es-fl li > div { display: grid; min-width: 0; } .es-fl li b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .es-fl li small { font-size: 11.5px; }
.es-fl li:hover { background: var(--bg); } .es-fl li.on { background: color-mix(in srgb, var(--gold) 14%, transparent); }
.es-q { width: 82px; text-align: right; padding: 6px 8px; }
.es-grade tfoot td { border-top: 1px solid var(--line-strong); }
.es-sug { padding: 12px; border: 1px solid var(--line); border-radius: 12px; margin-top: 10px; }
.es-kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; } .es-kpis > div { display: grid; gap: 1px; padding: 10px; border-radius: 10px; background: var(--bg); } .es-kpis small { font-size: 11.5px; color: var(--muted); } .es-kpis b { font-size: 15px; }
.es-tipo { margin-bottom: 12px; } .es-emb { display: grid; grid-template-columns: 1fr 1.4fr 1.2fr; gap: 10px; } .es-emb .field { margin: 0 0 12px; }
.es-ini { padding: 10px 12px; border-radius: 12px; background: var(--bg); margin-bottom: 12px; } .es-ini b { font-size: 13px; }
.es-pl { display: grid; grid-template-columns: minmax(0, 1fr) auto auto 30px; gap: 8px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); } .es-pl b { font-size: 13.5px; } .es-pl input { width: 76px; }
.es-rc { padding: 10px 0; border-bottom: 1px solid var(--line); }
@media (max-width: 900px) { .es-ficha { grid-template-columns: 1fr; } .es-fl { position: static; max-height: 260px; } .es-emb { grid-template-columns: 1fr 1fr; } .es-emb .field:last-child { grid-column: 1 / -1; } }
#es-body .db-sub { display: block; margin-top: 2px; font-size: 12px; }

/* ---------- BI ---------- */
.bi-ctl { display: grid; gap: 12px; }
.bi-q { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; } .bi-q .field { margin: 0; min-width: 170px; flex: 1; } .bi-q #bswap { margin-bottom: 2px; }
.bi-per { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; } .bi-per .quickp { display: flex; gap: 6px; flex-wrap: wrap; } .bi-per input { width: auto; padding: 7px 9px; }
.bi-per .chip, .bi-prontas .chip, .bi-filt .chip { padding: 6px 12px; font-size: 12.5px; }
.bi-filt, .bi-prontas { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: 12.5px; }
.bi-heat td { background: color-mix(in srgb, var(--gold) calc(var(--a, 0) * 55%), transparent); cursor: pointer; }
.bi-heat tbody th { cursor: pointer; text-align: left; font-weight: 600; white-space: nowrap; } .bi-heat tbody th:hover, .bi-heat td:hover { outline: 1px solid var(--gold); }
.bi-co td { cursor: default; } .bi-co td:hover { outline: 0; }
.bi-bars { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 4px; }
.bi-bars li { display: grid; grid-template-columns: minmax(120px, 260px) minmax(0, 1fr) auto 52px; gap: 10px; align-items: center; padding: 6px 8px; border-radius: 8px; cursor: pointer; font-size: 13.5px; }
.bi-bars li:hover { background: var(--bg); } .bi-bl { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bi-bars li > i { height: 10px; border-radius: 5px; background: var(--line); } .bi-bars li > i > i { display: block; height: 100%; border-radius: 5px; background: var(--gold); }
.bi-bars small { text-align: right; font-size: 11.5px; }
.bi-cols { width: 100%; height: 210px; display: block; margin-top: 10px; } .bi-cols rect { fill: var(--gold); opacity: .85; } .bi-cols rect.m { opacity: 1; } .bi-cols rect.ag { fill: var(--ok); opacity: .9; }
.bi-cols text { fill: var(--muted); font-size: 22px; } .bi-cols g:hover rect:first-of-type { opacity: 1; }
.bi-lg { display: inline-block; width: 10px; height: 10px; border-radius: 2px; background: var(--gold); vertical-align: middle; } .bi-lg.ag { background: var(--ok); }
.bi-drill { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; } .bi-drill .chip { padding: 6px 12px; font-size: 12.5px; }
.bi-os { color: var(--text); text-decoration: none; } .bi-os:hover { background: var(--bg); }
@media (max-width: 760px) { .bi-bars li { grid-template-columns: minmax(0, 1fr) auto; } .bi-bars li > i { grid-column: 1 / -1; grid-row: 2; } .bi-bars small { display: none; } .bi-q .field { min-width: calc(50% - 6px); } }
#bi-b .db-sub { display: block; margin-top: 2px; font-size: 12px; }

/* ---------- desk: menu dos 18 itens ---------- */
#nav .dk-top { display: flex; align-items: center; gap: 10px; width: 100%; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
#nav button.dk-top { padding: 9px 12px; border-radius: 10px; } #nav button.dk-top:hover { background: rgba(255,255,255,.04); }
.dk-car { margin-left: auto; font-size: 10px; opacity: .55; transition: transform .15s; } .dk-grp.open .dk-car { transform: rotate(90deg); }
.dk-sub { display: none; padding: 2px 0 6px 30px; } .dk-grp.open .dk-sub { display: grid; }
#nav .dk-sub a { padding: 6px 10px; font-size: 13px; border-radius: 8px; } .dk-ext { margin-left: auto; font-size: 11px; opacity: .5; }
.dk-grp.act > .dk-top { color: var(--text); font-weight: 600; }
/* pátio */
.pt-grid { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 14px; align-items: start; }
.pt-col h3 { display: flex; justify-content: space-between; align-items: center; font-size: 14.5px; margin: 0 0 10px; } .pt-col h3 .n { font-size: 12px; color: var(--muted); background: var(--bg); border-radius: 10px; padding: 1px 8px; }
.pt-lanes { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; } .pt-ln { font: 600 11.5px var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--faint); margin-bottom: 6px; }
.pt-car { display: grid; gap: 6px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); margin-bottom: 8px; cursor: pointer; } .pt-car:hover { border-color: var(--line-strong); }
.pt-car.alerta { border-left: 3px solid var(--bad); }
.pt-mid { display: flex; gap: 10px; align-items: center; } .pt-mid .placa { width: 104px; flex: none; } .pt-mid .placa .pl-num { font-size: 15px; height: 22px; } .pt-mid > div { min-width: 0; display: grid; }
.pt-sv { color: var(--faint); font-size: 12px; } .pt-foot { gap: 6px; }
.pt-key { border: 1px dashed var(--line-strong); background: transparent; color: var(--muted); border-radius: 8px; padding: 3px 8px; font-size: 12px; cursor: pointer; } .pt-key.on { border-style: solid; color: var(--text); }
/* veículos */
.vc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.vc-card { position: relative; display: grid; gap: 8px; text-align: left; cursor: pointer; font: inherit; color: var(--text); margin: 0; } .vc-card:hover { border-color: var(--gold); }
.vc-n { display: grid; } .vc-st { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); border-top: 1px solid var(--line); padding-top: 8px; } .vc-st b { color: var(--text); }
.vc-tag { position: absolute; top: 12px; right: 12px; } .vc-head { display: flex; gap: 12px; align-items: center; }
/* caixa */
.cx-open { max-width: 460px; } .cx-row { display: grid; grid-template-columns: minmax(0, 1fr) 130px 80px; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); }
.cx-row > span { display: grid; } .cx-row small { font-size: 12px; } .cx-row em { font-style: normal; font-size: 12.5px; text-align: right; } .cx-row em.ok { color: var(--ok); } .cx-row em.bad { color: var(--bad); font-weight: 700; }
.pt-col .db-sub, .vc-card .db-sub { display: block; }
@media (max-width: 1100px) { .pt-grid { grid-template-columns: 1fr; } }
.pc-tag { display: inline-block; padding: 1px 7px; border-radius: 999px; background: #2a64a0; color: #fff; font: 700 10px var(--sans); letter-spacing: .04em; }