/* js/job-screen/job-screen.css — veste so a TELA JOB: o cartao B (destaques), ETA · GO, a barra de abas (icone sobre o rotulo) e o painel.
   A v367 nasceu com o cartao A; a v368 (Rafael, 2026-09-29: "o job info criado nao tem nada parecido com a opcao que selecionamos no design,
   cartao B nesse caso. crie views identicos ao design aprovado!") e' o quadro 1 do esboco "Tela Job — abas" (Main.dc.html), numero a numero:
   cartao com 12 px de recheio e 10 px entre as partes; a coluna da hora com 96 px (hora 24 px/800, o fim 13 px, a data 13 px/600); o cliente
   18 px/700, o tipo 11 px em caixa alta; endereco e retailer · telefone 13 px; chips de 12 px/600 com 3 px 9 px e raio redondo (cinza #eef1f5,
   azul #e4edf7, ambar #fff1cf, verde #dff2e6); acoes de 50 px; abas de 52 px em colunas iguais, icone 20 px sobre rotulo 10 px, a ativa com
   fundo #e8eef5 e negrito. A fonte do cartao e das abas e' Archivo, como no esboco.
   HTML nos <template id="jv-tpl-…"> do index.html · desenho no ui.js · regras no rules.js · porta no index.js. Os tokens vem do style/tokens.css.
   As cores do tipo (.t-measure verde, .t-install azul) sao as do cartao MY JOBS (style/odoo.css .odoojob). */
.jv{display:flex;flex-direction:column;gap:10px}
/* o cartao B */
.jv-card{display:flex;flex-direction:column;gap:12px;font-family:Archivo,sans-serif;color:var(--ink)} /* v746: o cartao deixou de ser caixa (o verde da medida e o azul da instalacao sairam) — a cor do tipo mora na FAIXA (.jv-hero, no fim do arquivo) */
/* v481 — o topo = a proposta 3 do esboco "esboco-topo-job-3" com os botoes de icone da 3A (Rafael 07/10). Saiu o cartao B da v368 (a hora grande a
   esquerda, retailer · telefone, a fileira de chips). (1) o cliente 19 px/700 + a etapa numa pilula de 11 px + o tipo em caixa alta empurrado a direita;
   (2) o endereco 13,5 px; (3) os 3 botoes; (4) a grade de celulas brancas (rotulo 10,5 px em caixa alta, valor 14 px/700, a linha de baixo 12 px) */
.jv-title{display:flex;align-items:center;flex-wrap:wrap;gap:2px 8px}
.jv-name{flex:0 1 auto;min-width:0;font-size:19px;font-weight:700;line-height:1.15;overflow-wrap:anywhere}
.jv-stage{flex:none;font-size:11px;font-weight:600;line-height:1.35;color:var(--ink2);border:1px solid var(--line);border-radius:999px;padding:0 8px;white-space:nowrap}
.jv-kind{margin-left:auto;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);white-space:nowrap}
.jv-tid{flex:none;font-size:11px;font-weight:600;color:var(--ink2);font-variant-numeric:tabular-nums;white-space:nowrap} /* v485 (Rafael 08/10): o numero da tarefa do Odoo, depois do tipo, para conferir */
.jv-addr{margin-top:-6px;font-size:13.5px;color:var(--ink2);line-height:1.3;overflow-wrap:anywhere}
/* v496 — as zonas do My jobs na tela Job: o retailer (caixa alta, --accent) acima do nome, colado nele; a etiqueta amarela do Pick up abaixo do endereco
   (o amarelo de seguranca com texto escuro, igual nos temas); o 'none' em cinza, sem a etiqueta */
