:root{
  --bg:#f4f1ec; --card:#fff; --ink:#1f1b16; --mut:#7a7166; --line:#e6e0d6;
  --brand:#2b2622; --accent:#c8641e; --accent-soft:#fbeadd; --ok:#2f7d4f; --ok-soft:#e1f2e8;
  --warn:#b7791f; --warn-soft:#fdf1d8; --bad:#b83a2e; --bad-soft:#fbe4e1; --blue:#2f6690;
  --input:#fff; --hover:#faf8f4; --track:#eee7dc; --line2:#f0ebe2; --col:#ebe6dd; --badge:#eee; --logo:#2b2622; --radius:12px; --shadow:0 1px 2px rgba(0,0,0,.05),0 4px 14px rgba(0,0,0,.05);
}
html[data-tema=dark]{
  color-scheme:dark;
  --bg:#171412; --card:#221e1b; --ink:#efe9e1; --mut:#a49a8d; --line:#3a342e; --brand:#100d0b;
  --accent:#e0803a; --accent-soft:#3c2a1c; --ok:#58b97c; --ok-soft:#1d3427; --warn:#e0b04f; --warn-soft:#3a2f17;
  --bad:#ee7a6d; --bad-soft:#3d211e; --blue:#7fb2dc; --input:#1b1816; --hover:#2a2521; --track:#3a342e; --line2:#2e2823;
  --col:#1d1a17; --badge:#322c27; --logo:#efe9e1; --shadow:0 1px 2px rgba(0,0,0,.4),0 4px 14px rgba(0,0,0,.3);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.45}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.01em}
h1{font-size:22px} h2{font-size:17px} h3{font-size:14px}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--blue)}
.hidden{display:none!important}

