/* SONVI · sistema visual
   Identidade da marca: azul SONVI (#0055FF) como destaque, azul-claro (#0199FF) para o que está em andamento,
   preto e branco. Títulos e números em Sora, textos em Geist. Claro e escuro automáticos.
   Movimento: as telas entram em sequência, gráficos crescem, botões e cartões respondem ao toque. */

:root {
  --bg:#f4f6fa; --surface:#fff; --fill:#eef2f9; --fill-2:#e3e8f1;
  --ink:#0a0b0d; --ink-2:#5b6170; --ink-3:#8c93a1; --line:#e6e9f0; --line-2:#f0f2f6;
  --accent:#0055ff; --accent-hover:#0047d6; --accent-2:#0199ff; --accent-ink:#fff; --accent-soft:#ebf1ff; --accent-text:#0047d6;
  --bar-soft:#cfddff; --dark-card:#0a0b0d; --dark-card-2:#b9bfcb; --dark-line:#26282e;
  /* tons dos status e etiquetas (texto escuro o bastante para ler sobre o fundo claro) */
  --gray:#5b6170; --sky:#00649f; --orange:#9a4d00; --red:#c8312f; --green:#0b7a52; --blue:#0047d6; --purple:#6b3fd1; --ink-tone:#0a0b0d;
  --radius:22px; --radius-m:16px; --radius-s:12px;
  --shadow:0 1px 2px rgba(10,20,60,.04);
  --shadow-up:0 18px 40px -18px rgba(10,20,60,.28);
  --font:"Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --display:"Sora", "Geist", -apple-system, BlinkMacSystemFont, sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg:#000; --surface:#121316; --fill:#1b1d22; --fill-2:#26282e;
    --ink:#f5f6f8; --ink-2:#9ba1ad; --ink-3:#6b7280; --line:#26282e; --line-2:#1d1f24;
    --accent-hover:#1f6bff; --accent-soft:rgba(0,85,255,.22); --accent-text:#2ea6ff;
    --bar-soft:#1d3266; --dark-card:#1b1d22; --dark-card-2:#9ba1ad; --dark-line:#2c2f36;
    --gray:#9ba1ad; --sky:#4cb8ff; --orange:#f2a65a; --red:#ff6b61; --green:#3ddc97; --blue:#6aa1ff; --purple:#b69cff; --ink-tone:#f5f6f8;
    --shadow:none; --shadow-up:0 18px 40px -18px rgba(0,0,0,.8);
    color-scheme:dark;
  }
}

* { box-sizing:border-box; }
html, body { height:100%; }
body { margin:0; background:var(--bg); color:var(--ink); font:15px/1.47 var(--font); -webkit-font-smoothing:antialiased; display:flex; }
h1, h2, h3, p { margin:0; }
a { color:var(--accent-text); text-decoration:none; cursor:pointer; }
a:hover { color:var(--accent); }
.num, .tile b, td.r, th.r { font-variant-numeric:tabular-nums; }