.jv-eb{margin-bottom:-8px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);overflow-wrap:anywhere}
.jv-pk{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;max-width:100%;border-radius:8px;padding:6px 10px;background:#f5c518;color:#2a1f00;font-size:13.5px;font-weight:700;line-height:1.25;overflow-wrap:anywhere}
.jv-pk svg{flex:0 0 auto;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.jv-pk.jv-none{background:none;padding:0;color:var(--muted);font-weight:400} .jv-pk.jv-none svg{display:none}
.jv-cells{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .jv-cells[data-jv-n="1"]{grid-template-columns:minmax(0,1fr)}
.jv-cell:last-child:nth-child(odd){grid-column:1/-1} /* no telefone (2 colunas) a celula que sobra sozinha ocupa a linha */
.jobview .jv-cells{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)} .jobview .jv-cell:last-child:nth-child(odd){grid-column:auto} /* no PC uma linha so: 3 colunas (v496: o Retail foi para a faixa) */
.jv-cell{display:flex;flex-direction:column;gap:1px;min-width:0;padding:6px 9px;border-radius:10px;border:1px solid var(--jv-cell-line,transparent);background:var(--jv-cell,#fff);font-size:13px;line-height:1.25;color:var(--ink)}
.jv:not(.t-install):not(.t-measure):not(.t-estimate),body[data-theme="dark"]{--jv-cell-line:var(--line)} /* v481 (conserto): no cartao branco (servico e os tipos sem cor) e no escuro classico (celula --soft quase igual ao --panel) a celula ganha o contorno do tema, senao a grade some; nos cartoes de cor o contorno fica transparente, como o esboco (o recheio perdeu 1 px para o tamanho nao mudar) */
.jv-cell small{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.jv-cell b{font-size:14px;font-weight:700;color:var(--ink);overflow-wrap:anywhere} .jv-cell>span{font-size:12px;color:var(--ink2);overflow-wrap:anywhere}
.jv-cell>.jv-hrs{display:flex;align-items:center;gap:3px} .jv-hrs svg{flex:0 0 auto;width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round} /* v524: ⏱ as horas do trabalho */
/* v521: o ✎ Change da visita de estimate (abre a folha de remarcar no home.html) — 44 px de toque sem crescer a celula */
/* v525 — o pe do cartao: S1 (de onde vem o trabalho aberto) e V1 (o que ainda nao chegou ao Escritorio); a barra S3 (o #draftbar, shell.css) e a faixa V2 */
.jv-orig,.jv-pend{display:flex;align-items:center;gap:8px;margin:0;font-size:12.5px;line-height:1.3;color:var(--ink2)}
.jv-orig-t{flex:1;min-width:0;overflow-wrap:anywhere} .jv-orig-phone .jv-orig-t{color:var(--ink);font-weight:600} .jv-pend .jv-orig-t{color:#8a5a00;font-weight:600}
.jv-orig-b{flex:none;min-height:40px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--accent);font:inherit;font-weight:700;font-size:13px;line-height:1;cursor:pointer} /* v744: era font:700 13px/1 inherit — inherit nao entra no atalho font, o navegador jogava a regra fora e o botao saia com os 15 px do telefone */
.jv-conflict .jv-cft{flex:1;min-width:0}
.jv-expired{position:fixed;left:0;right:0;top:0;z-index:2001;display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:9px 14px;background:#7a4b00;color:#fff;font:500 13px/1.4 "Source Sans 3",system-ui,sans-serif;box-shadow:0 6px 24px rgba(0,0,0,.25)}
body:has(> [data-mr-expired]){padding-top:62px} /* a faixa nao cobre o ‹ My jobs */ .jv-expired .jv-expt{flex:1;min-width:0} .jv-expired button{min-height:44px;padding:8px 14px;border-radius:999px;border:0;background:#fff;color:#1f2f42;font-weight:700;cursor:pointer}
.jv-visit{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;min-height:44px;margin:-8px 0 -12px;padding:0 2px;font-size:13px;font-weight:700;color:var(--accent);text-decoration:none}
.jv-cell.jv-tone-amber{background:var(--jv-amb-bg,#fff1cf)} .jv-cell.jv-tone-amber b{color:var(--jv-amb-tx,#7a4e00)}
.jv-cell.jv-tone-green{background:var(--jv-grn-bg,#dff2e6)} .jv-cell.jv-tone-green b{color:var(--good)}
body:not(:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"])) .jv:is(.t-measure,.t-estimate) .jv-cell.jv-tone-green{--jv-cell-line:#bfe0c9} /* v481 (conserto): o verde 'sem problemas' no cartao verde da medida quase sumia (deltaE 4 no claro, 0,4 no Sketch) — ganha o contorno do proprio cartao verde */
.jv-cell.jv-tone-red{background:var(--jv-red-bg,#fde4e2)} .jv-cell.jv-tone-red b{color:var(--bad)} body[data-theme="sketch"]{--jv-red-bg:#feeeed;--jv-grn-bg:#eaf7ef} /* v481: no Sketch o vermelho (#b04a3a) e o cinza do rotulo davam 4,47:1 no #fde4e2 — o fundo um tom mais claro passa de 4,5; o verde (#2f7d4a) dava 4,33:1 no #dff2e6 e passa a 4,58 no #eaf7ef (conserto) */
.jv-ver{margin:4px 0 0;font:500 11px/1.3 Archivo,sans-serif;color:var(--ink2);text-align:center} /* v481: a versao, pequena, no fim da tela; a tinta --ink2 (o --muted dava 3,6:1 no claro e 4,4:1 no Lab — conserto) */
body[data-oj][data-view="M"][data-mtab="hub"] .page>h1,body[data-oj][data-view="M"][data-mtab="hub"] .page>.sub{display:none} /* v481: num trabalho do Odoo o titulo e a linha 'A1 Windows · generated from the measure sheet · data · vNNN' saem da TELA JOB (layout-e.js poe o data-oj). Conserto: so na tela Job do telefone (aba hub); a tela Job do PC e' a vista E, que ja os escondia (style/shell.css). A vista A do PC (a folha que imprime) e as outras abas do telefone ficam com o titulo e a linha, onde a versao aparece */
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]){--jv-cell:var(--soft);--jv-amb-bg:#3a2e14;--jv-amb-tx:var(--warn);--jv-grn-bg:#1f3a2c;--jv-red-bg:#3a1f1f} /* v481: as celulas e os tons nos 4 temas escuros */
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv .jv-card .jv-acts:not(.jv-goopen) button.jv-act:not(#sheetload){background:var(--jv-card);border-color:var(--line);color:var(--ink)} /* v746: os botoes viraram cartoes (o ETA mandado fica com o circulo verde); o :not(#sheetload) da v474 vence o 'button' generico do theme.css */
.jv-chip{display:inline-flex;align-items:center;padding:3px 9px;border-radius:50rem;font-size:12px;font-weight:600;background:#eef1f5;color:var(--ink2)}
.jv-chip-blue{background:#e4edf7;color:var(--accent)} .jv-chip-amber{background:#fff1cf;color:#7a4e00} .jv-chip-green{background:#dff2e6;color:var(--good)}
/* ETA · GO, e a fila Google Maps · Apple Maps · ✕ depois do GO */
.jv-acts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px} .jv-acts.jv-acts2{grid-template-columns:repeat(2,minmax(0,1fr))} /* v516: trabalho fechado = IR · Ligar */ .jv-acts.jv-goopen{grid-template-columns:1fr 1fr 48px} /* v481: ETA · IR · Ligar */
.jv-act{min-height:50px;margin:0;border:1px solid var(--line);background:#fff;border-radius:10px;font:inherit;padding:5px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;color:var(--ink);min-width:0;touch-action:manipulation;text-decoration:none}
.jv-act b{font:700 14px/1.1 Archivo,sans-serif;white-space:nowrap} .jv-act small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.jv-act[data-odooact="omw"] b,.jv-golink b{color:var(--accent)} .jv-act.sent b{color:var(--good)} .jv-act[disabled]{opacity:.4} .jv-golink{border-color:var(--accent);flex-direction:row;gap:8px} .jv-gotx{display:flex;flex-direction:column;align-items:flex-start;min-width:0;gap:2px} /* v423: o icone do app a esquerda */
/* v481 — os 3 botoes da 3A: cheios na cor do tema, o icone (sprite jv-ic-eta / go / call, traco currentColor: nitido em qualquer tema) a esquerda, o rotulo e a
   linha pequena a direita (com reticencias); o ETA mandado fica verde; sem endereco / sem telefone, apagados. 48 px de altura (o toque do telefone pede 44) */
/* v746 (esboco "Visual da tela Job", C1): os 3 viram cartoes brancos encostados na faixa — o icone num circulo (como o contato do iPhone), o rotulo e a linha
   pequena embaixo, inteira (o "6:35–7…" e o "(717) 5…" saiam cortados). ETA mandado = o circulo verde e a janela em verde */
.jv-acts:not(.jv-goopen) .jv-act{min-height:84px;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:9px 4px 8px;border:1px solid var(--line);border-radius:18px;background:var(--jv-card,#fff);color:var(--ink);box-shadow:0 6px 18px rgba(10,30,55,.14)}
.jv-acts:not(.jv-goopen) .jv-act .jv-aic{width:36px;height:36px;padding:8px;border-radius:50%;background:var(--acc2);color:var(--accent)}
.jv-acts:not(.jv-goopen) .jv-act .jv-atx{align-items:center;text-align:center}
.jv-acts:not(.jv-goopen) .jv-act b{color:var(--ink)} .jv-acts:not(.jv-goopen) .jv-act small{font-size:12px;font-weight:500;color:var(--ink2);font-variant-numeric:tabular-nums}
.jv-acts:not(.jv-goopen) .jv-act.sent .jv-aic{background:var(--jv-grn-bg,#dff2e6);color:var(--good)} .jv-acts:not(.jv-goopen) .jv-act.sent small{color:var(--good);font-weight:700}
.jv-acts .jv-act[disabled],.jv-acts .jv-act.jv-off{opacity:.45;cursor:default} .jv-act.jv-off{pointer-events:none}
.jv-aic{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.jv-atx{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:0;max-width:100%} .jv-atx small{max-width:100%}
/* a barra de abas B: uma coluna igual por aba, icone sobre o rotulo, a ativa com fundo; so rola de lado se nao couber (8 abas cabem em 375 px) */
.jv-strip{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(44px,1fr);gap:2px;border-bottom:1px solid var(--line);padding-bottom:6px;margin-top:4px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch} .jv-strip::-webkit-scrollbar{display:none}
.jv-tab{min-height:52px;min-width:0;margin:0;padding:4px 0;border:none;border-radius:10px;background:transparent;font:400 10px/1.2 Archivo,sans-serif;color:var(--ink2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;white-space:nowrap;touch-action:manipulation}
.jv-tab svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.jv-tab[aria-selected="true"]{color:var(--accent);background:#e8eef5;font-weight:700}
.jv-icons{position:absolute;width:0;height:0;overflow:hidden}
/* o painel da aba */
.jv-pane{display:flex;flex-direction:column;gap:10px;min-height:0} /* v369: na Info o painel fica vazio de proposito — nada sob as abas ate o Rafael definir */
.jv-soon{margin:0;padding:18px 16px;border:1px dashed var(--line);border-radius:12px;color:var(--muted);font-size:13px;line-height:1.45;text-align:center}
.jv-seg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--jv-card,#fff)}
.jv-seg button{flex:1;min-height:44px;margin:0;border:none;border-radius:0;background:var(--jv-card,#fff);font:700 14px/1 Archivo,sans-serif;color:var(--ink2);cursor:pointer;touch-action:manipulation} .jv-seg button[aria-pressed="true"]{background:var(--accent);color:var(--jv-on-acc,#fff)} /* v497: o fundo era #fff fixo — nos temas escuros o texto claro sumia no branco e o branco no destaque claro (medicao 85, a aba Measure); no claro nada muda */
.jv-placed{text-align:right;margin:-4px 2px 0} /* v371: 'N of M placed' sob o seletor da aba Measure */
/* v547 — as Tech notes sob o mapa (jv-tpl-technotes) e a barra de formato (tn-tpl-editor; js/job/tech-notes.js liga). Vazio = uma linha; com o
   foco, cresce. A area em 16 px: menos que isso o iPhone da zoom ao tocar. As cores = a paleta do TN_COLORS; nos temas escuros, tons mais claros */
.jv-tn{display:flex;flex-direction:column;gap:6px}
.jv-tn-h{margin:4px 2px 0;font:700 12px/1.2 Archivo,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)} .jv-tn-h small{font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:none;color:var(--muted)}
.jv-tn-saved{text-align:right;margin-top:-2px} .jv-tn-saved[hidden]{display:none}
/* v549 · o Lead Form da EPA (js/job/lead.js): o bloco da aba Measure acima do Finalizar medida — os cartoes dos kits e dos locais sao os do .jv-issue, no fundo do tema */
.jv-lead{display:flex;flex-direction:column;gap:8px;padding:12px 0 4px;border-top:1px solid var(--line);font-family:Archivo,sans-serif} .jv-lead .jv-rhead{gap:8px} .jv-lyear{margin:0}
.jv-lbody{display:flex;flex-direction:column;gap:14px} .jv-lbody[hidden]{display:none} .jv-lsec{display:flex;flex-direction:column;gap:8px}
.jv-lh{font:700 12px/1.2 Archivo,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)} .jv-lfirm{margin:0;font-size:14px;line-height:1.35;color:var(--ink)}
.jv-llist{display:flex;flex-direction:column;gap:10px} .jv-llist:empty{display:none} .jv-lead .jv-lcard{background:var(--panel,#fff)}
.jv-lgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px} .jv-lgrid>.jv-field{min-width:0} .jv-lgrid .jv-sel{padding:0 10px} .jv-lparts{display:flex;flex-wrap:wrap;gap:6px} .jv-lres3 button:last-child{flex-grow:1} /* v550: os campos em duas colunas */
.jv-lead .jv-field.jv-lneed>span{color:var(--bad)} .jv-lead .jv-field.jv-lneed .jv-sel,.jv-lead .jv-field.jv-lneed .jv-lres3,.jv-lead .jv-iadd.jv-lneed{border-color:var(--bad);box-shadow:0 0 0 1px var(--bad)} /* v550: o que falta, depois do Finish tentado */
.jv-lead [data-jv-lmiss]:not(.jv-bad){color:var(--muted)}
.jv-lres{margin:0;padding:10px 12px;border-radius:10px;font-size:14px;font-weight:700;background:var(--soft,#eef1f5);color:var(--ink)} .jv-lres[hidden]{display:none}
.jv-lres.jv-bad{background:var(--jv-red-bg,#fde4e2);color:var(--bad)} .jv-lres.jv-lgood{background:var(--jv-grn-bg,#dff2e6);color:var(--good)}
.tn-ed{border:1px solid var(--line);border-radius:12px;background:var(--jv-card,#fff);overflow:hidden} .tn-ed:focus-within{border-color:var(--accent)}
.tn-bar{display:flex;align-items:center;flex-wrap:wrap;gap:2px;padding:4px;border-bottom:1px solid var(--line)}
.tn-bar button{min-width:40px;min-height:40px;margin:0;padding:0 8px;border:none;border-radius:8px;background:transparent;color:var(--ink);font:600 16px/1 Archivo,sans-serif;cursor:pointer;touch-action:manipulation}
.tn-bar button[aria-pressed="true"]{background:var(--accent);color:var(--jv-on-acc,#fff)}
.tn-sep{width:1px;height:22px;margin:0 4px;background:var(--line)}
.tn-dot{display:inline-block;width:14px;height:14px;margin-right:3px;border-radius:50%;vertical-align:-2px;background:conic-gradient(#c62828 0 25%,#d9730d 0 50%,#2e7d32 0 75%,#1f5fa8 0)}
.tn-pal{display:flex;gap:10px;padding:6px 10px;border-bottom:1px solid var(--line)} .tn-pal[hidden]{display:none}
.tn-pal button{width:34px;height:34px;min-height:0;margin:0;padding:0;border:2px solid var(--line);border-radius:50%;background:var(--ink);cursor:pointer;touch-action:manipulation}
.tn-pal [data-tn-c="red"]{background:#c62828} .tn-pal [data-tn-c="orange"]{background:#d9730d} .tn-pal [data-tn-c="green"]{background:#2e7d32} .tn-pal [data-tn-c="blue"]{background:#1f5fa8}
.tn-area{min-height:2.6em;padding:10px 12px;font-family:inherit;font-size:16px;line-height:1.45;color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere;outline:none;cursor:text} .tn-area:focus{min-height:7.5em}
.tn-area.tn-empty::before{content:attr(data-ph);color:var(--muted);pointer-events:none}
.tn-area ul,.tn-area ol{margin:2px 0;padding-left:22px}
.tn-area [data-c="red"]{color:#c62828} .tn-area [data-c="orange"]{color:#d9730d} .tn-area [data-c="green"]{color:#2e7d32} .tn-area [data-c="blue"]{color:#1f5fa8}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .tn-area [data-c="red"]{color:#ff7a7a}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .tn-area [data-c="orange"]{color:#ffa94d}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .tn-area [data-c="green"]{color:#7bd389}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .tn-area [data-c="blue"]{color:#7fb2ff}
.jv-sum{margin:0 2px;font-size:13px;line-height:1.35;color:var(--ink2);overflow-wrap:anywhere} /* v535: o resumo da barra antiga (measured · lines · units · tempered), so no PC e no iPad */
/* v399: a aba Tool saiu (.jv-tool, .jv-add, .jv-toolhead, .jv-toggle) — a fita metrica esta na .jv-seg */
.jv-hint{margin:0;font-size:11px;color:var(--muted);text-align:center}
.jv-link{min-height:36px;margin:0;border:none;background:transparent;font:600 12px/1 Archivo,sans-serif;color:var(--accent);padding:0 4px;cursor:pointer}
/* ===== v370 — a aba REPORT (quadros 5 e 6 do esboco): o cabecalho com o chip e a janela, as duas escolhas de 64 px, o formulario (cartao por problema com
   as duas fotos de 96 px, o tipo, o texto), + Add another issue, Send report, o aviso OK/Cancel por cima da tela ===== */
.jv-report{display:flex;flex-direction:column;gap:10px;font-family:Archivo,sans-serif}
.jv-rhead{display:flex;align-items:center;gap:8px} .jv-rhead b{font-size:13px;font-weight:600} .jv-rhead small{font-size:12px;color:var(--muted)}
.jv-chip-red{background:#fde4e2;color:var(--bad)}
.jv-rnote{margin:0;font-size:12.5px;color:var(--ink2);line-height:1.4} .jv-rnote.jv-bad{color:var(--bad);font-weight:600} .jv-rnote[hidden]{display:none}
.jv-rchoices{display:flex;flex-direction:column;gap:10px}
.jv-big{min-height:64px;margin:0;border:2px solid var(--line);background:#fff;border-radius:12px;font-family:inherit;display:flex;align-items:center;gap:12px;padding:0 16px;text-align:left;color:var(--ink);cursor:pointer;touch-action:manipulation}
.jv-big b{display:block;font-size:16px} .jv-big small{display:block;font-size:12px;color:var(--muted);font-weight:400;margin-top:2px}
.jv-big svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.jv-big-ok{border-color:var(--good)} .jv-big-ok svg{color:var(--good)} .jv-big-bad{border-color:var(--bad)} .jv-big-bad svg{color:var(--bad)}
.jv-big[disabled]{opacity:.45;cursor:default}
.jv-rhint{text-align:left;font-size:12px;line-height:1.4;margin:4px 2px 0}
.jv-issues{display:flex;flex-direction:column;gap:10px} .jv-issues[hidden]{display:none}
.jv-ilist{display:flex;flex-direction:column;gap:10px}
.jv-issue{border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px;display:flex;flex-direction:column;gap:10px}
.jv-ihead{display:flex;align-items:center;justify-content:space-between} .jv-ihead b{font-size:13px} .jv-irm{color:var(--bad);font-weight:700;min-width:44px;min-height:32px}
.jv-iphotos{display:flex;gap:8px} .jv-slot{flex:1;min-width:0;display:flex}
.jv-photo{flex:1;min-height:96px;margin:0;padding:6px;border:2px dashed #b9c0cc;border-radius:10px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font:700 12px/1.2 Archivo,sans-serif;color:var(--accent);cursor:pointer;touch-action:manipulation}
.jv-photo svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.jv-photo.jv-photo-ok{border-style:solid;border-color:var(--good);background:#dff2e6;color:var(--good)}
.jv-field{display:flex;flex-direction:column;gap:4px;font:600 12px/1.3 Archivo,sans-serif;color:var(--ink2)} .jv-field[hidden]{display:none}
.jv-sel{min-height:44px;margin:0;border:1px solid var(--line);background:#fff;border-radius:10px;font:400 16px/1.2 Archivo,sans-serif;color:var(--ink);padding:0 12px;width:100%;box-sizing:border-box}
.jv-iadd{min-height:44px;margin:0;border:1px dashed #b9c0cc;background:transparent;border-radius:10px;font:700 14px/1 Archivo,sans-serif;color:var(--accent);cursor:pointer;touch-action:manipulation}
.jv-send{min-height:48px;margin:0;border:1px solid var(--accent);background:var(--accent);border-radius:10px;font:700 15px/1 Archivo,sans-serif;color:var(--on-acc);cursor:pointer;touch-action:manipulation}
.jv-modal{position:fixed;inset:0;z-index:120;background:rgba(28,36,48,.45);display:flex;align-items:center;justify-content:center;padding:24px}
.jv-dialog{background:#fff;border-radius:14px;padding:18px 16px;width:100%;max-width:420px;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;box-shadow:0 12px 40px rgba(0,0,0,.3);font-family:Archivo,sans-serif}
.jv-dialog b{font-size:16px} .jv-dialog span{font-size:14px;color:var(--ink2);line-height:1.4}
.jv-dbtns{display:flex;gap:8px;justify-content:flex-end;margin-top:4px}
.jv-dcancel{min-height:44px;margin:0;padding:0 16px;border:1px solid var(--line);background:#fff;border-radius:10px;font:700 14px/1 Archivo,sans-serif;color:var(--accent);cursor:pointer}
.jv-dok{min-height:44px;margin:0;padding:0 20px;border:1px solid var(--accent);background:var(--accent);border-radius:10px;font:700 14px/1 Archivo,sans-serif;color:var(--on-acc);cursor:pointer}
/* ===== v372 — a aba $ (quadro 11: o Add Products do Odoo): a busca de 44 px, as pilulas de categoria, os cartoes de produto em 2 colunas (132 px, acesos
   quando adicionados, com − [numero] + de 44 px e Remove), o rodape fixo com os itens, o total e Send to office ===== */
.jv-invoice{display:flex;flex-direction:column;gap:8px;font-family:Archivo,sans-serif}
.jv-search{display:flex;align-items:center;gap:8px;min-height:44px;border:1px solid var(--line);border-radius:10px;background:var(--jv-card,#fff);padding:0 12px;color:var(--muted)} .jv-search svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;flex:none}
.jv-search input{flex:1;min-width:0;margin:0;padding:0;border:none;outline:none;font:400 16px/1.2 Archivo,sans-serif;color:var(--ink);background:transparent}
.jv-cats{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px} .jv-cats::-webkit-scrollbar{display:none}
.jv-cat{flex:none;min-height:36px;margin:0;padding:0 12px;border:1px solid var(--line);background:#fff;border-radius:50rem;font:600 13px/1 Archivo,sans-serif;color:var(--ink2);white-space:nowrap;cursor:pointer;touch-action:manipulation} .jv-cat[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--jv-on-acc,#fff)}
.jv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .jv-grid .jv-soon{grid-column:1/-1}
.jv-product{display:flex;flex-direction:column;gap:4px;padding:10px;border:2px solid var(--line);border-radius:12px;background:var(--jv-card,#fff);min-height:132px} .jv-product.jv-added{border-color:var(--accent);background:var(--jv-pon,#eef3f9)}
.jv-pname{font-size:14px;font-weight:700;line-height:1.2;overflow-wrap:anywhere} .jv-pprice{font-size:13px;font-weight:600} .jv-ptag{align-self:flex-start;padding:2px 8px;border-radius:50rem;font-size:11px;font-weight:600;background:var(--jv-ptagbg,#eef1f5);color:var(--ink2)} .jv-ponhand{font-size:11px;color:var(--muted)}
.jv-padd{margin:auto 0 0;min-height:44px;border:1px solid var(--accent);background:#fff;border-radius:10px;font:700 14px/1 Archivo,sans-serif;color:var(--accent);cursor:pointer;touch-action:manipulation}
/* v472 — a grade em SECOES (as familias do PDF "Labor Invoice Icons": o titulo e a conta na linha inteira) e o icone de 44 px a esquerda do nome e do preco,
   como o "In the invoice (real size)" do PDF (la o icone tem a altura do + Adicionar; os 28 px do PDF sao a miniatura das listas); o desenho e' SVG do
   js/job-screen/labor-icons.js (as cores vem nos atributos dele) */
.jv-psec{grid-column:1/-1;display:flex;align-items:baseline;gap:8px;padding:10px 2px 0} .jv-psec:first-child{padding-top:2px} .jv-psec b{font-size:15px;font-weight:700;color:var(--ink)} .jv-psec small{font-size:12px;color:var(--muted)}
.jv-phead{display:flex;align-items:flex-start;gap:8px} .jv-ptext{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0} .jv-pico{flex:none;width:44px;height:44px} .jv-pico svg{display:block;width:44px;height:44px}
.jv-pstep{margin-top:auto;display:flex;align-items:center;gap:4px} .jv-pstep button{width:44px;height:44px;margin:0;padding:0;border:1px solid var(--accent);background:var(--accent);border-radius:10px;font:700 22px/1 Archivo,sans-serif;color:var(--on-acc);flex:none;cursor:pointer;touch-action:manipulation}
.jv-pstep input{flex:1;min-width:0;width:100%;height:44px;margin:0;padding:0 2px;border:1px solid var(--line);border-radius:10px;font:700 18px/1 Archivo,sans-serif;text-align:center;color:var(--ink);background:#fff;-moz-appearance:textfield} .jv-pstep input::-webkit-outer-spin-button,.jv-pstep input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.jv-prm{min-height:32px;margin:0;padding:0;border:none;background:transparent;font:700 12px/1 Archivo,sans-serif;color:var(--bad);text-align:left;cursor:pointer}
/* v474 (Rafael 06/10, "sim"): a aba $ nos 4 temas escuros. O cartao, a etiqueta, a busca e o rodape seguem o tema pelas variaveis do bloco dos temas escuros
   (--jv-card, --jv-pon, --jv-ptagbg, --jv-ofoot); o nome, o preco e o estoque ja usavam a tinta do tema e eram claros num cartao branco. Os botoes do cartao
   perdiam para a regra geral de botao escuro do theme.css (fundo do painel, texto claro: o Remove virava uma barra escura), entao voltam ao desenho do claro:
   + Adicionar com contorno e texto na cor de destaque, − e + cheios com o texto escuro (--jv-on-acc), Remove so o texto vermelho. O :not(#sheetload) e' o
   mesmo do theme.css (ver odoo.css, o omws). O desenho do icone nao muda. Fora dos temas escuros nada disto vale: o claro fica igual. */
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-invoice .jv-grid .jv-product button.jv-padd[data-jv-padd]:not(#sheetload){background:transparent;border-color:var(--accent);color:var(--accent)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-invoice .jv-grid .jv-product .jv-pstep button:is([data-jv-pdec],[data-jv-pinc]):not(#sheetload){background:var(--accent);border-color:var(--accent);color:var(--jv-on-acc)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-invoice .jv-grid .jv-product button.jv-prm[data-jv-prm]:not(#sheetload){background:transparent;border-color:transparent;color:var(--bad)}
/* v474, conserto apos a verificacao: (1) o estoque ("12 on hand", 11 px, --muted) ficava abaixo de 4,5:1 no cartao ACESO (--jv-pon: Classic dark 4,39, HUD
   3,90) e, no HUD, tambem no cartao normal perto do topo da tela, onde o degrade do fundo e' mais claro (4,22, medicao 93): nos escuros ele usa a --ink2.
   (2) A busca: a regra geral de input escuro do theme.css (fundo do painel) ganhava do transparente do .jv-search input e
   desenhava uma caixa dentro da caixa no HUD e no Holo, e o "Search products" ficava no cinza do Chrome (#757575: HUD 2,32, Holo 3,02): o campo fica
   transparente e o texto de exemplo na --ink2. No claro nada disto vale. */
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-invoice .jv-product .jv-ponhand{color:var(--ink2)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-invoice .jv-search input{background:transparent} body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-invoice .jv-search input::placeholder{color:var(--ink2);opacity:1}
.jv-ofoot{position:sticky;bottom:0;display:flex;align-items:center;gap:10px;padding:10px 0 12px;border-top:1px solid var(--line);background:var(--jv-ofoot,#fff)} .jv-ototals{display:flex;flex-direction:column} .jv-ototals small{font-size:12px;color:var(--muted)} .jv-ototals b{font-size:18px}
.jv-osend{padding:0 18px} .jv-osend[disabled]{opacity:.45;cursor:default}
/* ===== v374 — a aba PHOTOS (quadro 7): a grade de 3 com a legenda, + Add photo ===== */
.jv-photos{display:flex;flex-direction:column;gap:10px;font-family:Archivo,sans-serif;container:jvph/inline-size}
/* v773 (esboco "Baixar fotos da tarefa" D5 A, Rafael 29/10: "melhora o design dos botoes reload, photo measure e +add photo"): o ↻ so com o icone na ponta da
   linha do titulo; Photo Measure e Add photo lado a lado numa linha so deles, 44 px (o dedo); com 520 px de painel, tudo numa linha e 38 px */
.jv-photos .jv-rhead{flex-wrap:wrap;row-gap:10px} .jv-photos .jv-rhead b{font-size:15px;font-weight:800} .jv-photos .jv-rhead small{font-size:13px}
.jv-phbtn{min-height:44px;margin:0;padding:0 14px;border:1px solid var(--accent);border-radius:10px;background:var(--panel,#fff);color:var(--accent);font:700 14px/1 Archivo,sans-serif;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;white-space:nowrap;touch-action:manipulation}
.jv-phbtn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.jv-phre{margin-left:auto;width:44px;padding:0;border-color:var(--line);color:var(--ink2)}
.jv-phadd{background:var(--accent);color:var(--on-acc)} .jv-phbtn[disabled]{opacity:.45;cursor:default}
.jv-phacts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;flex:1 1 100%}
/* v798 (plano "Fotos no Google Drive"): Open in Drive — a pasta das fotos da tarefa; no telefone, a linha inteira embaixo dos dois; so aparece com o link */
.jv-phdrive{grid-column:1/-1;text-decoration:none} .jv-phdrive[hidden]{display:none}
.jv-phgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.jv-phtile{margin:0;display:grid;grid-template-columns:minmax(0,1fr);gap:3px;min-width:0} .jv-phtile img{grid-area:1/1;width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:#eef1f5;display:block} .jv-phtile figcaption{grid-area:2/1;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* v773 (D1 a): a ↓ no canto de baixo a direita da foto, por cima dela — o circulo escuro aparece em foto clara ou escura */
.jv-phdl{grid-area:1/1;align-self:end;justify-self:end;margin:6px;width:32px;height:32px;min-width:0;min-height:0;padding:0;border-radius:50%;border:1.5px solid rgba(255,255,255,.9);background:rgba(15,22,32,.62);display:grid;place-items:center;cursor:pointer;touch-action:manipulation} .jv-phdl[hidden]{display:none}
.jv-phdl svg{width:19px;height:19px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@container jvph (min-width:520px){ .jv-phacts{display:flex;flex:none} .jv-phbtn{min-height:38px} .jv-phre{width:38px} .jv-phdl{width:38px;height:38px;margin:10px} .jv-phdl svg{width:22px;height:22px} }
/* ===== v377 — o visualizador de fotos (V1 a V4): por cima da tela Job, fundo preto; a foto cabe no palco em 1x; o zoom e o arrasto vem das variaveis --jv-zoom/--jv-x/--jv-y ===== */
.jv-phtile{cursor:pointer}
.jv-viewer{position:fixed;inset:0;z-index:130;background:#000;color:#fff;display:flex;flex-direction:column;font-family:Archivo,sans-serif;touch-action:none;user-select:none;-webkit-user-select:none}
.jv-vbar{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 4px 0 14px;font-size:13px;flex:none} .jv-vpos{font-weight:700;white-space:nowrap} .jv-vcap{flex:1;min-width:0;color:#cfd4dc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* v773 (D2 a): o ↓ Download antes do ✎ Edit; no telefone so a seta, e a data desce para baixo do "1 of 10" */
.jv-vtit{display:contents} .jv-vdl{display:inline-flex;align-items:center;gap:6px;padding:0 10px} .jv-vdl[hidden]{display:none}
.jv-vdl svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:599px){ .jv-vdl span{display:none} .jv-vtit{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0;line-height:1.15} .jv-vtit .jv-vcap{font-size:12px} }
.jv-vclose{min-width:44px;min-height:44px;margin:0;padding:0;border:none;background:transparent;color:#fff;font-size:20px;cursor:pointer}
.jv-vstage{flex:1;min-height:0;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.jv-vstage img{max-width:100%;max-height:100%;display:block;transform-origin:0 0;transform:translate(var(--jv-x,0px),var(--jv-y,0px)) scale(var(--jv-zoom,1));will-change:transform;-webkit-user-drag:none;pointer-events:none}
.jv-vstage img[hidden]{display:none} .jv-vload{position:absolute;margin:0;font-size:13px;color:#cfd4dc} .jv-vload[hidden]{display:none}
.jv-varrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:64px;margin:0;padding:0;border:none;background:rgba(0,0,0,.35);color:#fff;font-size:34px;line-height:1;cursor:pointer;border-radius:10px} .jv-vprev{left:6px} .jv-vnext{right:6px} .jv-varrow[disabled]{opacity:.25;cursor:default}
.jv-vdots{display:flex;justify-content:center;gap:6px;padding:10px 0 16px;flex:none} .jv-vdot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35)} .jv-vdot[aria-current="true"]{background:#fff}
/* ===== v378 — a aba CONTRACT (quadro 4): a barra, o painel de 70 vh que rola sozinho (a pinca so nele: touch-action pan-x pan-y), as paginas como canvas na largura do painel × zoom ===== */
.jv-contract{display:flex;flex-direction:column;gap:8px;font-family:Archivo,sans-serif}
.jv-cbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap} .jv-cpage{font-size:13px;font-weight:600;white-space:nowrap}
.jv-cz{width:40px;height:36px;margin:0;padding:0;border:1px solid var(--line);background:#fff;border-radius:10px;font:700 18px/1 Archivo,sans-serif;color:var(--accent);cursor:pointer;touch-action:manipulation} .jv-cz[disabled]{opacity:.4;cursor:default}
.jv-czlabel{min-width:48px;text-align:center;font-size:13px;font-weight:600}
.jv-copen{display:inline-flex;align-items:center;text-decoration:none}
.jv-cpanel{height:70vh;min-height:320px;overflow:auto;border:1px solid var(--line);border-radius:12px;background:#e9ecf1;padding:8px;touch-action:pan-x pan-y;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.jv-cpages{display:flex;flex-direction:column;gap:8px;width:max-content;transform-origin:0 0;transform:scale(var(--jv-czoom,1))}
.jv-cpg{display:block;width:var(--jv-cw);height:auto;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.15)} .jv-cimg{display:block;width:var(--jv-cw);height:auto;background:#fff}
/* v379 — a aba $ travada (a PO confirmada) e a nota da PO aberta */
.jv-olock{display:flex;flex-direction:column;gap:8px;align-items:flex-start;font-family:Archivo,sans-serif} .jv-olocknote{font-weight:600} .jv-ponote{color:var(--accent);font-weight:600}
/* v387 — o bloco Finish measure (M1, M3) no fim da aba Measure */
.jv-finish{display:flex;flex-direction:column;gap:8px;padding:12px 0 4px;border-top:1px solid var(--line);font-family:Archivo,sans-serif} .jv-fsend{width:100%} .jv-finish .jv-hint[hidden]{display:none}
/* v467 (esboco 3 do relatorio do Finish, S1): "Group lines by" — Floor · Wall · Room · All together, acima do botao (telefone e PC); a escolhida em azul cheio */
.jv-fgroup{display:flex;flex-direction:column;gap:6px;margin-top:2px} .jv-fgroup small{font-size:13px;color:var(--ink2)}
.jv-fseg{display:flex;border:1.5px solid var(--accent);border-radius:12px;overflow:hidden;background:#fff}
.jv-fseg button{flex:1 1 0;min-width:0;min-height:44px;margin:0;padding:0 4px;border:none;border-right:1px solid var(--line);border-radius:0;background:#fff;font:500 15px/1.15 Archivo,sans-serif;color:var(--ink);cursor:pointer;touch-action:manipulation}
.jv-fseg button:last-child{flex-grow:1.25;border-right:none} .jv-fseg button[aria-pressed="true"]{background:var(--accent);color:var(--on-acc);font-weight:700} .jv-fseg button[disabled]{cursor:default;opacity:.6}
/* v383 — o bloco Sent (R2): os issues ja enviados, so leitura, com a caixa da foto sem Edit/Delete */
.jv-sent{display:flex;flex-direction:column;gap:10px} .jv-sent[hidden]{display:none} .jv-slist{display:flex;flex-direction:column;gap:10px} .jv-sentissue{background:var(--soft)} .jv-stext{margin:0;font-size:13px;color:var(--ink2)} .jv-sentphoto{flex:1;min-width:0}
/* v381 — a caixa com a foto (F1-F2): a foto preenche o slot, o rotulo no canto, Edit e Delete por cima num toque */
.jv-slot{position:relative} .jv-pbox{flex:1;position:relative;min-height:96px;border-radius:10px;overflow:hidden;background:#000;cursor:pointer;touch-action:manipulation} .jv-pbox[hidden]{display:none}
.jv-pimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
/* v472: so o rotulo DA FOTO (.jv-pbox) vai para o canto — sem o escopo, a etiqueta do produto da aba $ (a mesma classe, linha .jv-ptag acima) saia do cartao */
.jv-pbox .jv-ptag{position:absolute;left:6px;bottom:6px;padding:2px 7px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;font:700 11px Archivo,sans-serif}
.jv-pacts{position:absolute;inset:0;display:flex;flex-wrap:wrap;align-content:center;align-items:center;justify-content:center;gap:8px;padding:6px;background:rgba(0,0,0,.45)} /* v382: quebra linha na caixa estreita do recibo */ .jv-pacts[hidden]{display:none}
.jv-pact{border:0;border-radius:999px;padding:8px 12px;background:#fff;color:var(--ink);font:700 12px Archivo,sans-serif;cursor:pointer;touch-action:manipulation}
/* v489 — a despesa como CARTAO no fim da grade (esboco X1-X7 aprovado 09/10; antes v380/v487: um bloco solto). A secao reusa o olhar da .jv-psec;
   o cartao reusa .jv-product (largura toda); os campos com 16 px (o iPhone nao da zoom no foco); as miniaturas de 72 px na mesma caixa v382 */
.jv-expense{display:flex;flex-direction:column;gap:8px;padding:10px 0 4px;border-top:1px solid var(--line);font-family:Archivo,sans-serif}
.jv-xsec{padding:0 2px}
.jv-xcard{min-height:0;gap:8px}
.jv-xhint{color:var(--muted)}
.jv-xfield{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink2)} .jv-xfield input{height:36px;padding:0 10px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:16px;color:var(--ink);background:#fff}
.jv-xfield input[data-jv-xamount]{flex:0 0 120px;text-align:right;font-weight:600}
.jv-xfield input[data-jv-xdesc]{flex:1 1 auto;min-width:0}
.jv-xfield[hidden]{display:none}
.jv-xreceipts{display:flex;flex-wrap:wrap;gap:8px} .jv-xreceipts[hidden]{display:none}
.jv-xtile{flex:0 0 72px;width:72px;height:72px;min-height:0} /* v382: o recibo e' a mesma caixa da foto do issue (.jv-pbox) */
.jv-xmore{width:72px;height:72px;border:1.5px dashed #9a6a3a;color:#9a6a3a;border-radius:10px;background:transparent;font:700 12px/1.2 Archivo,sans-serif;cursor:pointer;touch-action:manipulation}
.jv-xadd{margin:auto 0 0;min-height:44px;border:1px solid #9a6a3a;background:transparent;border-radius:10px;font:700 14px/1 Archivo,sans-serif;color:#9a6a3a;cursor:pointer;touch-action:manipulation} /* classe propria, NAO .jv-padd: a medicao 93 pina .jv-padd no azul-accent da v472 */
.jv-xclear{min-height:36px;border:1px solid #b3433b;color:#b3433b;background:transparent;border-radius:10px;font:700 13px/1 Archivo,sans-serif;cursor:pointer;touch-action:manipulation}
/* J0 no telefone — o #mhead da tela JOB (layout-m.js poe .jvhead so nela): ‹ My jobs · bandeira · Home numa linha so (v481: o cliente centrado de 17 px saiu, e a regra dele tambem) */
#mhead.jvhead{flex-wrap:nowrap} #mhead.jvhead [data-myjobs]{margin-right:auto} /* v481: sem o nome no meio (ele crescia e empurrava), o ‹ Meus trabalhos empurra a bandeira e o Inicio para a direita */ #mhead.jvhead span:empty{display:none}
/* v536 (esboco "Layout PC e iPad", partes B C D — Rafael 13/10, D1 a): no PC e no iPad (a porta do Layout E, .jobview) a tela Job usa a largura toda (saiu o
   limite de 560 px do cartao, v365, e o de 840 px do .hubwrap).
   COLUNA (ate 1023 px — o iPad em pe): o cartao, a faixa das abas e o painel um embaixo do outro, cheios; a faixa azul e' um bloco arredondado na largura do
   cartao (o fundo de ponta a ponta da v425 fica so no telefone).
   PAINEL (1024 px ou mais — o iPad deitado e o PC): o cartao e as abas (em pe, uma por linha) no .jv-side, fixo a esquerda logo abaixo da barra unica (73 px =
   a barra de 61 + o respiro de 12); a aba aberta usa o resto. Os botoes ETA · IR · Ligar empilham icone e texto para o numero caber no painel.
   No telefone o .jv-side nao conta para o desenho (display:contents): o cartao e a faixa continuam como filhos do .jv, como antes */
.jv-side{display:contents}
.hubwrap.jobview{max-width:1680px;margin:0 auto}
.jobview .jv-strip{box-shadow:none;clip-path:none;border-radius:12px;padding:6px;margin-top:0;grid-auto-columns:minmax(0,1fr)}
@media (min-width:1024px){
  .jobview .jv{display:grid;grid-template-columns:var(--jv-side-w,360px) minmax(0,1fr);column-gap:16px;row-gap:10px;align-items:start}
  .jobview .jv-side{position:sticky;top:73px;grid-column:1;grid-row:1/span 2;display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 85px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
  .jobview .jv-pane{grid-column:2;grid-row:1;min-width:0}
  .jobview .jv-ver{grid-column:2;grid-row:2}
  .jobview .jv-strip{grid-auto-flow:row;grid-template-columns:minmax(0,1fr);grid-auto-columns:auto;gap:4px;overflow:visible}
  .jobview .jv-tab{flex-direction:row;justify-content:flex-start;gap:12px;min-height:46px;padding:0 14px;font:600 15px/1 Archivo,sans-serif} .jobview .jv-tab[aria-selected="true"]{font-weight:800}
  .jobview .jv-atx{max-width:100%;min-width:0}
}
@media (min-width:1024px) and (max-width:1279px){.jobview .jv{--jv-side-w:340px}}
/* v566 — o SPLIT VIEW da Windows list (esboco "Measure Split View", Rafael 14/10; D1 b: so com 1024 px ou mais, fora do telefone). v573: o Split view e' a
   3a parte do seletor House map | Windows list (esboco 2); escolhido: o cartao e as abas (.jv-side) recolhem (D2 a), a faixa P2 diz de quem e' o trabalho e os dois paineis (P3 P4) vao ate o fim
   da tela, cada um com a sua rolagem. --jv-sp-af / --jv-sp-bf = as larguras (a divisoria P7), --jv-sp-top = onde os paineis comecam (medido no ui.js) */
.jv-seg .jv-segico{width:17px;height:17px;margin-right:7px;vertical-align:-3px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round} /* v573: o Split view no seletor (E1 a); o botao de baixo saiu (E4 a) */
.jv-sprow{display:flex;align-items:center;gap:10px;min-height:40px;padding:0 2px}
.jv-spwho{font:800 17px/1.1 Archivo,sans-serif;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40%}
.jv-spkind{font:800 11px/1 Archivo,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);white-space:nowrap}
.jv-sprow .jv-spsum{flex:1;min-width:0;margin:0}
/* v768 (esboco "Split view com Fotos"): o .jv-sp e' uma fila de colunas (.jv-spcol) com as divisorias entre elas; a coluna empilhada tem 2 paineis e a divisoria
   deitada (.jv-spdivh). --jv-spf = a parte de cada coluna / painel (jvUiSpSizes); era --jv-sp-af / --jv-sp-bf (so A | B) */
.jv-sp{display:flex;height:calc(100vh - var(--jv-sp-top,150px));height:calc(100dvh - var(--jv-sp-top,150px));min-height:320px}
.jv-spcol{flex:var(--jv-spf,50) 1 0;min-width:0;min-height:0;display:flex;flex-direction:column}
.jv-spcol > .jv-spp{flex:var(--jv-spf,50) 1 0;container-type:inline-size} /* o painel estreito troca os nomes das abas pelos curtos e o Photos vira grade (@container abaixo) */
.jv-sp > .jv-spdiv{flex:0 0 12px}
.jv-spdiv.jv-spdivh{flex:0 0 12px;cursor:row-resize} .jv-spdiv.jv-spdivh i{width:44px;height:4px} /* .jv-spdiv.jv-spdivh: o .jv-spdiv (em pe) vem depois no arquivo */
.jv-spp{display:flex;flex-direction:column;min-width:0;min-height:0;border:1px solid var(--line);border-radius:12px;background:var(--jv-card,#fff);overflow:hidden}
.jv-sptabs{flex:none;display:flex;gap:2px;padding:4px 8px 0;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.jv-sptab{flex:none;display:inline-flex;align-items:center;gap:5px;min-height:40px;margin:0;padding:0 8px;border:0;border-bottom:3px solid transparent;border-radius:0;background:none;font:700 12.5px/1 Archivo,sans-serif;color:var(--ink2);cursor:pointer;white-space:nowrap}
.jv-sptab[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.jv-spdot{flex:none;width:6px;height:6px;border-radius:50%;background:var(--good)}
.jv-spb{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:8px 10px 12px;scrollbar-width:thin}
.jv-sptag{display:flex;justify-content:flex-end;margin:0 0 6px}
.jv-sptag span{font:700 10.5px/1 "Source Sans 3",sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border-radius:20px}
.jv-splive span{background:var(--jv-ok-bg,#e3f1e8);color:var(--jv-ok-tx,var(--good))}
.jv-sppdf span{background:var(--soft);color:var(--ink2)}
.jv-spbusy{margin:24px 8px;text-align:center}
.jv-spdiv{display:flex;align-items:center;justify-content:center;cursor:col-resize;touch-action:none}
.jv-spdiv i{width:4px;height:44px;border-radius:4px;background:var(--line)}
.jv-spdiv:hover i,.jv-spdiv:focus-visible i,.jv-spdiv.jv-spdrag i{background:var(--accent)}
.jv-spdiv:focus-visible{outline:none}
/* v567 — a 4a aba (o menu ▾ com as outras secoes do Send report) e a folha "como no PDF": branca como o papel em qualquer tema, na largura do PDF
   (8,2 in = 7,6 in de texto + 0,3 in de cada lado) e reduzida para caber no painel (--jv-sp-z, medido no index.js) */
.jv-spp{position:relative}
.jv-spmore{color:var(--accent);max-width:150px} .jv-spmore span{min-width:0;overflow:hidden;text-overflow:ellipsis} .jv-spmore svg{flex:none;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.jv-spmenu{position:absolute;top:46px;right:8px;z-index:6;display:flex;flex-direction:column;min-width:230px;max-width:calc(100% - 16px);max-height:calc(100% - 54px);overflow:auto;padding:6px;border:1px solid var(--line);border-radius:10px;background:var(--jv-card,#fff);box-shadow:0 8px 24px rgba(28,36,48,.18)}
.jv-spmenu[hidden]{display:none}
.jv-spmenu-h{margin:2px 8px 6px;font:700 10.5px/1.2 "Source Sans 3",sans-serif;letter-spacing:.07em;text-transform:uppercase;color:var(--ink2)}
.jv-spitem{margin:0;padding:8px 10px;border:0;border-radius:6px;background:none;text-align:left;font:600 13.5px/1.2 "Source Sans 3",sans-serif;color:var(--ink);cursor:pointer}
.jv-spitem:hover,.jv-spitem:focus-visible{background:var(--acc2,#e3edf7);outline:none} .jv-spitem[aria-checked="true"]{background:var(--acc2,#e3edf7);color:var(--accent)}
.jv-sppaper{display:block;box-sizing:border-box;width:8.2in;padding:.3in;margin:0 auto;background:#fff;color:#111;border:1px solid #e3e7ee;border-radius:3px;box-shadow:0 2px 8px rgba(28,36,48,.08);zoom:var(--jv-sp-z,1)}
/* v768 — o ▾ do Split view (D1 a), colado nele: aperta junto quando o Split esta ligado */
.jv-seg .jv-splay{flex:0 0 40px;display:flex;align-items:center;justify-content:center;padding:0;border-left:1px solid color-mix(in srgb,var(--line) 70%,transparent)} .jv-seg .jv-splay svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.jv-seg .jv-splay[aria-pressed="true"]{border-left-color:color-mix(in srgb,var(--jv-on-acc,#fff) 35%,transparent)} .jv-seg .jv-splay[aria-expanded="true"] svg{transform:rotate(180deg)}
/* o menu dos layouts (S2): preso abaixo do ▾ (o top e o right vem do ui.js), a grade das miniaturas 3 x 2 */
.jv-laymenu{position:fixed;z-index:40;width:min(440px,calc(100vw - 16px));display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--jv-card,#fff);box-shadow:0 12px 32px rgba(28,36,48,.22)}
.jv-laymenu[hidden]{display:none} .jv-laymenu .jv-spmenu-h{margin:0 2px}
.jv-laygrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.jv-laytile{display:flex;flex-direction:column;gap:6px;margin:0;padding:6px;border:0;border-radius:8px;background:none;cursor:pointer;font:700 12px/1.2 Archivo,sans-serif;color:var(--ink);text-align:center}
.jv-laytile:hover,.jv-laytile:focus-visible{background:var(--acc2,#e3edf7);outline:none}
.jv-laythumb{display:grid;gap:3px;aspect-ratio:16/10;padding:3px;border:1px solid var(--line);border-radius:6px;background:var(--soft,#f2f4f7)}
.jv-laytile[aria-checked="true"] .jv-laythumb{outline:3px solid var(--accent);outline-offset:1px}
.jv-laycell{display:grid;place-items:center;min-width:0;min-height:0;overflow:hidden;border:1.5px solid;border-radius:3px;font:800 8.5px/1 Archivo,sans-serif;letter-spacing:.04em;text-transform:uppercase}
.jv-lay-map{color:#2f7d4f;border-color:#2f7d4f;background:color-mix(in srgb,#2f7d4f 14%,var(--jv-card,#fff))}
.jv-lay-list{color:#2f62b8;border-color:#2f62b8;background:color-mix(in srgb,#2f62b8 14%,var(--jv-card,#fff))}
.jv-lay-photo{color:#a86a12;border-color:#a86a12;background:color-mix(in srgb,#a86a12 14%,var(--jv-card,#fff))}
.jv-layfoot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;border-top:1px solid var(--line);font:600 12.5px/1.3 "Source Sans 3",sans-serif;color:var(--ink2)}
.jv-layreset{margin:0;padding:6px 8px;border:0;border-radius:6px;background:none;font:700 12.5px/1 Archivo,sans-serif;color:var(--accent);cursor:pointer} .jv-layreset:hover{background:var(--acc2,#e3edf7)}
/* o painel estreito: os nomes curtos das abas (data-short = Map · Lines · Combined) */
@container (max-width:520px){ .jv-sptab[data-short] [data-jv-sptab-t]{display:none} .jv-sptab[data-short]::after{content:attr(data-short)} .jv-sptab{padding:0 6px} }
/* v768 — o painel PHOTOS (D4 a): a foto escolhida grande (contain, fundo escuro como o visualizador), ‹ › e a posicao; a grade da aba Photos deitada numa tira */
.jv-spph{display:flex;flex-direction:column} .jv-spph .jv-photos{flex:1;min-height:0} .jv-spph .jv-rhead{flex-wrap:wrap;row-gap:6px}
.jv-spstage{position:relative;flex:1;min-height:100px;border-radius:10px;overflow:hidden;background:#15191f}
.jv-spsopen{position:absolute;inset:0;margin:0;padding:0;border:0;background:none;cursor:zoom-in} .jv-spsopen img{display:block;width:100%;height:100%;object-fit:contain}
.jv-spsnav{position:absolute;top:50%;translate:0 -50%;width:36px;height:36px;margin:0;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:#1c2430;font:700 22px/1 Archivo,sans-serif;cursor:pointer;box-shadow:0 1px 6px rgba(0,0,0,.3)}
.jv-spsprev{left:8px} .jv-spsnext{right:8px} .jv-spsnav:disabled{opacity:0;pointer-events:none}
.jv-spspos{position:absolute;left:8px;bottom:8px;padding:4px 7px;border-radius:5px;background:rgba(255,255,255,.92);color:#1c2430;font:700 11.5px/1 Archivo,sans-serif}
.jv-spph .jv-phgrid{flex:none;display:flex;gap:6px;overflow-x:auto;padding:2px 2px 4px;scrollbar-width:thin}
.jv-spph .jv-phtile{flex:0 0 76px} .jv-spph .jv-phtile figcaption{display:none} .jv-spph .jv-phdl{width:26px;height:26px;margin:4px} .jv-spph .jv-phdl svg{width:15px;height:15px} /* v773: a ↓ menor na fita do Split */
.jv-spph .jv-phtile[aria-current="true"] img{outline:3px solid var(--accent);outline-offset:1px}
@container (max-width:360px){ .jv-spstage{display:none} .jv-spph .jv-photos{flex:none} .jv-spph .jv-phgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible} .jv-spph .jv-phtile{flex:none} .jv-spph .jv-phtile[aria-current="true"] img{outline:none} }
@media (min-width:1024px){
  body[data-jvsplit] .jobview .jv{grid-template-columns:minmax(0,1fr)}
  body[data-jvsplit] .jobview .jv-side,body[data-jvsplit] .jobview .jv-ver{display:none}
  body[data-jvsplit] .jobview .jv-pane{grid-column:1}
}
/* v392 — a aba Info: a descricao da tarefa em cima (linha por linha), a Material list enxuta colada no fim da tela (--jv-fill vem do jvUiInfoFill) */
/* v794 (esboco "Info: sem buraco", I4, aprovado 30/10): a lista nao fica mais colada no fim da tela (o buraco do PC) — os cartoes um embaixo do outro;
   com 720 px ou mais, em 2 colunas (Description | Ordered em cima, Job facts | Material list embaixo), cada um com a altura do que mostra */
.jv-info{container:jvinfo / inline-size} .jv-igrid{display:flex;flex-direction:column;gap:12px}
@container jvinfo (min-width:720px){ .jv-igrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start} }
.jv-desc{margin:0;white-space:pre-line;font-size:13.5px;line-height:1.5;color:var(--ink);overflow-wrap:anywhere}

.jv-buytable{width:100%;border-collapse:collapse;font-size:12.5px} .jv-buytable th{font-size:10.5px} .jv-buytable td{vertical-align:top} .jv-buytable td.n{white-space:nowrap}
.jv-swatch{display:inline-block;width:11px;height:11px;border-radius:2px;border:1px solid rgba(0,0,0,.3);vertical-align:-1px;margin-right:4px;background:var(--jv-hex,transparent)}
/* v399 — a fita metrica na linha do mapa/lista (so em trabalho de medida) e o Show client na lista de janelas */
.jv-seg .jv-tape{flex:0 0 56px;border-left:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--accent)} .jv-seg .jv-tape svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.jv-clientrow{text-align:right;margin:-4px 2px 0}
/* v657 — o Photo Measure ao lado da fita (a mesma porta do botao da aba Photos) */
.jv-seg button[data-jv-sub]{padding-left:8px;padding-right:8px} /* com o 3o icone, o recuo de 14 px quebrava "Windows list" em duas linhas no telefone de 390 (o texto e' centrado: no PC nada muda) */
.jv-seg .jv-pzbtn{flex:0 0 52px;border-left:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--accent)} .jv-seg .jv-pzbtn svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* v419 — o livro ao lado da fita e o texto dele; o mapa e a lista sem os textos explicativos (estao no livro); as cores e os limites na Material */
.jv-seg .jv-book{flex:0 0 52px;border-left:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--accent);background:var(--jv-card,#fff)}
.jv-seg .jv-book svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.jv-seg .jv-book[aria-expanded="true"]{background:var(--acc2,#e8f0fb)}
.jv-guide{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;font-size:13.5px;line-height:1.45;color:var(--ink)} .jv-guide[hidden]{display:none}
.jv-guide .jv-gp{margin:0 0 6px} .jv-guide .jv-gp:last-child{margin:0}
body[data-jvmeasure] [data-blk="map"]>h2,body[data-jvmeasure] #map-out>.mapbar>.note,body[data-jvmeasure] #map-out>.note,body[data-jvmeasure] #map-out>.maptray>b:first-child,body[data-jvmeasure] #map-out .rsbar .note{display:none}
body[data-jvlist] [data-blk="lines"] #pickers,body[data-jvlist] [data-blk="lines"] .toolrow,body[data-jvlist] [data-blk="lines"]>h2,body[data-jvlist] [data-blk="lines"]>.info,body[data-jvlist] #sections .total .note{display:none}
.jv-jobdef{border:1px solid var(--line);border-radius:12px;padding:10px;background:#fff;display:flex;flex-direction:column;gap:8px}
.jv-jobdef-h{margin:0;font:800 13px/1.2 Archivo,sans-serif;text-transform:uppercase;letter-spacing:.04em;color:var(--ink2)}
/* v426 — a lista de janelas no telefone, opcao A do esboco 2: linhas (nao cartoes), a medida grande, o resto em cinza; a tabela fica no PC */
body[data-phone][data-jvlist] #sections{display:none}
.jv-lines{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.jv-lines-h{display:flex;align-items:baseline;gap:8px;margin:0;padding:12px 4px 6px;border-bottom:1px solid var(--line);font:800 12px/1.2 Archivo,sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--ink2)}
.jv-lines-h small{font:600 12px/1.2 "Source Sans 3",sans-serif;text-transform:none;letter-spacing:0;color:var(--muted)}
.jv-lwarn{margin-left:auto;font:700 12px/1.2 "Source Sans 3",sans-serif;text-transform:none;letter-spacing:0;color:#b45309;border:1px solid #f1d29a;background:#fff8ea;border-radius:999px;padding:3px 10px;min-height:0;cursor:pointer} /* min-height 0: vence o botao de 44 px do telefone */
.jv-lwarn[aria-pressed="true"]{background:#b45309;border-color:#b45309;color:#fff}
.jv-onlyoff .jv-lrw:not([data-jv-off]){display:none}
/* v501 (R1 R2): o cartao e a lixeira lado a lado; a linha de baixo passa do cartao para o par */
.jv-lrw{display:flex;align-items:center;min-height:58px;border-bottom:1px solid var(--line)}
.jv-lrw>.jv-lr{flex:1 1 auto;min-width:0;border-bottom:0}
.jv-ldel{flex:0 0 44px;width:44px;height:44px;margin:0 2px 0 4px;padding:0;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--bad);cursor:pointer;touch-action:manipulation}
.jv-ldel svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.jv-lrw.jv-asking>.jv-lr,.jv-lrw.jv-asking>.jv-ldel,.jv-lrw.jv-asking>.jv-ldup{display:none}
/* v738 — o modo Reorder: a faixa acima dos cartoes (a dica a esquerda, o botao a direita); no modo o ⧉ e a lixeira somem e a alca ⋮⋮ (44 px, o
   dedo arrasta sem rolar a pagina) fica no lugar deles; o cartao que esta indo fica apagado e uma barra azul mostra onde ele cai */
.jv-lreord{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:6px 2px;border-bottom:1px solid var(--line)}
.jv-lreord-h{flex:1 1 auto;min-width:0;color:var(--ink2);font-size:13px}
.jv-lreord-b{flex:none;min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--accent,#1f5c99);font:inherit;font-weight:700;font-size:14px;cursor:pointer;touch-action:manipulation}
.jv-lreord-b[aria-pressed="true"]{background:var(--accent,#1f5c99);border-color:var(--accent,#1f5c99);color:#fff}
.jv-lreord-b i{font-style:normal}
.jv-reord .jv-lrw>.jv-ldup,.jv-reord .jv-lrw>.jv-ldel{display:none}
.jv-reord .jv-lr{cursor:default}
.jv-lgrip{flex:0 0 44px;width:44px;height:44px;margin:0 2px 0 4px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;color:var(--accent,#1f5c99);font-size:18px;letter-spacing:-3px;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}
.jv-lgrip[hidden]{display:none}
/* v740: o cartao que vai levanta (sombra, moldura) e segue o dedo; os outros abrem o espaco (o .ldrop-slot e o .ldragging moram no shell.css) */
.jv-lrw.ldrag{position:relative;z-index:5;background:var(--panel,#fff);border-radius:12px;box-shadow:0 0 0 2px var(--accent,#1f5c99),0 12px 26px rgba(0,0,0,.25)}
.jv-lrw.ldrag>.jv-lr{background:transparent}
/* v518: o duplicar, do tamanho da lixeira, a esquerda dela; a copia nova pisca 2 s */
.jv-ldup{flex:0 0 44px;width:44px;height:44px;margin:0 0 0 4px;padding:0;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--accent,#1f5c99);cursor:pointer;touch-action:manipulation}
.jv-ldup svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.jv-lrw.jv-lnew>.jv-lr{animation:jv-lnew 2s ease-out}
@keyframes jv-lnew{0%,40%{background:#fff3c4}100%{background:#fff}}
.jv-ldq{flex:1 1 auto;display:flex;align-items:center;gap:8px;min-height:58px;padding:6px 4px 6px 10px;background:#fdecea;border-left:4px solid #b3261e} /* a pergunta em cores fixas, clara em todo tema: e' um aviso */
.jv-ldq-t{flex:1 1 auto;min-width:0;font:700 15px/1.25 "Source Sans 3",sans-serif;color:#8c1d18}
.jv-ldq button{flex:none;min-height:44px;padding:0 14px;border-radius:10px;font:700 14px/1 Archivo,sans-serif;cursor:pointer;touch-action:manipulation}
.jv-ldq-no{border:1px solid #d0d5dd;background:#fff;color:#1d2433}
.jv-ldq-yes{border:1px solid #b3261e;background:#b3261e;color:#fff}
/* a lixeira e os dois botoes vencem o 'button' generico do theme.css (o mesmo :not(#sheetload) da v474 e da v481): sem isto o HUD e o Holo pintavam o Cancel de --panel transparente com a tinta clara, sobre o rosa */
body:is([data-theme]) .jv .jv-lrw button.jv-ldel[data-jv-ldel]:not(#sheetload){background:transparent;color:var(--bad);border-color:var(--line)}
body:is([data-theme]) .jv .jv-lrw button.jv-ldup[data-jv-ldup]:not(#sheetload){background:transparent;color:var(--accent,#1f5c99);border-color:var(--line)}
body:is([data-theme]) .jv .jv-lrw .jv-ldq[data-jv-ldq] button.jv-ldq-no:not(#sheetload){background:#fff;color:#1d2433;border-color:#d0d5dd}
body:is([data-theme]) .jv .jv-lrw .jv-ldq[data-jv-ldq] button.jv-ldq-yes:not(#sheetload){background:#b3261e;color:#fff;border-color:#b3261e}
.jv-lr{display:grid;grid-template-columns:24px 32px minmax(0,1fr) auto;gap:0 10px;align-items:center;width:100%;min-height:58px;margin:0;padding:8px 4px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;touch-action:manipulation}
.jv-lr:active{background:var(--acc2,#eef4fb)}
.jv-lr-n{font:700 14px/1 Archivo,sans-serif;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
.jv-lr-ic{display:flex;align-items:center;justify-content:center} .jv-lr-ic svg{max-width:32px;max-height:44px;height:auto}
.jv-lr-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.jv-lr-s{font:800 19px/1.2 Archivo,sans-serif;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.jv-lr-temp{font:800 10px/16px Archivo,sans-serif;font-style:normal;letter-spacing:.04em;color:#fff;background:#c62828;border-radius:4px;padding:0 5px;vertical-align:3px}
.jv-lr-l2{display:flex;align-items:center;gap:8px;min-width:0}
.jv-lr-meta{flex:1 1 auto;min-width:0;font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jv-lr-ico{flex:none;font-size:12px;color:var(--muted);white-space:nowrap}
.jv-lr-q{font:800 15px/1 Archivo,sans-serif;color:var(--ink2);font-variant-numeric:tabular-nums;align-self:start;padding-top:4px}
.jv-lines-tot{margin:0;padding:10px 4px 0;display:flex;justify-content:space-between;font-size:14px;color:var(--ink2)} .jv-lines-tot b{font-family:Archivo,sans-serif}
.jv-lines-tot .jv-ltc{flex:1;margin-left:8px;font-size:13px;color:var(--muted)} .jv-lines-tot .jv-ltc[hidden]{display:none} .jv-lines-tot b{order:2}
/* v789 (esboco "Measure: medido × contrato", M1–M4): a faixa em cima da Windows list — os quadros (o numero medido / o do contrato, e o estado: laranja =
   falta, verde = ok, vermelho = a mais), o aviso com os + Add e os chips. Cores fixas, claro em todo tema (como os cartoes da lista); os botoes no peso
   :not(#sheetload) contra o 'button' generico dos temas e o de 44 px do telefone */
.jv-tally{display:flex;flex-direction:column;gap:8px;margin:0 0 10px;color:#1d2433;container:jvtl / inline-size}
/* v793 (esboco "Measure: contagem por estilo", C1–C5): a tabela de contagem — uma linha por estilo, as colunas Without grids · With grids · Total (cada
   celula "medido / contrato": laranja com ▾ quando falta, vermelho com ▴ quando passa), o ponto da linha, o Total embaixo, o + Add na linha (tabela larga)
   ou sob o Total (estreita, 44 px). Cores fixas, claro em todo tema */
.jv-tl-box{border:1px solid #d3d9e2;border-radius:12px;background:#fff;overflow:hidden}
.jv-tl-cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0;padding:8px 12px;border-bottom:1px solid #eceef2;font-size:13px;color:#5f6b7d}
.jv-tl-cap b{font:700 15px/1.2 Archivo,sans-serif;color:#1d2433;font-variant-numeric:tabular-nums} .jv-tl-sub:empty{display:none}
.jv-tl-none[hidden]{display:none}
.jv-tl-st{margin-left:auto;font-weight:700} .jv-tl-st[data-state="short"]{color:#9a4a00} .jv-tl-st[data-state="over"]{color:#b3261e} .jv-tl-st[data-state="ok"]{color:#1a6b3c}
.jv-tl-tbl{display:flex;flex-direction:column}
.jv-tlr{display:grid;grid-template-columns:minmax(0,1fr) 62px 62px 62px;gap:6px;align-items:center;min-height:44px;padding:0 8px;border-bottom:1px solid #eceef2;font-variant-numeric:tabular-nums;cursor:pointer}
.jv-tlr-h,.jv-tlr-g{min-height:26px;cursor:default;background:#f4f6f9;font:700 10.5px/1.2 Archivo,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:#5f6b7d}
.jv-tlr-g>span{grid-column:1 / -1}
.jv-tlr-n{text-align:right;white-space:nowrap;font-size:14px} .jv-tlr-n b{font:700 14px/1.2 Archivo,sans-serif} .jv-tlr-n i{font-style:normal;color:#5f6b7d;font-size:12.5px}
.jv-tlr-n[data-state="short"] b,.jv-tlr-n[data-state="short"] i{color:#9a4a00} .jv-tlr-n[data-state="short"] b::before{content:"▾ ";font-size:10px}
.jv-tlr-n[data-state="over"] b,.jv-tlr-n[data-state="over"] i{color:#b3261e} .jv-tlr-n[data-state="over"] b::before{content:"▴ ";font-size:10px}
.jv-tlr-a{display:none}
.jv-tlh-l{display:none}
body .jv-tally button.jv-tlr-s.jv-tlr-s[data-jv-tlst]:not(#sheetload){display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:0;min-width:0;min-height:44px;margin:0;padding:2px 0;border:0;border-radius:0;background:transparent;color:#1d2433;font:inherit;text-align:left;box-shadow:none;cursor:pointer;position:relative;padding-left:14px}
.jv-tlr-s b{font:700 14px/1.2 Archivo,sans-serif} .jv-tlr-s small{max-width:100%;font-size:11.5px;line-height:1.25;color:#5f6b7d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jv-tl-dot{position:absolute;left:0;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:transparent}
.jv-tlr[data-state="short"] .jv-tl-dot,.jv-tlr[data-state="diff"] .jv-tl-dot{background:#c2730a} .jv-tlr[data-state="over"] .jv-tl-dot{background:#b3261e} .jv-tlr[data-state="ok"] .jv-tl-dot{background:#1a6b3c}
.jv-tlr.jv-tlr-on{background:#e8eef7;box-shadow:inset 3px 0 0 #2c4a78}
.jv-tlr-tot{background:#f4f6f9;border-bottom:0} .jv-tlr-tot .jv-tl-dot{display:none}
.jv-tl-nogr .jv-tlg{display:none} .jv-tl-nogr .jv-tlr{grid-template-columns:minmax(0,1fr) 72px} .jv-tl-nogr .jv-tlr-h>span:first-child{grid-column:1}
.jv-tl-adds{display:flex;flex-wrap:wrap;gap:6px;padding:8px} .jv-tl-adds:empty{display:none}
body .jv-tally button.jv-tladd.jv-tladd[data-jv-tladd]:not(#sheetload){min-height:44px;margin:0;padding:0 14px;border:1.5px solid #8a4a06;border-radius:10px;background:#fff;color:#8a4a06;font:700 14px/1 Archivo,sans-serif;box-shadow:none;cursor:pointer;touch-action:manipulation;white-space:nowrap}
body .jv-tally button.jv-tl-more.jv-tl-more[data-jv-tlmore]:not(#sheetload){display:block;width:100%;min-height:40px;margin:0;padding:0 12px;border:0;border-top:1px solid #eceef2;border-radius:0;background:#fff;color:#2c4a78;font:700 13px/1 Archivo,sans-serif;text-align:left;box-shadow:none;cursor:pointer}
body .jv-tally button.jv-tl-more.jv-tl-more[data-jv-tlmore][hidden]:not(#sheetload){display:none}
/* a tabela larga (PC, iPad deitado, o painel do Split): os nomes inteiros, o + Add na propria linha, a linha mais baixa */
@container jvtl (min-width:640px){
  .jv-tlr{grid-template-columns:minmax(0,1fr) 110px 110px 110px 100px;gap:10px;min-height:34px;padding:0 12px}
  .jv-tl-nogr .jv-tlr{grid-template-columns:minmax(0,1fr) 110px 100px}
  .jv-tlr-a{display:block;justify-self:end} .jv-tlh-l{display:inline} .jv-tlh-s{display:none}
  body .jv-tally button.jv-tlr-s.jv-tlr-s[data-jv-tlst]:not(#sheetload){flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;min-height:34px}
  body .jv-tally .jv-tlr-a button.jv-tladd.jv-tladd[data-jv-tladd]:not(#sheetload){min-height:28px;padding:0 9px;border-radius:7px;font-size:12px;border-width:1px}
  .jv-tl-adds{display:none}
}
/* C1: a linha de comando — Detailed | Combined, os chips e o Show client (a direita); estreita: os chips na linha de baixo */
.jv-tl-cmd{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 8px} .jv-tl-cmd>.jv-lvseg{margin:0} .jv-tl-cmd>.jv-clientrow{margin:0 0 0 auto}
body[data-phone] .jv-tl-cmd>.jv-tl-chips{order:3;flex-basis:100%}
[data-jv-sum][hidden]{display:none}
.jv-tl-chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
body button.jv-tlc.jv-tlc[data-jv-tlf]:not(#sheetload){flex:none;display:inline-flex;align-items:center;gap:6px;min-height:36px;margin:0;padding:0 12px;border:1px solid #c9d0db;border-radius:9px;background:#fff;color:#1d2433;font:600 13px/1 "Source Sans 3",sans-serif;box-shadow:none;cursor:pointer;touch-action:manipulation}
body button.jv-tlc.jv-tlc[data-jv-tlf][aria-pressed="true"]:not(#sheetload){border-color:#2c4a78;background:#e8eef7;color:#2c4a78}
body button.jv-tlc.jv-tlc[data-jv-tlf]:disabled:not(#sheetload){opacity:.5;cursor:default}
.jv-tlc b{font:800 13px/1 Archivo,sans-serif;font-variant-numeric:tabular-nums}
.jv-tl-show{margin:0;font-size:13px;font-weight:600;color:#2c4a78} .jv-tl-show[hidden]{display:none}
body .jv-tally button.jv-tl-ct.jv-tl-ct[data-jv-tlct]:not(#sheetload){display:inline;min-height:0;margin:0;padding:6px 2px;border:0;background:transparent;color:#2c4a78;font:700 13px/1 Archivo,sans-serif;box-shadow:none;cursor:pointer}
.jv-tl-cmd button:focus-visible,.jv-tally button:focus-visible{outline:2px solid #2c4a78;outline-offset:1px}
.ltc{font-weight:600;color:var(--muted)} .ltc:empty{display:none}
/* v790 (M2, D2): as linhas fora do filtro (o cartao do telefone e a linha da tabela do PC) e o selo do grupo, que o chip substitui */
.jv-lrw[hidden],tr[data-lrow][hidden],button.jv-lwarn[hidden]{display:none!important}
/* v424 — Detalhado | Combinado p/ pedido na lista de janelas */
.jv-lvseg{display:flex;width:max-content;max-width:100%;margin:0 0 10px}
/* v425 (Rafael escolheu no esboco: "faixa azul da 1 e cards do 3") — a barra de abas e' uma faixa azul de ponta a ponta (o fundo passa da margem da
   pagina pelo box-shadow + clip-path, sem saber o tamanho da margem); as abas em azul claro, a ativa num botao branco. Ela separa o cabecalho do trabalho
   (cartao, ETA / IR) do conteudo da aba. Na Info, cada bloco e' um cartao tingido sem borda, com o titulo na cor dele: azul = do cliente, laranja = material. */
.jv-strip{background:var(--paper);border-bottom:none;padding:6px 0;margin-top:6px} /* v749: a faixa azul de ponta a ponta (v425) saiu — ver o bloco v749 no fim do arquivo */
/* v464 (Rafael 05/10: "so essa linha azul saindo das bordas") — no PC o .page e' um cartao no meio da tela e nada cortava a sombra
   de 100vmax: a faixa atravessava a tela inteira. A pagina que tem a faixa corta o que passa da borda dela (overflow-x:clip nao cria
   area de rolagem, entao position:sticky continua valendo). No telefone o shell.css ja corta (.page{overflow-x:hidden}): nada muda la. */
.page:has(.jv-strip){overflow-x:clip}
.jv .jv-strip .jv-tab:not(#sheetload):not(#jv-x){color:var(--ink2);background:transparent} .jv .jv-strip .jv-tab[aria-selected="true"]:not(#sheetload):not(#jv-x){color:var(--accent);background:var(--acc2)} /* v749: a aba aberta num fundo azul claro. Os dois :not(#…) = 2 ids: vencem o 'button' generico dos temas escuros do theme.css (1 id e 5 classes — eram botoes escuros numa faixa azul clara) */
.jv-icard{border-radius:12px;padding:10px 12px;background:var(--jv-ict-bg);color:var(--ink)}
.jv-ict{margin:0 0 6px;font:800 11px/1.2 Archivo,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--jv-ict-c)}
.jv-icard-desc{--jv-ict-bg:#eaf2fa;--jv-ict-c:var(--accent)}
.jv-icard-mat{--jv-ict-bg:#fdf3e7;--jv-ict-c:#b45309}
/* v795 (esboco "Info: sem buraco", I3): os fatos do trabalho — nome em cinza, valor em negrito, o que falta em laranja; o Open CHECK › embaixo */
.jv-icard-facts{--jv-ict-bg:#f1f3f6;--jv-ict-c:var(--ink2)}
/* v796 (esboco "Info: sem buraco", I1 + I2): as linhas da descricao lidas como pedido (sublinhadas) e o cartao Ordered in the description — Style · Ordered ·
   Measured · Grids, o Measured laranja quando falta e vermelho quando passa, o Total, o aviso e o Use as the contract */
.jv-desc .jv-dline.jv-dord{text-decoration:underline 2px var(--accent);text-underline-offset:3px;font-weight:600}
.jv-dnote{margin:6px 0 0;font-size:12px;color:var(--muted)} .jv-dnote[hidden]{display:none}
.jv-icard-ord{--jv-ict-bg:#f1f3f6;--jv-ict-c:var(--ink2)}
.jv-ordh{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 10px} .jv-ords{font:700 13px/1.2 Archivo,sans-serif} .jv-ords[data-state="ok"]{color:#1a6b3c} .jv-ords[data-state="short"]{color:#9a4a00} .jv-ords[data-state="over"]{color:#b3261e}
.jv-ordt{display:flex;flex-direction:column;margin-top:6px;font-size:13px;font-variant-numeric:tabular-nums}
.jv-ordr{display:grid;grid-template-columns:minmax(0,1fr) 64px 72px minmax(0,1.1fr);gap:8px;align-items:center;min-height:30px;border-bottom:1px solid rgba(0,0,0,.08)}
.jv-ordr-h{min-height:22px;font:700 10.5px/1.2 Archivo,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.jv-ordr .n{text-align:right} .jv-ordr b{font-family:Archivo,sans-serif} .jv-ordg{color:var(--muted)}
.jv-ordr [data-state="short"]{color:#9a4a00;font-weight:700} .jv-ordr [data-state="over"]{color:#b3261e;font-weight:700}
.jv-ordr-tot{font-weight:700;border-bottom:0}
.jv-ordn{margin:6px 0 0;font-size:12.5px;color:var(--muted)} .jv-ordn.jv-ordwarn{color:#9a4a00;font-weight:700}
body .jv-icard-ord button.jv-orduse.jv-orduse[data-jv-orduse]:not(#sheetload):not([hidden]){display:inline-flex;align-items:center;min-height:44px;margin:8px 0 0;padding:0 14px;border:1.5px solid var(--accent);border-radius:10px;background:#fff;color:var(--accent);font:700 14px/1 Archivo,sans-serif;box-shadow:none;cursor:pointer;touch-action:manipulation} body .jv-icard-ord button.jv-orduse[hidden]{display:none}
.jv-kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;margin:6px 0 0;font-size:13px} .jv-kvr{display:contents} .jv-kv dt{color:var(--muted)} .jv-kv dd{margin:0;font-weight:600;min-width:0;overflow-wrap:anywhere} .jv-kv dd.jv-kmiss{color:#9a4a00}
body .jv-icard-facts button.jv-fgo.jv-fgo[data-jv-fgo]:not(#sheetload):not([hidden]){display:inline-flex;align-items:center;min-height:44px;margin:6px 0 0;padding:0 2px;border:0;background:transparent;color:var(--accent);font:700 13px/1 Archivo,sans-serif;box-shadow:none;cursor:pointer} body .jv-icard-facts button.jv-fgo[hidden]{display:none}
.jv-icard-mat .jv-buytable th{background:transparent;color:#8a5a1c;border-bottom:1px solid rgba(180,83,9,.25)} .jv-icard-mat .jv-buytable td{border-bottom:1px solid rgba(180,83,9,.12)}
/* ===== v466 — a aba MATERIAL no telefone (esboco "Aba Material no telefone", opcao A; Rafael 2026-10-06 "aprovo os esbocos"). So existe com body[data-phone] e
   ate 640 px: o painel ganha .jv-mat (resultados); v499: a aba Escolhas e' .jv-mch (a folha Settings, .jv-mset, saiu). As medidas do telefone: texto 15 px, rotulo 13-14 px, tabela 14 px, botao 44 px,
   campo 16 px. As cores do "not chosen": tracejado #d9822b, texto #7a3b00, fundo #fde6cc; o numero laranja #b45309. O PC e o iPad nao tem estas classes. ===== */
/* os temas escuros (Classic dark, HUD night, Holo, Sketch dark — o mesmo grupo do theme.css) trocam so estas variaveis (conserto apos verificacao: os
   cartoes eram brancos com o texto claro do tema). Cada regra abaixo usa var(--jv-…, <a cor do esboco>): sem tema escuro vale a cor de antes, igual */
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]){--jv-card:var(--panel);--jv-head:var(--soft);--jv-foot:var(--soft);--jv-grp:var(--soft);
  --jv-rule:var(--line);--jv-barline:var(--line);--jv-dots:var(--line);--jv-sub:var(--ink2);--jv-sub2:var(--ink2);--jv-un-bg:#3a2e14;--jv-un-tx:var(--warn);--jv-on-acc:#0e1520;
  --jv-pend:var(--warn);--jv-mag:#f472b6;--jv-org:var(--warn);--jv-rz-bg:#1f3a2c;--jv-rzw-bg:#3a1f1f;--jv-rzw-tx:var(--bad);--jv-side-bg:#3a2e14;--jv-side-tx:var(--warn);
  --jv-sv-ink:var(--ink);--jv-sv-sub:var(--muted);--jv-sv-strip:var(--soft);--jv-sv-edge:var(--muted);--jv-sv-rip:var(--ink2);--jv-sv-ow:var(--paper);--jv-sv-mk:var(--muted);
  --jv-sv-of:#f9a8d4;--jv-sv-pc:var(--soft);--jv-sv-pcc:var(--soft);--jv-sv-un:#3a2e14;--jv-sv-unl:#b7790f;--jv-sv-ut:var(--warn);--jv-sv-brk:var(--paper);--jv-hx-bg:#3a1d2e;--jv-hx-ln:#e0559f;
  --jv-pon:var(--acc2);--jv-ptagbg:var(--soft);--jv-ok-bg:#1f3a2c;--jv-ok-tx:#86e0a5;--jv-ofoot:var(--dlg,var(--panel))} /* v474: a aba $ — o cartao aceso, a etiqueta e o rodape (opaco: o --dlg do tema, ou o --panel do Classic dark) */
body[data-theme="sketchdark"]{--jv-pon:var(--panel)} /* v474: no Sketch dark o --acc2 (#17393e) e' claro demais para o Remove vermelho (4,2:1, medicao 93); o cartao aceso fica no papel do tema, marcado pela borda e pelo − + */
#jv-mhx rect{fill:var(--jv-hx-bg,#fdf0f7)} #jv-mhx line{stroke:var(--jv-hx-ln,#d0217f)}
.jv-mdot{display:inline-block;width:12px;height:12px;border-radius:50%;border:1px solid #9aa1ab;background:var(--jv-hex,#fff);vertical-align:-1px;flex:none;box-sizing:border-box}
/* v497 T0: a barra das abas internas (Separar · Cortar · Caulk · Escolhas) — o .jv-seg de sempre, presa no topo ao rolar; o ponto amarelo em Escolhas. T1: o aviso amarelo */
.jv-mtabs{position:sticky;top:0;z-index:5;margin:0 0 10px}
/* o shell.css:299 corta o telefone com overflow-x:hidden no html e no body — o body vira area de rolagem que nunca rola e o sticky nao prende.
   clip corta igual sem criar area de rolagem (como o .page:has(.jv-strip) acima); so enquanto a barra existe */
html:has(body[data-phone] .jv-mtabs),body[data-phone]:has(.jv-mtabs){overflow-x:clip}
.jv-mtabs,.jv-mtabs button:not([aria-pressed="true"]){background:var(--jv-card,#fff);color:var(--ink)} .jv-mtabs button[aria-pressed="true"]{color:var(--jv-on-acc,#fff)} /* o --ink, mais forte que o --ink2 do .jv-seg (que desde a v497 tambem tem o fundo do cartao) */
.jv-mtabs button{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 4px} .jv-mtabs button+button{border-left:1px solid var(--line)}
.jv-mtabdot{width:8px;height:8px;border-radius:50%;background:#d9822b;flex:none}
.jv-mwarn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:44px;margin:0 0 10px;padding:8px 12px;border:1.5px solid #d9822b;border-radius:12px;background:var(--jv-un-bg,#fff8ef);color:var(--jv-un-tx,#7a3b00);font:600 15px/1.3 "Source Sans 3",sans-serif;text-align:left;cursor:pointer;touch-action:manipulation}
.jv-mwarn b{font:700 14px/1 Archivo,sans-serif;white-space:nowrap}
/* os resultados: o que foi para a aba Escolhas (ou e' desenhado de novo aqui) some do painel — menos dentro da propria Escolhas (.jv-mch, v499) */
.jv-mat .math:not(.jv-mch .math),.jv-mat [data-blk="install"]>h2,.jv-mat #trim-sec>.pick.sys,.jv-mat #trim-sec>.pick.sys+.info,.jv-mat #trim-sec>.lbl,.jv-mat #trim-colors:not(.jv-mch #trim-colors),.jv-mat #trim-colors+.info,
.jv-mat #t-buy,.jv-mat [data-blk="buy"]>h2>.tag,.jv-mat #t-util,.jv-mat #cut-visual,.jv-mat #t-cut,.jv-mat #t-caulk,.jv-mat #t-caulkcolor,.jv-mat #t-foam{display:none!important}
.jv-mat [data-blk="install"]:has(#trim-out[hidden]){display:none} /* sem peca de trim (coil wrap + interior none) a M7 nao aparece, como hoje */
.jv-mat [data-blk="buy"]>h2{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px}
.jv-mat [data-blk="buy"]>h2>.info{margin-left:auto}
.jv-mat [data-blk="buy"]>h2 .ipop{font:400 15px/1.45 "Source Sans 3","Segoe UI",Roboto,sans-serif;text-transform:none;letter-spacing:normal} /* conserto: o 📖 mora no titulo e herdava as maiusculas do h2 — o texto como nos outros 📖 */
/* v500 G1: o titulo "To bring" — o "Material list" de hoje fica no h2 com letra 0 (volta no PC); o 📖 pequeno ao lado, como na aba Escolhas (o alvo continua 44 px) */
.jv-mbuyh{font-size:0!important;gap:0 4px!important} .jv-mbuyt{font-size:12.5px}
.jv-mat [data-blk="buy"]>h2.jv-mbuyh>.info{margin-left:0}
.jv-mbuyh .ibtn{min-width:44px;min-height:36px;padding:0;border:0;border-radius:10px;background:none;font-size:0;line-height:1;color:var(--accent)}
.jv-mbuyh .ibtn::before{content:"📖";font-size:17px;opacity:.8}
.jv-mbuyh .ibtn[aria-expanded="true"]{background:var(--acc2)}
.jv-mfirst{margin:0 0 6px;font-weight:600}
.jv-mcard{border:1.5px solid var(--line);border-radius:12px;background:var(--jv-card,#fff)}
/* M2 */
.jv-mbuy{margin:0 0 10px}
.jv-mbr{display:flex;gap:10px;align-items:flex-start;padding:9px 11px;border-top:1px solid var(--jv-rule,#eceef1)} .jv-mbr:first-child{border-top:0}
.jv-mbn{flex:1;min-width:0;font:700 15px/1.3 "Source Sans 3",sans-serif}
.jv-mbs{display:block;font:400 13px/1.4 "Source Sans 3",sans-serif;color:var(--muted);margin-top:2px}
/* v500 G2: o nome da cor numa linha dela; G4: o 'For:' numa linha propria, na tinta normal */
.jv-mbc{display:block;margin-top:3px;font:600 14px/1.3 "Source Sans 3",sans-serif;color:var(--ink)}
.jv-mbfor{display:block;margin-top:3px;font:400 13.5px/1.35 "Source Sans 3",sans-serif;color:var(--ink)} .jv-mbfor i{font-style:normal;color:var(--muted)}
/* v500 B1-B4 (esboco-material-separar-amostra): a linha com cor pintada inteira na cor do material; o texto todo numa tinta so, escura ou branca pelo
   contraste (data-jv-on) — o detalhe e o 'For:' se separam pelo tamanho e pelo negrito, nao pelo cinza; o aviso vira etiqueta branca. Sem cor: como antes */
.jv-mbuy{overflow:hidden}
.jv-mbr[data-jv-on]{background:var(--jv-hex);border-top-color:rgba(0,0,0,.14)}
.jv-mbr[data-jv-on="l"]{color:#1d2433} .jv-mbr[data-jv-on="d"]{color:#fff}
.jv-mbr[data-jv-on] .jv-mbs,.jv-mbr[data-jv-on] .jv-mbc,.jv-mbr[data-jv-on] .jv-mbfor,.jv-mbr[data-jv-on] .jv-mbfor i{color:inherit}
.jv-mbr[data-jv-on] .jv-mbfor i{font-weight:700}
.jv-mbr[data-jv-on] .jv-mbpend{display:inline-block;margin:3px 0 1px;padding:0 6px;border:1px solid #e3a37e;border-radius:6px;background:#fff;color:#9a3412;font-size:12.5px}
/* v528 — o material usado (docs/odoo-material-contract.md §6.1): o cartao logo abaixo do To bring — M1 em cima, as linhas M2, o texto M3, o botao M4 ou a saida M5.
   O +/− e' o da aba $ (.jv-pstep, 44 px); o botao e' o .jv-send; os avisos usam as cores do aviso amarelo (.jv-mwarn: --jv-un-bg / --jv-un-tx) */
.jv-ux{margin:0 0 10px;padding:10px 11px 12px}
.jv-uxh{display:flex;flex-direction:column;gap:2px;padding-bottom:8px;border-bottom:1px solid var(--jv-rule,#eceef1)}
.jv-uxh b{font:800 16px/1.3 Archivo,sans-serif;color:var(--ink)}
.jv-uxm{display:flex;flex-wrap:wrap;gap:0 12px;font:600 14px/1.35 "Source Sans 3",sans-serif;color:var(--muted)}
.jv-uxwarn,.jv-uxw{color:var(--jv-un-tx,#7a3b00)}
.jv-uxwarn{display:block;margin-top:4px;padding:4px 9px;border:1.5px solid #d9822b;border-radius:8px;background:var(--jv-un-bg,#fff8ef);font:600 14px/1.35 "Source Sans 3",sans-serif}
.jv-uxr{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid var(--jv-rule,#eceef1)}
.jv-uxdot{width:14px;height:14px;border-radius:3px}
.jv-uxl{flex:1;min-width:0;font:700 15px/1.3 "Source Sans 3",sans-serif;color:var(--ink)}
.jv-uxw{display:block;margin-top:2px;font:600 13px/1.3 "Source Sans 3",sans-serif}
.jv-uxoff [data-jv-uxlab],.jv-uxoff .jv-uxp b,.jv-uxoff .jv-uxs b{color:var(--muted)}
.jv-uxp,.jv-uxu{display:flex;flex-direction:column;align-items:center;gap:2px;flex:none}
.jv-uxp i,.jv-uxu i{font:400 12.5px/1.2 "Source Sans 3",sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.jv-uxp b{min-width:28px;font:800 18px/44px Archivo,sans-serif;text-align:center;color:var(--ink)}
.jv-uxs{margin:0} .jv-uxs b{min-width:30px;font:800 18px/1 Archivo,sans-serif;text-align:center;color:var(--ink)}
.jv-uxs button:disabled,.jv-uxgo:disabled{opacity:.4;cursor:default}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-ux .jv-uxr .jv-pstep.jv-uxs button:is([data-jv-uxdec],[data-jv-uxinc]):not(#sheetload){background:var(--accent);border-color:var(--accent);color:var(--jv-on-acc)} /* o +/− no escuro, como o da aba $ (linha 141): o botao generico do tema (theme.css, 1 id + 5 classes) ganharia */
.jv-uxn{margin:8px 0 10px;font:400 14px/1.35 "Source Sans 3",sans-serif;color:var(--muted)}
.jv-uxgo{width:100%}
.jv-uxdone{margin:0;padding:10px 12px;border:1.5px solid var(--good);border-radius:10px;font:700 15px/1.35 "Source Sans 3",sans-serif;color:var(--good)}
.jv-uxdone.jv-uxwait{border-color:#d9822b;background:var(--jv-un-bg,#fff8ef);color:var(--jv-un-tx,#7a3b00)}
.jv-uxst{margin:6px 0 0;font:400 14px/1.35 "Source Sans 3",sans-serif;color:var(--muted)} .jv-uxst.jv-uxerr{color:var(--bad)}
.jv-mbpend{display:block;font:700 13px/1.4 "Source Sans 3",sans-serif;color:var(--jv-pend,#9a3412);margin-top:2px}
.jv-mbq{display:flex;flex-direction:column;align-items:flex-end;font:800 17px/1.25 Archivo,sans-serif;white-space:nowrap;text-align:right;padding-top:1px}
.jv-mempty{margin:0;padding:12px;font-size:14px;color:var(--muted)}
/* o 📖 da Material list: no telefone os 3 cartoes do coil ficam EMBAIXO da lista (no PC e no iPad, em cima) — a frase certa de cada um (index.html) */
.jv-mbelow{display:none} .jv-mat .jv-mabove{display:none} .jv-mat .jv-mbelow{display:inline}
/* M3: os 3 cartoes em 3 colunas */
.jv-mat [data-blk="coil"]>.cards{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px}
.jv-mat [data-blk="coil"]>.cards .card{border:1.5px solid var(--line);border-radius:12px;padding:8px 8px 9px;min-width:0}
.jv-mat [data-blk="coil"]>.cards .k{font-size:14px;line-height:1.2;letter-spacing:.03em;text-transform:uppercase;color:var(--muted)}
.jv-mat [data-blk="coil"]>.cards .v{font:700 26px/1.1 Archivo,sans-serif;margin:4px 0 3px}
.jv-mat [data-blk="coil"]>.cards .d{font-size:14px;line-height:1.3;color:var(--muted)}
/* M4: o aproveitamento por cor */
.jv-mutils{display:flex;flex-direction:column;gap:10px;margin:8px 0 12px}
.jv-mutil{padding:10px 11px 11px}
.jv-mlab{display:block;font:400 14px/1.3 "Source Sans 3",sans-serif;letter-spacing:.04em;color:var(--muted);text-transform:uppercase}
.jv-muh{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap} .jv-muh b{font:700 15px "Source Sans 3",sans-serif} .jv-muh .jv-mdot{margin-right:4px}
.jv-mu3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px} .jv-mu3 b{display:block;font:800 17px/1.25 Archivo,sans-serif}
.jv-mcg{color:var(--good)} .jv-mcm{color:var(--jv-mag,#d0217f)} .jv-mco{color:var(--jv-org,#a65a00)}
.jv-mubar{display:flex;height:12px;border-radius:6px;overflow:hidden;margin-top:10px;border:1px solid var(--jv-barline,#e1e3e8)}
.jv-mubar i{display:block;height:100%;width:calc(var(--jv-w,0)*1%)}
.jv-mug{background:#2f8a55} .jv-mum{background:repeating-linear-gradient(45deg,#d0217f 0 2px,#f6c6df 2px 4px)} .jv-muo{background:#f0b25e}
.jv-mul{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;margin-top:9px;border-top:1px solid var(--jv-rule,#eceef1);padding-top:8px}
.jv-mul .jv-mlab{max-width:250px;text-transform:none;letter-spacing:0} .jv-mul b{font:800 16px Archivo,sans-serif;white-space:nowrap}
.jv-mrz{font:700 13px "Source Sans 3",sans-serif;color:var(--good);background:var(--jv-rz-bg,#e6f3ea);border-radius:5px;padding:1px 6px;margin-left:4px;vertical-align:2px} .jv-mrz.jv-mrzw{color:var(--jv-rzw-tx,#b91c1c);background:var(--jv-rzw-bg,#fdeaea)}
/* M5: Easiest | Least primeiro, Table | Visual depois, a nota embaixo */
.jv-mat [data-blk="coil"] .seg:has(#cp-easy){order:-1}
.jv-mat #cp-note{flex-basis:100%;font-size:13px;line-height:1.45;color:var(--muted)}
/* M6: o corte — Visual (um corte por linha) ou Table */
.jv-mcut{display:flex;flex-direction:column;gap:12px;margin:10px 0 4px}
.jv-mcbox{padding:10px 8px}
.jv-mcbh{margin:0 0 6px 2px;font:800 15px/1.3 Archivo,sans-serif;color:var(--ink)} .jv-mcbh .jv-mdot{margin:0 4px}
.jv-mleg{margin:8px 2px 0;font:13px/1.45 "Source Sans 3",sans-serif;color:var(--jv-sub,#4b5563)}
.jv-cutsvg{display:block;margin-top:2px;overflow:visible}
.jv-cs-cl{font:700 13px Archivo,sans-serif;fill:var(--jv-sv-ink,#1c2430);text-anchor:middle}
.jv-cs-sl{font:600 12px "Source Sans 3",sans-serif;fill:var(--jv-sv-ink,#1c2430)} .jv-cs-sn{font:400 11.5px "Source Sans 3",sans-serif;fill:var(--jv-sv-sub,#5b6472)}
.jv-cs-st{fill:var(--jv-sv-strip,#f4f5f7);stroke:var(--jv-sv-edge,#9aa1ab);stroke-width:.5} .jv-cs-ob{fill:none;stroke:var(--jv-sv-sub,#5b6472);stroke-width:1}
.jv-cs-rp{stroke:var(--jv-sv-rip,#3b4250);stroke-width:.9;stroke-dasharray:4 3} .jv-cs-cv{stroke:var(--jv-sv-ink,#1c2430);stroke-width:1.3;stroke-dasharray:4 3}
.jv-cs-hx{fill:url(#jv-mhx)} .jv-cs-ow{fill:var(--jv-sv-ow,#fff);fill-opacity:.92}
.jv-cs-mk{font:13px Arial,sans-serif;fill:var(--jv-sv-mk,#6b7280)} .jv-cs-dm{font:11.5px "Source Sans 3",sans-serif;fill:var(--jv-sv-sub,#5b6472);text-anchor:middle}
.jv-cs-of{font:600 11.5px "Source Sans 3",sans-serif;fill:var(--jv-sv-of,#b0186b)}
.jv-cs-un{fill:var(--jv-sv-un,#fff3e0);stroke:var(--jv-sv-unl,#d9a35b);stroke-width:1} .jv-cs-ut{font:600 13px "Source Sans 3",sans-serif;fill:var(--jv-sv-ut,#9a4a05)} .jv-cs-brk{fill:var(--jv-sv-brk,#fbfaf7);stroke:var(--jv-sv-ut,#9a4a05);stroke-width:1.2}
/* v510 (proposta C, etapa 3 — esboco-material-cortar-caulk): C4 a legenda uma vez, antes da caixa 1; C6 o trim legivel (o desenho do PC tem letra de ~5 px no
   telefone e fica escondido — o calafeto do trim continua no #trim-out ate a etapa 4); C7 o atalho das formulas. Os temas escuros trocam so as --jv-sv-* (acima) */
.jv-mleg1{margin:0;padding:9px 11px;border:1.5px dashed var(--line);border-radius:12px;background:var(--jv-card,#fff)}
.jv-mat #trim-out{display:none!important} /* v511: o calafeto do trim foi para a aba Caulk (K1 somado, K2 com as partes 5-11 e a nota das linhas) */
.jv-mtrim{display:flex;flex-direction:column;gap:10px;margin:10px 0 4px}
.jv-mtg{margin:6px 0 -2px 2px;font:600 14px/1.2 "Source Sans 3",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.jv-mtm{padding:10px 10px 6px;min-width:0}
.jv-mtmn{margin:0;font:800 16px/1.25 Archivo,sans-serif;color:var(--ink)}
.jv-mtbuy{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;margin:6px 0 0} .jv-mtbuy b{font:800 17px/1.25 Archivo,sans-serif;color:var(--ink)}
.jv-mtsub{margin:2px 0 0;font:400 13.5px/1.4 "Source Sans 3",sans-serif;color:var(--jv-sub,#4b5563)}
.jv-mtlong{margin:4px 0 0;font:700 13.5px/1.35 "Source Sans 3",sans-serif;color:var(--jv-pend,#9a3412)}
.jv-mtpills{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;margin:10px 0 8px} .jv-mtpbox{display:flex;gap:6px;flex-wrap:wrap}
.jv-mtpill:not(#sheetload){min-width:56px;min-height:44px;margin:0;padding:0 10px;border:1.5px solid var(--line);border-radius:22px;background:var(--jv-card,#fff);color:var(--ink);font:700 14px/1 Archivo,sans-serif;cursor:pointer;touch-action:manipulation}
.jv-mtpill[aria-pressed="true"]:not(#sheetload){background:var(--accent);border-color:var(--accent);color:var(--jv-on-acc,#fff)}
.jv-mtrows{min-width:0}
.jv-trimsvg{display:block;margin:0 0 4px;overflow:visible}
.jv-ts-t{font:800 12.5px Archivo,sans-serif;fill:var(--jv-sv-ink,#1c2430)} .jv-ts-n{font:600 12px "Source Sans 3",sans-serif;fill:var(--jv-sv-sub,#5b6472)}
.jv-ts-sb{fill:var(--jv-sv-ow,#fff)} .jv-ts-pc{fill:var(--jv-sv-pc,#dbeafe)} .jv-ts-pcc{fill:var(--jv-sv-pcc,#ede9fe)}
.jv-ts-l{font:700 11.5px "Source Sans 3",sans-serif;fill:var(--jv-sv-ink,#1c2430);text-anchor:middle}
.jv-ts-s{font:400 10.5px "Source Sans 3",sans-serif;fill:var(--jv-sv-sub,#475569);text-anchor:middle}
.jv-ts-lf{font:600 10.5px "Source Sans 3",sans-serif;fill:var(--jv-sv-of,#b0186b);text-anchor:middle}
.jv-mtt td small.jv-mtcv{display:block;font-weight:400;color:var(--jv-sub,#4b5563)}
.jv-mlink:not(#sheetload){display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:48px;margin:10px 0 0;padding:10px 12px;border:1.5px solid var(--line);border-radius:12px;background:var(--jv-card,#fff);color:var(--ink);font:600 15px/1.3 "Source Sans 3",sans-serif;text-align:left;cursor:pointer;touch-action:manipulation}
.jv-mlink em{font-style:normal;font-weight:700;color:var(--accent);white-space:nowrap}
.jv-mct{overflow:hidden}
.page table.jv-mctt{display:table;width:100%;border-collapse:collapse;font:14px/1.3 "Source Sans 3",sans-serif;margin:0}
.jv-mctt th{font:600 14px/1.25 "Source Sans 3",sans-serif;color:var(--jv-sub,#4b5563);text-align:left;padding:8px 5px;background:var(--jv-head,#f3f5f8);vertical-align:bottom;text-transform:none;letter-spacing:0}
.jv-mctt td{padding:7px 5px;border-top:1px solid var(--jv-rule,#eceef1);vertical-align:top;font-variant-numeric:tabular-nums}
.jv-mctt .n{text-align:right} .jv-mctt td.jv-mb{font-weight:700} .jv-mctt td.jv-mg{color:var(--jv-sub,#4b5563)}
.jv-mctg td{background:var(--jv-grp,#fbfbfc);font-weight:700;padding:8px} .jv-mctg small{font-weight:400;letter-spacing:.03em;color:var(--muted);margin-right:6px;text-transform:uppercase} .jv-mctg .jv-mdot{margin-right:4px}
.jv-mctt tr.jv-mctot td{font-weight:800;background:var(--jv-foot,#f8f9fb)}
/* M8 e M9: as tabelas em cartao */
.jv-mcaulk{display:flex;flex-direction:column;gap:8px;margin:2px 0 8px}
.jv-mth,.jv-mtr{display:grid;gap:8px;padding:8px 10px;border-top:1px solid var(--jv-rule,#eceef1);align-items:start}
.jv-mth{border-top:0;background:var(--jv-head,#f3f5f8);border-radius:11px 11px 0 0;font:600 14px/1.3 "Source Sans 3",sans-serif;color:var(--jv-sub,#4b5563)}
.jv-mtl3 .jv-mth,.jv-mtl3 .jv-mtr{grid-template-columns:minmax(0,1fr) 70px 52px}
.jv-mtlp .jv-mth,.jv-mtlp .jv-mtr{grid-template-columns:minmax(0,1fr) 70px 72px}
.jv-mtl2 .jv-mth,.jv-mtl2 .jv-mtr{grid-template-columns:minmax(0,1fr) 104px}
.jv-mtr>span{font:400 14px/1.35 "Source Sans 3",sans-serif}
.jv-mtr>span:not(:first-child),.jv-mtr>b,.jv-mth>span:not(:first-child){text-align:right;font-variant-numeric:tabular-nums}
.jv-mtr b{font:800 15px/1.35 Archivo,sans-serif}
.jv-mtr small{display:block;font:400 13px/1.4 "Source Sans 3",sans-serif;color:var(--muted);margin-top:1px}
.jv-mtr .jv-mdot{margin-right:4px} .jv-mnw{white-space:nowrap}
.jv-mtr.jv-mtot{background:var(--jv-foot,#f8f9fb);border-radius:0 0 11px 11px} .jv-mtot>span:first-child{font-weight:700}
.jv-mstrong>span:first-child>span:first-child{font-weight:700} .jv-mstrong>span:last-child{font:800 15px/1.35 Archivo,sans-serif}
.jv-mside{font:700 13px/1 "Source Sans 3",sans-serif;border-radius:4px;padding:2px 6px;margin-left:3px;vertical-align:1px;background:var(--jv-side-bg,#fcefc7);color:var(--jv-side-tx,#7a4a00)}
.jv-mside[data-side="inside"]{background:var(--acc2);color:var(--accent)}
/* v511 (proposta C, etapa 4 — esboco-material-cortar-caulk): K1 o titulo do telefone no h2 de hoje (o texto de hoje com letra 0, como o 'To bring' da v500);
   K2 as partes de contato dobradas — a linha do resumo na cor de destaque, como o caixa a caixa; a nota das linhas do trim no fim */
.jv-mh2x{font-size:0!important} .jv-mh2t{font-size:12.5px}
.jv-mh2t,.jv-mbuyt{letter-spacing:.1em} /* o h2 com letra 0 zera o .1em herdado (1,25 px nos outros titulos) — tambem o 'To bring' da v500 */
.jv-mk2>summary{display:list-item;padding:12px 12px;font:600 15px/1.35 "Source Sans 3",sans-serif;color:var(--accent);cursor:pointer;touch-action:manipulation}
.jv-mk2[open]>summary{border-bottom:1px solid var(--jv-rule,#eceef1)}
.jv-mk2 .jv-mth{border-radius:0}
.jv-mk2n{margin:0;padding:9px 12px 11px;border-top:1px solid var(--jv-rule,#eceef1);font:400 13.5px/1.45 "Source Sans 3",sans-serif;color:var(--jv-sub,#4b5563)}
.jv-mfoam{margin:2px 0 8px}
/* M10: o caixa a caixa, fechado, no fim */
.jv-mat>details{margin:6px 0 0!important;border:1.5px solid var(--line);border-radius:10px;background:var(--jv-card,#fff);padding:0 12px}
.jv-mat>details>summary{display:list-item;padding:13px 0;font:600 15px/22px "Source Sans 3",sans-serif!important;color:var(--accent)}
/* ----- v499 (proposta C, etapa 5): a aba Escolhas — as 5 escolhas (E1-E5) e o Mais ajustes (X) no proprio painel; a folha Settings (M11 a M17) saiu.
   As pecas de hoje entram nos [data-jv-msslot] do .jv-mch; o selo de cada escolha: "falta escolher" (--jv-nc, laranja) ou ✓ (--jv-ok, verde) ----- */
.jv-mch{padding-bottom:16px;color:var(--ink);font:15px/1.4 "Source Sans 3","Segoe UI",Roboto,sans-serif}
.jv-msg{margin-top:18px} .jv-msg:first-child{margin-top:4px}
.jv-msgh{display:flex;align-items:center;gap:4px 6px;min-height:36px;margin:0 2px 6px}
.jv-msgh h5{margin:0;font:800 13px/1.3 Archivo,sans-serif;letter-spacing:.09em;color:var(--accent);text-transform:uppercase}
/* o 📖 vira um icone pequeno ao lado do titulo (o botao "📖 info" de hoje: o texto some, fica o livro; o alvo de toque continua 44 px) */
.jv-mch .jv-msinfo:empty,.jv-mch .jv-mboxinfo:empty{display:none}
.jv-mch .jv-msinfo .ibtn,.jv-mch .jv-mboxinfo .ibtn{min-width:44px;min-height:36px;padding:0;border:0;border-radius:10px;background:none;font-size:0;line-height:1;color:var(--accent)}
.jv-mch .jv-msinfo .ibtn::before,.jv-mch .jv-mboxinfo .ibtn::before{content:"📖";font-size:17px;opacity:.8}
.jv-mch .jv-msinfo .ibtn[aria-expanded="true"],.jv-mch .jv-mboxinfo .ibtn[aria-expanded="true"]{background:var(--acc2)}
.jv-mch .jv-mboxinfo{display:flex;justify-content:flex-end;margin:-6px 0 0}
/* o selo de cada escolha na linha do rotulo: falta escolher (--jv-nc, laranja) ou ✓ (--jv-ok, verde) — os textos na lingua do app */
.jv-mch .pk.unset .lbl::after,.jv-mch #mfrtags.unset>.note::after,.jv-mch [data-jv-msg="install"].jv-un .pick.sys>.pk:first-child>.lbl::after{content:var(--jv-nc);display:inline-block;margin-left:auto;font:700 13px/1.5 "Source Sans 3",sans-serif;letter-spacing:.05em;color:#7a3b00;background:#fde6cc;border:1.5px solid #d9822b;border-radius:6px;padding:0 7px;text-transform:uppercase;white-space:nowrap}
.jv-mch #pickers .pk:not(.unset)>.lbl::after,.jv-mch #mfrtags:not(.unset)>.note::after,.jv-mch [data-jv-msg="install"]:not(.jv-un) .pick.sys>.pk:first-child>.lbl::after{content:var(--jv-ok);display:inline-block;margin-left:auto;font:800 13px/1.5 "Source Sans 3",sans-serif;color:var(--jv-ok-tx,#1f7a3f);background:var(--jv-ok-bg,#e3f3e8);border-radius:6px;padding:0 8px}
/* E1 E2: as cores da janela lado a lado (o rotulo vira "Por dentro" / "Por fora", --jv-lin / --jv-lout); E3: o coil na largura toda */
.jv-mch #pickers{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 8px}
.jv-mch #pickers>.pk{margin:0;min-width:0} .jv-mch #pk-coil{grid-column:1/-1}
.jv-mch .pk>.lbl{display:flex;align-items:center;gap:6px;min-height:22px;font-size:13px;letter-spacing:.05em;color:var(--muted);text-transform:uppercase;margin:0 0 5px}
.jv-mch #pk-in>.lbl,.jv-mch #pk-out>.lbl{flex-direction:column;align-items:flex-start;gap:3px;font-size:0} /* na meia largura o selo desce para baixo do rotulo */
.jv-mch #pk-in>.lbl::after,.jv-mch #pk-out>.lbl::after{margin-left:0!important} .jv-mch #pk-in>.lbl::before{content:var(--jv-lin);font-size:13px} .jv-mch #pk-out>.lbl::before{content:var(--jv-lout);font-size:13px}
.jv-mch #pickers .pk button.cur{width:100%;min-height:64px;gap:10px;padding:8px 10px;border:1.5px solid var(--line);border-radius:12px}
.jv-mch #pickers .pk button.cur::after{content:"›";margin-left:auto;color:#6b7280;font:700 20px Arial,sans-serif}
.jv-mch #pickers .pk .chip{flex:none;width:28px;height:28px;min-height:0;padding:0;border-radius:50%;border:1px solid #a9afb8}
.jv-mch #pickers .pk .meta{font-size:13px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.jv-mch #pickers .pk.unset button.cur{border:2px dashed #d9822b;background:var(--jv-un-bg,#fff8ef)}
/* E4: fabricante · serie num cartao so (os dois botoes de hoje dentro dele); tracejado laranja quando falta */
.jv-mch #mfrtags{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px;border:1.5px solid var(--line);border-radius:12px;background:var(--jv-card,#fff);outline:none;position:relative}
.jv-mch #mfrtags.unset{border:2px dashed #d9822b;background:var(--jv-un-bg,#fff8ef)}
.jv-mch #mfrtags>.note{flex:1 0 100%;display:flex;align-items:center;margin:0!important;font-size:14px;color:var(--muted)}
.jv-mch .tagbtn{min-height:44px;border:1.5px solid #9fb6cd;border-radius:999px;padding:0 14px;font-size:15px;color:var(--accent);background:var(--jv-card,#fff)}
.jv-mch .tagbtn .tl{font-size:12px;letter-spacing:.08em}
/* E5: Exterior e Interior nos selects de hoje; J-channel e o caulked-to em botoes (.jv-mpills, o .jv-seg de sempre) — o select deles fica escondido */
.jv-mch [data-jv-msg="install"] .pick.sys{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:10px}
.jv-mch [data-jv-msg="install"] .pick.sys select{min-height:46px;border:1.5px solid var(--line);border-radius:10px;font-size:16px}
.jv-mch [data-jv-msg="install"].jv-un .pick.sys>.pk:nth-child(-n+2) select{border:2px dashed #d97706}
.jv-mch .pk:has(>.jv-mpills)>select{display:none}
.jv-mch .jv-mpills button{padding:0 6px;font-size:14px;line-height:1.15} .jv-mch .jv-mpills button+button{border-left:1px solid var(--line)}
/* M14: as 6 cores do trim em 2 colunas */
.jv-mch #trim-colors{display:grid;grid-template-columns:1fr 1fr!important;gap:10px}
.jv-mch #trim-colors .lbl{text-transform:none;letter-spacing:0;line-height:1.25;margin:0 0 3px}
.jv-mch #trim-colors .ctag{min-height:44px;font-size:15px}
/* como no esboco (conserto): a etiqueta branca com a bolinha da cor e o nome (o fundo colorido de hoje vira a bolinha: --jv-hex vem do ui.js) */
.jv-mch #trim-colors .ctag{justify-content:flex-start;gap:7px;padding:0 14px;border:1.5px solid var(--line)!important;background:var(--jv-card,#fff)!important;color:var(--ink)!important;font:600 15px "Source Sans 3",sans-serif}
.jv-mch #trim-colors .ctag::before{content:"";flex:none;width:12px;height:12px;border-radius:50%;border:1px solid #9aa1ab;box-sizing:border-box;background:var(--jv-hex,#fff)}
.jv-mch #trim-colors .ctag.dflt{border-style:dashed!important} .jv-mch #trim-colors .ctag.dflt::before{display:none}
/* M15: as 4 caixas 📐 numa so — um grupo que abre e fecha por caixa; cada regra vira um cartao (nome, ↺, formula, exemplo) */
.jv-msnote{margin:0 0 4px;font-size:14px;line-height:1.45;color:var(--accent)}
.jv-msacc{display:flex;align-items:center;gap:9px;width:100%;min-height:48px;margin:6px 0 0;padding:4px 12px;border:1.5px solid var(--line);border-radius:10px;background:var(--jv-card,#fff);color:var(--ink);font:600 15px "Source Sans 3",sans-serif;text-align:left;cursor:pointer;touch-action:manipulation}
.jv-msacc::before{content:"▶";color:#6b7280;font-size:12px;width:12px}
.jv-msacc:has(+ [data-jv-msslot] details[open]){border-radius:10px 10px 0 0;border-bottom:0;background:var(--jv-head,#f3f5f8)} .jv-msacc:has(+ [data-jv-msslot] details[open])::before{content:"▼"}
.jv-mch .math details{margin:0;padding:2px 10px 10px;border:1.5px solid var(--line);border-top:0;border-radius:0 0 10px 10px;background:var(--jv-card,#fff)}
.jv-mch .math details:not([open]){display:none}
.jv-mch .math summary{display:none}
.jv-mch .math table{display:block;width:100%;margin:0;font-size:14px} .jv-mch .math thead{display:none} .jv-mch .math tbody{display:block}
.jv-mch .math tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 8px;padding:9px 0 8px;border-top:1px solid var(--jv-rule,#eceef1)} .jv-mch .math tr:first-child{border-top:0}
.jv-mch .math td{display:block;padding:0;border:0;background:none}
.jv-mch .math td:nth-child(1){grid-column:1;grid-row:1;font-size:14px;line-height:1.3} .jv-mch .math td:nth-child(4){grid-column:2;grid-row:1}
.jv-mch .math td:nth-child(2){grid-column:1/-1;grid-row:2} .jv-mch .math td:nth-child(3){grid-column:1/-1;grid-row:3;font-size:13px!important;line-height:1.55;color:var(--jv-sub2,#374151)}
.jv-mch .math td:nth-child(4):empty{display:none}
.jv-mch .math input.ex{width:100%;min-height:44px;border:1.5px solid var(--line);border-radius:10px;padding:0 10px;font:15px/1.2 Consolas,"IBM Plex Mono",monospace!important}
.jv-mch .math td:nth-child(4) button{min-width:44px;min-height:44px;border:1.5px solid var(--line);border-radius:10px;background:var(--jv-card,#fff);color:#6b7280;font-size:17px;padding:0}
.jv-mch .math .note{font-size:13px;margin:8px 0 0}
[data-jv-msslot="m-trim"]:not(:has(details[open]))+[data-jv-msslot="plinfo"]{display:none}
[data-jv-msslot="plinfo"]{margin:6px 0 0}
/* M16: as constantes nos 5 grupos de hoje, que abrem e fecham; uma por linha, o nome a esquerda e o campo a direita */
.jv-mch #const .cg h4{display:flex;align-items:center;gap:9px;min-height:48px;margin:6px 0 0;padding:4px 12px;border:1.5px solid var(--line);border-radius:10px;background:var(--jv-card,#fff);color:var(--ink);font:600 15px "Source Sans 3",sans-serif;text-transform:none;letter-spacing:0;cursor:pointer}
.jv-mch #const .cg h4::before{content:"▶";color:#6b7280;font-size:12px;width:12px}
.jv-mch #const .cg.jv-cgopen h4{border-radius:10px 10px 0 0;border-bottom:0;background:var(--jv-head,#f3f5f8)} .jv-mch #const .cg.jv-cgopen h4::before{content:"▼"}
.jv-mch #const .cg .const{display:none!important}
.jv-mch #const .cg.jv-cgopen .const{display:block!important;border:1.5px solid var(--line);border-top:0;border-radius:0 0 10px 10px;background:var(--jv-card,#fff);padding:2px 10px 10px}
.jv-mch #const .const label{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px dotted var(--jv-dots,#d9dce3);font-size:14px;line-height:1.3;color:var(--jv-sub2,#374151)}
.jv-mch #const .const input{width:64px;min-height:44px;flex:none;border:1.5px solid var(--line);border-radius:10px;text-align:right;padding:0 9px;font-size:16px}
/* o valor inteiro no campo, como no esboco (conserto): sem as setinhas do campo numerico, que tomavam a largura e cortavam 2.375, 0.375, 2010… */
.jv-mch #const .const input{-moz-appearance:textfield;appearance:textfield} .jv-mch #const .const input::-webkit-inner-spin-button,.jv-mch #const .const input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
/* X: o Mais ajustes — um cartao com uma linha por grupo; tocar abre no lugar (a lista cresce para baixo), tocar de novo fecha. Detailed | Combined fica na linha */
.jv-mmore{border:1.5px solid var(--line);border-radius:12px;background:var(--jv-card,#fff);overflow:hidden}
.jv-mrow+.jv-mrow{border-top:1px solid var(--jv-rule,#eceef1)}
.jv-mrowb{display:flex;align-items:center;gap:10px;width:100%;min-height:56px;margin:0;padding:8px 12px;border:0;border-radius:0;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer;touch-action:manipulation}
.jv-mrowb::after{content:"▾";margin-left:auto;color:#6b7280;font:700 15px/1 Arial,sans-serif} .jv-mrow.jv-open>.jv-mrowb::after{content:"▴"}
.jv-mrow.jv-open>.jv-mrowb{background:var(--jv-head,#f3f5f8)}
.jv-mric{flex:none;width:24px;text-align:center;font-size:18px;line-height:1}
.jv-mrt{display:flex;flex-direction:column;min-width:0} .jv-mrt b{font:600 15px/1.3 "Source Sans 3",sans-serif} .jv-mrt small{font-size:13px;line-height:1.3;color:var(--muted)}
.jv-mbox{display:none;padding:8px 12px 12px} .jv-mrow.jv-open>.jv-mbox{display:block}
.jv-mrowlv{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;min-height:56px;padding:8px 12px}
.jv-mrowlv>[data-jv-msslot="lv"]{margin-left:auto}
/* M17 */
.jv-mch [data-jv-msslot="lv"] .seg{display:inline-flex;margin:0}
/* v571 — a janela sem troca no cartao da lista (js/job/keep.js): a etiqueta ao lado do tamanho e o fundo listrado */
.jv-lr-keep{font-style:normal;font-weight:700;font-size:11px;letter-spacing:.03em;text-transform:uppercase;color:var(--ink);border:1.5px solid var(--ink);border-radius:999px;padding:1px 7px;margin-left:4px;white-space:nowrap}
.jv-lrw[data-jv-keep] .jv-lr{background:repeating-linear-gradient(135deg,var(--soft) 0 8px,transparent 8px 16px)}
/* v585 — o botao da barra da aba Photos (contorno no accent, entre Reload e + Add photo) e o do visualizador (na barra preta, antes do ✕); v588: abrem o
   Photo Measure (a escolha da parede da v585 saiu) */
.jv-phpc{border:1px solid var(--accent);color:var(--accent);background:var(--panel,#fff);font-weight:700}
.jv-vpc{min-height:36px;margin:0;padding:0 12px;border:1px solid rgba(255,255,255,.55);border-radius:9px;background:transparent;color:#fff;font:700 13px/1 Archivo,sans-serif;cursor:pointer;white-space:nowrap}
.jv-vpc:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ===== v746 — a FAIXA da tela Job (esboco "Visual da tela Job", V1 C1 e V2 a; Rafael 24/10: "gosto do A, mas adiciona a faixa azul do B no A claro, e acha uma cor
   que contrasta legal com o A escuro"). O cliente (retailer, nome, etapa, tipo, #, endereco, Pick up) sobre uma faixa na COR DO TIPO, com a grade de planta;
   os 3 botoes encostam na borda de baixo dela. No telefone a faixa vai de ponta a ponta e leva junto o #mhead (‹ My jobs · bandeira · tema); no PC e' um bloco
   arredondado no topo da coluna. --jv-k0 → --jv-k1 = o #mhead, --jv-k1 → --jv-k2 = a faixa (de cima para baixo: a emenda nao aparece). As cores do tipo
   sao as do My jobs (medida azul, instalacao verde, servico verde-azulado); a visita de estimate fica com a cor da medida (v458, E6 — a medicao 73). Nos 4 temas escuros um tom mais vivo — o azul escuro do claro quase
   some no fundo quase preto. O texto e' branco: >= 4,5:1 contra o --jv-k1 (o background-color, que a medicao 98 le). */
.page{--jv-k0:#0f2d4a;--jv-k1:#123557;--jv-k2:#245c8f;--jv-kgrid:rgba(255,255,255,.07)}
.page:has(.jv.t-install){--jv-k0:#0a321e;--jv-k1:#0d3f26;--jv-k2:#1a6b3c}
.page:has(.jv.t-service){--jv-k0:#0a3035;--jv-k1:#0d3a40;--jv-k2:#1f6466}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .page{--jv-k0:#1a4a82;--jv-k1:#1d5390;--jv-k2:#2f6db0;--jv-kgrid:rgba(255,255,255,.09)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .page:has(.jv.t-install){--jv-k0:#145a35;--jv-k1:#17683f;--jv-k2:#23824f}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .page:has(.jv.t-service){--jv-k0:#11575a;--jv-k1:#136466;--jv-k2:#1d7f80}
.jv-hero{display:flex;flex-direction:column;gap:7px;padding:14px 14px 42px;border-radius:16px;color:#fff;background-color:var(--jv-k1);
  background-image:linear-gradient(var(--jv-kgrid) 1px,transparent 1px),linear-gradient(90deg,var(--jv-kgrid) 1px,transparent 1px),linear-gradient(180deg,var(--jv-k1),var(--jv-k2));
  background-size:16px 16px,16px 16px,100% 100%;
  --jv-pin-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6.5-5.4-6.5-10.8a6.5 6.5 0 0 1 13 0C18.5 15.6 12 21 12 21z'/%3E%3Ccircle cx='12' cy='10.2' r='2.4'/%3E%3C/svg%3E");
  --jv-kind-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='10.5' r='6.5'/%3E%3Ccircle cx='10' cy='10.5' r='2'/%3E%3Cpath d='M10 17h10.5v-3.2'/%3E%3C/svg%3E")}
.jv.t-install .jv-hero{--jv-kind-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='1.5'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}
.jv.t-service .jv-hero{--jv-kind-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0-5.4 5.2L4 16.8V20h3.2l5.3-5.3a4 4 0 0 0 5.2-5.4l-2.5 2.5-2.3-.5-.5-2.3z'/%3E%3C/svg%3E")}
.jv.t-estimate .jv-hero{--jv-kind-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a1.5 1.5 0 0 0-1.5 1.5v15A1.5 1.5 0 0 0 7 21h10a1.5 1.5 0 0 0 1.5-1.5V7.5z'/%3E%3Cpath d='M14 3v4.5h4.5M9 13h6M9 17h4'/%3E%3C/svg%3E")}
.jv-hero .jv-title{gap:8px;align-items:center}
.jv-hero .jv-kind{order:-2;margin-left:0;display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border-radius:8px;background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.24);color:#fff;font-size:11.5px;letter-spacing:.06em}
.jv-hero .jv-kind::before{content:"";width:14px;height:14px;flex:none;background:currentColor;-webkit-mask:var(--jv-kind-ic) center/contain no-repeat;mask:var(--jv-kind-ic) center/contain no-repeat}
.jv-hero .jv-stage{order:-1;display:inline-flex;align-items:center;gap:6px;padding:2px 9px;border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.14);color:#fff;font-size:12px}
.jv-hero .jv-stage::before{content:"";width:7px;height:7px;border-radius:50%;background:#fff}
.jv-hero .jv-tid{order:0;margin-left:auto;color:#fff;font-size:12.5px}
.jv-hero .jv-name{order:1;flex:1 0 100%;margin-top:4px;font-size:27px;font-weight:800;letter-spacing:-.015em;line-height:1.08;color:#fff}
.jv-hero .jv-addr{margin-top:0;color:#fff;font-size:14.5px}
.jv-hero .jv-addr::before{content:"";display:inline-block;width:15px;height:15px;margin:0 5px -2px 0;background:currentColor;-webkit-mask:var(--jv-pin-ic) center/contain no-repeat;mask:var(--jv-pin-ic) center/contain no-repeat}
.jv-hero .jv-eb{margin-bottom:-4px;color:#fff}
/* os 3 botoes sobem metade para dentro da faixa */
.jv-card>.jv-hero+.jv-acts{margin:-42px 10px 0;position:relative;z-index:1}
/* TELEFONE: a faixa de ponta a ponta. O recuo do Conferir (check-panel.css: body[data-ck] padding-right) passa para a .page nesta tela, para a faixa poder ir
   ate a borda; o conteudo continua recuado igual (--jv-pr). O #mhead fica sobre a faixa: 64 px de altura (a grade de 16 px emenda) */
body[data-phone] .page:has(.jv-strip){--jv-pr:10px}
body[data-phone][data-ck]:has(.jv-strip){padding-right:0}
body[data-phone][data-ck] .page:has(.jv-strip){--jv-pr:calc(10px + var(--ck-tw));padding-right:var(--jv-pr)}
body[data-phone] .jv-hero{margin:0 calc(-1 * var(--jv-pr)) 0 -10px;padding:4px calc(var(--jv-pr) + 4px) 42px 14px;border-radius:0}
body[data-phone] .jv-card>.jv-hero+.jv-acts{margin:-42px 0 0}
body[data-phone] #mhead.jvhead{box-sizing:border-box;min-height:64px;margin:-10px calc(-1 * var(--jv-pr)) 0 -10px;padding:12px calc(var(--jv-pr) + 4px) 8px 10px;color:#fff;background-color:var(--jv-k0);
  background-image:linear-gradient(var(--jv-kgrid) 1px,transparent 1px),linear-gradient(90deg,var(--jv-kgrid) 1px,transparent 1px),linear-gradient(180deg,var(--jv-k0),var(--jv-k1));background-size:16px 16px,16px 16px,100% 100%}
body[data-phone] #mhead.jvhead .mnav[data-myjobs]:not(#sheetload){border-color:transparent;background:transparent;color:#fff;padding-left:4px}
body[data-phone] #mhead.jvhead :is([data-i18n-btn],[data-dp-lookopen]):not(#sheetload){border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.14);color:#fff}
/* v746 — o PAINEL dos numeros (C1, peca 4): Quando · Janelas · Relatorio numa superficie so, em vez de caixas soltas. As celulas perdem a caixa e ganham o
   divisor; os numeros crescem (18 px/800); o Relatorio e' a faixa de baixo do painel, tingida pelo tom (pendente ambar, sem problemas verde, com problemas
   vermelho). No telefone: Quando | Janelas em cima, o Relatorio na largura toda; no PC (.jobview) as 3 lado a lado, como antes. "Ontem · ⏱ 0,7h" numa linha */
.jv-card .jv-cells{gap:0;border:1px solid var(--line);border-radius:18px;background:var(--jv-card,#fff);overflow:hidden;box-shadow:0 1px 2px rgba(28,36,48,.05)}
.jv-card .jv-cell{--jv-cell-line:transparent;border:0;border-radius:0;background:transparent;padding:10px 12px;gap:2px}
.jv-card .jv-cell+.jv-cell{border-left:1px solid var(--line)}
.jv-card .jv-cell small{display:flex;align-items:center;gap:4px;font-size:10.5px}
.jv-card .jv-cell[data-jv-cell="when"] small::before,.jv-card .jv-cell[data-jv-cell="windows"] small::before{content:"";width:13px;height:13px;flex:none;background:currentColor;-webkit-mask:var(--jv-cic) center/contain no-repeat;mask:var(--jv-cic) center/contain no-repeat}
.jv-card .jv-cell[data-jv-cell="when"]{--jv-cic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E");flex-direction:row;flex-wrap:wrap;align-items:baseline;column-gap:6px}
.jv-card .jv-cell[data-jv-cell="when"]>small,.jv-card .jv-cell[data-jv-cell="when"]>b,.jv-card .jv-cell[data-jv-cell="when"]>.jv-visit{flex:1 0 100%}
.jv-card .jv-cell[data-jv-cell="when"]>.jv-hrs::before{content:"·";margin-right:3px}
.jv-card .jv-cell[data-jv-cell="windows"]{--jv-cic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='1.5'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}
.jv-card .jv-cell:not([data-jv-cell="report"]) b{font-size:18px;font-weight:800;line-height:1.2;font-variant-numeric:tabular-nums}
.jv-card .jv-cell[data-jv-cell="report"]{background:var(--jv-cell,#fff)}
.jv-card .jv-cell.jv-tone-amber{background:var(--jv-amb-bg,#fff1cf)} .jv-card .jv-cell.jv-tone-green{background:var(--jv-grn-bg,#dff2e6)} .jv-card .jv-cell.jv-tone-red{background:var(--jv-red-bg,#fde4e2)}
body:not([data-phone]) .jobview .jv-card .jv-cell[data-jv-cell="report"] b{font-size:15px}
body[data-phone] .jv-card .jv-cell[data-jv-cell="report"]:last-child:nth-child(odd){flex-direction:row;align-items:center;justify-content:space-between;min-height:44px;border-left:0;border-top:1px solid var(--line)}
body[data-phone] .jv-card .jv-cell[data-jv-cell="report"] b{font-size:15px}
/* v747 — o pe do cartao (S1 e V1) como linhas do painel: "📱 Onde voce parou · 11 linhas · …" fecha numa linha de 44 px que abre (<details>) e mostra o
   "Usar o do Escritorio" — o botao que troca o trabalho do telefone pelo do Escritorio saiu de perto do ETA, IR e Ligar. A copia do Escritorio (sem o botao)
   nao abre. O V1 (⚠ Ainda nao esta no Escritorio … Tentar de novo) fica aberto: e' um aviso */
.jv-card details.jv-orig{display:block;border:1px solid var(--line);border-radius:14px;background:var(--jv-card,#fff)}
.jv-card .jv-orig-s{display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px;cursor:pointer;list-style:none;touch-action:manipulation}
.jv-card .jv-orig-s::-webkit-details-marker{display:none}
.jv-card .jv-orig-s::after{content:"›";flex:none;margin-left:auto;font:700 20px/1 Archivo,sans-serif;color:var(--muted);transition:transform .15s}
.jv-card details.jv-orig[open] .jv-orig-s::after{transform:rotate(90deg)}
.jv-card details.jv-orig:not(:has([data-jv-useoffice])) .jv-orig-s{cursor:default;pointer-events:none} .jv-card details.jv-orig:not(:has([data-jv-useoffice])) .jv-orig-s::after{display:none}
.jv-card details.jv-orig>.jv-orig-b{display:block;margin:0 12px 10px auto}
.jv-card .jv-pend{min-height:44px;padding:6px 8px 6px 12px;border:1px solid var(--line);border-radius:14px;background:var(--jv-card,#fff)}
/* v748 — o BOTAO PRINCIPAL (esboco, P7): a peca mais forte da tela, na cor do tipo (--jv-k2, a mesma da faixa: >= 4,5:1 com o branco nos 7 temas). O icone num
   circulo, o proximo passo, a linha pequena e a barra das janelas medidas; ✓ Feito / Fechado = so a linha verde */
button.jv-main:not(#sheetload):not(#jv-x){display:flex;align-items:center;gap:12px;width:100%;min-height:68px;margin:0;padding:11px 12px;border:0;border-radius:20px;background:var(--jv-k2,var(--accent));color:#fff;font:inherit;text-align:left;cursor:pointer;box-shadow:0 6px 18px rgba(18,53,87,.26);touch-action:manipulation}
button.jv-main:not(#sheetload):not(#jv-x):focus-visible{outline:3px solid #f0a500;outline-offset:2px}
.jv-mic{flex:none;width:44px;height:44px;padding:10px;border-radius:50%;background:rgba(255,255,255,.16);stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.jv-mtx{display:flex;flex-direction:column;flex:1;min-width:0;gap:2px}
.jv-mtx b{font:800 18px/1.15 Archivo,sans-serif;color:#fff} .jv-mtx small{font-size:13.5px;color:#fff;opacity:.92;font-variant-numeric:tabular-nums}
.jv-mbar{-webkit-appearance:none;appearance:none;display:block;width:100%;height:5px;margin-top:6px;border:0;border-radius:5px;background:rgba(255,255,255,.25);overflow:hidden;color:#fff}
.jv-mbar::-webkit-progress-bar{background:rgba(255,255,255,.25);border-radius:5px} .jv-mbar::-webkit-progress-value{background:#fff;border-radius:5px} .jv-mbar::-moz-progress-bar{background:#fff;border-radius:5px}
.jv-mgo{flex:none;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;font:700 22px/1 Archivo,sans-serif}
.jv-main-done{display:flex;align-items:center;gap:8px;min-height:52px;margin:0;padding:10px 14px;border-radius:16px;background:var(--jv-grn-bg,#dff2e6);color:var(--good);font:700 15px/1.25 Archivo,sans-serif}
/* v749 — as ABAS (esboco "Visual da tela Job", peca 6, e D4 a): a faixa azul pesada saiu — era a parte mais forte da tela, mais que o proprio trabalho. Fundo do
   papel com uma linha em cima e embaixo, os icones novos (v745), a aba aberta no azul claro. No TELEFONE a barra vai de ponta a ponta e fica PRESA no topo da
   tela quando ele desce na lista de janelas ou no mapa — o overflow-x:clip no html e no body e' o mesmo truque da .jv-mtabs (o hidden fazia do body uma area de
   rolagem que nunca rola, e o sticky nao prendia); as abas internas da Material prendem logo abaixo dela. No PC a coluna das abas vira um cartao claro */
body[data-phone] .jv-strip{position:sticky;top:0;z-index:30;margin:6px calc(-1 * var(--jv-pr,10px)) 0 -10px;padding:6px var(--jv-pr,10px) 6px 10px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:0 8px 14px -12px rgba(28,36,48,.45)}
html:has(body[data-phone] .jv-strip),body[data-phone]:has(.jv-strip){overflow-x:clip}
body[data-phone] .jv-mtabs{top:66px}
.jobview .jv-strip{background:var(--jv-card,#fff);border:1px solid var(--line)}
/* a Info nos temas escuros: os dois cartoes eram claros com o texto claro do tema (a Descricao ficava ilegivel) */
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-icard-desc{--jv-ict-bg:var(--acc2);--jv-ict-c:var(--accent)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-icard-mat{--jv-ict-bg:#3a2e14;--jv-ict-c:var(--warn)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-icard-facts{--jv-ict-bg:var(--soft);--jv-ict-c:var(--ink2)} /* v795 */ body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-icard-ord{--jv-ict-bg:var(--soft);--jv-ict-c:var(--ink2)} body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-ordr :is([data-state="short"],[data-state="over"]),body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-ordn.jv-ordwarn{color:var(--warn)} /* v796 */ body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-kv dd.jv-kmiss{color:var(--warn)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-icard-mat .jv-buytable th{color:var(--warn);border-bottom-color:rgba(226,160,74,.3)} body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-icard-mat .jv-buytable td{border-bottom-color:rgba(226,160,74,.15)}
/* v750 — a linha da Medida (D6 a): os 3 icones sem nome ganham legenda embaixo, como as abas (icone sobre o nome) — + Janela (o measure tool), Foto (o Photo
   Measure) e Guia; no telefone Mapa | Lista numa linha */
.jv-seg .jv-tape,.jv-seg .jv-pzbtn,.jv-seg .jv-book{flex-direction:column;gap:2px}
.jv-seg .jv-tape small,.jv-seg .jv-pzbtn small,.jv-seg .jv-book small{font:600 10px/1.1 Archivo,sans-serif;color:var(--ink2);white-space:nowrap}
/* v753 (conserto do lote, bateria de 25/10: 84, 93 e 163 vermelhas) — com as abas presas no topo (v749) tudo que o app rola "ate o topo" (scrollIntoView start: a aba nova da
   Material, o aviso que leva ao que falta, o botao principal) ficava ESCONDIDO atras delas. O topo util da tela comeca embaixo da barra: 66 px = a altura dela */
html:has(body[data-phone] .jv-strip){scroll-padding-top:66px}
/* v803 (contraste dos temas, T3 + T4 na aba Measure; esboco aprovado 04/11 "Aprovo, D1-D3 em a"): nos 4 escuros a tabela de contagem (v789/v793), os chips,
   o Floor | Wall | Room e o guia deixam de ser ilhas brancas — cada cor fixa vira a cor do tema que faz o mesmo papel (#fff -> --panel, #f4f6f9 -> --soft,
   #eceef2/#d3d9e2 -> --line, #1d2433 -> --ink, #5f6b7d -> --ink2, #2c4a78 -> --accent, #e8eef7 -> --acc2, laranja/vermelho/verde -> --warn/--bad/--good).
   Os botoes ganham o :not(#jv-x) para passar da regra geral de botao do theme.css (a linha preta e o chip preto do print da #2083). Nos claros nada muda. */
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tally{color:var(--ink)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tl-box{border-color:var(--line);background:var(--panel)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tl-cap{border-bottom-color:var(--line);color:var(--ink2)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tl-cap b{color:var(--ink)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tl-st[data-state="short"]{color:var(--warn)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tl-st[data-state="over"]{color:var(--bad)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tl-st[data-state="ok"]{color:var(--good)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tlr{border-bottom-color:var(--line)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) :is(.jv-tlr-h,.jv-tlr-g){background:var(--soft);color:var(--ink2)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tlr-n i{color:var(--ink2)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tlr-n[data-state="short"] :is(b,i){color:var(--warn)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tlr-n[data-state="over"] :is(b,i){color:var(--bad)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tlr-s small{color:var(--ink2)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tlr.jv-tlr-on{background:var(--acc2);box-shadow:inset 3px 0 0 var(--accent)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tlr-tot{background:var(--soft)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tally button.jv-tlr-s.jv-tlr-s[data-jv-tlst]:not(#sheetload):not(#jv-x){background:transparent;color:var(--ink);border-color:transparent}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tally button.jv-tladd.jv-tladd[data-jv-tladd]:not(#sheetload):not(#jv-x){background:var(--panel);color:var(--warn);border-color:var(--warn)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tally button.jv-tl-more.jv-tl-more[data-jv-tlmore]:not(#sheetload):not(#jv-x){background:var(--panel);color:var(--accent);border-color:var(--line)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tally button.jv-tl-ct.jv-tl-ct[data-jv-tlct]:not(#sheetload):not(#jv-x){background:transparent;color:var(--accent);border-color:transparent}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) button.jv-tlc.jv-tlc[data-jv-tlf]:not(#sheetload):not(#jv-x){background:var(--panel);color:var(--ink);border-color:var(--line)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) button.jv-tlc.jv-tlc[data-jv-tlf][aria-pressed="true"]:not(#sheetload):not(#jv-x){background:var(--acc2);color:var(--accent);border-color:var(--accent)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-tl-show{color:var(--accent)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) :is(.jv-tl-cmd,.jv-tally) button:focus-visible{outline-color:var(--accent)}
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) :is(.jv-fseg,.jv-guide){background:var(--panel)}
/* v804 (contraste dos temas, T3; esboco aprovado 04/11): Job colours & limits (Material) no painel do tema nos 4 escuros */
body:is([data-theme="dark"],[data-theme="hud"],[data-theme="holo"],[data-theme="sketchdark"]) .jv-jobdef{background:var(--panel)}