/* layout */
.shell{display:flex;min-height:100vh}
.side{width:230px;background:var(--brand);color:#eee;padding:20px 14px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;flex-shrink:0}
.logo{font-weight:800;font-size:22px;letter-spacing:.14em;color:#fff;padding:0 8px}
.logo small{display:block;font-weight:500;font-size:10px;letter-spacing:.3em;color:#bdb3a6;margin-top:2px}
.credit{font-size:8px;letter-spacing:.22em;text-transform:uppercase;color:#8d8377;padding:6px 8px 18px}
.nav a{display:flex;gap:10px;align-items:center;padding:9px 10px;border-radius:8px;color:#d8d0c4;text-decoration:none;margin-bottom:2px;cursor:pointer}
.nav a:hover{background:#3a342e}
.nav a.on{background:var(--accent);color:#fff}
.nav .sec{font-size:10px;letter-spacing:.2em;color:#8d8377;text-transform:uppercase;padding:14px 10px 6px}
.side .user{margin-top:auto;border-top:1px solid #443d36;padding:12px 8px 0;font-size:12px;color:#bdb3a6}
.side .user b{color:#fff;display:block}
.side .user a{color:#e9b891;cursor:pointer;margin-right:10px}
.main{flex:1;min-width:0;padding:26px 30px 50px}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.top .sub{color:var(--mut);margin-top:2px}
.menu-btn{display:none}

/* components */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))} .g3{grid-template-columns:repeat(3,minmax(0,1fr))} .g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi .l{color:var(--mut);font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.kpi .v{font-size:24px;font-weight:700;margin-top:4px;font-variant-numeric:tabular-nums}
.kpi .s{font-size:12px;color:var(--mut);margin-top:2px}
.pos{color:var(--ok)} .neg{color:var(--bad)}
.btn{border:1px solid var(--line);background:var(--input);padding:8px 14px;border-radius:8px;cursor:pointer;font-weight:600}
.btn:hover{background:var(--hover)}
.btn.pri{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.pri:hover{background:#b55818}
.btn.danger{color:var(--bad)}
.btn.sm{padding:4px 9px;font-size:12px}
.btn:disabled{opacity:.5;cursor:default}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spacer{flex:1}
input[type=text],input[type=number],input[type=date],input[type=password],input[type=month],select,textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--input)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent-soft);border-color:var(--accent)}
label.f{display:block;font-size:12px;font-weight:600;color:var(--mut);margin-bottom:10px}
label.f>*:not(span){margin-top:4px;font-weight:400;color:var(--ink)}
.badge{display:inline-block;padding:2px 8px;border-radius:99px;font-size:11px;font-weight:700;background:var(--badge);color:var(--mut)}
.badge.ok{background:var(--ok-soft);color:var(--ok)} .badge.warn{background:var(--warn-soft);color:var(--warn)} .badge.bad{background:var(--bad-soft);color:var(--bad)} .badge.acc{background:var(--accent-soft);color:var(--accent)}
.bar{height:8px;background:var(--track);border-radius:99px;overflow:hidden}
.bar>i{display:block;height:100%;background:var(--accent);border-radius:99px}
.bar.ok>i{background:var(--ok)}
table{width:100%;border-collapse:collapse}
th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid var(--line2);vertical-align:middle}
tr:hover td{background:var(--hover)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tablewrap{overflow-x:auto}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px;overflow-x:auto}
.tabs button{border:0;background:none;padding:10px 14px;cursor:pointer;font-weight:600;color:var(--mut);border-bottom:2px solid transparent;white-space:nowrap}
.tabs button.on{color:var(--accent);border-color:var(--accent)}
.empty{color:var(--mut);text-align:center;padding:30px}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px;align-items:end}
.filters>*{width:auto;min-width:130px}
.filters label.f{margin:0}

/* kanban */
.kanban{display:flex;gap:12px;overflow-x:auto;padding-bottom:12px;align-items:flex-start}
.col{background:var(--col);border-radius:12px;min-width:250px;width:250px;padding:10px;flex-shrink:0}
.col.over{outline:2px dashed var(--accent)}
.col h3{display:flex;justify-content:space-between;font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:2px 4px 10px;color:var(--mut)}
.kcard{background:var(--card);border-radius:10px;padding:12px;margin-bottom:9px;box-shadow:var(--shadow);cursor:pointer;border-left:4px solid var(--accent)}
.kcard.dragging{opacity:.4}
.kcard b{display:block}
.kcard .m{color:var(--mut);font-size:12px;margin:2px 0}
.kcard .bar{margin-top:8px}

/* etapas */
.etapa{border:1px solid var(--line);border-radius:10px;margin-bottom:10px;background:var(--card)}
.etapa>summary{list-style:none;cursor:pointer;padding:12px 14px;display:flex;gap:10px;align-items:center}
.etapa>summary::-webkit-details-marker{display:none}
.etapa .body{padding:4px 14px 14px;border-top:1px solid var(--line2)}
.etapa.atual{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.ativ{display:flex;gap:10px;align-items:center;padding:7px 0;border-bottom:1px dashed var(--line2)}
.ativ input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}
.ativ.done span.d{text-decoration:line-through;color:var(--mut)}
.timeline{display:flex;gap:4px;margin:10px 0}
.timeline i{flex:1;height:10px;border-radius:4px;background:var(--line)}
.timeline i.done{background:var(--ok)} .timeline i.cur{background:var(--accent)}
.ring{--p:0;width:130px;height:130px;border-radius:50%;background:conic-gradient(var(--accent) calc(var(--p)*1%),var(--track) 0);display:grid;place-items:center;margin:auto}
.ring div{width:98px;height:98px;border-radius:50%;background:var(--card);display:grid;place-items:center;font-size:28px;font-weight:800}
.ring div small{font-size:11px;font-weight:600;color:var(--mut);display:block;text-align:center;margin-top:-6px}

/* modal / toast */
#modal-root .ov{position:fixed;inset:0;background:rgba(20,15,10,.5);display:flex;justify-content:center;align-items:flex-start;padding:30px 14px;overflow:auto;z-index:50}
.modal{background:var(--card);border-radius:14px;width:100%;max-width:640px;padding:22px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.modal.wide{max-width:820px}
.modal h2{margin-bottom:14px}
.modal .foot{display:flex;gap:10px;justify-content:flex-end;margin-top:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:99}
#toast div{background:var(--brand);color:#fff;padding:10px 18px;border-radius:99px;margin-top:8px;box-shadow:var(--shadow)}
#toast div.err{background:var(--bad)}
.chartbox{position:relative;height:260px}
.anexo{display:flex;gap:8px;align-items:center;padding:6px 0;border-bottom:1px dashed var(--line2)}

/* login */
.login{min-height:100vh;display:grid;place-items:center;padding:20px}
.login .card{width:100%;max-width:360px;padding:28px}
.login .logo{color:var(--logo);padding:0;text-align:center}
.login .credit{text-align:center;padding-bottom:20px;color:#a39a8d}

@media(max-width:900px){
  .shell{display:block}
  .side{position:fixed;left:-250px;z-index:40;transition:left .2s;width:240px}
  .side.open{left:0}
  .menu-btn{display:inline-block}
  .main{padding:16px 14px 40px}
  .g2,.g3,.g4{grid-template-columns:1fr}
  .two{grid-template-columns:1fr}
}
@media print{.side,.menu-btn,.btn,.filters{display:none!important}.main{padding:0}.card{box-shadow:none}}

/* ajustes */
.permtab td,.permtab th{padding:7px 10px}
.permtab .grp td{background:var(--hover);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut)}
.permtab input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}
.tema-op{display:flex;gap:12px;flex-wrap:wrap}
.tema-op label{border:2px solid var(--line);border-radius:12px;padding:14px 18px;cursor:pointer;min-width:150px;text-align:center;font-weight:600}
.tema-op input{display:none}
.tema-op label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.gear{display:flex;align-items:center;gap:6px;color:#e9b891;cursor:pointer;text-decoration:none;margin-top:8px}

/* orçamento por itens */
#orc select{min-width:150px}
#orc input[type=text]{min-width:120px}
#orc td{padding:6px 6px}