:root{
  --grafite:#232C33;--grafite-2:#2D3942;--grafite-line:#384651;
  --areia:#F4F3EF;--branco:#FFFFFF;--linha:#E6E5E0;--linha-2:#D8D7D1;
  --petroleo:#15756E;--petroleo-d:#0F5A55;--petroleo-soft:#E3F0EE;
  --latao:#B5853C;--latao-soft:#F6EEDD;
  --txt:#1F2830;--txt2:#5C6973;--txt3:#8B969C;
  --ok:#2E7D57;--ok-soft:#E5F1EA;--warn:#B07A1E;--warn-soft:#FAF0D9;--over:#B0473A;--over-soft:#F8E8E5;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --sans:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --bg:var(--areia);--surface:var(--branco);--border:var(--linha);--border2:var(--linha-2);
  --ink:var(--txt);--ink2:var(--txt2);--ink3:var(--txt3);
}
[data-theme="dark"]{
  --bg:#1A2228;--surface:#222C33;--border:#2E3A42;--border2:#37454e;
  --ink:#E7ECEE;--ink2:#9FB0B8;--ink3:#76858D;--areia:#222C33;--branco:#222C33;
  --petroleo-soft:#143b39;--latao-soft:#3a2f1b;--ok-soft:#163528;--warn-soft:#3a2f15;--over-soft:#3a201c;
}
*{box-sizing:border-box}html,body{margin:0}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.hidden{display:none!important}