/* ---------- movimento ---------- */
@keyframes rise { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
@keyframes grow { from { transform:scaleY(0); } to { transform:scaleY(1); } }
@keyframes fill { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@keyframes pop { 0% { opacity:0; transform:scale(.6); } 60% { transform:scale(1.08); } 100% { opacity:1; transform:scale(1); } }
@keyframes pulse { 0% { box-shadow:0 0 0 0 color-mix(in srgb, var(--tone, var(--accent)) 50%, transparent); } 70% { box-shadow:0 0 0 9px transparent; } 100% { box-shadow:0 0 0 0 transparent; } }
@keyframes eq { 0%, 100% { transform:scaleY(.25); } 50% { transform:scaleY(1); } }
@keyframes dlg { from { opacity:0; transform:translateY(18px) scale(.97); } to { opacity:1; transform:none; } }
@keyframes fade { from { opacity:0; } to { opacity:1; } }

/* Ao abrir uma tela, os blocos entram um depois do outro */
#content.entra > * { animation:rise .6s var(--ease) both; }
#content.entra > *:nth-child(2) { animation-delay:60ms; } #content.entra > *:nth-child(3) { animation-delay:120ms; }
#content.entra > *:nth-child(4) { animation-delay:180ms; } #content.entra > *:nth-child(5) { animation-delay:240ms; }
#content.entra > *:nth-child(n+6) { animation-delay:300ms; }
#content.entra .tiles > * { animation:rise .6s var(--ease) both; }
#content.entra .tiles > *:nth-child(2) { animation-delay:60ms; } #content.entra .tiles > *:nth-child(3) { animation-delay:120ms; }
#content.entra .tiles > *:nth-child(4) { animation-delay:180ms; } #content.entra .tiles > *:nth-child(n+5) { animation-delay:240ms; }
#bar.entra > * { animation:rise .5s var(--ease) both; }
.entra .bars i { animation:grow 1s var(--ease) both; animation-delay:calc(300ms + var(--i, 0) * 70ms); }
.entra .prog i, .entra .stack { animation:fill 1.1s var(--ease) both; animation-delay:calc(400ms + var(--i, 0) * 90ms); }
.entra .steps .mark { animation:pop .5s var(--ease) both; animation-delay:calc(200ms + var(--i, 0) * 110ms); }
.pulse { animation:pulse 2s ease-out infinite; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation:none !important; transition:none !important; }
}

/* ---------- barra lateral ---------- */
#side { width:248px; flex:none; height:100vh; position:sticky; top:0; padding:26px 16px 18px; display:flex; flex-direction:column; gap:22px; border-right:1px solid var(--line); background:var(--surface); overflow-y:auto; }
.brand { display:block; padding:2px 10px; }
.brand img { display:block; width:112px; height:auto; }
.veh { position:relative; display:flex; align-items:center; gap:10px; padding:6px 12px 6px 6px; border:1px solid var(--line); border-radius:999px; background:var(--surface); cursor:pointer; transition:background .2s, border-color .2s; }
.veh:hover { background:var(--fill); }
.veh:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.veh select { position:absolute; inset:0; width:100%; opacity:0; cursor:pointer; }
.veh .vt { display:flex; flex-direction:column; min-width:0; flex:1; line-height:1.2; }
.veh .vt b { font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.veh .vt small { font-size:12px; color:var(--ink-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.veh svg { width:16px; height:16px; flex:none; fill:none; stroke:var(--ink-2); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.vav.img { background:#fff; border:1px solid var(--line); overflow:hidden; } .vav.img img { width:100%; height:100%; object-fit:contain; }
.acessos { display:flex; flex-direction:column; gap:8px; padding:14px; border-radius:var(--radius-m); background:var(--fill); }
.acessos[hidden] { display:none; }
.acessos .ac-l { display:grid; grid-template-columns:32px minmax(0, 1fr) 210px; align-items:center; gap:10px; }
.acessos .ac-l select { width:100%; min-width:0; background-color:var(--surface); }
@media (max-width:520px) { .acessos .ac-l { grid-template-columns:32px minmax(0, 1fr); } .acessos .ac-l select { grid-column:1 / -1; } }
.logo-campo { display:flex; gap:18px; align-items:center; padding:14px; border-radius:var(--radius-m); background:var(--fill); }
.logo-prev { width:96px; height:96px; flex:none; border-radius:18px; background:#fff; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; overflow:hidden; color:var(--ink-3); }
.logo-prev img { width:100%; height:100%; object-fit:contain; }
.logo-info { display:flex; flex-direction:column; gap:8px; min-width:0; } .logo-info small { line-height:1.35; }
.cores { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.cor { width:26px; height:26px; border-radius:999px; border:2px solid var(--surface); box-shadow:0 0 0 1px var(--line); cursor:pointer; padding:0; transition:transform .15s var(--ease); }
.cor:hover:not(:disabled) { transform:scale(1.12); } .cor.on { box-shadow:0 0 0 2px var(--ink); } .cor:disabled { cursor:default; }
form.ver .logo-info .row { display:none; }
@media (max-width:520px) { .logo-campo { flex-direction:column; align-items:flex-start; } }
.vav { width:32px; height:32px; border-radius:999px; flex:none; display:inline-flex; align-items:center; justify-content:center; color:#fff; font:700 10px/1 var(--display); letter-spacing:.02em; }
#side nav { display:flex; flex-direction:column; gap:2px; }
#side nav a, #side nav span.soon { display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:var(--radius-s); color:var(--ink); font-weight:500; transition:background .2s, color .2s, transform .15s; }
#side nav a { color:color-mix(in srgb, var(--ink) 80%, var(--bg)); }
#side nav a:hover { background:var(--fill); color:var(--ink); }
#side nav a:active { transform:scale(.97); }
#side nav a.on { background:var(--accent-soft); color:var(--accent-text); font-weight:600; }
#side nav svg { width:20px; height:20px; flex:none; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
#side nav .badge { margin-left:auto; min-width:22px; text-align:center; background:var(--accent); color:var(--accent-ink); border-radius:999px; font-size:12px; font-weight:600; padding:1px 7px; }
#side nav .sec { font-size:11px; font-weight:600; color:var(--ink-3); text-transform:uppercase; letter-spacing:.08em; padding:18px 12px 4px; }
#side nav span.soon { color:var(--ink-3); cursor:default; }

.dot { display:inline-block; width:10px; height:10px; border-radius:50%; flex:none; }
.av { width:38px; height:38px; border-radius:999px; flex:none; display:inline-flex; align-items:center; justify-content:center; background:var(--ink); color:var(--bg); font:600 13px/1 var(--display); }
.av.soft { background:var(--accent-soft); color:var(--accent-text); width:36px; height:36px; font-size:12px; }
.eu { margin-top:auto; display:flex; align-items:center; gap:10px; padding:10px; border-radius:var(--radius-m); background:var(--fill); }
.eu div { flex:1; min-width:0; } .eu b, .eu small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .eu b { font-size:14px; } .eu small { color:var(--ink-2); font-size:12px; }
.eu .btn { background:var(--surface); }
#saveState { color:var(--ink-3); font-weight:400; }

/* ---------- acesso (entrar / criar conta) ---------- */
body.fora #side, body.fora #bar { display:none; }
body.fora #main { display:flex; }
body.fora #content { max-width:none; width:100%; min-height:100vh; display:flex; padding:0; }
.acesso { flex:1; display:grid; grid-template-columns:minmax(0, 1.05fr) minmax(0, 1fr); min-height:100vh; }
.acesso .lado { position:relative; overflow:hidden; background:#0055ff; color:#fff; padding:48px; display:flex; flex-direction:column; justify-content:space-between; }
.acesso .lado img.marca { width:132px; height:auto; }
.acesso .lado img.simbolo { position:absolute; right:-80px; bottom:-90px; width:440px; opacity:.12; }
.acesso .lado h2 { font:600 clamp(30px, 3.4vw, 46px)/1.08 var(--display); letter-spacing:-.03em; max-width:12em; }
.acesso .lado p { opacity:.85; max-width:30em; margin-top:14px; }
.acesso .forma { display:grid; place-items:center; padding:32px 24px; }
.auth { width:min(380px, 100%); display:grid; gap:16px; margin:0; animation:rise .6s var(--ease) both; }
.auth .logo { width:118px; height:auto; margin-bottom:6px; }
@media (min-width:821px) { .acesso .auth picture { display:none; } }
.auth h1 { font:600 30px/1.1 var(--display); letter-spacing:-.03em; }
.auth .btn { height:50px; font-size:15px; }
.auth input { height:48px; padding:0 14px; font-size:15px; }
.auth > a { justify-self:center; font-weight:600; font-size:14px; }
.carregando { flex:1; display:grid; place-items:center; gap:18px; min-height:100vh; }
.carregando img { width:56px; height:auto; animation:pop .5s var(--ease) both; }
.eq { display:flex; align-items:flex-end; gap:4px; height:22px; }
.eq span { width:4px; height:100%; border-radius:2px; background:var(--tone, var(--accent)); transform-origin:bottom; animation:eq 1.1s ease-in-out infinite; }
.eq span:nth-child(2) { animation-delay:.18s; } .eq span:nth-child(3) { animation-delay:.36s; } .eq span:nth-child(4) { animation-delay:.09s; } .eq span:nth-child(5) { animation-delay:.27s; }

/* ---------- área principal ---------- */
#main { flex:1; min-width:0; }
#bar { display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; padding:34px clamp(18px, 3vw, 44px) 10px; max-width:1268px; margin:0 auto; }
#bar h1 { font:600 clamp(28px, 2.6vw, 38px)/1.08 var(--display); letter-spacing:-.03em; flex:1; min-width:220px; }
#bar .sub { display:flex; align-items:center; gap:8px; flex-wrap:wrap; color:var(--ink-2); font:500 14px/1.4 var(--font); letter-spacing:0; margin-bottom:8px; }
#content { padding:18px clamp(18px, 3vw, 44px) 80px; max-width:1268px; margin:0 auto; }

.card { background:var(--surface); border-radius:var(--radius); padding:24px; margin-bottom:16px; box-shadow:var(--shadow); }
.card > h3, .card .hd h3 { font:600 17px/1.3 var(--display); letter-spacing:-.01em; margin-bottom:16px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.card .hd { display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:16px; }
.card .hd h3 { margin:0; }
.card .hd span, .card .hd a { font-size:13px; } .card .hd span { color:var(--ink-2); } .card .hd a { font-weight:600; }
.cols { display:grid; grid-template-columns:repeat(auto-fit, minmax(340px, 1fr)); gap:16px; margin-bottom:16px; }
.cols > .card { margin:0; }
.row { display:flex; gap:14px; flex-wrap:wrap; align-items:flex-end; }
.row.mid { align-items:center; }
.grow { flex:1; }
.muted { color:var(--ink-2); } .small { font-size:13px; }
.empty { text-align:center; color:var(--ink-2); padding:52px 16px; }
.empty b { display:block; color:var(--ink); font:600 18px/1.3 var(--display); margin-bottom:6px; letter-spacing:-.01em; }
.note { background:color-mix(in srgb, var(--red) 10%, transparent); color:var(--red); border-radius:var(--radius-m); padding:12px 16px; font-size:14px; margin-bottom:16px; }
.note.info { background:var(--fill); color:var(--ink-2); } .note.info b { color:var(--ink); }
.note.info a { font-weight:600; }

/* ---------- campos e botões ---------- */
input, select, textarea, button { font:inherit; color:inherit; }
input, select, textarea { border:1px solid transparent; border-radius:var(--radius-s); background:var(--fill); padding:9px 12px; min-width:0; outline:none; transition:box-shadow .2s, border-color .2s, background .2s; }
input:focus, select:focus, textarea:focus { background:var(--surface); border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
input:disabled, select:disabled, textarea:disabled { color:var(--ink-2); opacity:.85; }
input[type="search"] { border-radius:999px; padding-left:40px; background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%238c93a1' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E") no-repeat 14px 50%; border-color:var(--line); }
input[type="checkbox"] { accent-color:var(--accent); width:18px; height:18px; }
input[type="color"] { padding:3px; height:42px; }
textarea { width:100%; min-height:84px; resize:vertical; }
small.dica { color:var(--ink-2); font-size:12px; font-weight:500; }
small.aviso { color:var(--red); font-size:12px; font-weight:500; }
::placeholder { color:var(--ink-3); opacity:.7; }
input:user-invalid, textarea:user-invalid { border-color:var(--red); box-shadow:0 0 0 3px color-mix(in srgb, var(--red) 15%, transparent); }
select { appearance:none; padding-right:30px; background-image:linear-gradient(45deg, transparent 50%, var(--ink-2) 50%), linear-gradient(135deg, var(--ink-2) 50%, transparent 50%); background-position:calc(100% - 15px) 55%, calc(100% - 10px) 55%; background-size:5px 5px; background-repeat:no-repeat; }
label.f { display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:500; color:var(--ink-2); }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid var(--line); border-radius:999px; padding:0 18px; height:42px; background:var(--surface); font-weight:600; cursor:pointer; white-space:nowrap; transition:background .2s, transform .15s, box-shadow .2s, border-color .2s; }
.btn:hover { background:var(--fill); }
.btn:active { transform:scale(.96); }
.btn:disabled { opacity:.6; cursor:default; }
.btn svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.btn.pri { background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.btn.pri:hover { background:var(--accent-hover); border-color:var(--accent-hover); box-shadow:0 10px 24px -12px color-mix(in srgb, var(--accent) 80%, transparent); }
.btn.danger { color:var(--red); }
.btn.warn { color:var(--orange); border-color:color-mix(in srgb, var(--orange) 30%, var(--line)); }
.btn.sm { height:34px; padding:0 14px; font-size:13px; }
.x { border:0; background:none; color:var(--ink-3); cursor:pointer; font-size:18px; line-height:1; padding:4px 6px; border-radius:8px; transition:color .2s, background .2s; }
.x:hover { color:var(--red); background:color-mix(in srgb, var(--red) 10%, transparent); }
.duo { display:flex; } .duo input { border-radius:var(--radius-s) 0 0 var(--radius-s); width:84px; text-align:right; } .duo select { border-radius:0 var(--radius-s) var(--radius-s) 0; margin-left:1px; }
.seg { display:inline-flex; background:var(--fill-2); border-radius:999px; padding:4px; margin-bottom:18px; gap:2px; max-width:100%; overflow-x:auto; }
.seg button { border:0; background:none; padding:7px 16px; border-radius:999px; cursor:pointer; font-weight:500; font-size:14px; color:var(--ink-2); white-space:nowrap; transition:background .2s, color .2s; }
.seg button:hover { color:var(--ink); }
.seg button.on { background:var(--surface); color:var(--ink); box-shadow:0 1px 3px rgba(10,20,60,.14); font-weight:600; }
.pill { display:inline-flex; align-items:center; gap:6px; padding:3px 11px; border-radius:999px; font-size:12px; font-weight:600; background:color-mix(in srgb, var(--tone) 13%, transparent); color:var(--tone); white-space:nowrap; letter-spacing:0; }
.pill.live::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--tone); animation:pulse 2s ease-out infinite; }

/* ---------- tabelas ---------- */
.scroll { overflow-x:auto; }
table { border-collapse:collapse; width:100%; }
th { text-align:left; font-size:12px; font-weight:500; color:var(--ink-2); padding:8px 10px; border-bottom:1px solid var(--line); white-space:nowrap; }
td { padding:13px 10px; border-bottom:1px solid var(--line-2); vertical-align:middle; }
tr:last-child td { border-bottom:0; }
td.r, th.r { text-align:right; }
tr.tot td { font-weight:600; border-top:1px solid var(--line); }
tr.click { cursor:pointer; } tr.click td { transition:background .2s; } tr.click:hover td { background:var(--fill); }
tr.click td:first-child { border-radius:var(--radius-s) 0 0 var(--radius-s); } tr.click td:last-child { border-radius:0 var(--radius-s) var(--radius-s) 0; }
td.edit { padding:5px 6px; } td.edit input, td.edit select { width:100%; }
.chip { display:inline-block; padding:3px 9px; border-radius:8px; background:var(--accent-soft); color:var(--accent-text); font-weight:600; font-size:13px; white-space:nowrap; }

/* ---------- cartões de números ---------- */
.tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:16px; margin-bottom:16px; }
.tile { position:relative; overflow:hidden; background:var(--surface); border-radius:var(--radius); padding:22px; display:flex; flex-direction:column; gap:12px; box-shadow:var(--shadow); transition:transform .25s var(--ease), box-shadow .25s; }
.tile:hover { transform:translateY(-3px); box-shadow:var(--shadow-up); }
.tile small { color:var(--ink-2); font-size:14px; font-weight:500; }
.tile b { display:block; font:600 clamp(26px, 2.3vw, 32px)/1.1 var(--display); letter-spacing:-.03em; }
.tile span { align-self:flex-start; padding:3px 10px; border-radius:999px; background:var(--fill); color:var(--ink-2); font-size:12px; font-weight:600; }
.tile span.bom { background:color-mix(in srgb, var(--green) 13%, transparent); color:var(--green); }
.tile span.ruim { background:color-mix(in srgb, var(--orange) 13%, transparent); color:var(--orange); }
.tile.hero { background:var(--accent); color:#fff; }
.tile.hero small { color:#fff; opacity:.9; } .tile.hero span { background:rgba(255,255,255,.18); color:#fff; }
.tile.hero::after { content:""; position:absolute; right:-18px; bottom:-24px; width:120px; height:142px; background:url("../img/simbolo-branco.svg") no-repeat center / contain; opacity:.16; pointer-events:none; }

/* ---------- gráficos ---------- */
.bars { height:200px; display:flex; align-items:flex-end; gap:12px; border-bottom:1px solid var(--line); }
.bars > div { flex:1; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:8px; min-width:0; }
.bars b { font-size:12px; font-weight:600; color:var(--ink-2); white-space:nowrap; }
.bars i { display:block; width:100%; max-width:44px; border-radius:10px 10px 4px 4px; background:var(--bar-soft); transform-origin:bottom; min-height:3px; }
.bars > div.on i { background:var(--accent); } .bars > div.on b { color:var(--accent-text); }
.bars-x { display:flex; gap:12px; margin-top:10px; } .bars-x span { flex:1; text-align:center; font-size:12px; color:var(--ink-2); min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stack { display:flex; height:14px; border-radius:999px; overflow:hidden; gap:3px; margin-bottom:14px; transform-origin:left; background:var(--fill); }
.stack i { display:block; min-width:6px; }
.legend { display:flex; flex-direction:column; }
.legend > a, .legend > div { display:flex; align-items:center; gap:12px; padding:10px 8px; border-radius:var(--radius-s); color:var(--ink); transition:background .2s; }
.legend > a:hover { background:var(--fill); }
.legend .sq { width:10px; height:10px; border-radius:3px; flex:none; }
.legend .n { width:32px; text-align:right; font-weight:600; font-variant-numeric:tabular-nums; }
.prog { height:6px; border-radius:999px; background:var(--fill); overflow:hidden; }
.prog i { display:block; height:100%; border-radius:999px; background:var(--accent); transform-origin:left; }
.prog i.ruim { background:var(--orange); }
.people > div { display:grid; grid-template-columns:36px minmax(0, 1fr) auto; align-items:center; gap:12px; padding:10px 8px; border-radius:var(--radius-m); }
.people .who { display:flex; flex-direction:column; gap:6px; min-width:0; }
.people .who > div { display:flex; justify-content:space-between; gap:8px; }
.people .val { display:flex; flex-direction:column; align-items:flex-end; min-width:92px; }
.list > a, .list > div { display:flex; align-items:center; gap:14px; padding:12px 8px; border-radius:var(--radius-m); color:var(--ink); transition:background .2s; }
.list > a:hover { background:var(--fill); }
.list .ic { width:40px; height:40px; border-radius:var(--radius-s); background:var(--fill); color:var(--accent-text); display:flex; align-items:center; justify-content:center; flex:none; }
.list .ic svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.list .tx { flex:1; min-width:0; display:flex; flex-direction:column; } .list .tx b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.list .tx small { color:var(--ink-2); font-size:13px; }
.list .vl { display:flex; flex-direction:column; align-items:flex-end; gap:4px; }

/* Agenda */
.agenda .ag { display:grid; grid-template-columns:72px minmax(0, 1fr) auto; gap:14px; align-items:center; padding:12px 8px; border-bottom:1px solid var(--line-2); }
.agenda .ag:last-child { border-bottom:0; }
.agenda .qd { display:flex; flex-direction:column; } .agenda .qd b { font:600 17px/1.2 var(--display); font-variant-numeric:tabular-nums; } .agenda .qd small { color:var(--ink-2); font-size:12px; }
.agenda .tx { display:flex; flex-direction:column; min-width:0; } .agenda .tx small { color:var(--ink-2); font-size:13px; }
.agenda .tx .res { color:var(--ink); background:var(--fill); border-radius:10px; padding:6px 10px; margin-top:6px; }
.agenda .ac { display:flex; align-items:center; gap:8px; }
@media (max-width:820px) { .agenda .ag { grid-template-columns:56px minmax(0, 1fr); } .agenda .ac { grid-column:2; } }

/* Próximo compromisso do consultor */
.next { position:relative; overflow:hidden; background:var(--accent); color:#fff; border-radius:26px; padding:22px; margin-bottom:16px; display:flex; flex-direction:column; gap:14px; }
.next .eq { position:absolute; right:22px; top:22px; height:28px; opacity:.55; --tone:#fff; }
.next .quando { align-self:flex-start; padding:4px 11px; border-radius:999px; background:rgba(255,255,255,.18); font-size:13px; font-weight:600; }
.next h2 { font:600 24px/1.15 var(--display); letter-spacing:-.02em; }
.next p { opacity:.9; }
.next .row { gap:10px; align-items:center; }
.next .btn { border:0; background:#fff; color:#0040c0; height:48px; }
.next .btn.ghost { background:rgba(255,255,255,.2); color:#fff; }

/* ---------- PI ---------- */
.steps { position:relative; display:grid; grid-template-columns:repeat(var(--n, 5), minmax(0, 1fr)); gap:8px; }
.steps::before, .steps::after { content:""; position:absolute; left:calc(50% / var(--n, 5)); top:15px; height:3px; border-radius:999px; }
.steps::before { right:calc(50% / var(--n, 5)); background:var(--line); }
.steps::after { width:calc((100% - 100% / var(--n, 5)) * var(--p, 0)); background:var(--accent); transform-origin:left; transition:width .6s var(--ease); }
.steps > div { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; }
.steps .mark { width:32px; height:32px; border-radius:999px; display:flex; align-items:center; justify-content:center; background:var(--surface); border:2px solid var(--line); }
.steps .ok .mark { background:var(--accent); border-color:var(--accent); }
.steps .ok .mark svg { width:16px; height:16px; fill:none; stroke:#fff; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.steps .now .mark { border:3px solid var(--tone, var(--accent-2)); }
.steps .now .mark::after { content:""; width:10px; height:10px; border-radius:50%; background:var(--tone, var(--accent-2)); animation:pulse 2s ease-out infinite; }
.steps b { font-size:14px; } .steps .todo b { color:var(--ink-2); font-weight:500; }
.steps small { display:block; font-size:12px; color:var(--ink-2); }
.layout { display:grid; grid-template-columns:minmax(0, 1fr) 300px; gap:16px; align-items:start; }
.layout > .sum { position:sticky; top:16px; }
.sum.card { background:var(--dark-card); color:#fff; }
.sum h3 { color:var(--dark-card-2); font-size:15px; }
.sum .big { font:600 34px/1.1 var(--display); letter-spacing:-.03em; margin:-4px 0 16px; font-variant-numeric:tabular-nums; }
.sum div { display:flex; justify-content:space-between; gap:12px; margin-bottom:9px; font-variant-numeric:tabular-nums; }
.sum small { color:var(--dark-card-2); font-size:13px; } .sum b { font-size:14px; font-weight:600; } .sum .g b { color:#7ee2b4; }
.sum hr { border:0; border-top:1px solid var(--dark-line); margin:14px 0; }
.pieces { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.piece { display:flex; align-items:center; gap:6px; background:var(--fill); border-radius:var(--radius-s); padding:2px 4px 2px 12px; }
.piece b { color:var(--accent-text); font-family:var(--display); } .piece input { background:none; border:0; padding:7px 4px; width:170px; } .piece input:focus { box-shadow:none; }
.grid td, .grid th { padding:4px; border-bottom:0; }
.grid th.d { text-align:center; font-size:10px; line-height:1.15; padding:2px; }
.grid th.d.we { color:var(--red); }
.grid input.day { width:30px; height:30px; padding:0; text-align:center; border-radius:8px; font-weight:600; font-size:13px; }
.grid input.day.has { background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
.grid input.w { width:200px; } .grid input.n { width:96px; text-align:right; }
.grid tr.tot td { padding-top:12px; }
.hist { list-style:none; margin:0; padding:0; }
.hist li { display:grid; grid-template-columns:12px 130px auto minmax(0, 1fr); gap:12px; align-items:center; padding:9px 0; font-size:14px; }
.hist li::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--accent-2); }

/* ---------- diálogo e aviso ---------- */
dialog { border:0; border-radius:26px; padding:0; width:min(560px, 94vw); background:var(--surface); color:var(--ink); box-shadow:0 40px 100px -20px rgba(0,0,0,.45); }
dialog[open] { animation:dlg .32s var(--ease) both; }
dialog::backdrop { background:rgba(8,12,24,.38); backdrop-filter:blur(6px); animation:fade .25s ease both; }
dialog form { padding:28px; display:grid; gap:16px; max-height:88vh; overflow-y:auto; } dialog h2 { font:600 22px/1.2 var(--display); letter-spacing:-.02em; }
.g2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; } .g2 input, .g2 select { width:100%; }
.row.so-ver, .row.so-editar { align-items:center; }
form.ver .so-editar, form:not(.ver) .so-ver { display:none; }
form.ver .g2 button { display:none; }
form.ver input:disabled, form.ver select:disabled, form.ver textarea:disabled { color:var(--ink); opacity:1; }
.caixa { padding:16px; border-radius:var(--radius-m); background:var(--fill); }
.caixa input, .caixa select { background:var(--surface); }
.menu { position:fixed; z-index:40; min-width:230px; padding:6px; border-radius:16px; background:var(--surface); border:1px solid var(--line); box-shadow:0 24px 60px -18px rgba(10,20,60,.35); animation:dlg .18s var(--ease) both; }
.menu button { display:flex; align-items:center; gap:10px; width:100%; padding:10px 12px; border:0; border-radius:10px; background:none; font:inherit; font-weight:500; color:var(--ink); text-align:left; cursor:pointer; }
.menu button:hover, .menu button:focus { background:var(--fill); outline:none; }
.menu button svg { width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.menu button.perigo { color:var(--red); }
.menu hr { border:0; border-top:1px solid var(--line); margin:5px 4px; }
.btn.tres { width:36px; height:36px; padding:0; border-color:transparent; background:transparent; }
.btn.tres:hover { background:var(--fill); }
.btn.tres svg { fill:currentColor; stroke:none; }
.chk { display:flex; gap:10px; align-items:center; font-size:14px; color:var(--ink); font-weight:400; flex-direction:row; }
#toast { position:fixed; left:50%; bottom:28px; transform:translate(-50%, 24px) scale(.96); background:var(--ink); color:var(--bg); padding:12px 20px; border-radius:999px; font-size:14px; font-weight:500; opacity:0; pointer-events:none; transition:opacity .25s, transform .4s cubic-bezier(.2,1.4,.4,1); z-index:30; max-width:min(560px, 92vw); text-align:center; box-shadow:0 18px 40px -16px rgba(0,0,0,.5); }
#toast.on { opacity:1; transform:translate(-50%, 0) scale(1); }

/* ---------- celular: a barra lateral vira barra de abas flutuante ---------- */
@media (max-width:820px) {
  body { display:block; }
  #side { display:contents; }
  #side .brand, #side nav .sec, #side nav span.soon { display:none; }
  #main::before { content:""; position:fixed; top:0; left:0; right:0; height:64px; background:color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter:saturate(180%) blur(18px); -webkit-backdrop-filter:saturate(180%) blur(18px); z-index:9; }
  body.fora #main::before { display:none; }
  #side .veh { position:fixed; top:12px; left:14px; max-width:calc(100vw - 150px); z-index:11; padding:4px 12px 4px 4px; }
  #side .veh .vav { width:30px; height:30px; } #side .veh .vt small { display:none; }
  #side .eu { position:fixed; top:12px; right:14px; z-index:11; margin:0; padding:0; background:none; gap:6px; }
  #side .eu div { display:none; } #side .eu .av { width:40px; height:40px; }
  #side .eu .btn { height:40px; padding:0 14px; }
  #side nav { position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom)); z-index:11; flex-direction:row; justify-content:space-around; gap:0; padding:8px 6px; border-radius:28px; background:color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter:saturate(180%) blur(18px); -webkit-backdrop-filter:saturate(180%) blur(18px); border:1px solid var(--line); box-shadow:0 18px 40px -18px rgba(10,20,60,.35); overflow-x:auto; }
  #side nav a { flex-direction:column; gap:3px; font-size:11px; padding:6px 10px; position:relative; min-width:58px; border-radius:18px; }
  #side nav a.on { background:none; }
  #side nav svg { width:22px; height:22px; }
  #side nav .badge { position:absolute; top:0; right:6px; margin:0; font-size:10px; min-width:18px; padding:0 5px; }
  #bar { padding:84px 16px 4px; } #content { padding:12px 16px 120px; }
  .card { padding:20px; }
  .tiles { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; } .tile { padding:18px; gap:10px; } .tile b { font-size:24px; } .tile small { font-size:13px; }
  .tile span { white-space:normal; }
  .layout { grid-template-columns:minmax(0, 1fr); } .layout > .sum { position:static; order:-1; }
  .g2 { grid-template-columns:1fr; }
  .cols { grid-template-columns:minmax(0, 1fr); }
  .acesso { grid-template-columns:1fr; }
  .acesso .lado { display:none; }
  .steps b { font-size:12px; } .steps small { display:none; }
  .bars { gap:6px; } .bars-x { gap:6px; } .bars b { font-size:10px; }
}


/* ---------- PI: largura total e barra lateral compacta ---------- */
#bar.largo, #content.largo { max-width:1900px; }
.brand .so-simbolo { display:none; width:30px; height:auto; }
@media (min-width:821px) {
  body.compacto #side { width:76px; padding:22px 10px 16px; align-items:center; }
  body.compacto .brand { padding:2px 0; } body.compacto .brand picture { display:none; } body.compacto .brand .so-simbolo { display:block; }
  body.compacto .veh { padding:3px; border:0; } body.compacto .veh .vt, body.compacto .veh > svg { display:none; }
  body.compacto #side nav { width:100%; }
  body.compacto #side nav a { font-size:0; gap:0; justify-content:center; padding:11px 0; position:relative; }
  body.compacto #side nav a svg { width:22px; height:22px; }
  body.compacto #side nav .badge { position:absolute; top:3px; right:2px; font-size:10px; min-width:18px; padding:0 5px; }
  body.compacto #side nav .sec, body.compacto #side nav span.soon { display:none; }
  body.compacto .eu { flex-direction:column; padding:6px 0; background:none; } body.compacto .eu div { display:none; }
  body.compacto .eu .btn { padding:0 10px; font-size:12px; height:30px; }
}

/* ---------- PI: cabeçalho, abas e informações ---------- */
.titulo-in { font:inherit; letter-spacing:inherit; color:inherit; width:100%; max-width:900px; padding:2px 10px; margin-left:-11px; border-radius:12px; }
.sujo { display:inline-flex; align-items:center; gap:8px; color:var(--orange); font-size:13px; font-weight:600; white-space:nowrap; }
.sujo[hidden] { display:none; }
.sujo i { width:8px; height:8px; border-radius:50%; background:#e08a2e; --tone:#e08a2e; animation:pulse 2s ease-out infinite; }
.salvo { white-space:nowrap; align-self:center; }
.abas { display:flex; gap:26px; border-bottom:1px solid var(--line); margin-bottom:16px; overflow-x:auto; }
.abas button { border:0; background:none; padding:10px 0; font:inherit; font-weight:500; color:var(--ink-2); border-bottom:2px solid transparent; cursor:pointer; white-space:nowrap; display:inline-flex; align-items:center; gap:6px; transition:color .2s, border-color .2s; }
.abas button:hover { color:var(--ink); }
.abas button.on { color:var(--accent-text); border-color:var(--accent); font-weight:600; }
.abas .cont { min-width:18px; padding:0 5px; border-radius:999px; background:var(--fill-2); color:var(--ink); font-size:11px; font-weight:600; text-align:center; }
.pi-info { padding:14px 18px; display:flex; flex-direction:column; gap:10px; }
.pi-info .lin { display:flex; flex-wrap:wrap; gap:8px 22px; align-items:center; }
.pi-info .cond { padding-top:10px; border-top:1px solid var(--line-2); }
.pi-info .ic { display:flex; align-items:center; gap:8px; min-width:0; }
.pi-info .ic > small { color:var(--ink-3); font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.pi-info .val { padding:4px 10px; border:1px solid var(--line); border-radius:10px; font-weight:500; }
.pi-info input, .pi-info select { height:36px; padding-top:0; padding-bottom:0; max-width:240px; }
.pi-info .duo input { width:72px; }
.pecas { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:16px; }
.peca { display:flex; align-items:center; gap:10px; padding:6px 10px 6px 6px; border-radius:var(--radius-s); background:var(--surface); border:1px solid var(--line); max-width:100%; }
.peca input { height:30px; width:220px; max-width:52vw; }
.btn.tracej { border-style:dashed; background:transparent; color:var(--ink-2); }
.pc { width:26px; height:26px; flex:none; border-radius:8px; background:var(--pc); color:#fff; display:inline-flex; align-items:center; justify-content:center; font:600 12px/1 var(--display); }
select.pc-sel { width:46px; height:30px; padding:0 20px 0 9px; border:0; border-radius:8px; background-color:var(--pc); color:#fff; font-weight:700; background-image:linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%); background-position:calc(100% - 12px) 55%, calc(100% - 8px) 55%; }
select.pc-sel option { color:var(--ink); background:var(--surface); }
.pi-corpo { display:grid; grid-template-columns:minmax(0, 1fr) 240px; gap:16px; align-items:start; }
.pi-grades { min-width:0; display:flex; flex-direction:column; gap:16px; }
.pi-grades > .card, .pi-grades > p { margin:0; }
.pi-sum { position:sticky; top:16px; margin:0; padding:20px; }
.pi-sum h3 { font:600 16px/1.3 var(--display); margin-bottom:8px; }
.pi-sum div { display:flex; flex-direction:column; padding:7px 0; }
.pi-sum small { color:var(--ink-2); font-size:12px; }
.pi-sum b { font:600 17px/1.3 var(--display); font-variant-numeric:tabular-nums; }
.pi-sum .g b { color:var(--green); }
.pi-sum .hr { border-top:1px solid var(--line-2); margin-top:6px; padding-top:13px; }
.obs { white-space:pre-line; margin:0; }

/* ---------- PI: grade do mês ---------- */
.grade { padding:0; overflow:hidden; }
.g-hd { display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; padding:16px 20px; }
.g-hd h3 { margin:0 auto 0 0 !important; font:600 17px/1.3 var(--display); }
.g-hd label { display:flex; align-items:center; gap:8px; color:var(--ink-2); font-size:14px; }
.g-hd label b { color:var(--ink); font-weight:600; }
.g-hd input, .g-hd select { height:38px; } .g-hd input[list] { width:190px; } .g-hd select { min-width:180px; }
.grade, .it-ab { --pc:var(--accent); }
.gr { display:grid; grid-template-columns:292px minmax(0, 1fr) auto; border-top:1px solid var(--line); font-variant-numeric:tabular-nums; }
.gr .ln { height:48px; box-sizing:border-box; display:flex; align-items:center; gap:6px; padding:0 10px; border-top:1px solid var(--line-2); }
.gr .ln.cb { height:46px; border-top:0; background:var(--bg); font-size:12px; color:var(--ink-2); font-weight:500; }
.gr .ln.ft { height:52px; border-top:1px solid var(--line); }
.gr-l { border-right:1px solid var(--line); min-width:0; }
.gr-l .ln { display:grid; grid-template-columns:22px minmax(0, 1.25fr) minmax(0, 1fr); gap:5px; padding-left:4px; }
.gr-l .rm { padding:2px; font-size:16px; opacity:0; } .gr-l .ln:hover .rm, .gr-l .rm:focus-visible { opacity:1; } .gr-l .rm:hover { color:var(--red); }
.gr-l .ln.ft { display:flex; justify-content:space-between; }
.gr-l input, .gr-l select { height:32px; padding-top:0; padding-bottom:0; padding-left:8px; font-size:13px; min-width:0; width:100%; }
.gr-l select:not(.pc-sel) { padding-right:24px; background-position:calc(100% - 13px) 55%, calc(100% - 8px) 55%; }
.gr-l .tx { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:14px; }
.gr-m { overflow-x:auto; min-width:0; }
.gr-mi { width:max-content; min-width:100%; }
.gr .dias { gap:2px; }
.dh { width:24px; flex:none; text-align:center; font-size:10px; line-height:1.15; color:var(--ink-2); display:flex; flex-direction:column; }
.dh b { font-size:12px; font-weight:600; color:var(--ink); } .dh.we, .dh.we b { color:var(--red); }
.day { width:24px; height:24px; flex:none; box-sizing:border-box; padding:0; border-radius:7px; text-align:center; font-size:12px; font-weight:700; border:1px solid var(--line); background:var(--surface); color:#fff; display:inline-flex; align-items:center; justify-content:center; transition:transform .12s, background .15s; }
input.day:hover { transform:scale(1.12); }
input.day:focus { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-soft); background:var(--surface); color:var(--ink); }
.day.has { background:var(--pc); border-color:var(--pc); color:#fff; }
.dt { width:24px; flex:none; text-align:center; font-size:11px; color:var(--ink-2); font-weight:600; }
.gr-r { border-left:1px solid var(--line); }
.gr-r .vals { display:grid; grid-template-columns:36px 80px 118px 92px; gap:6px; justify-content:end; text-align:right; }
.gr-r .vals .ins { text-align:center; font-weight:600; background:var(--bg); border-radius:7px; padding:3px 0; }
.gr-r .ln.cb .ins, .gr-r .ln.ft .ins { background:none; }
.gr-r input.n { width:78px; height:30px; padding:0 8px; text-align:right; font-size:13px; }
.gr-r .duo input { width:50px; height:30px; padding:0 6px; font-size:13px; text-align:right; }
.gr-r .duo select { height:30px; width:66px; padding:0 18px 0 6px; font-size:13px; background-position:calc(100% - 11px) 55%, calc(100% - 7px) 55%; }
.gr-r .sub { white-space:nowrap; font-size:13px; }
.gr-r .bon { text-align:center; } .gr-r span.n { font-size:13px; white-space:nowrap; }

/* ---------- PI no celular: cartão com calendário ---------- */
.gc { padding:16px; display:flex; flex-direction:column; gap:12px; }
.gc .g-hd { padding:0; }
.gc .g-hd label { flex:1 1 140px; flex-direction:column; align-items:stretch; gap:4px; font-size:12px; }
.gc .g-hd input { width:100%; }
.it-res { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid var(--line); border-radius:16px; background:var(--surface); font:inherit; color:var(--ink); text-align:left; cursor:pointer; width:100%; }
.it-res .tx { flex:1; min-width:0; display:flex; flex-direction:column; } .it-res small { color:var(--ink-2); }
.it-res svg { width:16px; height:16px; flex:none; fill:none; stroke:var(--ink-3); stroke-width:2; stroke-linecap:round; }
.it-ab { border:2px solid var(--pc); border-radius:18px; padding:14px; display:flex; flex-direction:column; gap:12px; }
.it-cab { display:flex; align-items:center; gap:10px; }
.it-cab .tx { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; } .it-cab .tx small { color:var(--ink-2); }
.it-cab input, .it-cab select { height:36px; width:100%; }
.cal { display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:5px; text-align:center; }
.cal > small { font-size:11px; font-weight:600; color:var(--ink-2); } .cal > small.we { color:var(--red); }
.cd { display:flex; flex-direction:column; align-items:stretch; gap:2px; }
.cd small { font-size:10px; color:var(--ink-2); } .cd.we small { color:var(--red); }
.cd .day { width:100%; height:38px; border-radius:10px; font-size:14px; }
.it-vals { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; }
.it-vals .ro { height:40px; display:flex; align-items:center; padding:0 10px; background:var(--bg); border-radius:10px; font-weight:600; color:var(--ink); }
.it-vals input { width:100%; height:40px; } .it-vals .duo input { width:100%; min-width:0; } .it-vals .duo select { width:84px; flex:none; }
.pi-total { position:sticky; bottom:96px; z-index:5; width:100%; margin-top:16px; border:0; border-radius:20px; background:var(--dark-card); color:#fff; padding:12px 18px; display:flex; justify-content:space-between; align-items:center; font:inherit; cursor:pointer; box-shadow:var(--shadow-up); }
.pi-total span { display:flex; flex-direction:column; align-items:flex-start; } .pi-total small { color:var(--dark-card-2); }
.pi-total b { font:600 22px/1.2 var(--display); font-variant-numeric:tabular-nums; }
.pi-total svg { width:20px; height:20px; fill:none; stroke:#fff; stroke-width:2; transform:rotate(180deg); }

/* ---------- arquivos (aba Mídias) ---------- */
.drop { display:flex; flex-direction:column; align-items:center; gap:4px; padding:26px; margin-bottom:10px; border:2px dashed var(--line); border-radius:18px; cursor:pointer; color:var(--ink-2); text-align:center; transition:border-color .2s, background .2s; }
.drop b { color:var(--ink); } .drop:hover, .drop.on { border-color:var(--accent); background:var(--accent-soft); }

/* Em telas abaixo de 1700 px o resumo vira uma faixa acima das grades, para sobrar largura para os dias */
@media (max-width:1700px) {
  .pi-corpo { grid-template-columns:minmax(0, 1fr); }
  .pi-sum { position:static; order:-1; display:grid; grid-template-columns:repeat(auto-fit, minmax(130px, 1fr)); gap:4px 16px; align-items:start; }
  .pi-sum h3 { grid-column:1 / -1; margin-bottom:2px; }
  .pi-sum .hr { border-top:0; margin-top:0; padding-top:7px; }
}
@media (max-width:820px) { .pi-sum { order:0; } }
@media (max-width:820px) {
  .titulo-in { margin-left:0; }
  .pi-info .ic { flex:1 1 100%; justify-content:space-between; } .pi-info input, .pi-info select { max-width:62%; }
  .abas { gap:20px; }
}

/* ---------- documento do PI (impressão / PDF) ---------- */
/* Notebook: dias mais estreitos para o mês inteiro caber sem rolar */
@media (min-width:821px) and (max-width:1699px) {
  .gr { grid-template-columns:212px minmax(0, 1fr) auto; }
  .gr .ln { padding:0 8px; } .gr-l .ln { padding-left:2px; gap:4px; grid-template-columns:18px minmax(0, 1.2fr) minmax(0, 1fr); }
  .gr-l select:not(.pc-sel) { padding-left:6px; padding-right:18px; font-size:12px; background-position:calc(100% - 10px) 55%, calc(100% - 6px) 55%; }
  .gr .dias { gap:1px; } .day, .dh, .dt { width:21px; } .day { height:22px; border-radius:6px; font-size:11px; } .dh { font-size:9px; } .dh b { font-size:11px; }
  .gr-r .vals { grid-template-columns:30px 72px 108px 84px; gap:5px; } .gr-r input.n { width:72px; } .gr-r .duo input { width:44px; } .gr-r .duo select { width:64px; }
}
/* Lista de PIs: linhas de uma só altura, colunas alinhadas, textos longos cortados com "…" */
.pl { display:flex; flex-direction:column; font-variant-numeric:tabular-nums; }
.pl-l { display:grid; grid-template-columns:118px minmax(0, 1.5fr) minmax(0, 1.3fr) minmax(0, 1fr) 100px 88px 150px 44px; gap:16px; align-items:center; padding:12px 10px; border-top:1px solid var(--line-2); border-radius:var(--radius-s); }
.pl-l.click { cursor:pointer; transition:background .2s; } .pl-l.click:hover, .pl-l.click:focus-visible { background:var(--fill); outline:none; }
.pl-l > span { min-width:0; display:flex; flex-direction:column; gap:2px; }
.pl-l b, .pl-l .pl-c > span, .pl-l small, .pl-un { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pl-l small { color:var(--ink-2); font-size:12.5px; }
.pl-cab { border-top:0; padding-top:4px; padding-bottom:8px; font-size:12px; color:var(--ink-2); font-weight:500; }
.pl-n { color:var(--ink-2); white-space:nowrap; font-size:14px; }
.pl-t b { font-weight:600; }
.pl-u { flex-direction:row !important; align-items:center; gap:8px !important; } .pl-u .av { width:30px; height:30px; font-size:11px; flex:none; }
.pl-p, .pl-i { text-align:right; align-items:flex-end; } .pl-p small, .pl-i small { display:none; }
.pl-v { text-align:right; align-items:flex-end; } .pl-v b { font:600 15px/1.2 var(--display); }
.pl-m { align-items:flex-end; }
.pl-cab .pl-p, .pl-cab .pl-i, .pl-cab .pl-v { display:block; }
.pl-tot { border-top:1px solid var(--line); margin-top:4px; font-weight:600; } .pl-tot .pl-n { color:var(--ink); font-weight:600; }
/* Notebook: consultor só com as iniciais */
@media (min-width:821px) and (max-width:1439px) {
  .pl-l { grid-template-columns:108px minmax(0, 1.5fr) minmax(0, 1.3fr) 36px 92px 76px 140px 40px; gap:12px; }
  .pl-un { display:none; } .pl-cab .pl-u { font-size:0; }
}
/* Celular: cada PI vira um cartão */
@media (max-width:820px) {
  .pl-cab { display:none; }
  .pl-l { grid-template-columns:minmax(0, 1fr) auto; grid-template-areas:"n m" "t t" "c c" "u v" "p i"; gap:6px 12px; padding:14px 12px; border:1px solid var(--line); border-radius:var(--radius-m); margin-bottom:10px; }
  .pl-n { grid-area:n; font-size:13px; } .pl-m { grid-area:m; margin:-6px -6px 0 0; } .pl-t { grid-area:t; } .pl-t b { font-size:16px; white-space:normal; }
  .pl-c { grid-area:c; } .pl-u { grid-area:u; } .pl-v { grid-area:v; }
  .pl-p, .pl-i { flex-direction:row !important; gap:6px !important; align-items:baseline; font-size:13px; } .pl-p { grid-area:p; justify-content:flex-start; text-align:left; align-items:flex-start; } .pl-i { grid-area:i; justify-content:flex-end; }
  .pl-p small, .pl-i small { display:inline; }
  .pl-tot { grid-template-areas:"n v" "i i"; border-style:dashed; } .pl-tot .pl-t, .pl-tot .pl-c, .pl-tot .pl-u, .pl-tot .pl-p, .pl-tot .pl-m { display:none; }
}
#print { display:none; }
#print .cab, .previa .cab { display:flex; align-items:center; gap:14px; margin-bottom:6px; } #print .cab img, .previa .cab img { width:64px; height:64px; max-height:none; object-fit:contain; flex:none; }
/* Visualizar: o documento do PI numa folha branca, igual ao que sai no PDF */
dialog.largo { width:min(1360px, 96vw); }
.previa { background:#fff; color:#111; border-radius:var(--radius-m); border:1px solid var(--line); padding:32px 36px; font:12px/1.45 Helvetica, Arial, sans-serif; overflow-x:auto; }
.previa h1 { font:700 20px/1.2 Helvetica, Arial, sans-serif; color:#111; } .previa h2 { font:700 13px/1.3 Helvetica, Arial, sans-serif; margin:16px 0 6px; color:#111; }
.previa table { border-collapse:collapse; margin:6px 0; width:100%; } .previa th, .previa td { border:1px solid #999; padding:3px 5px; font-size:11px; color:#111; background:#fff; text-align:left; white-space:nowrap; }
.previa .meta { display:grid; grid-template-columns:repeat(3, 1fr); gap:3px 18px; margin:10px 0; }
.previa .cols { display:grid; grid-template-columns:2fr 1fr; gap:14px; } .previa .box { border:1px solid #999; padding:8px; margin-bottom:8px; }
.previa .sign { display:flex; gap:40px; margin-top:48px; } .previa .sign div { flex:1; border-top:1px solid #111; text-align:center; padding-top:4px; }
.previa img { max-height:48px; }
@media (max-width:820px) { .previa { padding:18px 14px; } .previa table { display:block; overflow-x:auto; } .previa .box { overflow-x:auto; } .previa .meta, .previa .cols { grid-template-columns:1fr; } }
@media print {
  @page { size:legal landscape; margin:8mm; }
  body { background:#fff; display:block; } #side, #main, dialog, #toast { display:none !important; }
  #print { display:block; font:10px/1.4 Helvetica, Arial, sans-serif; color:#000; }
  #print h1 { font-size:16px; } #print h2 { font-size:12px; margin:12px 0 4px; }
  #print table { margin:6px 0; } #print th, #print td { border:1px solid #777; padding:2px 3px; font-size:8.5px; color:#000; }
  #print .meta { display:grid; grid-template-columns:repeat(3, 1fr); gap:2px 16px; margin:8px 0; }
  #print .cols { display:grid; grid-template-columns:2fr 1fr; gap:12px; } #print .box { border:1px solid #777; padding:6px; margin-bottom:6px; }
  #print .sign { display:flex; gap:40px; margin-top:44px; } #print .sign div { flex:1; border-top:1px solid #000; text-align:center; padding-top:3px; }
  #print .pidoc { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  #print .pidoc table { margin:0; } #print .pidoc th, #print .pidoc td { border-color:#8d939e; padding:3px 4px; font-size:10px; } #print .pidoc .pd-grade th { padding:1px 0; } #print .pidoc .pd-parc td { border:0; border-top:1px solid #d6d9df; padding:1px 4px 1px 0; } #print .pidoc .pd-parc tr.mut td { border-top:0; }
}
}

/* ---------- Programação musical ---------- */
.mus-sem { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.mus-sem b { font:600 16px/1.3 var(--display); }
.mus-sem .btn svg { width:16px; height:16px; }
.mus-dias button { position:relative; }
.mus-alerta { position:absolute; top:3px; right:3px; width:7px; height:7px; border-radius:50%; background:var(--red); }
.mus-horas { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px; }
.mus-horas button { position:relative; min-width:48px; height:36px; border:1px solid var(--line); border-radius:10px; background:var(--surface); font:inherit; font-size:13px; font-weight:600; color:var(--ink); cursor:pointer; box-shadow:inset 0 -3px 0 var(--tone); transition:background .2s, transform .15s; }
.mus-horas button:hover { background:var(--fill); }
.mus-horas button.on { background:var(--ink); color:var(--bg); border-color:var(--ink); }
.mus-corpo { display:grid; grid-template-columns:minmax(0, 1fr) 380px; gap:16px; align-items:start; }
.mus-corpo > .card, .mus-lado > .card { margin:0; }
.mus-lado { display:flex; flex-direction:column; gap:16px; position:sticky; top:16px; }
.mus-tot { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:8px; margin-bottom:12px; }
.mus-tot div { background:var(--fill); border-radius:var(--radius-s); padding:8px 12px; display:flex; flex-direction:column; }
.mus-tot small { color:var(--ink-2); font-size:12px; } .mus-tot b { font:600 15px/1.3 var(--display); }
.mus-lista { display:flex; flex-direction:column; }
.mus-l { display:grid; grid-template-columns:24px 48px 116px 56px minmax(0, 1fr) 52px 36px; gap:10px; align-items:center; padding:9px 8px; border-top:1px solid var(--line-2); border-left:3px solid transparent; border-radius:var(--radius-s); transition:background .2s; }
.mus-l[data-act] { cursor:pointer; } .mus-l[data-act]:hover, .mus-l[data-act]:focus-visible { background:var(--fill); outline:none; }
.mus-l.nm { color:var(--ink-2); } .mus-l.nm .mus-x b { font-weight:500; }
.mus-l.vazio { border-left-color:var(--orange); background:color-mix(in srgb, var(--orange) 6%, transparent); }
.mus-l.erro { border-left-color:var(--red); background:color-mix(in srgb, var(--red) 6%, transparent); }
.mus-l.sel { border-left-color:var(--accent); background:var(--accent-soft); }
.mus-n { color:var(--ink-3); font-size:12px; } .mus-t { color:var(--ink-2); font-size:13px; }
.mus-c, .mus-m { display:flex; gap:4px; align-items:center; min-width:0; } .mus-c .pill { max-width:100%; overflow:hidden; text-overflow:ellipsis; }
.mus-x { display:flex; flex-direction:column; min-width:0; }
.mus-x b, .mus-x small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .mus-x small { color:var(--ink-2); font-size:12.5px; }
.mus-x small.aviso { color:var(--red); white-space:normal; }
.mus-d { font-size:12px; color:var(--ink-2); text-align:right; } .mus-a { display:flex; justify-content:flex-end; }
.mus-lista.curta .mus-l { grid-template-columns:48px minmax(0, 1fr); }
.mus-rt { width:22px; height:22px; flex:none; border-radius:7px; display:inline-flex; align-items:center; justify-content:center; font:700 11px/1 var(--display); background:color-mix(in srgb, var(--tone) 15%, transparent); color:var(--tone); }
.mus-pe { width:22px; height:22px; flex:none; border-radius:7px; display:inline-flex; align-items:center; justify-content:center; font:700 11px/1 var(--display); color:var(--ink); background:color-mix(in srgb, var(--red) calc(var(--p) * 14%), var(--surface)); }
.mus-pe-sq { background:color-mix(in srgb, var(--red) calc(var(--p) * 14%), var(--surface)) !important; border:1px solid var(--line); }
.mus-luzes { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px; }
.mus-luz { display:flex; align-items:center; gap:8px; padding:6px 10px; border-radius:10px; font-size:12px; font-weight:600; background:var(--fill); color:var(--ink-3); }
.mus-luz::before { content:""; width:8px; height:8px; flex:none; border-radius:50%; background:var(--ink-3); }
.mus-luz.ok { background:color-mix(in srgb, var(--green) 10%, transparent); color:var(--green); } .mus-luz.ok::before { background:var(--green); }
.mus-luz.on { background:color-mix(in srgb, var(--red) 12%, transparent); color:var(--red); } .mus-luz.on::before { background:var(--red); animation:pulse 2s ease-out infinite; --tone:var(--red); }
.mus-alertas { display:flex; flex-direction:column; gap:8px; }
.mus-alertas > div { display:flex; flex-direction:column; gap:2px; padding:10px 12px; border-radius:var(--radius-s); background:color-mix(in srgb, var(--red) 9%, transparent); }
.mus-alertas small { color:var(--red); font-size:12.5px; }
.mus-ok { color:var(--green); font-size:12.5px; font-weight:500; }
.mus-cand { display:flex; flex-direction:column; gap:4px; padding:16px; border:1px solid var(--line); border-radius:var(--radius-m); }
.mus-cand > b { font:600 18px/1.25 var(--display); } .mus-cand small { font-size:12.5px; }
.mus-busca { max-height:460px; overflow-y:auto; margin-top:6px; }
.mus-busca a.on { background:var(--accent-soft); }
.mus-imp { max-height:340px; overflow-y:auto; }
/* grades de dia × hora: peso, histórico, restrição e grade da semana */
.mus-mapa { display:grid; grid-template-columns:40px repeat(24, minmax(20px, 1fr)); gap:2px; min-width:620px; align-items:center; margin-top:8px; }
.mus-mapa.tot { grid-template-columns:40px repeat(24, minmax(20px, 1fr)) 34px; }
.mus-mapa > small { font-size:10.5px; color:var(--ink-2); text-align:center; } .mus-mapa > small:nth-of-type(1) { text-align:left; }
.mus-mapa > b { font-size:12px; color:var(--red); text-align:center; }
.mus-mapa > i { height:20px; border-radius:4px; background:var(--fill); font:700 10px/20px var(--display); font-style:normal; text-align:center; color:var(--accent-text); }
.mus-mapa > i.h1 { background:color-mix(in srgb, var(--accent) 22%, var(--surface)); } .mus-mapa > i.h2 { background:color-mix(in srgb, var(--accent) 45%, var(--surface)); }
.mus-mapa > i.nm { background:var(--fill-2); } .mus-mapa > i.pe { background:color-mix(in srgb, var(--red) calc(var(--p) * 14%), var(--surface)); }
.mus-mapa button { height:24px; border:0; padding:0; border-radius:4px; cursor:pointer; background:color-mix(in srgb, var(--green) 45%, var(--surface)); transition:transform .12s; }
.mus-mapa button:hover:not(:disabled) { transform:scale(1.12); } .mus-mapa button:disabled { cursor:default; }
.mus-mapa button.bl { background:color-mix(in srgb, var(--red) 70%, var(--surface)); }
.mus-mapa.grade button { height:28px; background:color-mix(in srgb, var(--tone) 70%, var(--surface)); }
form.ver .g2 .mus-mapa button { display:block; }
.mus-leg { flex-direction:row; flex-wrap:wrap; gap:4px 16px; margin-top:10px; } .mus-leg > div { padding:4px 0; font-size:13px; }
.mus-barras { display:flex; gap:6px; align-items:flex-end; height:190px; min-width:620px; border-bottom:1px solid var(--line); }
.mus-barras > div { flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:1px; height:100%; }
.mus-barras i { display:block; width:100%; max-width:26px; background:var(--tone); border-radius:4px; transform-origin:bottom; }
.mus-barras small { font-size:10px; color:var(--ink-2); margin-top:4px; }
.entra .mus-barras i { animation:grow 1s var(--ease) both; }
.mus-hist { display:grid; grid-template-columns:260px minmax(0, 1fr); gap:20px; }
.mus-hist-esc { display:flex; flex-direction:column; gap:10px; } .mus-hist-esc .seg { margin:0; } .mus-hist-esc .mus-busca { max-height:260px; }
.mus-fmt { text-align:left; border:2px solid transparent; font:inherit; color:inherit; cursor:pointer; box-shadow:inset 5px 0 0 var(--tone), var(--shadow); }
.mus-fmt.on { border-color:var(--accent); }
.mus-pos { display:flex; flex-wrap:wrap; gap:8px; }
.mus-pos .pill { padding:4px 4px 4px 11px; font-size:13px; } .mus-pos .x { font-size:15px; padding:2px 6px; color:inherit; }
.mus-regras { display:flex; flex-direction:column; }
.mus-regra { display:grid; grid-template-columns:minmax(0, 1fr) 240px 110px 52px; gap:16px; align-items:center; padding:12px 4px; border-top:1px solid var(--line-2); }
.mus-regra .tx { display:flex; flex-direction:column; } .mus-regra .tx small { color:var(--ink-2); font-size:13px; }
.mus-regra .aviso { color:var(--red); font-weight:600; }
.mus-par input { width:100%; accent-color:var(--accent); padding:0; background:none; }
.mus-sw { position:relative; display:inline-block; width:48px; height:28px; }
.mus-sw input { position:absolute; inset:0; opacity:0; margin:0; width:100%; height:100%; cursor:pointer; z-index:1; }
.mus-sw i { position:absolute; inset:0; border-radius:999px; background:var(--fill-2); transition:background .2s; }
.mus-sw i::after { content:""; position:absolute; top:3px; left:3px; width:22px; height:22px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.25); transition:transform .2s var(--ease); }
.mus-sw input:checked + i { background:var(--green); } .mus-sw input:checked + i::after { transform:translateX(20px); }
.mus-sw input:focus-visible + i { box-shadow:0 0 0 3px var(--accent-soft); }
@media (max-width:1280px) { .mus-corpo { grid-template-columns:minmax(0, 1fr) 330px; } }
@media (max-width:1100px) { .mus-corpo { grid-template-columns:minmax(0, 1fr); } .mus-lado { position:static; } }
@media (max-width:820px) {
  .mus-tot { grid-template-columns:repeat(2, minmax(0, 1fr)); } .mus-tot div:last-child { grid-column:1 / -1; }
  .mus-l { grid-template-columns:44px minmax(0, 1fr) auto; grid-template-areas:"t c a" "x x x" "m m d"; gap:6px 10px; padding:12px 8px; }
  .mus-n { display:none; } .mus-t { grid-area:t; } .mus-c { grid-area:c; } .mus-a { grid-area:a; } .mus-x { grid-area:x; } .mus-m { grid-area:m; } .mus-d { grid-area:d; }
  .mus-x b { white-space:normal; }
  .mus-lista.curta .mus-l { grid-template-areas:none; }
  .mus-hist { grid-template-columns:minmax(0, 1fr); }
  .mus-regra { grid-template-columns:minmax(0, 1fr) 52px; } .mus-regra .mus-par { grid-column:1 / -1; grid-row:2; } .mus-regra > .small { grid-column:1; }
  .mus-luzes { grid-template-columns:minmax(0, 1fr); }
}

/* ---------- Tabela de preços (grade programa × formato) ---------- */
.tp-faixa { display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; padding:14px 20px; }
.tp-ink { color:var(--ink); }
.tp-versao { display:flex; align-items:center; gap:8px; } .tp-versao select { height:38px; }
.tp-grade { padding:12px 12px 16px; }
.tp-tab { min-width:calc(360px + var(--n, 3) * 130px); }
.tp-cab, .tp-row { display:grid; grid-template-columns:minmax(220px, 1.6fr) repeat(var(--n, 3), minmax(120px, 1fr)) minmax(110px, auto); gap:8px; align-items:center; padding:12px; }
.tp-cab { align-items:end; border-bottom:1px solid var(--line); }
.tp-row { border-bottom:1px solid var(--line-2); border-radius:var(--radius-s); transition:background .2s; }
.tp-row:hover { background:color-mix(in srgb, var(--fill) 55%, transparent); }
.tp-form { display:flex; align-items:flex-start; justify-content:flex-end; gap:2px; text-align:right; }
.tp-form > span { display:flex; flex-direction:column; min-width:0; } .tp-form b { font:600 15px/1.2 var(--display); } .tp-form small { color:var(--ink-2); font-size:12px; }
.tp-form .btn.tres { width:30px; height:30px; margin-top:-4px; }
.tp-mais { display:flex; justify-content:flex-end; }
.tp-prog { display:flex; flex-direction:column; gap:4px; min-width:0; } .tp-prog b { font-size:16px; } .tp-prog small { color:var(--ink-2); font-size:13px; }
.inativo .tp-prog b, .tp-form.inativo b { color:var(--ink-3); }
.tp-cel { display:flex; flex-direction:column; align-items:flex-end; gap:4px; min-width:0; }
.tp-cel small.aviso { color:var(--orange); text-align:right; }
.tp-preco { padding:8px 12px; border:1px solid transparent; border-radius:12px; background:var(--fill); font:600 16px/1.2 var(--display); color:var(--ink); font-variant-numeric:tabular-nums; cursor:pointer; white-space:nowrap; transition:background .2s, border-color .2s, transform .15s; }
.tp-preco:hover:not(:disabled) { background:var(--surface); border-color:var(--accent); }
.tp-preco:active:not(:disabled) { transform:scale(.97); }
.tp-preco:disabled { cursor:default; background:transparent; }
.tp-preco.aviso { background:color-mix(in srgb, var(--orange) 12%, transparent); border-color:color-mix(in srgb, var(--orange) 35%, transparent); }
.tp-preco.herdado { color:var(--ink-3); background:transparent; border:1px dashed var(--line); }
.tp-vazio { padding:8px 12px; border:1px dashed var(--line); border-radius:12px; background:transparent; font:inherit; font-size:13px; font-weight:600; color:var(--ink-2); cursor:pointer; }
.tp-vazio:hover { border-color:var(--accent); color:var(--accent-text); }
.tp-ed { display:flex; align-items:center; gap:6px; padding:4px 4px 4px 10px; border:1px solid var(--accent); border-radius:12px; background:var(--surface); box-shadow:0 0 0 3px var(--accent-soft); }
.tp-ed label { font-size:13px; color:var(--ink-2); }
.tp-ed input { width:84px; padding:4px 2px; border:0; background:transparent; box-shadow:none; font:600 16px/1.2 var(--display); text-align:right; }
.tp-ed input:focus { box-shadow:none; background:transparent; }
.tp-ed .btn { width:32px; padding:0; }
.tp-rodape { padding:14px 12px 0; }
.tp-cartao .hd { align-items:flex-start; margin-bottom:6px; }
.tp-lin { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:52px; border-top:1px solid var(--line-2); }
.tp-previa { border-radius:var(--radius-m); background:var(--fill); padding:4px 14px; max-height:300px; overflow-y:auto; }
.tp-previa > div { display:grid; grid-template-columns:minmax(0, 1fr) 84px 16px 84px; gap:8px; padding:8px 0; border-top:1px solid var(--line); font-size:14px; font-variant-numeric:tabular-nums; }
.tp-previa > div > span:nth-child(2), .tp-previa > div > b { text-align:right; }
.tp-previa .tp-pv-cab { border-top:0; font-size:12px; color:var(--ink-2); font-weight:500; } .tp-previa .tp-pv-cab span:nth-child(2), .tp-previa .tp-pv-cab span:nth-child(4) { text-align:right; }
@media (max-width:820px) { .tp-faixa .grow { display:none; } .tp-versao { width:100%; } .tp-versao select { flex:1; } }
/* Tabela de preços · seções (programa, quadro, rotativo) e formatos de preço único */
.tp-grupos { border-bottom:0; padding-bottom:0; }
.tp-grupo { text-align:center; font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-2); padding-bottom:6px; border-bottom:2px solid var(--line); }
.tp-cel.uni1, .tp-form.uni1, .tp-grupo.uni1 { border-left:1px solid var(--line); padding-left:12px; margin-left:4px; }
.tp-cel.uni .tp-preco { background:var(--accent-soft); }
.tp-secao { padding:20px 12px 6px; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-text); }
.tp-vazio.leve { border-color:transparent; color:var(--ink-3); font-weight:500; padding:8px 14px; }
.tp-vazio.leve:hover { border-color:var(--accent); border-style:dashed; color:var(--accent-text); }
.tp-novos { display:flex; flex-wrap:wrap; gap:8px; }
.tp-seg { margin-bottom:0; display:flex; } .tp-seg button { flex:1; }
.tp-minis { display:grid; grid-template-columns:repeat(auto-fill, minmax(68px, 1fr)); gap:6px; margin-top:6px; }
.tp-mini { display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 4px; border:1px solid transparent; border-radius:12px; background:var(--fill); font:inherit; color:var(--ink); cursor:pointer; min-width:0; }
.tp-mini small { font-size:12px; color:var(--ink-2); } .tp-mini b { font:600 13px/1.2 var(--display); letter-spacing:-.02em; font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.tp-mini.vazio b { color:var(--ink-3); } .tp-mini.aviso { border-color:color-mix(in srgb, var(--orange) 45%, transparent); }
.tp-mini:disabled, .tp-unico:disabled { cursor:default; }
.tp-unico { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; margin-top:8px; padding:10px 12px; border:0; border-radius:12px; background:var(--accent-soft); font:inherit; font-weight:600; color:var(--ink); cursor:pointer; text-align:left; }
.tp-unico b { font:600 16px/1.2 var(--display); font-variant-numeric:tabular-nums; }
.tp-unicos-novos { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; } .tp-unicos-novos .tp-vazio { display:inline-flex; align-items:center; gap:4px; padding:6px 10px; font-size:12px; }

/* ---------- PI impresso (contrato de publicidade): vale na prévia e no PDF ---------- */
.pidoc { font:11px/1.35 'Geist', Helvetica, Arial, sans-serif; color:#111317; display:flex; flex-direction:column; gap:8px; }
.previa .pidoc { min-width:0; }
.pidoc table { border-collapse:collapse; width:100%; margin:0; }
.pidoc th, .pidoc td { border:1px solid #8d939e; padding:3px 4px; font-size:10.5px; color:#111317; background:transparent; white-space:normal; text-align:left; }
.pidoc .r { text-align:right; } .pidoc .c { text-align:center; } .pidoc .mut, .pidoc .mut td { color:#4b515c; } .pidoc .tx { color:#111317; }
.pd-topo { display:grid; grid-template-columns:270px minmax(0, 1fr) 220px; gap:12px; align-items:stretch; }
.pd-radio { display:flex; gap:10px; align-items:flex-start; font-size:10.5px; }
.pd-radio img { width:60px; height:60px; max-height:none; object-fit:contain; flex:none; }
.pd-selo { width:60px; height:60px; flex:none; border-radius:10px; color:#fff; display:flex; align-items:center; justify-content:center; font:700 12px/1 'Sora', sans-serif; text-align:center; padding:4px; box-sizing:border-box; overflow:hidden; }
.pd-nome { font:700 13px/1.25 'Sora', sans-serif; display:block; margin-bottom:1px; }
.pd-meio { display:flex; flex-direction:column; gap:5px; }
.pd-titulo { font:700 16px/1.1 'Sora', sans-serif; letter-spacing:.04em; text-align:center; }
.pd-cli th { width:80px; background:#f2f3f6; font-weight:600; white-space:nowrap; }
.pd-num { border:2px solid; border-radius:8px; padding:7px 10px; display:flex; flex-direction:column; gap:4px; }
.pd-no { font:700 16px/1.15 'Sora', sans-serif; text-align:center; }
.pd-kv { display:grid; grid-template-columns:66px minmax(0, 1fr); gap:1px 6px; } .pd-kv span { color:#4b515c; }
.pd-autoriza { text-align:center; font-weight:700; letter-spacing:.03em; padding:3px 0; border-top:1px solid #111317; border-bottom:1px solid #111317; }
.pd-per { font-size:11px; margin-bottom:-4px; }
.pd-grade { table-layout:fixed; }
.pd-grade col.k-pg { width:15%; } .pd-grade col.k-fm { width:7%; } .pd-grade col.k-pc { width:34px; } .pd-grade col.k-qt { width:34px; } .pd-grade col.k-un { width:70px; } .pd-grade col.k-ds { width:46px; } .pd-grade col.k-tt { width:84px; }
.pd-grade th { background:#f2f3f6; text-align:center; padding:1px 0; font-weight:600; font-size:10px; } .pd-grade th.l { text-align:left; padding:2px 5px; } .pd-grade th.r { text-align:right; padding:2px 5px; }
.pd-grade td { padding:3px 2px; } .pd-grade td.pg { font-weight:600; padding-left:5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pd-grade td.r { padding-right:5px; }
.pd-grade .fim { background:#e9ebef; }
.pd-grade tfoot td { background:#f8f9fb; }
.pd-pecas { display:flex; justify-content:space-between; gap:18px; font-size:10.5px; }
.pd-baixo { display:grid; grid-template-columns:1.3fr 1fr 250px; gap:10px; align-items:stretch; }
.pd-box { border:1px solid #8d939e; border-radius:6px; padding:6px 9px; display:flex; flex-direction:column; gap:4px; }
.pd-tit { font-size:11.5px; }
.pd-parc td { border:0; border-top:1px solid #d6d9df; padding:1px 4px 1px 0; } .pd-parc tr.mut td { border-top:0; }
.pd-tot { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:2px 8px; align-content:start; border-color:#111317; font-variant-numeric:tabular-nums; }
.pd-tot .forte { font-weight:700; border-top:1px solid #8d939e; padding-top:2px; }
.pd-tot .final { font:700 13px/1.3 'Sora', sans-serif; border-top:2px solid #111317; padding-top:3px; }
.pd-fecho { display:grid; grid-template-columns:minmax(0, 1fr) 170px; gap:10px; align-items:end; }
.pd-fecho > div:first-child { display:flex; flex-direction:column; gap:3px; }
.pd-ass { display:grid; grid-template-columns:repeat(var(--n, 3), minmax(0, 1fr)); gap:30px; margin-top:28px; text-align:center; }
.pd-ass > div { border-top:1px solid #111317; padding-top:3px; } .pd-ass span { color:#4b515c; }
.pd-aprov { text-align:center; align-items:center; gap:2px; } .pd-aprov .ok { color:#0b6b47; font-weight:600; }
.pd-conds { border-top:1px solid #111317; padding-top:5px; font-size:8.6px; line-height:1.32; color:#23262c; column-count:2; column-gap:26px; }
.pd-rodape { display:flex; justify-content:space-between; font-size:9px; color:#6b717c; }
@media (max-width:820px) { .previa .pidoc { min-width:1100px; } .previa .pidoc table { display:table; overflow:visible; } }
#dlg textarea.alto { min-height:340px; font-size:13px; line-height:1.5; }

/* ---------- Financeiro ---------- */
.fin-verde { color:var(--green); } .fin-laranja { color:var(--orange); }
.fin-leg { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-2); }
.fin-leg i { display:inline-block; width:10px; height:10px; border-radius:3px; margin-left:8px; }
.fin-leg i.prev, .fin-bars i.prev { background:var(--accent); } .fin-leg i.rec, .fin-bars i.rec { background:var(--green); }
.fin-bars { height:180px; display:flex; align-items:flex-end; gap:12px; border-bottom:1px solid var(--line); }
.fin-bars > div { flex:1; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:8px; min-width:0; }
.fin-bars > div > b { font-size:11px; font-weight:600; color:var(--ink-2); white-space:nowrap; }
.fin-bars > div > span { display:flex; align-items:flex-end; gap:3px; width:100%; justify-content:center; }
.fin-bars i { display:block; width:40%; max-width:24px; border-radius:7px 7px 3px 3px; transform-origin:bottom; }
.fin-bars > div:not(.on) i.prev { background:var(--bar-soft); }
.legend > a.on { background:var(--fill); }
.legend > a b { font-variant-numeric:tabular-nums; }
.fin-faturar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:16px 22px; }
.fin-filtros { display:flex; flex-wrap:wrap; align-items:center; gap:10px 12px; padding:14px 16px; }
.fin-seg { margin:0; } .fin-seg button span { font-weight:500; }
.fin-per { display:flex; align-items:center; gap:8px; } .fin-per select, .fin-per input { height:40px; }
.fin-busca { flex:1 1 240px; display:flex; align-items:center; gap:8px; height:40px; padding:0 12px; border-radius:var(--radius-s); background:var(--fill); color:var(--ink-2); }
.fin-busca svg { width:16px; height:16px; flex:none; }
.fin-busca input { flex:1; min-width:0; border:0; background:transparent; padding:0; box-shadow:none; height:auto; }
.fin-busca input:focus { box-shadow:none; background:transparent; }
.fin-lista { padding:8px 10px 16px; }
.fin-selbar { position:sticky; top:8px; z-index:2; display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:6px 4px 8px; padding:10px 14px; border-radius:var(--radius-m); background:var(--dark-card); color:#fff; }
.fin-selbar .btn:not(.pri) { background:transparent; color:#fff; border-color:var(--dark-line); }
.fin-tab { min-width:960px; }
.fin-cab, .fin-lin { display:grid; grid-template-columns:28px 96px minmax(220px, 2fr) 100px 100px 150px 140px 150px; gap:10px; align-items:center; padding:10px 12px; }
.fin-cab { font-size:12px; color:var(--ink-2); font-weight:500; border-bottom:1px solid var(--line); }
.fin-cab .r { text-align:right; }
.fin-lin { border-bottom:1px solid var(--line-2); border-radius:var(--radius-s); transition:background .2s; }
.fin-lin:hover, .fin-lin.sel { background:color-mix(in srgb, var(--fill) 60%, transparent); }
.fin-cab input, .fin-lin input[type=checkbox], .fin-cartao input[type=checkbox] { width:18px; height:18px; accent-color:var(--accent); }
.fin-data { font-variant-numeric:tabular-nums; }
.fin-quem { display:flex; flex-direction:column; min-width:0; } .fin-quem b { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .fin-quem small { color:var(--ink-2); font-size:13px; }
.fin-valor { display:flex; flex-direction:column; align-items:flex-end; text-align:right; } .fin-valor b { font:600 15px/1.2 var(--display); font-variant-numeric:tabular-nums; white-space:nowrap; } .fin-valor small { font-size:12px; }
.fin-acoes { display:flex; justify-content:flex-end; align-items:center; gap:4px; }
.fin-mes { display:flex; justify-content:space-between; align-items:baseline; gap:8px; padding:18px 12px 6px; } .fin-mes b { font:600 15px/1.3 var(--display); } .fin-mes span { font-size:13px; color:var(--ink-2); }
.fin-cartao { display:flex; flex-direction:column; gap:8px; padding:14px 6px; border-bottom:1px solid var(--line-2); }
.fin-cartao > .row { align-items:flex-start; gap:10px; flex-wrap:nowrap; } .fin-cartao .fin-quem { flex:1; }
.fin-cartao .fin-acoes { justify-content:stretch; } .fin-cartao .fin-acoes .btn.sm { flex:1; height:44px; }
.fin-devido { display:flex; justify-content:space-between; align-items:center; padding:12px 14px; border-radius:var(--radius-m); background:var(--fill); margin:6px 0 14px; } .fin-devido b { font:600 20px/1.2 var(--display); }
@media (max-width:820px) { .fin-filtros .fin-seg { width:100%; } .fin-filtros .fin-seg button { flex:1; padding:7px 8px; font-size:13px; } .fin-per { width:100%; } .fin-per select { flex:1; } }
.fin-busca svg { fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
/* Financeiro · relatórios (tela) */
.fin-rel { display:grid; grid-template-columns:260px minmax(0, 1fr); gap:16px; align-items:start; }
.fin-rel > .card { margin:0; }
.fin-rel-menu { display:flex; flex-direction:column; gap:2px; padding:12px 10px; position:sticky; top:16px; }
.fin-rel-grupo { padding:12px 12px 4px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); }
.fin-rel-grupo:first-child { padding-top:4px; }
.fin-rel-menu button { padding:9px 12px; border:0; border-radius:var(--radius-s); background:transparent; color:var(--ink); text-align:left; cursor:pointer; font:inherit; font-size:14px; transition:background .2s; }
.fin-rel-menu button:hover { background:var(--fill); } .fin-rel-menu button.on { background:var(--accent-soft); font-weight:600; }
.fin-rel-corpo { display:flex; flex-direction:column; gap:18px; }
.fin-rel-topo { display:flex; flex-wrap:wrap; align-items:flex-start; gap:10px; } .fin-rel-topo h3 { margin:0 0 4px; font:600 21px/1.2 var(--display); } .fin-rel-topo p { margin:0; font-size:14px; }
.fin-rel-filtros { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.fin-rel-f { display:flex; align-items:center; gap:6px; height:40px; padding:0 4px 0 12px; border-radius:var(--radius-s); background:var(--fill); font-size:13px; color:var(--ink-2); }
.fin-rel-f select, .fin-rel-f input { height:34px; border:0; background:transparent; box-shadow:none; font-weight:600; color:var(--ink); padding:0 6px; }
.fin-rel-sel { margin-bottom:12px; }
.rr-res { display:grid; grid-template-columns:repeat(var(--n, 4), minmax(0, 1fr)); gap:12px; }
.rr-k { border:1px solid var(--line); border-radius:var(--radius-m); padding:14px 16px; display:flex; flex-direction:column; gap:4px; min-width:0; }
.rr-k small { font-size:13px; color:var(--ink-2); } .rr-k b { font:600 21px/1.25 var(--display); letter-spacing:-.02em; font-variant-numeric:tabular-nums; } .rr-k span { font-size:12px; color:var(--ink-2); }
.rr-k.dest { background:var(--dark-card); border-color:var(--dark-card); color:#fff; } .rr-k.dest small, .rr-k.dest span { color:var(--dark-card-2); }
.rr-k.ruim b { color:var(--orange); } .rr-k.dest.ruim b { color:#fff; } .rr-k.bom span { color:var(--green); font-weight:600; }
.rr-prog { display:block; height:6px; border-radius:999px; background:var(--fill); overflow:hidden; } .rr-prog i { display:block; height:100%; background:var(--green); border-radius:999px; }
.rr-part { display:flex; flex-direction:column; gap:9px; }
.rr-tit { font:600 15px/1.3 var(--display); }
.rr-part > div { display:grid; grid-template-columns:minmax(120px, 220px) minmax(0, 1fr) 60px 130px; gap:12px; align-items:center; font-size:14px; }
.rr-nome { font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rr-barra { height:12px; border-radius:999px; background:var(--fill); overflow:hidden; } .rr-barra i { display:block; height:100%; border-radius:999px; background:var(--ink); } .rr-barra i.pri { background:var(--accent); }
.rr-part b { text-align:right; } .rr-val { text-align:right; color:var(--ink-2); font-variant-numeric:tabular-nums; }
.rr-tab { width:100%; font-variant-numeric:tabular-nums; }
.rr-tab th { font-size:12px; color:var(--ink-2); font-weight:500; border-bottom:1px solid var(--line); }
.rr-tab td small { display:block; color:var(--ink-2); font-size:12px; }
.rr-tab tbody tr:not(.rr-grp):not(.rr-sub):nth-child(even) td { background:color-mix(in srgb, var(--fill) 45%, transparent); }
.rr-tab .rr-grp td { padding-top:18px; font:600 15px/1.3 var(--display); border-bottom:0; background:transparent; }
.rr-tab .rr-sub td { font-size:13px; color:var(--ink-2); text-align:right; border-bottom:0; } .rr-tab .rr-sub td.r { color:var(--ink); font-weight:700; }
.rr-tab tfoot td { font-weight:700; border-top:2px solid var(--ink); }
.rr-sit { display:inline-block; padding:2px 9px; border-radius:999px; font-size:12px; font-weight:600; background:color-mix(in srgb, var(--sky) 13%, transparent); color:var(--sky); white-space:nowrap; }
.rr-sit.ruim { background:color-mix(in srgb, var(--orange) 13%, transparent); color:var(--orange); } .rr-sit.bom { background:color-mix(in srgb, var(--green) 13%, transparent); color:var(--green); }
.rr-ler { display:flex; flex-direction:column; gap:4px; padding:12px 16px; border-radius:var(--radius-m); background:var(--fill); font-size:13px; color:var(--ink-2); } .rr-ler b { color:var(--ink); }
.fin-rel-cartao { display:flex; flex-direction:column; gap:4px; padding:12px 2px; border-bottom:1px solid var(--line-2); }
.fin-rel-cartao > div { display:flex; justify-content:space-between; gap:12px; font-size:14px; } .fin-rel-cartao > div span:first-child { color:var(--ink-2); }
.fin-rel-cartao.total { border-bottom:0; border-top:2px solid var(--ink); margin-top:6px; }
@media (max-width:980px) { .fin-rel { grid-template-columns:1fr; } .rr-res { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:560px) { .rr-part > div { grid-template-columns:minmax(0, 1fr) 54px; } .rr-part .rr-barra { grid-column:1 / -1; grid-row:2; } .rr-part .rr-val { display:none; } .rr-k b { font-size:18px; } }
/* Relatório impresso (A4 em pé) */
.rdoc { font:11.5px/1.45 'Geist', Helvetica, Arial, sans-serif; color:#15171c; display:flex; flex-direction:column; gap:18px; }
@media print {
  body > *:not(#print) { display:none !important; }
  #print .rdoc { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  #print .rdoc table { margin:0; } #print .rdoc th, #print .rdoc td { border:0; border-bottom:1px solid #e6e8ec; padding:6px 7px; font-size:10.5px; color:#15171c; }
  #print .rdoc th { color:#4b515c; font-weight:600; border-bottom:1.5px solid #15171c; text-align:left; } #print .rdoc .r { text-align:right; }
  #print .rdoc td small { display:block; color:#6b717c; font-size:9.5px; }
  #print .rdoc tbody tr:not(.rr-grp):not(.rr-sub):nth-child(even) td { background:#f7f8fa; }
  #print .rdoc .rr-grp td { font:700 11px/1.3 'Sora', sans-serif; padding-top:12px; border-bottom:0; background:transparent; }
  #print .rdoc .rr-sub td { border-bottom:0; color:#4b515c; text-align:right; font-size:10px; } #print .rdoc .rr-sub td.r { color:#15171c; font-weight:700; }
  #print .rdoc tfoot td { font-weight:700; border-top:1.5px solid #15171c; border-bottom:0; }
  #print .rdoc .rr-sit { background:#e6f4ff; color:#00609e; font-size:9px; padding:1px 6px; } #print .rdoc .rr-sit.ruim { background:#fdf0e3; color:#9a4d00; } #print .rdoc .rr-sit.bom { background:#e3f2ec; color:#0b6b47; }
  #print .rdoc tr { break-inside:avoid; } #print .rdoc thead { display:table-header-group; }
}
.rd-cab { display:flex; align-items:flex-start; gap:14px; padding-bottom:14px; border-bottom:3px solid var(--rcor, #0055ff); }
.rd-cab img { width:54px; height:54px; max-height:none; object-fit:contain; flex:none; }
.rd-selo { width:54px; height:54px; flex:none; border-radius:10px; color:#fff; display:flex; align-items:center; justify-content:center; font:700 12px/1 'Sora', sans-serif; }
.rd-radio { flex:1; display:flex; flex-direction:column; gap:1px; color:#4b515c; } .rd-radio b { font:700 13.5px/1.25 'Sora', sans-serif; color:#15171c; }
.rd-tit { text-align:right; display:flex; flex-direction:column; gap:2px; color:#4b515c; } .rd-tit small { font-size:9.5px; font-weight:700; letter-spacing:.12em; color:#6b717c; } .rd-tit > b { font:700 19px/1.15 'Sora', sans-serif; color:#15171c; } .rd-tit span b { color:#15171c; }
.rdoc .rr-res { gap:9px; grid-template-columns:repeat(var(--n, 4), minmax(0, 1fr)); } .rdoc .rr-k { border:1px solid #dfe2e8; border-radius:10px; padding:10px 11px; gap:2px; }
.rdoc .rr-k small { font-size:10.5px; color:#4b515c; } .rdoc .rr-k b { font:700 15px/1.2 'Sora', sans-serif; color:#15171c; } .rdoc .rr-k span { font-size:9.5px; color:#6b717c; }
.rdoc .rr-k.dest { background:#15171c; border-color:#15171c; } .rdoc .rr-k.dest b { color:#fff; } .rdoc .rr-k.dest small, .rdoc .rr-k.dest span { color:#c9cdd5; }
.rdoc .rr-k.ruim:not(.dest) b { color:#9a4d00; } .rdoc .rr-k.bom span { color:#0b6b47; }
.rdoc .rr-prog { background:#e9ebef; } .rdoc .rr-prog i { background:#0b7a52; }
.rdoc .rr-tit { font:700 12px/1.3 'Sora', sans-serif; }
.rdoc .rr-part { gap:7px; } .rdoc .rr-part > div { grid-template-columns:170px minmax(0, 1fr) 50px 100px; font-size:11px; gap:10px; }
.rdoc .rr-barra { height:10px; background:#eef0f3; } .rdoc .rr-barra i { background:#15171c; } .rdoc .rr-barra i.pri { background:var(--rcor, #0055ff); } .rdoc .rr-val { color:#4b515c; }
.rd-nota { margin:-10px 0 0; font-size:9.5px; color:#6b717c; }
.rdoc .rr-ler { background:#f4f5f7; border-radius:10px; padding:10px 12px; font-size:10px; color:#3a3f4a; gap:3px; } .rdoc .rr-ler b { color:#15171c; font-size:10.5px; }
.rd-rod { display:flex; justify-content:space-between; gap:12px; padding-top:8px; border-top:1px solid #dfe2e8; font-size:9.5px; color:#6b717c; }