/* =================== v3: componentes próprios e telas ágeis =================== */
.sub { color: var(--muted); }
.link { background: none; border: 0; padding: 0; color: var(--acc-2); font-weight: 700; cursor: pointer; font-size: inherit; }
.link:hover { text-decoration: underline; }
kbd { font: 700 .68rem/1 var(--sans); padding: 3px 6px; border-radius: 6px; border: 1px solid var(--line-2); background: var(--panel-3); color: var(--muted); }
.din.peca, b.peca { color: #c4a6ff; }
.stat.neg .v, .v.neg { color: var(--c-bad); }
.stat.clicavel { cursor: pointer; text-align: left; font: inherit; color: inherit; transition: transform .15s var(--ease), border-color .2s, background .2s; }
.stat.clicavel:hover { transform: translateY(-2px); border-color: rgba(230,52,88,.4); }
.stat.on { border-color: var(--acc); background: linear-gradient(160deg, rgba(230,52,88,.16), var(--panel) 70%); }
.btn.ativo { border-color: var(--acc); color: var(--acc-2); }
.badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: var(--acc); color: #fff; font-size: .7rem; font-weight: 800; }

/* popover genérico */
.pop { position: fixed; z-index: 140; background: #211e3a; border: 1px solid var(--line-2); border-radius: 14px; box-shadow: 0 22px 50px -12px rgba(0,0,0,.8); opacity: 0; transform: translateY(-6px); transition: opacity .14s, transform .18s var(--ease); max-height: min(60vh, 420px); overflow: auto; overscroll-behavior: contain; }
.pop.acima { transform: translateY(6px); }
.pop.on { opacity: 1; transform: none; }
.pop.per, .pop.fil { max-height: none; overflow: visible; }
.pop::-webkit-scrollbar { width: 8px; }
.pop::-webkit-scrollbar-thumb { background: #3a365e; border-radius: 8px; }

/* lista de escolha (combo) */
.cb { position: relative; display: flex; align-items: center; }
.cb-in { padding-right: 38px; cursor: text; }
.cb-seta { position: absolute; right: 10px; color: var(--muted); cursor: pointer; display: grid; place-items: center; width: 22px; height: 22px; }
.cb-x { position: absolute; right: 32px; border: 0; background: none; color: var(--dim); cursor: pointer; display: none; }
.cb.tem .cb-x { display: grid; }
.cb-lista { padding: 6px; display: grid; gap: 2px; }
.cb-item { display: flex; align-items: baseline; gap: 8px; padding: 9px 11px; border-radius: 9px; cursor: pointer; color: var(--text); font-size: .9rem; }
.cb-item small { margin-left: auto; color: var(--muted); font-size: .72rem; white-space: nowrap; }
.cb-item.on { background: rgba(230,52,88,.16); }
.cb-item.sel .cb-t { color: var(--acc-2); font-weight: 700; }
.cb-novo { color: var(--acc-2); font-weight: 700; font-size: .78rem; }
.cb-vazio { padding: 14px; color: var(--muted); text-align: center; font-size: .85rem; }

/* segmentado e chips */
.seg { display: inline-flex; flex-wrap: wrap; gap: 3px; padding: 3px; border-radius: 13px; background: var(--panel-2); border: 1px solid var(--line); }
.seg-b { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 0; border-radius: 10px; background: transparent; color: var(--muted); font-weight: 700; cursor: pointer; transition: background .15s, color .15s; }
.seg-b:hover { color: var(--text); }
.seg-b.on { background: linear-gradient(180deg, #f0486b, #d62b50); color: #fff; box-shadow: 0 6px 16px -8px rgba(230,52,88,.9); }
.chipsb { display: flex; flex-wrap: wrap; gap: 6px; }
.chipsb.mini .chipb { padding: 4px 10px; font-size: .76rem; }
.chipb { padding: 7px 13px; border-radius: 99px; border: 1px solid var(--line-2); background: var(--panel-2); color: var(--text); font-weight: 600; cursor: pointer; transition: .15s; }
.chipb:hover { border-color: rgba(230,52,88,.5); }
.chipb.on { background: rgba(230,52,88,.18); border-color: var(--acc); color: #fff; }

/* período e filtros */
.barra-fil { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 12px; }
.barra-fil .busca { flex: 1 1 240px; min-width: 200px; }
.periodo { display: inline-flex; align-items: center; gap: 4px; padding: 3px; border-radius: 13px; background: var(--panel-2); border: 1px solid var(--line); }
.per-b { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border: 0; border-radius: 10px; background: transparent; color: var(--text); font-weight: 700; cursor: pointer; min-width: 11rem; justify-content: center; }
.per-b:hover { background: var(--panel-3); }
.per-b svg:first-child { color: var(--acc); }
.per-pop { padding: 12px; display: grid; gap: 12px; }
.per-atalhos { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.per-a { text-align: left; padding: 8px 10px; border: 0; border-radius: 9px; background: var(--panel-2); color: var(--text); cursor: pointer; font-weight: 600; font-size: .85rem; }
.per-a:hover { background: rgba(230,52,88,.16); }
.per-custom { display: grid; gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.per-linha { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.per-linha .dp { min-width: 0; }
.fil-pop { padding: 14px; display: grid; gap: 10px; }
.fil-acoes { display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px; }
.fil-ativos { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: -2px 0 14px; font-size: .84rem; }
.fil-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px 5px 11px; border-radius: 99px; border: 1px solid rgba(230,52,88,.4); background: rgba(230,52,88,.1); color: var(--text); cursor: pointer; font-weight: 600; }
.fil-chip:hover { background: rgba(230,52,88,.2); }

/* movimento */
.mv-dia { margin-bottom: 12px; border: 1px solid var(--line); border-radius: var(--r); background: var(--panel); overflow: clip; }
.mv-dia > header { display: flex; align-items: center; gap: 16px; padding: 10px 16px; background: var(--panel-2); flex-wrap: wrap; }
.mv-data { display: flex; align-items: baseline; gap: 8px; }
.mv-data strong { font-size: 1.05rem; }
.mv-data span { color: var(--muted); font-size: .8rem; text-transform: capitalize; }
.mv-res { margin-left: auto; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: .84rem; color: var(--muted); }
.mv-saldo { color: var(--text); font-weight: 700; }
.mv-itens { display: grid; }
.mv-it { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto 130px; gap: 12px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--line); cursor: pointer; transition: background .15s; }
.mv-it:hover { background: rgba(255,255,255,.035); }
.mv-it.fixo { cursor: default; }
.mv-it.sim { background: rgba(245,185,66,.05); }
.mv-ico { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; }
.mv-ico.os { background: rgba(230,52,88,.14); color: var(--acc-2); }
.mv-ico.des { background: rgba(255,138,138,.12); color: var(--c-bad); }
.mv-ico.ent { background: rgba(74,222,128,.12); color: var(--din); }
.mv-ico.pec { background: rgba(196,166,255,.13); color: #c4a6ff; }
.mv-txt { min-width: 0; display: grid; gap: 2px; }
.mv-l1 { display: flex; align-items: center; gap: 8px; min-width: 0; }
.mv-l1 strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mv-l2 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; color: var(--muted); font-size: .84rem; }
.lk { background: none; border: 0; padding: 0; color: var(--text); font: inherit; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; border-bottom: 1px dashed transparent; }
.lk:hover { border-bottom-color: var(--acc-2); color: var(--acc-2); }
.lk.tec { color: var(--muted); }
.mv-pag { display: flex; justify-content: flex-end; }
.mv-val { text-align: right; display: grid; justify-items: end; }
.mv-val .din { font-size: 1rem; }
.mv-val small { font-size: .74rem; }
.mais-dias { width: 100%; margin-top: 4px; }
.previstos { margin-bottom: 14px; }
.previstos summary { cursor: pointer; font-weight: 700; display: flex; align-items: center; gap: 8px; list-style: none; }
.previstos summary::-webkit-details-marker { display: none; }
.prev-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 8px; margin-top: 12px; }
.prev { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 11px; border: 1px solid var(--line); background: var(--panel-2); color: var(--text); cursor: pointer; text-align: left; font: inherit; }
.prev > span:nth-child(2) { display: grid; flex: 1; min-width: 0; }
.prev small { color: var(--muted); }
.prev.venc { border-color: rgba(255,138,138,.45); }
.prev-d { font-weight: 800; color: var(--c-warn); }
.prev.venc .prev-d { color: var(--c-bad); }
.rank.duas { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px 24px; }
.rank .l.clicavel { background: none; border: 0; padding: 4px 6px; margin: -4px -6px; border-radius: 9px; cursor: pointer; color: inherit; font: inherit; text-align: left; }
.rank .l.clicavel:hover { background: rgba(255,255,255,.04); }

/* formulários ágeis */
.fos { display: grid; gap: 14px; }
.fc { display: grid; gap: 6px; min-width: 0; }
.fc-r { font-size: .8rem; font-weight: 700; color: var(--muted); display: flex; gap: 8px; align-items: baseline; }
.fc-r small { font-weight: 500; color: var(--dim); }
.fgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.span2 { grid-column: 1 / -1; }
input.grande, .busca.grande input { font-size: 1.08rem; padding-top: 12px; padding-bottom: 12px; font-weight: 600; }
.busca.grande svg { top: 14px; }
.din-campo { display: flex; align-items: center; border: 1px solid var(--line-2); border-radius: 11px; background: var(--panel-2); overflow: hidden; }
.din-campo:focus-within { border-color: var(--acc); box-shadow: 0 0 0 3px rgba(230,52,88,.15); }
.din-campo span { padding: 0 4px 0 12px; color: var(--muted); font-weight: 700; }
.din-campo input { border: 0; background: transparent; box-shadow: none !important; font-size: 1.1rem; font-weight: 700; }
.lucro { font-size: .9rem; color: var(--muted); margin-top: -6px; }
.novo-cli { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: rgba(245,185,66,.08); border: 1px solid rgba(245,185,66,.25); color: #f3d79a; font-size: .86rem; margin-top: -6px; }
.novo-cli[hidden] { display: none; }
.mais { border: 1px solid var(--line); border-radius: 12px; padding: 0 14px; background: rgba(255,255,255,.015); }
.mais summary { cursor: pointer; padding: 12px 0; font-weight: 700; color: var(--muted); }
.mais summary:hover { color: var(--text); }
.mais[open] { padding-bottom: 14px; }
input.curto { max-width: 110px; }
.horas .chipsb { max-height: 120px; overflow: auto; }
.horas .chipb { padding: 5px 10px; font-size: .8rem; font-variant-numeric: tabular-nums; }
.tec-info { font-size: .86rem; padding: 10px 12px; border-radius: 11px; background: var(--panel-2); }

/* detalhe */
.det { display: grid; gap: 14px; }
.det-topo { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.det-ap { font-size: 1.35rem; font-weight: 800; letter-spacing: -.02em; }
.det-sub { color: var(--muted); }
.det-valor { display: grid; justify-items: end; gap: 6px; }
.det-valor .din { font-size: 1.4rem; }
.det-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.det-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; }
.det-l { display: grid; gap: 2px; padding: 10px 12px; border-radius: 11px; background: var(--panel-2); }
.det-l span { color: var(--muted); font-size: .76rem; font-weight: 600; }
.det-pag { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.lin { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border: 0; border-radius: 10px; background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer; border-bottom: 1px solid var(--line); }
button.lin:hover { background: rgba(255,255,255,.04); }
div.lin { cursor: default; }
.lin .muted { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

/* início */
.ini-topo { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.ini-data { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 4px; }
.busca-grande { flex: 1 1 380px; max-width: 620px; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line-2); background: var(--panel); color: var(--muted); font: inherit; font-size: .98rem; cursor: text; text-align: left; transition: border-color .2s, box-shadow .2s; }
.busca-grande:hover { border-color: rgba(230,52,88,.5); box-shadow: 0 0 0 4px rgba(230,52,88,.08); }
.busca-grande svg { color: var(--acc); }
.busca-grande span { flex: 1; }
.acoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; margin-bottom: 14px; }
.acao { display: grid; gap: 4px; justify-items: start; align-content: start; padding: 16px; border-radius: 16px; border: 1px solid var(--line); background: var(--panel); color: var(--text); cursor: pointer; text-align: left; font: inherit; transition: transform .15s var(--ease), border-color .2s, background .2s; }
.acao:hover { transform: translateY(-3px); border-color: rgba(230,52,88,.45); background: linear-gradient(160deg, rgba(230,52,88,.1), var(--panel) 70%); }
.acao-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: rgba(230,52,88,.14); color: var(--acc-2); margin-bottom: 6px; }
.acao.rosa { background: linear-gradient(160deg, #e63458, #a91f45); border-color: transparent; }
.acao.rosa .acao-ico { background: rgba(255,255,255,.18); color: #fff; }
.acao.rosa small { color: rgba(255,255,255,.88); }
.acao-t { font-weight: 800; font-size: 1rem; }
.acao small { color: var(--muted); font-size: .78rem; line-height: 1.3; }
.hoje { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin-bottom: 14px; }
.hj { display: grid; gap: 2px; text-align: left; padding: 12px 14px; border-radius: 13px; border: 1px solid var(--line); background: var(--panel-2); color: var(--text); font: inherit; cursor: pointer; }
.hj:hover { border-color: var(--line-2); }
.hj > span { color: var(--muted); font-size: .78rem; font-weight: 700; }
.hj strong { font-size: 1.3rem; font-weight: 800; }
.hj small { color: var(--muted); font-size: .74rem; }
.hj.alerta { border-color: rgba(245,185,66,.4); }
.ini-meio { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 14px; margin-bottom: 18px; align-items: stretch; }
.cal-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.cal-topo h3 { margin: 0; text-transform: capitalize; }
.cal-grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.cal-s { text-align: center; color: var(--muted); font-size: .72rem; font-weight: 700; padding: 4px 0; text-transform: uppercase; }
.cal-d { position: relative; min-height: 64px; display: grid; grid-template-rows: auto 1fr auto; padding: 6px 7px; border-radius: 11px; border: 1px solid var(--line); background: rgba(230,52,88, var(--i, 0)); color: var(--text); cursor: pointer; text-align: left; font: inherit; transition: transform .12s var(--ease), border-color .15s; }
.cal-d:hover { transform: scale(1.04); border-color: var(--line-2); z-index: 1; }
.cal-d:not(.tem) { background: var(--panel-2); color: var(--muted); }
.cal-d.hoje { border-color: var(--acc-2); box-shadow: inset 0 0 0 1px var(--acc-2); }
.cal-d.sel { outline: 2px solid #fff; outline-offset: 1px; }
.cal-n { font-weight: 800; font-size: .86rem; }
.cal-e { align-self: end; font-size: .72rem; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; }
.cal-m { display: flex; gap: 3px; height: 7px; }
.cal-m i, .cal-leg i { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.m-ag { background: #60a5fa; }
.m-pv { background: var(--c-warn); }
.m-neg { background: var(--c-bad); }
.cal-leg { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 12px; font-size: .76rem; color: var(--muted); }
.cal-leg span { display: inline-flex; align-items: center; gap: 6px; }
.dia-det { display: grid; gap: 12px; align-content: start; }
.dd-num { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 8px; }
.dd-num > div { display: grid; padding: 9px 11px; border-radius: 11px; background: var(--panel-2); }
.dd-num small { color: var(--muted); font-size: .74rem; font-weight: 700; }
.dd-num .din { font-size: 1.05rem; }
.dd-bloco h4 { margin: 0 0 4px; font-size: .84rem; color: var(--muted); display: flex; justify-content: space-between; }
.dd-bloco p { margin: 0; font-size: .85rem; }
.secao { margin: 8px 0 12px; font-size: 1.15rem; }
.grafico .b { background: none; border: 0; padding: 0; cursor: pointer; }
.grafico .b.sel i { background: linear-gradient(180deg, #fff, var(--acc-2)); opacity: 1; }
.grafico.baixo { height: 90px; }
.ag-it { display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); }
.ag-hora { font-weight: 800; font-variant-numeric: tabular-nums; color: #93c5fd; display: grid; }
.ag-hora small { color: var(--muted); font-weight: 600; }
.ag-txt { display: grid; cursor: pointer; min-width: 0; }
.ag-txt small { color: var(--muted); font-size: .78rem; }
.ag-acoes { display: flex; gap: 6px; }
.ag-it.faltou, .ag-it.cancelado { opacity: .6; }

/* paleta Ctrl+K */
.paleta { place-items: start center; padding-top: 10vh; }
.pal { width: min(640px, 100%); background: #1c1a2f; border: 1px solid var(--line-2); border-radius: 18px; box-shadow: 0 30px 80px -20px rgba(0,0,0,.9); overflow: hidden; animation: sobe .25s var(--ease) both; }
.pal-topo { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.pal-topo svg { color: var(--acc); }
.pal-in { border: 0 !important; background: transparent; box-shadow: none !important; font-size: 1.05rem; padding: 6px 0; }
.pal-res { max-height: 55vh; overflow: auto; padding: 6px; }
.pal-g { padding: 10px 10px 4px; color: var(--muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.pal-it { display: flex; align-items: center; gap: 12px; width: 100%; padding: 9px 10px; border: 0; border-radius: 11px; background: transparent; color: var(--text); text-align: left; cursor: pointer; font: inherit; }
.pal-it.on, .pal-it:hover { background: rgba(230,52,88,.15); }
.pal-ico { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--panel-3); color: var(--acc-2); flex: none; }
.pal-t { display: grid; flex: 1; min-width: 0; font-weight: 700; }
.pal-t small { color: var(--muted); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pal-pe { display: flex; gap: 16px; padding: 10px 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: .76rem; flex-wrap: wrap; }
.pal-pe kbd { margin-right: 2px; }

/* carteira */
.ordem { display: flex; align-items: center; gap: 8px; }
.ordem .cb { width: 210px; }
.cart-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; }
.cli { display: grid; gap: 12px; padding: 14px; border-radius: 15px; border: 1px solid var(--line); background: var(--panel); color: var(--text); text-align: left; cursor: pointer; font: inherit; transition: transform .15s var(--ease), border-color .2s; }
.cli:hover { transform: translateY(-2px); border-color: rgba(230,52,88,.4); }
.cli-topo { display: flex; gap: 10px; align-items: center; }
.cli-av { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; font-weight: 800; font-size: .8rem; background: rgba(230,52,88,.16); color: var(--acc-2); flex: none; }
.cli-nome { display: grid; min-width: 0; flex: 1; }
.cli-nome strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cli-nome small { color: var(--muted); font-size: .76rem; }
.cli-deve { padding: 3px 8px; border-radius: 99px; background: rgba(245,185,66,.14); color: var(--c-warn); font-size: .74rem; font-weight: 800; white-space: nowrap; }
.cli-num { display: grid; grid-template-columns: repeat(auto-fit, minmax(70px, 1fr)); gap: 6px; }
.cli-num > div { display: grid; }
.cli-num small { color: var(--muted); font-size: .7rem; font-weight: 700; }
.cart { display: grid; gap: 14px; }
.cart .stats { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }

@media (max-width: 1100px) { .ini-meio { grid-template-columns: 1fr; } }
@media (max-width: 860px) {
  .mv-it { grid-template-columns: 32px minmax(0, 1fr) auto; }
  .mv-pag { grid-column: 2; justify-content: flex-start; }
  .mv-val { grid-row: 1; grid-column: 3; }
  .mv-res { margin-left: 0; width: 100%; }
  .fgrid { grid-template-columns: 1fr; }
  .cal-d { min-height: 48px; padding: 4px; }
  .cal-e { font-size: .6rem; }
  .acoes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .busca-grande { flex-basis: 100%; }
  .busca-grande kbd { display: none; }
  .per-b { min-width: 0; }
  .seg { width: 100%; }
  .seg-b { flex: 1; justify-content: center; padding: 8px 6px; }
  .ordem { flex: 1; }
  .ordem .cb { width: 100%; }
}

/* =================== Início em grade (bento): tudo à vista =================== */
.i2-topo { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.i2-ola h1 { font-size: 1.45rem; }
.i2-ola .muted { margin-top: 2px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.i2-acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; align-items: center; }
.btn.grande { padding: 11px 20px; font-size: 1rem; border-radius: 13px; }
.acao-b { display: inline-flex; align-items: center; gap: 8px; padding: 10px 15px; border-radius: 13px; border: 1px solid var(--line-2); background: var(--panel); color: var(--text); font: inherit; font-weight: 700; cursor: pointer; transition: border-color .15s, background .15s, transform .15s var(--ease); }
.acao-b svg { color: var(--acc-2); }
.acao-b:hover { border-color: rgba(230,52,88,.5); background: var(--panel-2); transform: translateY(-1px); }
.bento { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; align-items: stretch; }
.bx { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 16px; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.bx-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.bx-h h3 { margin: 0; font-size: .95rem; }
.bx .mes strong { min-width: 8.5rem; font-size: .86rem; }
.pequeno { font-size: .76rem; }
.kpi { grid-column: span 3; position: relative; overflow: hidden; text-align: left; font: inherit; color: inherit; cursor: pointer; gap: 2px; min-height: 128px; padding-bottom: 40px; transition: transform .15s var(--ease), border-color .2s; }
.kpi:hover { transform: translateY(-2px); border-color: rgba(230,52,88,.4); }
.kpi-r { color: var(--muted); font-size: .8rem; font-weight: 700; display: flex; justify-content: space-between; gap: 8px; }
.kpi-v { font-size: 1.7rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; position: relative; z-index: 1; }
.kpi-s { color: var(--muted); font-size: .78rem; position: relative; z-index: 1; }
.kpi.destaque { background: linear-gradient(150deg, rgba(230,52,88,.22), var(--panel) 65%); border-color: rgba(230,52,88,.35); }
.kpi.alerta .kpi-v { color: var(--c-warn); }
.delta { font-size: .72rem; font-weight: 800; padding: 2px 7px; border-radius: 99px; }
.delta.up { color: var(--din); background: rgba(74,222,128,.12); } .delta.down { color: var(--c-bad); background: rgba(255,138,138,.12); }
.spark { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 30px; opacity: .85; }
.spark-l { fill: none; stroke: var(--acc-2); stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.spark-a { fill: rgba(230,52,88,.14); stroke: none; }
.b-cal { grid-column: span 5; grid-row: span 2; }
.b-dia { grid-column: span 4; grid-row: span 2; }
.b-ag, .b-deve { grid-column: span 3; }
.b-graf { grid-column: span 6; }
.b-r1, .b-r2, .b-r3, .b-r4 { grid-column: span 3; }
.b-r5 { grid-column: span 6; }
.cg { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; flex: 1; align-content: start; }
.cg-s { text-align: center; color: var(--muted); font-size: .7rem; font-weight: 800; padding: 2px 0; }
.cd { display: grid; grid-template-rows: auto 1fr auto; gap: 1px; min-height: 52px; padding: 5px 6px; border-radius: 10px; border: 1px solid var(--line); background: var(--panel-2); color: var(--muted); font: inherit; text-align: left; cursor: pointer; transition: transform .12s var(--ease); }
.cd.tem { background: rgba(230,52,88, var(--i, .15)); color: var(--text); }
.cd:hover { transform: scale(1.05); z-index: 1; }
.cd.hoje { box-shadow: inset 0 0 0 1.5px var(--acc-2); }
.cd.sel { outline: 2px solid #fff; outline-offset: 1px; }
.cd-n { font-weight: 800; font-size: .8rem; }
.cd-e { align-self: end; font-size: .68rem; font-weight: 800; color: #fff; white-space: nowrap; overflow: hidden; }
.cd-m { display: flex; gap: 3px; height: 6px; } .cd-m i { width: 6px; height: 6px; border-radius: 50%; }
.b-cal .cal-leg { margin-top: 2px; }
.dd3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.dd3 > div { display: grid; padding: 8px 10px; border-radius: 11px; background: var(--panel-2); }
.dd3 small { color: var(--muted); font-size: .72rem; font-weight: 700; }
.dd-lista { display: grid; align-content: start; overflow: auto; max-height: 340px; }
.b-dia .dd-lista { max-height: none; flex: 1; }
.vazio-p { margin: 0; font-size: .86rem; }
.bx .grafico { height: 120px; flex: 1; }
.rk { display: grid; gap: 4px; }
.rk-l { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; grid-template-rows: auto 4px; gap: 3px 8px; align-items: center; padding: 6px 6px; border: 0; border-radius: 9px; background: none; color: var(--text); font: inherit; font-size: .86rem; text-align: left; cursor: pointer; }
.rk-l:hover { background: rgba(255,255,255,.04); }
.rk-n { grid-row: span 2; color: var(--muted); font-weight: 800; font-size: .76rem; text-align: center; }
.rk-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rk-b { grid-column: 2 / 4; height: 4px; border-radius: 99px; background: var(--panel-3); overflow: hidden; }
.rk-b i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #d62b50, var(--acc-2)); }
@media (max-width: 1360px) {
  .kpi { grid-column: span 6; }
  .b-cal { grid-column: span 7; } .b-dia { grid-column: span 5; }
  .b-ag, .b-deve { grid-column: span 6; }
  .b-graf, .b-r5 { grid-column: span 12; }
  .b-r1, .b-r2, .b-r3, .b-r4 { grid-column: span 6; }
}
@media (max-width: 860px) {
  .bento > * { grid-column: 1 / -1 !important; grid-row: auto !important; }
  .kpi-v { font-size: 1.4rem; }
  .i2-acoes .acao-b { flex: 1 1 calc(50% - 8px); justify-content: center; }
  .i2-acoes .btn.grande { flex: 1 1 100%; }
}

/* =================== v4: simples — números grandes, poucas coisas por tela =================== */
.deve { color: var(--c-warn); font-weight: 800; font-variant-numeric: tabular-nums; }
.simples { max-width: 1180px; margin: 0 auto; display: grid; gap: 18px; }
.s-topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; }
.s-topo h1 { font-size: 1.7rem; }
.s-topo p { margin: 4px 0 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.s-acoes { display: flex; flex-wrap: wrap; gap: 10px; }
.btn.s-grande { padding: 14px 22px; font-size: 1.02rem; border-radius: 14px; gap: 10px; }
.btn.fantasma { background: transparent; border-style: dashed; color: var(--muted); }
.s-dia { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.s-dia.quatro { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.s-num { display: grid; gap: 4px; padding: 22px 22px 20px; border-radius: 18px; border: 1px solid var(--line); background: var(--panel); color: var(--text); text-align: left; font: inherit; }
button.s-num { cursor: pointer; transition: border-color .2s, transform .15s var(--ease); }
button.s-num:hover { border-color: rgba(230,52,88,.45); transform: translateY(-2px); }
.s-num > span { font-size: .95rem; font-weight: 700; color: var(--muted); }
.s-num strong { font-size: clamp(1.7rem, 3vw, 2.4rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.s-num small { color: var(--muted); font-size: .85rem; }
.s-duas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.s-caixa { padding: 18px 20px; border-radius: 18px; border: 1px solid var(--line); background: var(--panel); display: grid; gap: 8px; align-content: start; }
.s-caixa > header { display: flex; align-items: center; gap: 10px; }
.s-caixa > header h2 { font-size: 1.12rem; margin: 0; }
.s-caixa > header .link { margin-left: auto; }
.s-cont { min-width: 26px; height: 26px; padding: 0 8px; border-radius: 99px; display: inline-grid; place-items: center; background: var(--panel-3); font-weight: 800; font-size: .85rem; }
.s-lin { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 6px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--text); font: inherit; font-size: 1rem; text-align: left; cursor: pointer; border-radius: 0; }
.s-lin:last-child { border-bottom: 0; }
.s-lin:hover { background: rgba(255,255,255,.035); }
.s-lin .muted { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.s-lin .din { font-size: 1.02rem; }
.s-vazio { display: grid; justify-items: start; gap: 10px; padding: 8px 0 4px; color: var(--muted); }
.s-vazio p { margin: 0; }
.s-alerta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 10px 12px; border-radius: 12px; background: rgba(245,185,66,.1); color: #f3d79a; font-size: .9rem; }
.s-link-mes { display: flex; align-items: center; gap: 14px; padding: 18px 20px; border-radius: 18px; border: 1px solid var(--line); background: linear-gradient(150deg, rgba(230,52,88,.14), var(--panel) 60%); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.s-link-mes span { display: grid; flex: 1; } .s-link-mes small { color: var(--muted); }
.s-link-mes:hover { border-color: rgba(230,52,88,.45); }
.s-link-mes > svg:first-child { color: var(--acc-2); }
.s-rank { list-style: none; margin: 0; padding: 0; counter-reset: r; }
.s-rank li { counter-increment: r; }
.s-rank .s-lin::before { content: counter(r); width: 22px; color: var(--muted); font-weight: 800; }
.simples .cg { gap: 6px; }
.simples .cd { min-height: 58px; }
.simples .cd-e { font-size: .76rem; }
.resumo { display: flex; flex-wrap: wrap; align-items: stretch; gap: 0; margin-bottom: 14px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); overflow: hidden; }
.r-it { display: grid; gap: 2px; padding: 14px 20px; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--text); font: inherit; text-align: left; }
button.r-it { cursor: pointer; } button.r-it:hover { background: rgba(255,255,255,.04); }
.r-it span { color: var(--muted); font-size: .82rem; font-weight: 700; }
.r-it strong { font-size: 1.35rem; font-weight: 800; }
.r-per { margin-left: auto; align-self: center; padding: 0 20px; color: var(--muted); font-size: .85rem; }
.cli-linha { font-size: .92rem; color: var(--muted); } .cli-linha strong { margin: 0 2px; }
@media (max-width: 860px) {
  .s-dia, .s-dia.quatro, .s-duas { grid-template-columns: 1fr; }
  .s-dia.quatro { grid-template-columns: 1fr 1fr; }
  .s-acoes .btn { flex: 1 1 calc(50% - 10px); justify-content: center; }
  .r-it { flex: 1 1 50%; border-bottom: 1px solid var(--line); }
  .r-per { padding: 10px 20px; }
}

/* =================== card giratório + gráficos do verso =================== */
.flip { perspective: 1200px; min-height: 172px; }
.flip-in { position: relative; display: grid; width: 100%; height: 100%; min-height: inherit; transform-style: preserve-3d; transition: transform .7s cubic-bezier(.3,.8,.25,1); }
.flip.virado .flip-in { transform: rotateY(180deg); }
.flip-f { position: relative; grid-area: 1 / 1; backface-visibility: hidden; -webkit-backface-visibility: hidden; display: grid; gap: 4px; align-content: start; padding: 22px 22px 20px; border-radius: 18px; border: 1px solid var(--line); background: var(--panel); color: var(--text); text-align: left; overflow: hidden; }
.flip-f.frente { cursor: pointer; transition: border-color .2s; }
.flip-f.frente:hover { border-color: rgba(230,52,88,.45); }
.flip-f.verso { transform: rotateY(180deg); background: linear-gradient(160deg, #262248, var(--panel) 70%); border-color: rgba(230,52,88,.35); align-content: stretch; grid-template-rows: auto 1fr; }
.flip-f > span { font-size: .95rem; font-weight: 700; color: var(--muted); }
.flip-f > strong { font-size: clamp(1.7rem, 3vw, 2.4rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.flip-f > small { color: var(--muted); font-size: .85rem; }
.flip-t { font-size: .8rem; font-weight: 800; color: var(--muted); padding-right: 36px; }
.flip-b { position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; border: 1px solid var(--line-2); background: rgba(255,255,255,.04); color: var(--muted); cursor: pointer; transition: .2s; z-index: 2; }
.flip-b:hover { color: #fff; border-color: var(--acc); background: rgba(230,52,88,.2); transform: rotate(-90deg); }
.flip:not(.virado) .verso { visibility: hidden; transition: visibility 0s .35s; }
.flip.virado .frente { visibility: hidden; transition: visibility 0s .35s; }
.flip.virado .verso { visibility: visible; }
.gx { display: grid; grid-template-rows: 1fr auto; gap: 6px; min-height: 0; height: 100%; }
.gx-b { display: flex; align-items: flex-end; gap: 3px; height: 100%; min-height: 70px; }
.gx-c { flex: 1; min-width: 0; height: 100%; display: flex; align-items: flex-end; }
.gx-c i { display: block; width: 100%; border-radius: 4px 4px 0 0; transition: filter .15s; }
.gx-c:hover i { filter: brightness(1.3); }
.gx-ent .gx-c i { background: linear-gradient(180deg, #86efac, var(--din)); }
.gx-sai .gx-c i { background: linear-gradient(180deg, #ffb4b4, var(--c-bad)); }
.gx-e { display: flex; justify-content: space-between; color: var(--muted); font-size: .72rem; font-weight: 700; }
.gx-svg { width: 100%; height: 100%; min-height: 70px; overflow: visible; }
.gx-linha { fill: none; stroke: var(--din); stroke-width: 2; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.gx-area { fill: rgba(74,222,128,.14); stroke: none; }
.gx-zero { stroke: var(--line-2); stroke-dasharray: 2 2; vector-effect: non-scaling-stroke; }
.gx-dev { display: grid; gap: 7px; align-content: center; }
.gx-dev > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; font-size: .82rem; }
.gx-dev span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gx-dev b { color: var(--c-warn); }
.gx-dev i { grid-column: 1 / -1; height: 4px; border-radius: 99px; background: linear-gradient(90deg, #c77d12, var(--c-warn)); }
@media (prefers-reduced-motion: reduce) { .flip-in { transition: none; } }

/* =================== ajuda e passeio =================== */
.ajuda-b { display: grid; justify-items: center; gap: 2px; padding: 6px 4px; border-radius: 10px; color: var(--muted); text-decoration: none; font-size: .62rem; font-weight: 700; }
.ajuda-b:hover { color: var(--acc-2); background: rgba(255,255,255,.04); }
.hl-regras { display: flex; flex-wrap: wrap; gap: 8px 22px; padding: 14px 18px; border-radius: 14px; border: 1px solid var(--line); background: var(--panel); }
.ajuda-lista { display: grid; gap: 10px; }
.ajuda-it { border: 1px solid var(--line); border-radius: 16px; background: var(--panel); overflow: clip; }
.ajuda-it[open] { border-color: rgba(230,52,88,.35); }
.ajuda-it > summary { display: flex; align-items: center; gap: 14px; padding: 15px 18px; cursor: pointer; list-style: none; }
.ajuda-it > summary::-webkit-details-marker { display: none; }
.ajuda-it > summary > svg:last-child { color: var(--muted); transition: transform .2s; margin-left: auto; }
.ajuda-it[open] > summary > svg:last-child { transform: rotate(180deg); }
.ajuda-ico { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: rgba(230,52,88,.14); color: var(--acc-2); flex: none; }
.ajuda-t { display: grid; flex: 1; min-width: 0; } .ajuda-t strong { font-size: 1.05rem; } .ajuda-t small { color: var(--muted); font-size: .86rem; }
.ajuda-corpo { padding: 2px 20px 20px 74px; display: grid; gap: 14px; }
.ajuda-corpo ol { margin: 0; padding-left: 22px; display: grid; gap: 9px; font-size: 1rem; line-height: 1.5; }
.ajuda-corpo li::marker { color: var(--acc-2); font-weight: 800; }
.ajuda-corpo .btn { justify-self: start; }
.ajuda-dica { display: flex; gap: 10px; align-items: flex-start; padding: 11px 14px; border-radius: 12px; background: rgba(96,165,250,.1); border: 1px solid rgba(96,165,250,.25); color: #bfdbfe; font-size: .92rem; }
.atalhos-t { display: grid; gap: 8px; } .atalhos-t > div { display: flex; align-items: center; gap: 14px; } .atalhos-t kbd { min-width: 130px; text-align: center; padding: 6px 10px; }
.tour { display: grid; gap: 12px; justify-items: center; text-align: center; padding: 8px 6px 4px; min-height: 230px; align-content: center; }
.tour h3 { font-size: 1.3rem; } .tour p { margin: 0; color: var(--muted); font-size: 1.02rem; line-height: 1.55; max-width: 460px; } .tour p strong { color: var(--text); }
.tour-ico { width: 72px; height: 72px; border-radius: 22px; display: grid; place-items: center; background: radial-gradient(circle at 30% 20%, rgba(230,52,88,.35), rgba(230,52,88,.1)); border: 1px solid rgba(230,52,88,.4); color: var(--acc-2); }
.tour-pts { display: flex; gap: 6px; margin-top: 8px; } .tour-pts i { width: 8px; height: 8px; border-radius: 50%; background: var(--panel-3); transition: .2s; } .tour-pts i.on { background: var(--acc); width: 22px; border-radius: 99px; }
.btn.oculto { display: none; }
@media (max-width: 860px) { .ajuda-corpo { padding-left: 20px; } .ajuda-b { display: none; } .flip { min-height: 140px; } }
.flip.s-num { padding: 0; border: 0; background: none; border-radius: 18px; }
.btn[hidden] { display: none; }

.flip.s-lista { min-height: 0; }
.flip.s-lista .flip-f { padding: 18px 20px; gap: 8px; border-radius: 18px; }
.flip.s-lista .flip-f.frente { cursor: default; }
.flip.s-lista .s-rank { margin: 0; }
.flip.s-lista h2 { font-size: 1.12rem; margin: 0 0 4px; padding-right: 40px; }
.flip.s-num .flip-f { min-height: 172px; }
.flip.s-lista .verso { align-content: start; grid-template-rows: auto 1fr; }
.flip.s-lista .verso .gx { align-self: center; }
.gx-rosca-w { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; justify-content: center; padding: 6px 0; }
.gx-rosca { width: 150px; height: 150px; transform: rotate(0deg); flex: none; }
.gx-leg { display: grid; gap: 7px; min-width: 150px; flex: 1; }
.gx-leg > div { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: .86rem; }
.gx-leg i { width: 12px; height: 12px; border-radius: 4px; } .gx-leg span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .gx-leg b { color: var(--muted); font-variant-numeric: tabular-nums; }
.gx-hb { display: grid; gap: 11px; padding: 4px 0; }
.gx-hb > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; font-size: .86rem; }
.gx-hb span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .gx-hb b { color: var(--din); font-variant-numeric: tabular-nums; }
.gx-hb i { grid-column: 1 / -1; height: 8px; border-radius: 99px; }
.virar-todos.on { border-color: var(--acc); color: var(--acc-2); background: rgba(230,52,88,.12); }
.s-topo .tools { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* =================== passeio com foco =================== */
.tr { position: fixed; inset: 0; z-index: 2000; animation: fade .2s both; }
.tr.fim { opacity: 0; transition: opacity .2s; }
.tr::before { content: ''; position: absolute; inset: 0; }
.tr-mask { position: fixed; border-radius: 14px; box-shadow: 0 0 0 9999px rgba(6,5,16,.78), 0 0 0 3px var(--acc), 0 0 28px 4px rgba(230,52,88,.55); transition: top .35s var(--ease), left .35s var(--ease), width .35s var(--ease), height .35s var(--ease), opacity .2s; pointer-events: none; opacity: 0; }
.tr-card { position: fixed; z-index: 1; width: min(380px, calc(100vw - 24px)); padding: 16px 18px 14px; border-radius: 18px; background: #26223f; border: 1px solid rgba(230,52,88,.5); box-shadow: 0 24px 60px -10px rgba(0,0,0,.85); display: grid; gap: 8px; transition: top .35s var(--ease), left .35s var(--ease), opacity .15s; }
.tr-card.saindo { opacity: .35; }
.tr-card h3 { font-size: 1.12rem; margin: 0; }
.tr-card p { margin: 0; color: #d9d6ee; font-size: .95rem; line-height: 1.5; }
.tr-card p strong { color: #fff; }
.tr-topo { display: flex; align-items: center; justify-content: space-between; }
.tr-n { font-size: .74rem; font-weight: 800; color: var(--acc-2); text-transform: uppercase; letter-spacing: .06em; }
.tr-x { width: 28px; height: 28px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; display: grid; place-items: center; }
.tr-x:hover { background: rgba(255,255,255,.08); color: #fff; }
.tr-pts { display: flex; gap: 5px; align-items: center; margin: 2px 0; }
.tr-pts i { width: 7px; height: 7px; border-radius: 50%; background: var(--panel-3); transition: .2s; } .tr-pts i.fei { background: rgba(230,52,88,.5); } .tr-pts i.on { background: var(--acc); width: 20px; border-radius: 99px; }
.tr-barra { height: 5px; width: 100%; border-radius: 99px; background: var(--panel-3); overflow: hidden; } .tr-barra i { display: block; height: 100%; border-radius: 99px; background: var(--acc); transition: width .3s; }
.tr-acoes { display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px; }
.ajuda-flut { position: fixed; right: 18px; bottom: 18px; z-index: 60; width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(230,52,88,.6); background: linear-gradient(180deg, #f0486b, #d62b50); color: #fff; display: grid; place-items: center; cursor: pointer; box-shadow: 0 10px 28px -6px rgba(230,52,88,.7); transition: transform .15s var(--ease); }
.ajuda-flut:hover { transform: scale(1.08) rotate(-6deg); }
.tour-botoes { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 860px) { .ajuda-flut { bottom: 84px; right: 14px; width: 44px; height: 44px; } .tr-card { width: calc(100vw - 24px); } }

/* =================== oficina (fila de consertos) e ajustes de clareza =================== */
.simula-nota { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; background: rgba(96,165,250,.1); border: 1px solid rgba(96,165,250,.25); color: #bfdbfe; font-size: .84rem; line-height: 1.4; }
.simula-nota svg { flex: none; margin-top: 2px; } .simula-nota strong { color: #fff; }
.s-oficina { display: flex; align-items: center; gap: 16px; width: 100%; padding: 14px 18px; border-radius: 18px; border: 1px solid rgba(230,52,88,.35); background: linear-gradient(150deg, rgba(230,52,88,.16), var(--panel) 65%); color: var(--text); font: inherit; text-align: left; cursor: pointer; transition: transform .15s var(--ease), border-color .2s; }
.s-oficina:hover { transform: translateY(-2px); border-color: var(--acc); }
.s-of-ico { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; background: rgba(230,52,88,.2); color: var(--acc-2); flex: none; }
.s-of-t { display: grid; flex: 1; min-width: 0; } .s-of-t strong { font-size: 1.05rem; } .s-of-t small { color: var(--muted); }
.s-of-n { display: grid; justify-items: center; min-width: 74px; } .s-of-n b { font-size: 1.7rem; font-weight: 800; line-height: 1; } .s-of-n small { color: var(--muted); font-size: .72rem; font-weight: 700; margin-top: 3px; }
b.azul { color: #93c5fd; } b.amarelo { color: var(--c-warn); } b.verde { color: var(--din); }
.ofi-filtro { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ofi-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: start; }
.ofi-col { display: grid; gap: 10px; padding: 14px; border-radius: 18px; border: 1px solid var(--line); background: var(--panel); align-content: start; border-top: 3px solid var(--c); }
.ofi-col.azul { --c: #60a5fa; } .ofi-col.amarelo { --c: var(--c-warn); } .ofi-col.verde { --c: var(--din); }
.ofi-col > header { display: flex; justify-content: space-between; align-items: center; gap: 8px; } .ofi-col h2 { font-size: 1.1rem; margin: 0; } .ofi-col header small { color: var(--muted); }
.ofi-card { display: grid; gap: 8px; padding: 12px; border-radius: 14px; border: 1px solid var(--line); background: var(--panel-2); }
.ofi-card.atrasada { border-color: rgba(255,138,138,.5); background: linear-gradient(160deg, rgba(255,138,138,.08), var(--panel-2) 60%); }
.ofi-info { display: grid; gap: 5px; padding: 0; border: 0; background: none; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.ofi-l1 { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; } .ofi-l1 strong { font-size: 1.08rem; }
.ofi-tempo { color: var(--muted); font-size: .76rem; font-weight: 700; white-space: nowrap; } .ofi-card.atrasada .ofi-tempo { color: var(--c-bad); }
.ofi-cli { display: flex; gap: 8px; align-items: center; color: var(--muted); font-size: .9rem; }
.ofi-def { display: flex; gap: 7px; align-items: flex-start; font-size: .9rem; color: #f3d79a; } .ofi-def svg { flex: none; margin-top: 3px; } .ofi-def.vazio { color: var(--dim); font-style: italic; }
.ofi-pe { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; color: var(--muted); font-size: .82rem; } .tag.sem { background: rgba(245,185,66,.14); color: var(--c-warn); }
.ofi-avanca { width: 100%; justify-content: center; padding: 10px; font-weight: 800; }
.ofi-col.azul .ofi-avanca { border-color: rgba(96,165,250,.5); color: #bfdbfe; } .ofi-col.amarelo .ofi-avanca { border-color: rgba(245,185,66,.5); color: #f3d79a; } .ofi-col.verde .ofi-avanca { border-color: rgba(74,222,128,.5); color: #bbf7d0; }
.ofi-vazio { padding: 22px 8px; text-align: center; color: var(--dim); font-size: .9rem; }
.s-vazio-grande { justify-items: center; text-align: center; padding: 40px 20px; gap: 12px; }
.r-it small { color: var(--muted); font-size: .74rem; }
@media (max-width: 1100px) { .ofi-grade { grid-template-columns: 1fr; } }
@media (max-width: 860px) { .s-oficina { flex-wrap: wrap; } .s-of-n { min-width: 60px; } }

/* =================== áreas (Serviços, Financeiro) e Início enxuto =================== */
.area { max-width: 1280px; margin: 0 auto; display: grid; gap: 14px; }
.area-topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; }
.area-topo h1 { font-size: 1.7rem; }
.abas.grande button { padding: 9px 18px; font-size: .96rem; }
.sub-aba .s-topo h1, .sub-aba .head h1 { display: none; }
.sub-aba .s-topo { justify-content: flex-end; } .sub-aba .head { justify-content: flex-end; margin-bottom: 14px; }
.sub-aba .simples, .sub-aba .mov { max-width: none; }
.fila { display: grid; gap: 12px; }
.fila-topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; }
.fila-topo h2 { font-size: 1.25rem; margin: 0; } .fila-topo .muted { font-size: .9rem; }
.fila-vazia { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; justify-content: space-between; padding: 20px 22px; border-radius: 18px; border: 1px dashed var(--line-2); color: var(--muted); } .fila-vazia p { margin: 0; max-width: 560px; } .fila-vazia strong { color: var(--text); }
.ofi-col > header h3 { font-size: 1.02rem; margin: 0; }
.s-mais { display: inline-flex; align-items: center; gap: 8px; padding: 12px 6px; border: 0; background: none; color: var(--muted); font: inherit; font-weight: 700; cursor: pointer; } .s-mais:hover { color: var(--acc-2); }
.fin-faixa { display: flex; align-items: center; gap: 18px; padding: 12px 18px; border-radius: 14px; border: 1px solid var(--line); background: var(--panel); color: var(--muted); font: inherit; cursor: pointer; text-align: left; flex-wrap: wrap; }
.fin-faixa:hover { border-color: var(--line-2); } .fin-faixa > span:first-child { font-weight: 800; color: var(--text); } .fin-faixa strong { font-size: 1.02rem; }
.s-duas:has(> :only-child) { grid-template-columns: 1fr; }

/* =================== Início: central de atalhos personalizável =================== */
.inicio .s-topo { margin-bottom: 4px; }
.personaliza.on { border-color: var(--acc); color: var(--acc-2); background: rgba(230,52,88,.12); }
.atalhos { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.atalho { position: relative; border-radius: 20px; border: 1px solid var(--line); background: var(--panel); transition: transform .15s var(--ease), border-color .2s, box-shadow .2s; min-height: 148px; }
.atalho:not(.edita):hover { transform: translateY(-3px); border-color: rgba(230,52,88,.5); box-shadow: 0 16px 34px -18px rgba(230,52,88,.55); }
.at-corpo { display: grid; align-content: start; gap: 6px; width: 100%; height: 100%; padding: 20px; border: 0; border-radius: inherit; background: none; color: var(--text); font: inherit; text-align: left; cursor: pointer; position: relative; }
.at-ico { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: rgba(230,52,88,.14); color: var(--acc-2); margin-bottom: 6px; flex: none; }
.at-t { font-size: 1.12rem; font-weight: 800; letter-spacing: -.01em; }
.at-s { color: var(--muted); font-size: .88rem; line-height: 1.35; }
.at-seta { position: absolute; right: 16px; bottom: 16px; color: var(--dim); transition: transform .15s var(--ease), color .15s; }
.atalho:not(.edita):hover .at-seta { transform: translateX(3px); color: var(--acc-2); }
.atalho.destaque { background: linear-gradient(150deg, #e63458, #a91f45); border-color: transparent; }
.atalho.destaque .at-ico { background: rgba(255,255,255,.2); color: #fff; } .atalho.destaque .at-s { color: rgba(255,255,255,.88); } .atalho.destaque .at-seta { color: rgba(255,255,255,.7); }
.atalho.alerta .at-s { color: var(--c-warn); font-weight: 800; } .atalho.verde .at-s { color: var(--din); font-weight: 800; }
.atalho[data-id="fila"] .at-s { color: #bfdbfe; font-weight: 700; }
.atalho.edita { border-style: dashed; border-color: var(--line-2); cursor: grab; animation: balanca .5s ease-in-out infinite alternate; }
.atalho.edita .at-corpo { cursor: grab; }
.atalho.arrasta { opacity: .35; } .atalho.alvo { border-color: var(--acc); background: rgba(230,52,88,.12); }
@keyframes balanca { from { transform: rotate(-.35deg); } to { transform: rotate(.35deg); } }
.at-x { position: absolute; top: -9px; right: -9px; width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--bg); background: var(--c-bad); color: #240a0a; display: grid; place-items: center; cursor: pointer; z-index: 2; }
.at-x:hover { filter: brightness(1.15); transform: scale(1.1); }
.at-mov { position: absolute; left: 12px; bottom: 12px; display: flex; gap: 6px; }
.at-mov button { width: 30px; height: 30px; border-radius: 9px; border: 1px solid var(--line-2); background: var(--panel-2); color: var(--text); display: grid; place-items: center; cursor: pointer; }
.at-mov button:hover:not(:disabled) { border-color: var(--acc); color: var(--acc-2); } .at-mov button:disabled { opacity: .3; cursor: default; }
.atalho.adiciona { display: grid; place-items: center; align-content: center; gap: 8px; border: 2px dashed rgba(230,52,88,.5); background: rgba(230,52,88,.06); color: var(--acc-2); font: inherit; font-weight: 800; cursor: pointer; animation: none; }
.atalho.adiciona:hover { background: rgba(230,52,88,.14); }
.ed-dica { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; padding: 11px 14px; border-radius: 12px; background: rgba(96,165,250,.1); border: 1px solid rgba(96,165,250,.25); color: #bfdbfe; font-size: .9rem; } .ed-dica[hidden] { display: none; } .ed-dica b { color: #fff; }
.cat { display: grid; gap: 16px; max-height: 60vh; overflow: auto; }
.cat h4 { margin: 0 0 6px; color: var(--muted); font-size: .76rem; text-transform: uppercase; letter-spacing: .06em; }
.cat-it { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; border-radius: 13px; border: 1px solid var(--line); background: var(--panel-2); color: var(--text); font: inherit; text-align: left; cursor: pointer; margin-bottom: 6px; }
.cat-it:hover { border-color: var(--acc); background: rgba(230,52,88,.1); } .cat-it .at-ico { width: 40px; height: 40px; margin: 0; }
.cat-t { display: grid; flex: 1; min-width: 0; } .cat-t small { color: var(--muted); } .cat-it > svg:last-child { color: var(--acc-2); }
@media (max-width: 860px) { .atalhos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .at-corpo { padding: 14px; } .atalho { min-height: 130px; } .at-t { font-size: 1rem; } }
@media (prefers-reduced-motion: reduce) { .atalho.edita { animation: none; } }

.atalho.edita { min-height: 168px; }
.atalho.edita .at-corpo { padding-bottom: 54px; }
.atalho.edita .at-seta { display: none; }

.blq-pop { padding: 12px; display: grid; gap: 6px; }
.blq-t { margin: 8px 2px 2px; font-size: .78rem; font-weight: 700; color: var(--muted); }
.blq-op { display: flex; justify-content: space-between; align-items: center; padding: 9px 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--panel-2); color: var(--text); font: inherit; cursor: pointer; }
.blq-op:hover { border-color: var(--acc); } .blq-op.on { border-color: var(--acc); background: rgba(230,52,88,.14); color: #fff; font-weight: 700; }

/* login: cartão que vira para definir a senha (troca da senha temporária) */
.login .vira { perspective: 1400px; width: min(380px, 100%); }
.login .vira-in { position: relative; display: grid; transform-style: preserve-3d; transition: transform .85s cubic-bezier(.3,.8,.25,1); }
.login .vira.virado .vira-in { transform: rotateY(180deg); }
.login .face { grid-area: 1 / 1; width: 100%; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.login .face.verso { transform: rotateY(180deg); background: linear-gradient(160deg, #262248, var(--panel) 70%); border-color: rgba(230,52,88,.35); }
.login .vira:not(.virado) .verso, .login .vira.virado .frente { pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .login .vira-in { transition: none; } }

/* Movimentações em "visão planilha": mesmas colunas da planilha do caixa */
.pl-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); }
.pl { width: 100%; border-collapse: collapse; font-size: .86rem; white-space: nowrap; }
.pl th { position: sticky; top: 0; background: #262248; color: var(--muted); font-size: .7rem; letter-spacing: .05em; text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--line-2); }
.pl td { padding: 7px 10px; border-bottom: 1px solid rgba(255,255,255,.05); }
.pl tr.pl-dh td { background: rgba(230,52,88,.1); font-size: .88rem; padding: 8px 10px; }
.pl .pl-sd { text-align: right; font-variant-numeric: tabular-nums; }
.pl .pl-n { font-variant-numeric: tabular-nums; }
.pl .pl-e .pl-n { color: var(--c-ok, #3ad29f); font-weight: 700; }
.pl .pl-s .pl-n, .pl .pl-d .pl-n { color: var(--c-bad, #ff6b81); font-weight: 700; }
.pl tr.pl-peca .pl-e .pl-n { color: #b9a4ff; }
.pl tr.clicavel { cursor: pointer; }
.pl tr.clicavel:hover td { background: rgba(255,255,255,.04); }
.pl tr.sim td:first-child { box-shadow: inset 2px 0 0 var(--accent, #e63458); }
.pl .pl-pg { color: var(--muted); }

/* consulta de CNPJ */
.cnpj-campo { display: flex; gap: 8px; align-items: stretch; }
.cnpj-campo input { flex: 1; }
.cnpj-res { margin-top: 12px; padding: 14px; border: 1px solid var(--line-2); border-radius: 14px; background: rgba(255,255,255,.03); display: grid; gap: 6px; font-size: .9rem; }
.cnpj-topo { display: flex; justify-content: space-between; gap: 10px; align-items: center; flex-wrap: wrap; }
.cnpj-l { display: grid; grid-template-columns: 130px 1fr; gap: 8px; }
.cnpj-l > :first-child { font-size: .8rem; }
.pequeno { font-size: .75rem; }

/* regras de comissão */
.cm-sel { display: flex; align-items: center; gap: 10px; margin: 6px 0 14px; }
.cm-grupo { margin-top: 14px; }
.cm-grupo h4, .cm-excl h4 { margin: 0 0 6px; font-size: .86rem; }
.cm-cab, .cm-lin { display: grid; grid-template-columns: 1fr 100px 130px; gap: 10px; align-items: center; }
.cm-cab { font-size: .7rem; color: var(--muted); letter-spacing: .04em; text-transform: uppercase; padding: 0 4px 4px; border-bottom: 1px solid var(--line); }
.cm-lin { padding: 6px 4px; border-bottom: 1px solid rgba(255,255,255,.05); }
.cm-lin.off .cm-nome { opacity: .5; }
.cm-nome small { display: block; color: var(--muted); font-size: .74rem; }
.cm-sw { display: flex; justify-content: center; }
.cm-sw input { width: 20px; height: 20px; accent-color: var(--accent, #e63458); }
.cm-lin input[type=text] { width: 100%; text-align: right; }
.cm-excl { margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--line); }
.cm-excl textarea { width: 100%; }
.cm-det { margin-top: 12px; }
.cm-det summary { cursor: pointer; color: var(--muted); font-size: .85rem; }
.cm-det-l { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; padding: 4px 0; font-size: .85rem; border-bottom: 1px solid rgba(255,255,255,.05); }
.cm-det-l small { color: var(--muted); }
@media (max-width: 600px) { .cm-cab, .cm-lin { grid-template-columns: 1fr 70px 90px; } }

/* Lista de movimentações na mesma sequência de colunas da planilha */
:root { --mv-cols: 104px 96px 96px minmax(120px,1fr) minmax(110px,1fr) minmax(140px,1.4fr) 84px 104px 124px; }
.mv-cab { display: grid; grid-template-columns: var(--mv-cols); gap: 12px; padding: 0 16px 6px; margin-top: 4px; font-size: .68rem; letter-spacing: .06em; color: var(--dim); font-weight: 800; }
.mv-cab span { white-space: nowrap; }
.mv-itens .mv-it { grid-template-columns: var(--mv-cols); gap: 12px; }
.mv-c { min-width: 0; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: .9rem; }
.mv-c.e, .mv-c.s, .mv-c.d { font-variant-numeric: tabular-nums; }
.mv-c.ap strong, .mv-c.ds { overflow: hidden; text-overflow: ellipsis; }
.mv-c.ap { flex-wrap: nowrap; }
.mv-c.ap strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.pill.st-concluida, .pill.st-entregue { background: rgba(52,211,153,.12); color: var(--c-ok); }
.pill.st-recebido, .pill.st-em_reparo { background: rgba(96,165,250,.14); color: var(--c-info); }
.pill.st-cancelada { background: rgba(255,138,138,.14); color: var(--c-bad); }
@media (max-width: 1180px) {
  .mv-cab { display: none; }
  .mv-itens .mv-it { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 4px; }
  .mv-c:empty { display: none; }
  .mv-c[data-rot]:not(.e):not(.s):not(.d):not(.ap)::before { content: attr(data-rot) ': '; color: var(--dim); font-size: .72rem; }
  .mv-c.ap { grid-column: 1 / -1; order: -1; }
  .mv-c.ds, .mv-c.lj { grid-column: span 3; }
}
.pl th.pl-sd { text-align: right; }

/* O.S.: ações rápidas e checklist de entrada */
.det-acoes { display: flex; gap: 8px; flex-wrap: wrap; margin: 2px 0 8px; }
.btn.whats { border-color: rgba(37,211,102,.45); color: #6ee7a0; }
.btn.whats:hover { background: rgba(37,211,102,.12); }
.ck-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.ck-chip { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line-2); background: rgba(255,255,255,.03); color: var(--muted); font: inherit; font-size: .84rem; cursor: pointer; text-align: left; }
.ck-chip .ck-s { width: 18px; text-align: center; font-weight: 800; }
.ck-chip.ok { border-color: rgba(52,211,153,.5); color: var(--text); background: rgba(52,211,153,.1); } .ck-chip.ok .ck-s { color: var(--c-ok); }
.ck-chip.defeito { border-color: rgba(255,138,138,.55); color: var(--text); background: rgba(255,138,138,.1); } .ck-chip.defeito .ck-s { color: var(--c-bad); }
.ck-chip.nt { border-style: dashed; }

/* impressão (comprovante e extrato) */
.print-area { display: none; }
@media print {
  @page { margin: 10mm; }
  body.imprimindo > *:not(.print-area) { display: none !important; }
  body.imprimindo, html:has(body.imprimindo) { background: #fff !important; }
  body.imprimindo .print-area { display: block; color: #111; font: 11pt/1.4 system-ui, sans-serif; }
  .pr { page-break-inside: avoid; }
  .fmt-a4 .pr + .pr { margin-top: 10mm; }
  .pr-cab { display: grid; grid-template-columns: 52px 1fr auto; gap: 10px; align-items: center; border-bottom: 2px solid #e63458; padding-bottom: 8px; margin-bottom: 10px; }
  .pr-cab img { width: 52px; filter: invert(1) hue-rotate(180deg); }
  .pr-cab strong { display: block; font-size: 13pt; } .pr-cab small { color: #555; font-size: 8.5pt; }
  .pr-tit { font-weight: 800; font-size: 11pt; text-align: right; }
  .pr-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 3px 16px; margin-bottom: 8px; }
  .pr-l { display: flex; gap: 6px; border-bottom: 1px dotted #bbb; padding: 2px 0; } .pr-l span { color: #555; min-width: 92px; }
  .pr-ck h4 { margin: 8px 0 4px; font-size: 10pt; }
  .pr-ck-g { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px 12px; font-size: 9pt; }
  .pr-ck-i { display: flex; justify-content: space-between; border-bottom: 1px dotted #ddd; } .pr-ck-i.defeito b { color: #b00020; }
  .pr-termo { font-size: 8pt; color: #333; margin-top: 8px; text-align: justify; }
  .pr-ass { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 26px; font-size: 9pt; text-align: center; color: #444; }
  .pr-ass i { display: block; border-top: 1px solid #333; margin-bottom: 3px; }
  .pr-rod { margin-top: 8px; font-size: 7.5pt; color: #777; text-align: right; }
  .pr-tab { width: 100%; border-collapse: collapse; font-size: 9.5pt; margin-top: 6px; }
  .pr-tab th, .pr-tab td { border-bottom: 1px solid #ddd; padding: 4px 6px; text-align: left; } .pr-tab th { background: #f3f3f3; }
  .pr-tab tfoot td { border-top: 2px solid #333; font-size: 11pt; }
  .pr-pix { margin-top: 10px; font-size: 11pt; }
  /* bobina 80 mm */
  .fmt-cupom { width: 72mm; font-size: 9pt !important; }
  .fmt-cupom .pr-cab { grid-template-columns: 1fr; text-align: center; } .fmt-cupom .pr-cab img { margin: 0 auto; width: 40px; } .fmt-cupom .pr-tit { text-align: center; }
  .fmt-cupom .pr-grade, .fmt-cupom .pr-ck-g, .fmt-cupom .pr-ass { grid-template-columns: 1fr; }
}

/* garantia na O.S. */
.gar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 12px; border-radius: 12px; font-size: .88rem; margin: 4px 0; }
.gar.ok { background: rgba(52,211,153,.08); border: 1px solid rgba(52,211,153,.3); color: var(--c-ok); }
.gar.venc { background: rgba(255,255,255,.03); border: 1px solid var(--line); color: var(--muted); }
.gar small { color: var(--muted); } .gar .btn { margin-left: auto; }

/* estoque de peças */
.est-lista { display: grid; gap: 8px; }
.est-it { display: grid; grid-template-columns: 90px minmax(0, 1fr) 110px 120px 168px; gap: 14px; align-items: center; padding: 12px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); cursor: pointer; transition: border-color .15s, background .15s; }
.est-it:hover { border-color: rgba(230,52,88,.4); }
.est-it.baixo { border-color: rgba(245,185,66,.45); background: linear-gradient(90deg, rgba(245,185,66,.07), var(--panel) 45%); }
.est-it .tag { justify-self: start; }
.est-nome { display: grid; min-width: 0; } .est-nome strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .est-nome small, .est-qtd small, .est-custo small { color: var(--muted); font-size: .75rem; }
.est-qtd, .est-custo { display: grid; justify-items: end; } .est-qtd b { font-size: 1.35rem; font-variant-numeric: tabular-nums; }
.est-it.baixo .est-qtd b, .est-it.baixo .est-qtd small { color: var(--c-warn); }
.est-acoes { display: flex; gap: 6px; justify-content: flex-end; }
.est-form { display: grid; gap: 12px; }
.est-f { display: grid; gap: 6px; } .est-f > span { font-weight: 700; font-size: .85rem; } .est-f small { color: var(--muted); font-weight: 400; margin-left: 6px; }
.est-ck { display: flex; gap: 8px; align-items: center; }
@media (max-width: 760px) { .est-it { grid-template-columns: 1fr auto; } .est-it .tag, .est-custo { display: none; } .est-acoes { grid-column: 1 / -1; } }

/* edição direta na grade */
.pl td.ed { cursor: text; position: relative; }
.pl td.ed:hover { background: rgba(230,52,88,.1); box-shadow: inset 0 0 0 1px rgba(230,52,88,.5); }
.pl td.ed:focus-visible { outline: 2px solid var(--acc-2); outline-offset: -2px; }
.pl td.editando { padding: 2px 4px; background: rgba(230,52,88,.14); box-shadow: inset 0 0 0 2px var(--acc); }
.pl td.editando .ed-campo { width: 100%; min-width: 96px; background: var(--panel-2); color: var(--text); border: 0; border-radius: 6px; padding: 6px 8px; font: inherit; outline: none; }
.pl td.salvando { opacity: .6; } .pl td.salvo { animation: edOk 1.1s ease-out; }
@keyframes edOk { from { background: rgba(52,211,153,.4); } to { background: transparent; } }
.pl tr.edit td:first-child { box-shadow: inset 3px 0 0 var(--c-warn); }
.pl-dica { margin: 0 0 8px; color: var(--muted); font-size: .8rem; }

/* CRM de WhatsApp */
.wa-grade { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 14px; height: calc(100vh - 150px); min-height: 480px; }
.wa-lista, .wa-chat { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.wa-lista { padding: 12px; gap: 10px; }
.wa-lista-topo { display: flex; gap: 8px; align-items: center; } .wa-lista-topo .busca { flex: 1; }
.wa-conv-lista { overflow-y: auto; display: grid; gap: 4px; align-content: start; margin: 0 -4px; padding: 0 4px; }
.wa-conv { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px; border: 0; border-radius: 12px; background: transparent; color: var(--text); text-align: left; cursor: pointer; font: inherit; }
.wa-conv:hover { background: rgba(255,255,255,.04); } .wa-conv.on { background: rgba(230,52,88,.14); }
.wa-av { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, #33305a, #23203f); font-weight: 800; font-size: .8rem; color: var(--acc-2); flex: none; }
.wa-conv-t { display: grid; min-width: 0; } .wa-conv-t strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; gap: 6px; align-items: center; }
.wa-conv-t small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wa-conv.nova .wa-conv-t strong, .wa-conv.nova .wa-conv-t small { color: var(--text); font-weight: 700; }
.wa-conv-m { display: grid; justify-items: end; gap: 4px; } .wa-conv-m small { color: var(--dim); font-size: .72rem; }
.wa-badge { background: var(--acc); color: #fff; border-radius: 99px; min-width: 20px; height: 20px; display: grid; place-items: center; font-size: .72rem; padding: 0 6px; }
.wa-chat-topo { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.wa-chat-nome { display: grid; flex: 1; min-width: 160px; } .wa-chat-nome small { color: var(--muted); }
.wa-chat-acoes { display: flex; gap: 8px; } .wa-voltar { display: none; }
.wa-os { display: flex; gap: 8px; align-items: center; padding: 8px 16px; border-bottom: 1px solid var(--line); font-size: .82rem; flex-wrap: wrap; }
.wa-msgs { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 6px; background: radial-gradient(60% 40% at 50% 0, rgba(230,52,88,.05), transparent); }
.wa-dia { align-self: center; font-size: .72rem; color: var(--dim); background: rgba(255,255,255,.05); border-radius: 99px; padding: 3px 12px; margin: 8px 0; }
.wa-m { max-width: min(72%, 560px); padding: 8px 12px 6px; border-radius: 14px; display: grid; gap: 2px; white-space: pre-wrap; word-break: break-word; font-size: .92rem; }
.wa-m.in { align-self: flex-start; background: var(--panel-3); border-bottom-left-radius: 4px; }
.wa-m.out { align-self: flex-end; background: linear-gradient(135deg, #b32a49, #8f2140); border-bottom-right-radius: 4px; }
.wa-m small { justify-self: end; font-size: .68rem; opacity: .7; } .wa-tipo { opacity: .75; font-size: .8rem; }
.wa-st.lida { color: #7dd3fc; }
.wa-compor { border-top: 1px solid var(--line); padding: 10px 14px; display: grid; gap: 8px; }
.wa-rapidas { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: .8rem; }
.wa-linha { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; } .wa-linha textarea { resize: none; width: 100%; }
.wa-chat-vazio { flex: 1; display: grid; place-content: center; justify-items: center; gap: 10px; color: var(--dim); }
.wa-vazio { display: grid; justify-items: center; gap: 10px; text-align: center; padding: 40px 20px; max-width: 560px; margin: 24px auto; }
.wa-qr { display: grid; justify-items: center; gap: 8px; padding: 12px; } .wa-qr img { width: 240px; height: 240px; background: #fff; border-radius: 12px; padding: 8px; }
@media (max-width: 900px) {
  .wa-grade { grid-template-columns: 1fr; height: calc(100vh - 200px); }
  .wa-grade.com-chat .wa-lista { display: none; } .wa-grade:not(.com-chat) .wa-chat { display: none; }
  .wa-voltar { display: inline-flex; } .wa-m { max-width: 86%; }
}

/* formulário da O.S. em duas colunas (sem rolagem desnecessária) */
@media (min-width: 900px) {
  .fos { grid-template-columns: 1fr 1fr; column-gap: 18px; }
  .fos > * { grid-column: 1 / -1; }
  .fos > .fc.half { grid-column: auto; }
}
/* lista: células editáveis + lápis */
:root { --mv-cols: 104px 96px 96px minmax(120px,1fr) minmax(110px,1fr) minmax(140px,1.4fr) 84px 112px 124px 40px; }
.mv-c.ed { cursor: text; border-radius: 8px; padding: 3px 6px; margin: -3px -6px; transition: background .12s; }
.mv-c.ed:hover { background: rgba(230,52,88,.12); box-shadow: inset 0 0 0 1px rgba(230,52,88,.45); }
.mv-c.ed:focus-visible { outline: 2px solid var(--acc-2); }
.mv-c.editando { background: rgba(230,52,88,.14); box-shadow: inset 0 0 0 2px var(--acc); flex-wrap: nowrap; }
.mv-c.editando .ed-campo { width: 100%; min-width: 80px; background: var(--panel-2); color: var(--text); border: 0; border-radius: 6px; padding: 5px 8px; font: inherit; outline: none; }
.mv-c.salvando { opacity: .6; } .mv-c.salvo { animation: edOk 1.1s ease-out; }
.mv-c.lp { justify-content: flex-end; }
.lapis { width: 32px; height: 32px; border-radius: 9px; border: 1px solid var(--line-2); background: rgba(255,255,255,.04); color: var(--muted); display: grid; place-items: center; cursor: pointer; transition: .15s; }
.lapis:hover { color: #fff; background: var(--acc); border-color: var(--acc); }
.mv-it.clicavel { cursor: pointer; }
@media (max-width: 1180px) { .mv-itens .mv-it { grid-template-columns: repeat(3, minmax(0, 1fr)); } .mv-c.lp { grid-column: -2 / -1; grid-row: 1; } }
.fos > .fc.half { align-content: start; }
:root { --mv-cols: 104px 96px 96px minmax(150px,1fr) minmax(120px,1fr) minmax(130px,1.2fr) 84px 112px 124px 40px; }
.mv-c.ap { flex-wrap: wrap; }
.mv-c.ap strong { white-space: normal; overflow: visible; }

/* inserir: "+" por dia, linha rápida e botão flutuante */
.mv-mais { display: inline-flex; gap: 6px; margin-left: 12px; vertical-align: middle; opacity: .55; transition: opacity .15s; }
.mv-dia > header:hover .mv-mais, .pl-dh:hover .mv-mais, .mv-mais:focus-within { opacity: 1; }
.mais-btn { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 99px; border: 1px solid var(--line-2); background: rgba(255,255,255,.04); color: var(--muted); font: 700 .72rem/1 inherit; cursor: pointer; }
.mais-btn:hover { color: #fff; background: var(--acc); border-color: var(--acc); }
.pl tr.pl-rapida td { background: rgba(230,52,88,.08); border-bottom: 2px solid var(--acc); padding: 6px 6px; vertical-align: top; }
.rp-c { width: 100%; min-width: 72px; background: var(--panel-2); color: var(--text); border: 1px solid var(--line-2); border-radius: 8px; padding: 7px 8px; font: inherit; font-size: .84rem; }
.rp-c:focus { outline: 2px solid var(--acc-2); border-color: transparent; }
.rp-dica { display: block; color: var(--dim); font-size: .66rem; margin-top: 2px; text-align: left; }
.rp-add { width: 38px; height: 38px; border-radius: 10px; border: 0; background: linear-gradient(180deg, #f04a68, #d92f50); color: #fff; display: grid; place-items: center; cursor: pointer; box-shadow: 0 6px 16px rgba(230,52,88,.35); }
.rp-add:hover { filter: brightness(1.1); } .rp-add:disabled { opacity: .5; }
.fab-mais { position: fixed; right: 20px; bottom: 82px; z-index: 55; width: 56px; height: 56px; border-radius: 50%; border: 0; background: linear-gradient(180deg, #f04a68, #d92f50); color: #fff; display: grid; place-items: center; cursor: pointer; box-shadow: 0 10px 28px rgba(230,52,88,.5); transition: transform .18s; }
.fab-mais:hover { transform: scale(1.08) rotate(90deg); }
@media (max-width: 760px) { .fab-mais { bottom: 150px; } }
.pl tr.pl-rapida select.rp-c { min-width: 118px; } .pl tr.pl-rapida td:nth-child(7) select.rp-c { min-width: 150px; }

/* barra de ações: uma linha só, logo abaixo dos filtros */
.barra-acoes { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0 0 12px; }
.barra-acoes .ba-dica { flex: 1; min-width: 180px; text-align: right; color: var(--dim); font-size: .78rem; padding: 0 8px; }

.aviso-dados { display:flex;flex-wrap:wrap;gap:7px 14px;align-items:center;padding:10px 13px;margin:8px 0 14px;border:1px solid var(--line);border-radius:10px;color:var(--muted);font-size:.76rem; }

/* Equipe: acessos legíveis no celular, sem tabela cortada. */
.equipe-lista{display:grid;gap:8px}.equipe-pessoa{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line)}.equipe-pessoa .tools{flex-wrap:wrap;justify-content:flex-end}.equipe-pessoa .sub{overflow-wrap:anywhere}.equipe-acessos h2{margin:0}@media(max-width:600px){.equipe-pessoa{align-items:flex-start;flex-direction:column}.equipe-pessoa .tools{width:100%;justify-content:flex-start}.equipe-acessos>.tools>.tools{flex-wrap:wrap}}