/* ---------- Login ---------- */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--grafite);padding:20px}
.login-card{background:var(--surface);border-radius:16px;padding:34px 30px;width:360px;max-width:100%;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.login-brand{display:flex;align-items:center;gap:11px;justify-content:center;margin-bottom:6px}
.login-brand .nm{font-weight:700;font-size:24px;color:var(--ink)}
.login-card .sub{text-align:center;color:var(--ink2);font-size:13px;margin-bottom:22px}
.field{margin-bottom:14px}.field label{display:block;font-size:12px;color:var(--ink2);font-weight:600;margin-bottom:5px}
.input{width:100%;border:1px solid var(--border2);border-radius:9px;padding:10px 12px;font-size:14px;font-family:inherit;background:var(--bg);color:var(--ink)}
.input:focus{outline:none;border-color:var(--petroleo);box-shadow:0 0 0 3px var(--petroleo-soft)}
.login-err{background:var(--over-soft);color:var(--over);border-radius:8px;padding:9px 12px;font-size:12.5px;margin-bottom:12px}
.login-hint{margin-top:16px;font-size:11.5px;color:var(--ink3);text-align:center;line-height:1.7}

/* ---------- Shell ---------- */
.app{display:flex;min-height:100vh}
.side{width:240px;flex:0 0 240px;background:var(--grafite);color:#C2CDD3;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.brand{display:flex;align-items:center;gap:11px;padding:17px 18px 8px}.brand .nm{font-weight:700;color:#F2F0EB;font-size:18px}
.co{margin:6px 14px;background:var(--grafite-2);border:1px solid var(--grafite-line);border-radius:8px;padding:7px 10px;display:flex;align-items:center;gap:8px;font-size:12.5px;color:#D6E0E4;cursor:pointer}
.co .ico{color:var(--latao);font-weight:700}.co select{margin-left:auto;background:transparent;border:none;color:#D6E0E4;font-family:inherit;font-size:12.5px;cursor:pointer}
.nav{padding:2px 10px 8px;overflow-y:auto;flex:1}
.navgrp .grp{font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:#6B7C85;padding:12px 10px 4px;font-weight:600}
.nav a{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:8px;color:#B4C1C8;text-decoration:none;font-size:13px;cursor:pointer;margin:1px 0}
.nav a svg{width:17px;height:17px;flex:none;stroke:#8A9BA3;stroke-width:1.7;fill:none}
.nav a:hover{background:var(--grafite-2);color:#EAF0F2}.nav a.active{background:var(--petroleo);color:#fff}.nav a.active svg{stroke:#fff}
.nav a.soon{color:#76858D}.nav a.soon svg{stroke:#5E6E76}.nav a.soon .sdot{margin-left:auto;width:6px;height:6px;border-radius:50%;background:#566570;flex:none}
.who{display:flex;align-items:center;gap:10px;padding:11px 16px;border-top:1px solid var(--grafite-line)}
.who .av{width:30px;height:30px;border-radius:50%;background:var(--latao);color:#3a2a0e;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex:none}
.who .nm{font-size:13px;color:#EAF0F2;font-weight:500}.who .rl{font-size:10px;color:#7E8E96}
.who .out{margin-left:auto;color:#7E8E96;cursor:pointer;font-size:11px}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{min-height:60px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:14px;padding:10px 24px;position:sticky;top:0;z-index:6;flex-wrap:wrap}
.top h1{font-size:18px;margin:0;font-weight:600}.top .sub{color:var(--ink2);font-size:12.5px}.top .spacer{flex:1;min-width:10px}
.theme-toggle{border:1px solid var(--border2);background:var(--surface);color:var(--ink2);border-radius:8px;padding:6px 10px;cursor:pointer;font-size:13px}
.content{padding:22px 24px;max-width:1080px;width:100%}

.banner{display:flex;gap:11px;align-items:center;border-radius:10px;padding:11px 15px;margin-bottom:18px;font-size:13px;border:1px solid #e6d3a8;background:var(--latao-soft);color:var(--ink2)}
.btn{border:1px solid var(--border2);background:var(--surface);color:var(--ink);padding:8px 13px;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;display:inline-flex;gap:7px;align-items:center}
.btn.pri{background:var(--petroleo);border-color:var(--petroleo);color:#fff}.btn.sm{padding:6px 11px;font-size:12.5px}.btn.dang{border-color:#e0bdb6;color:var(--over)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:18px}.card+.card{margin-top:16px}
.card-h{display:flex;align-items:baseline;gap:10px;margin-bottom:14px;flex-wrap:wrap}.card-h h2{font-size:15px;margin:0;font-weight:600}.card-h .meta{color:var(--ink2);font-size:12.5px;margin-left:auto}

table{width:100%;border-collapse:collapse}
th{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);font-weight:600;text-align:left;padding:9px 12px;border-bottom:1px solid var(--border)}
th.r,td.r{text-align:right}td{padding:10px 12px;border-bottom:1px solid var(--border);font-size:13.5px}tr:last-child td{border-bottom:none}
tbody tr.clickable{cursor:pointer}tbody tr.clickable:hover{background:rgba(125,125,125,.06)}
.pill{display:inline-block;font-size:11px;font-weight:600;padding:2px 9px;border-radius:20px}
.pill.ok{background:var(--ok-soft);color:var(--ok)}.pill.warn{background:var(--warn-soft);color:var(--warn)}.pill.over{background:var(--over-soft);color:var(--over)}.pill.gray{background:rgba(125,125,125,.14);color:var(--ink2)}.pill.pet{background:var(--petroleo-soft);color:var(--petroleo-d)}

.empty{text-align:center;padding:40px 20px;color:var(--ink3)}
.empty h3{color:var(--ink2);font-size:16px;margin:0 0 6px}

/* ---------- Forms / grid ---------- */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
@media(max-width:760px){.grid2,.grid3{grid-template-columns:1fr}}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:14px}
select.input{appearance:auto}
.comp-row{display:grid;grid-template-columns:1fr 90px 34px;gap:8px;margin-bottom:8px;align-items:center}
.comp-row .input{margin:0}
.iconbtn{border:1px solid var(--border2);background:var(--surface);color:var(--over);border-radius:8px;cursor:pointer;font-size:16px;line-height:1;padding:0;height:36px}
.subt{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);font-weight:600;margin:18px 0 8px}

/* breakdown de custo */
.costbox{background:var(--bg);border:1px solid var(--border);border-radius:11px;padding:16px;position:sticky;top:80px}
.costbox h3{margin:0 0 4px;font-size:14px}.costbox .meta{font-size:11.5px;color:var(--ink3);margin-bottom:12px}
.costline{display:flex;justify-content:space-between;font-size:13px;padding:7px 0;border-bottom:1px solid var(--border)}
.costline .k{color:var(--ink2)}.costline small{color:var(--ink3);font-weight:400}
.costtot{display:flex;justify-content:space-between;align-items:baseline;margin-top:12px}
.costtot .l{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);font-weight:600}
.costtot .v{font-size:24px;font-weight:700;color:var(--petroleo-d)}
.margem{margin-top:10px;font-size:12.5px;color:var(--ink2)}
.precos{margin-top:14px;border-top:1px solid var(--border);padding-top:12px}
.precos .costline:last-child{border:none}
.note{display:flex;gap:10px;align-items:flex-start;background:var(--latao-soft);border:1px solid #e6d3a8;border-radius:10px;padding:12px 14px;margin-top:14px;font-size:12.5px;color:var(--ink2)}
.note b{font-weight:600;color:var(--ink)}

.switch2{display:inline-flex;gap:4px;background:var(--areia);border:1px solid var(--border2);border-radius:9px;padding:4px;margin-bottom:16px;flex-wrap:wrap}
.switchbtn{border:none;background:none;font-family:inherit;font-size:12.5px;padding:6px 12px;border-radius:7px;cursor:pointer;color:var(--ink2);font-weight:500}
.switchbtn.on{background:var(--grafite);color:#fff}
[data-theme="dark"] .switch2{background:var(--bg)}[data-theme="dark"] .switchbtn.on{background:var(--petroleo)}
.quadros{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.quadro{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:22px 16px;border:1px solid var(--border2);border-radius:12px;background:var(--surface);cursor:pointer;font-family:inherit;color:var(--ink)}
.quadro:hover{border-color:var(--petroleo);background:var(--petroleo-soft)}
.quadro b{font-size:15px}.quadro span{font-size:11.5px;color:var(--ink3)}
.quadro .qi{width:44px;height:44px;border-radius:11px;background:var(--latao-soft);display:flex;align-items:center;justify-content:center}
.quadro .qi svg{width:24px;height:24px;stroke:var(--latao);stroke-width:1.7;fill:none}
.nowrap{white-space:nowrap}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:13px;margin-bottom:16px}
.tile{border:1px solid var(--border);border-radius:11px;padding:15px;background:var(--surface)}
.tile .l{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3);font-weight:600}
.tile .v{font-size:21px;font-weight:600;margin-top:6px}.tile .v.over{color:var(--over)}
.tile .s{font-size:11.5px;color:var(--ink2);margin-top:2px}
.menuwrap{position:relative;display:inline-block}
.menu{position:absolute;right:0;top:calc(100% + 4px);background:var(--surface);border:1px solid var(--border2);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.16);z-index:40;min-width:230px;padding:4px;text-align:left}
.menu button{display:block;width:100%;text-align:left;padding:8px 12px;border:none;background:none;font-family:inherit;font-size:13px;color:var(--ink);cursor:pointer;border-radius:7px}
.menu button:hover{background:var(--petroleo-soft)}
.menu button:disabled{color:var(--ink3);cursor:default;background:none}
.menu button.danger{color:var(--over)}
.comp-row.c4{grid-template-columns:1fr 74px 74px 34px}
.comp-row.ped{grid-template-columns:1fr 76px 100px 90px 34px}
.oph{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:11px;overflow:hidden;margin-bottom:16px}
.oph>div{background:var(--surface);padding:13px 15px}
.oph .l{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);font-weight:600}
.oph .v{font-size:16px;font-weight:600;margin-top:4px}
.costbar{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:11px;overflow:hidden;margin-top:16px}
.costbar>div{background:var(--surface);padding:13px 15px;text-align:center}
.costbar .l{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);font-weight:600}
.costbar .v{font-size:19px;font-weight:600;margin-top:5px}
@media(max-width:900px){.oph{grid-template-columns:1fr 1fr}}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink2);cursor:pointer}
.chkbox{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:4px}
.modal-bg{position:fixed;inset:0;background:rgba(20,25,30,.5);display:flex;align-items:flex-start;justify-content:center;padding:30px 16px;overflow-y:auto;z-index:50}
.modal{background:var(--surface);border-radius:14px;padding:22px;width:920px;max-width:100%}
.modal-h{display:flex;align-items:center;margin-bottom:16px}.modal-h h2{margin:0;font-size:17px}.modal-h .x{margin-left:auto;cursor:pointer;color:var(--ink3);font-size:22px;line-height:1}
.modal-foot{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
@media(max-width:980px){.modal{width:100%}.costbox{position:static}}
@media(max-width:900px){.side{display:none}}

/* v6 — filtros, despesas do pedido */
.filtros{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 12px}
.filtros .input{margin:0;width:auto;flex:1 1 150px;min-width:0}
.filtros input[type=date].input{flex:0 1 150px}
.comp-row.cpvar{grid-template-columns:1.6fr 1fr 90px 140px 34px}