:root{
  /* papel + tinta: mesma base do site alyron.com.br */
  --bg:#F4F2EC;--s1:#FFFFFF;--s2:#FAF9F5;--s3:#ECE9E0;--line:#E6E2D7;--line-2:#D6D1C3;
  --ink:#141412;--soft:#55524A;--dim:#7F7B71;--silver:#141412;
  /* cor com função: cada família tem cheio, tom claro e tinta escura */
  --cy:#93F1F7;--cy-t:#DCF8FA;--cy-d:#0B6870;
  --or:#FF8126;--or-t:#FFE8D6;--or-d:#9A4200;
  --li:#C6F19D;--li-t:#ECF9DE;--li-d:#3B6A10;
  --rd:#D8443A;--rd-t:#FCE5E2;--rd-d:#9C2A22;
  --cyan:var(--cy-d);--amber:var(--or);--red:var(--rd);--green:var(--li-d);
  --ease:cubic-bezier(.23,1,.32,1);--disp:"Bricolage Grotesque",Inter,system-ui,sans-serif;color-scheme:light;
}
::selection{background:var(--cy);color:var(--ink)}
html{scrollbar-color:var(--line-2) transparent}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font:14px/1.45 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,textarea,select{font:inherit;color:var(--ink)}
a{color:inherit}
:focus-visible{outline:2px solid var(--cy-d);outline-offset:2px;border-radius:6px}
[hidden]{display:none!important}
.g{font-family:var(--disp),Inter,sans-serif}
.money{font-variant-numeric:tabular-nums}
svg.i{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mark{display:inline-block;width:7px;height:22px;background:linear-gradient(118deg,#2a2a28 0 25%,#d9dce0 27% 45%,#8a8d92 47% 63%,#141412 65%);transform:skewX(-20deg);border-radius:1px}
.boot{min-height:100vh;display:grid;place-items:center}
.boot .mark{animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35}}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:0 14px;border-radius:9px;font-weight:500;font-size:13.5px;transition:background .15s,border-color .15s,opacity .15s,transform .16s var(--ease);text-decoration:none;white-space:nowrap}
.btn:active:not(:disabled){transform:scale(.97)}
.btn.pri{background:var(--ink);color:var(--bg)}
.btn.pri:hover{background:#000}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.sec{border:1px solid var(--line-2);background:var(--s1)}
.btn.sec:hover{background:var(--s2);border-color:#bdb7a7}
.btn.wa{background:var(--li);color:#1d3a05;border:1px solid #aedc80}
.btn.wa:hover{background:#b9ea88}
.btn.dng{border:1px solid #efb7b1;color:var(--rd-d);background:var(--s1)}
.btn.lg{height:48px;font-size:15px;border-radius:11px;width:100%}
.btn.sm{height:30px;padding:0 10px;font-size:12.5px;border-radius:8px}
.btn.busy{opacity:.6;pointer-events:none}

.chip{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px;border-radius:999px;font-size:11px;font-weight:600;border:1px solid transparent;background:var(--s3);color:var(--soft);white-space:nowrap}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--dim)}
.chip.novo{background:var(--cy);color:#06474d}.chip.novo::before{background:#06474d}
.chip.conf{background:var(--or-t);color:var(--or-d)}.chip.conf::before{background:var(--or)}
.chip.sep{background:var(--ink);color:var(--bg)}.chip.sep::before{background:var(--cy)}
.chip.pronto{background:var(--li);color:#24470a}.chip.pronto::before{background:#24470a}
.chip.entregue,.chip.cancelado{background:transparent;border-color:var(--line-2);color:var(--dim)}
.chip.entregue::before,.chip.cancelado::before{background:var(--line-2)}
.chip.warn{color:var(--or-d);background:var(--or-t)}
.chip.warn::before{background:var(--or)}
.chip.ok{color:var(--li-d);background:var(--li-t)}
.chip.ok::before{background:var(--li-d)}
.chip.bad{color:var(--rd-d);background:var(--rd-t)}
.chip.bad::before{background:var(--rd)}
.chip.plain::before{display:none}

.field{display:block;margin:0 0 14px}
.field>span{display:block;font-size:12.5px;color:var(--soft);margin-bottom:6px}
.field input,.field textarea,.field select{width:100%;height:44px;border:1px solid var(--line-2);border-radius:10px;background:var(--s1);padding:0 12px;outline:none;transition:border-color .15s,box-shadow .15s}
.field textarea{height:auto;padding:10px 12px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--cy-d);box-shadow:0 0 0 3px var(--cy-t)}
.field small{display:block;color:var(--dim);font-size:12px;margin-top:6px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.err{margin:0 0 14px;padding:10px 12px;border-radius:10px;border:1px solid #f1c3be;background:var(--rd-t);color:var(--rd-d);font-size:13px}
.empty{padding:40px 10px;text-align:center;color:var(--dim)}
.note{margin-top:12px;padding:10px 12px;border-radius:10px;border:1px solid #ffd0ad;background:var(--or-t);color:var(--or-d);font-size:12.5px}

/* ---------- entrada ---------- */
.auth{min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--bg)}
.auth-art{position:relative;overflow:hidden;background:var(--bg);display:grid;place-items:center}
.auth-art .stage{position:relative;height:100%;max-height:100vh;aspect-ratio:1100/1400;max-width:100%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.auth-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:arte 1.4s var(--ease) both}
@keyframes arte{from{opacity:0;transform:scale(1.04)}}
/* assinatura: um brilho percorre o feixe ciano uma vez */
.auth-art .glint{position:absolute;left:-40%;right:-40%;top:53.43%;height:3px;margin-top:-1.5px;pointer-events:none;background:radial-gradient(closest-side,#fff,rgba(147,241,247,.75) 45%,transparent);background-size:16% 100%;background-repeat:no-repeat;background-position:-20% 0;animation:glint 2.8s .7s cubic-bezier(.65,0,.35,1) both}
@keyframes glint{from{background-position:-20% 0}to{background-position:120% 0}}
.auth-box{width:100%;max-width:400px;align-self:center;justify-self:center;padding:40px 24px}
.auth-brand{display:flex;align-items:center;gap:10px;margin-bottom:40px}
.auth-brand b{font:700 15px var(--disp);letter-spacing:.14em}
.auth-brand span{color:var(--dim)}
.auth h1{font:700 40px/1 var(--disp);letter-spacing:-.035em;margin:0 0 10px}
.auth p.sub{color:var(--soft);margin:0 0 26px}
.auth .foot{margin-top:24px;color:var(--dim);font-size:12.5px}
.local{margin-top:22px;padding:12px 14px;border:1px dashed var(--line-2);border-radius:10px;color:var(--soft);font-size:12.5px}
.local b{color:var(--ink);font-weight:500}
.local table{width:100%;margin-top:8px;border-collapse:collapse}
.local td{padding:3px 0;font-variant-numeric:tabular-nums}
.local button{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* ---------- topo da equipe ---------- */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;min-height:60px;padding:0 20px;padding-top:env(safe-area-inset-top,0px);border-bottom:1px solid var(--line);background:rgba(244,242,236,.9);backdrop-filter:blur(8px)}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand b{font:700 14px var(--disp);letter-spacing:.14em}
.brand span{color:var(--dim);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.tabs{display:flex;gap:2px;padding:3px;border:1px solid var(--line-2);border-radius:9px;background:var(--s1);margin-left:10px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{height:30px;padding:0 12px;border-radius:7px;color:var(--soft);font-size:13px;display:flex;align-items:center;gap:8px;white-space:nowrap;flex:none;transition:background .15s,color .15s}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-current="page"]{background:var(--ink);color:var(--bg)}
.tabs .n{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--line-2);font-size:11px;display:grid;place-items:center}
.tabs .n.on{background:var(--cy);color:#06474d}
.tabs button[aria-current="page"] .n{background:rgba(244,242,236,.18)}
.tabs button[aria-current="page"] .n.on{background:var(--cy);color:#06474d}
.me{margin-left:auto;display:flex;align-items:center;gap:10px}
.me span{color:var(--soft);font-size:12.5px;white-space:nowrap}
.av{width:30px;height:30px;border-radius:50%;border:1px solid var(--line-2);background:var(--s3);display:grid;place-items:center;font-size:11px;font-weight:600;flex:none}
.modo{background:var(--or-t);color:var(--or-d);border-bottom:1px solid #ffd0ad;text-align:center;font-size:12px;padding:6px 12px}

.wrap{padding:24px 20px 80px;max-width:1500px;margin:0 auto}
.head{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.head h1{font:700 30px/1.05 var(--disp);letter-spacing:-.03em;margin:0}
.head p{margin:6px 0 0;color:var(--soft)}
.head p b{color:var(--ink);font-weight:500}
.head .right{margin-left:auto;display:flex;gap:10px;align-items:center;flex-wrap:wrap}

/* quadro */
.board{display:grid;grid-template-columns:repeat(5,minmax(220px,1fr));gap:12px;overflow-x:auto;padding-bottom:6px}
.col{border:1px solid var(--line);border-radius:14px;background:var(--s3);min-height:420px;display:flex;flex-direction:column}
.col-h{display:flex;align-items:center;gap:8px;height:44px;padding:0 12px;font-size:12.5px;color:var(--soft)}
.col-h b{color:var(--ink);font-weight:500}
.col-h .c{margin-left:auto;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--s1);color:var(--soft);font-size:11.5px;font-weight:600;display:grid;place-items:center}
.col{--k:var(--line-2);--kd:var(--dim);position:relative}
.col::before{content:"";position:absolute;left:14px;right:14px;top:-1px;height:3px;border-radius:0 0 3px 3px;background:var(--k)}
.col-h .dot{width:9px;height:9px;border-radius:50%;background:var(--k);box-shadow:0 0 0 1.5px var(--kd) inset}
.st-novo{--k:var(--cy);--kd:var(--cy-d)}.st-conf{--k:var(--or);--kd:var(--or-d)}.st-sep{--k:var(--ink);--kd:var(--ink)}.st-pronto{--k:var(--li);--kd:var(--li-d)}
.col-h b{font:700 14px var(--disp);letter-spacing:-.01em}
.col-b{padding:10px;display:flex;flex-direction:column;gap:8px}
.card{display:block;width:100%;text-align:left;padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--s1);box-shadow:0 1px 2px rgba(20,20,18,.05);transition:border-color .15s,box-shadow .2s var(--ease),transform .16s var(--ease)}
.card:hover{border-color:var(--line-2);box-shadow:0 6px 18px -8px rgba(20,20,18,.18)}
.card:active{transform:scale(.985)}
.card.sel{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.card .r1{display:flex;justify-content:space-between;align-items:center;gap:6px}
.card b{font:600 13.5px var(--disp)}
.card .who{display:block;margin-top:6px;font-size:12.5px}
.card small{display:block;color:var(--dim);font-size:11.5px;margin-top:3px}
.card .r2{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:11.5px;color:var(--dim)}
.card .late{color:var(--or-d);font-weight:600}

/* painel lateral */
.panel{position:fixed;top:0;right:0;bottom:0;width:min(460px,100vw);z-index:30;padding-top:env(safe-area-inset-top,0px);border-left:1px solid var(--line);background:var(--s1);box-shadow:-24px 0 60px -30px rgba(20,20,18,.35);transform:translateX(104%);transition:transform .4s cubic-bezier(.32,.72,0,1);display:flex;flex-direction:column}
.panel.on{transform:none}
.pn-h{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line)}
.pn-h b{font:600 18px var(--disp)}
.pn-h .x{margin-left:auto;width:32px;height:32px;border-radius:8px;border:1px solid var(--line-2);display:grid;place-items:center;color:var(--soft)}
.pn-b{flex:1;overflow:auto;padding:16px 18px}
.pn-b h3{font-size:12px;color:var(--soft);font-weight:500;margin:18px 0 8px}
.pn-f{display:flex;flex-wrap:wrap;gap:8px;padding:14px 18px;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line)}
.pn-f .btn{flex:1}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:8px 18px;font-size:13px;margin:0 0 16px}
.kv dt{color:var(--dim)}
.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.ln{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.ln>div{flex:1;min-width:0}
.ln small{display:block;color:var(--dim);font-size:12px}
.ln small.warn{color:var(--or-d)}
.ln .lv{text-align:right;min-width:84px}
.pn-tot{display:flex;justify-content:space-between;padding:12px 0 2px;font-weight:600}
.pn-tot b{font:600 16px var(--disp)}
.hist{list-style:none;margin:0;padding:0;font-size:12.5px;color:var(--soft)}
.hist li{padding:6px 0;border-bottom:1px solid var(--line)}
.hist li:last-child{border-bottom:0}
.hist time{color:var(--dim);margin-right:8px;font-variant-numeric:tabular-nums}
.pay{margin-top:18px;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--s2)}
.pay-h{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}
.pay small{display:block;color:var(--dim);font-size:12px;margin-top:6px}
.seg{display:flex;gap:2px;padding:3px;border:1px solid var(--line-2);border-radius:9px;background:var(--s1);margin-top:12px}
.seg button{flex:1;height:32px;border-radius:7px;color:var(--soft);font-size:13px}
.seg button[aria-checked="true"]{background:var(--ink);color:var(--bg)}
.pay label{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;font-size:12.5px;color:var(--soft)}
.pay input[type=date]{height:34px;border:1px solid var(--line-2);border-radius:8px;background:var(--s1);padding:0 8px;font-size:13px}
.pay .acts{display:flex;gap:8px;margin-top:12px}.pay .acts .btn{flex:1}

.qty{display:flex;align-items:center;gap:6px}
.qty button{width:34px;height:34px;border-radius:9px;border:1px solid var(--line-2);background:var(--s1);display:grid;place-items:center;font-size:16px;color:var(--ink);transition:transform .16s var(--ease),background .15s}
.qty button:hover{border-color:#bdb7a7}
.qty button:active:not(:disabled){transform:scale(.92)}
.qty button:disabled{opacity:.35;cursor:not-allowed}
.qty span{min-width:22px;text-align:center;font:600 14px var(--disp)}
.qty .add{width:auto;padding:0 14px;font-size:13px;font-weight:600;background:var(--ink);color:var(--bg);border-color:var(--ink)}
.qty .add:hover{background:#000;border-color:#000}

/* imagem de produto */
.pic{width:46px;height:46px;border-radius:11px;border:1px solid var(--line-2);background:linear-gradient(150deg,#fff,var(--s3));display:grid;place-items:center;flex:none;overflow:hidden;font:700 12px var(--disp);color:var(--soft);letter-spacing:.04em}
.pic img{width:100%;height:100%;object-fit:cover}
.pic.s{width:34px;height:34px;border-radius:8px;font-size:10.5px}

/* separação */
.sep-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.sep{border:1px solid var(--line);border-radius:10px;background:var(--s1)}
.sep-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.sep-h b{font:600 16px var(--disp)}
.sep-h small{display:block;color:var(--dim);font-size:12px;margin-top:2px}
.chk{display:flex;align-items:center;gap:12px;width:100%;padding:10px 16px;border-bottom:1px solid var(--line);text-align:left;font-size:13.5px;min-height:56px}
.chk .box{width:22px;height:22px;border-radius:6px;border:1.5px solid var(--line-2);display:grid;place-items:center;flex:none}
.chk small{display:block;color:var(--dim);font-size:11.5px}
.chk.ok{color:var(--dim)}
.chk.ok span.t{text-decoration:line-through}
.chk .box{transition:background .15s,border-color .15s,transform .16s var(--ease)}
.chk:active .box{transform:scale(.9)}
.chk.ok .box{background:var(--li);border-color:#8fc85c;color:#24470a}
.chk .q{margin-left:auto;font:600 15px var(--disp);color:var(--ink)}
.sep-f{display:flex;align-items:center;gap:10px;padding:12px 16px}
.sep-f .prog{flex:1;height:4px;border-radius:2px;background:var(--line-2);overflow:hidden}
.sep-f .prog i{display:block;height:100%;background:var(--li-d);transition:width .3s var(--ease)}
.sep-f small{color:var(--dim);font-size:12px;white-space:nowrap}

/* painel do dono */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:12px;background:var(--s1)}
.kpi{padding:18px 18px 16px;border-left:1px solid var(--line);min-width:0}
.kpi:first-child{border-left:0}
.kpi small{display:block;color:var(--soft);font-size:12px}
.kpi b{display:block;margin-top:12px;font:700 30px/1 var(--disp);letter-spacing:-.03em}
.kpi span{display:block;margin-top:8px;color:var(--dim);font-size:12px}
.kpi span.up{color:var(--li-d)}.kpi span.down{color:var(--or-d)}
.grid2{display:grid;grid-template-columns:1.6fr 1fr;gap:12px;margin-top:12px;align-items:start}
.grid2.b{grid-template-columns:1.3fr 1fr}
.box{border:1px solid var(--line);border-radius:12px;background:var(--s1);overflow:hidden;min-width:0}
.box-h{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:46px;padding:0 16px;border-bottom:1px solid var(--line);font-size:12px;color:var(--soft)}
.box-h b{color:var(--ink);font-weight:500;font-size:13px}
.chart{display:flex;align-items:flex-end;gap:3px;height:200px;padding:18px 16px 0}
.chart .d{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-width:0;position:relative}
.chart .d i{display:block;width:100%;max-width:18px;background:var(--line-2);border-radius:3px 3px 0 0}
.chart .d.has i{background:#bdb7a7}
.chart .d.best i{background:var(--ink)}
.chart .d.today i{background:var(--cy-d)}
.chart .d:hover i{background:var(--ink)}
.chart .d .tt{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);padding:6px 8px;border-radius:7px;border:1px solid var(--line-2);background:var(--s3);font-size:11.5px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s;z-index:2}
.chart .d:hover .tt{opacity:1}
.axis{display:flex;justify-content:space-between;padding:8px 16px 14px;color:var(--dim);font-size:11px;border-top:1px solid var(--line)}
.alerts{list-style:none;margin:0;padding:0}
.alerts li{display:flex;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);align-items:flex-start}
.alerts li:last-child{border-bottom:0}
.alerts .ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:none;border:1px solid var(--line-2);color:var(--soft)}
.alerts .ic.w{color:var(--or-d);border-color:#ffd0ad;background:var(--or-t)}
.alerts li>div{flex:1;min-width:0;font-size:13px}
.alerts small{display:block;color:var(--dim);font-size:12px;margin-top:2px}
.alerts .btn{margin-top:8px}
table.t{width:100%;border-collapse:collapse;font-size:13px}
table.t th{font-weight:500;color:var(--dim);font-size:12px;text-align:left;padding:10px 16px;border-bottom:1px solid var(--line);white-space:nowrap}
table.t td{padding:11px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
table.t tr:last-child td{border-bottom:0}
table.t .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
table.t .pos{color:var(--dim);width:36px}
table.t .bar{height:3px;border-radius:2px;background:var(--line-2);margin-top:6px;overflow:hidden}
table.t .bar i{display:block;height:100%;background:var(--cy-d)}
table.t .sub{color:var(--dim);font-size:11.5px}
table.t .sub.warn{color:var(--or-d)}
table.t tr.off td{opacity:.5}
.tops{list-style:none;margin:0;padding:4px 0}
.tops li{display:flex;align-items:center;gap:12px;padding:9px 16px}
.tops li>div{flex:1;min-width:0}
.tops small{display:block;color:var(--dim);font-size:12px}
.scroll-x{overflow-x:auto}
.m-only{display:none}
.r-rule{margin:12px 2px 0;color:var(--dim);font-size:12px}
select.sel{height:36px;border:1px solid var(--line-2);border-radius:9px;background:var(--s1);padding:0 10px;font-size:13px}
.search{display:flex;align-items:center;gap:8px;height:40px;padding:0 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--s1);color:var(--dim)}
.search:focus-within{border-color:var(--cy-d);box-shadow:0 0 0 3px var(--cy-t)}
.search input{flex:1;background:none;border:0;outline:none;min-width:0}
.form-box{max-width:560px}
.link-box{display:flex;gap:8px;align-items:center;margin-top:10px;padding:10px 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--s2);font-size:12.5px;color:var(--soft)}
.link-box code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:ui-monospace,Menlo,monospace}

/* ---------- consultora ---------- */
.cs{max-width:520px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;border-left:1px solid var(--line);border-right:1px solid var(--line);background:var(--bg)}
.cs-h{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:10px;min-height:58px;padding:0 18px;padding-top:env(safe-area-inset-top,0px);border-bottom:1px solid var(--line);background:rgba(244,242,236,.9);backdrop-filter:blur(8px)}
.cs-h b{font:600 16px var(--disp);letter-spacing:-.01em}
.cs-h .back{width:34px;height:34px;margin-left:-8px;border-radius:8px;display:grid;place-items:center;color:var(--soft)}
.cs-h .right{margin-left:auto;display:flex;align-items:center;gap:10px}
.cs-b{flex:1;padding:16px 18px 120px}
.cs-f{position:sticky;bottom:0;padding:12px 18px;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);background:rgba(244,242,236,.94);backdrop-filter:blur(8px)}
.hello{color:var(--soft);font-size:13px;margin:0 0 4px}
.cs-title{font:700 26px/1.08 var(--disp);letter-spacing:-.03em;margin:0 0 16px}
.mine{display:grid;grid-template-columns:1fr 1fr;border-radius:18px;background:var(--ink);color:var(--bg);margin-bottom:20px;position:relative;overflow:hidden}
.mine::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--cy);box-shadow:0 0 14px 1px rgba(147,241,247,.7)}
.mine div{padding:14px;min-width:0}
.mine div{padding:16px}
.mine div+div{border-left:1px solid rgba(244,242,236,.14)}
.mine small{display:block;color:#b9b5aa;font-size:11.5px}
.mine b{display:block;font:700 26px/1.05 var(--disp);letter-spacing:-.03em;margin-top:8px}
.mine div+div b{color:var(--li)}
.mine span{display:block;color:#9a968c;font-size:11px;margin-top:4px}
.sec-t{font:600 13px var(--disp);color:var(--soft);margin:0 0 8px}
.o-card{display:block;width:100%;text-align:left;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--s1);margin-bottom:10px;box-shadow:0 1px 2px rgba(20,20,18,.05);transition:transform .16s var(--ease),border-color .15s}
.o-card:hover{border-color:var(--line-2)}
.o-card:active{transform:scale(.985)}
.o-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.o-card b{font:600 14px var(--disp)}
.o-card small{display:block;color:var(--dim);font-size:12px;margin-top:4px}
.cats{display:flex;gap:6px;overflow-x:auto;margin:10px -18px 6px;padding:0 18px 6px;scrollbar-width:none}
.cats::-webkit-scrollbar{display:none}
.cats button{height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:var(--s1);color:var(--soft);font-size:12.5px;font-weight:500;white-space:nowrap;flex:none;transition:background .15s,color .15s,transform .16s var(--ease)}
.cats button:active{transform:scale(.95)}
.cats button[aria-pressed="true"]{background:var(--cy);color:#06474d;border-color:var(--cy)}
.prod{display:flex;align-items:center;gap:12px;padding:12px;margin-bottom:8px;border:1px solid var(--line);border-radius:14px;background:var(--s1)}
.prod .pic{width:58px;height:58px;border-radius:12px}
.prod>div{flex:1;min-width:0}
.prod b{display:block;font-weight:600;font-size:14px}
.prod small{color:var(--dim);font-size:12px}
.prod .pr{color:var(--ink);font-weight:600;margin-left:8px}
.prod .chip{margin-top:5px;height:19px;font-size:10.5px}
.sum{display:flex;justify-content:space-between;color:var(--soft);font-size:13px;margin-bottom:10px}
.sum b{color:var(--ink)}
.items{border:1px solid var(--line);border-radius:14px;margin-top:16px;background:var(--s1)}
.items .it{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);font-size:13px}
.items .it .nm{flex:1;min-width:0}
.items .it .sub{color:var(--soft);font-size:12px;display:block;margin-top:2px}
.items .tot{display:flex;justify-content:space-between;padding:12px;font-weight:600}
.items .tot b{font:600 15px var(--disp)}
.timeline{list-style:none;margin:18px 0 0;padding:0}
.timeline li{position:relative;padding:0 0 22px 26px;color:var(--dim)}
.timeline li::before{content:"";position:absolute;left:4px;top:4px;width:12px;height:12px;border-radius:50%;border:1.5px solid var(--line-2);background:var(--bg)}
.timeline li::after{content:"";position:absolute;left:10px;top:18px;bottom:2px;width:1px;background:var(--line-2)}
.timeline li:last-child::after{display:none}
.timeline li.done{color:var(--ink)}
.timeline li.done::before{background:var(--ink);border-color:var(--ink)}
.timeline li.done::after{background:var(--ink)}
.timeline li.cur{color:var(--ink)}
.timeline li.cur{font-weight:600}
.timeline li.cur::before{background:var(--cy);border-color:var(--cy-d);box-shadow:0 0 0 5px var(--cy-t);animation:pulso 2.4s var(--ease) infinite}
@keyframes pulso{50%{box-shadow:0 0 0 9px rgba(220,248,250,.35)}}
.timeline small{display:block;color:var(--dim);font-size:12px;margin-top:2px;font-weight:400}

/* avisos */
#toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,12px) scale(.96);z-index:60;padding:11px 16px;border-radius:12px;border:0;background:var(--ink);color:var(--bg);box-shadow:0 18px 40px -16px rgba(20,20,18,.5);font-size:13px;opacity:0;transition:.3s var(--ease);pointer-events:none;max-width:calc(100vw - 32px)}
#toast.on{opacity:1;transform:translate(-50%,0) scale(1)}
#toast.err{background:var(--rd-d);color:#fff}
#aviso{position:fixed;left:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:55;width:min(380px,calc(100vw - 32px));display:none}
#aviso.on{display:block;animation:up .4s var(--ease)}
@keyframes up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#aviso .in{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:var(--s1);box-shadow:0 24px 50px -18px rgba(20,20,18,.4)}
#aviso .in div{flex:1;min-width:0;font-size:13px}
#aviso small{display:block;color:var(--dim);font-size:11.5px}
#aviso .x{color:var(--dim);width:28px;height:28px;border-radius:7px;display:grid;place-items:center}

@media (max-width:1100px){
  .kpis{grid-template-columns:1fr 1fr}
  .kpi:nth-child(3){border-left:0}
  .kpi:nth-child(n+3){border-top:1px solid var(--line)}
  .grid2,.grid2.b{grid-template-columns:1fr}
  .me span{display:none}
}
@media (max-width:860px){
  .top{padding-inline:12px;gap:8px;flex-wrap:wrap}
  .top .tabs{order:3;width:100%;margin:0 0 8px}
  .brand span{display:none}
  .wrap{padding:18px 14px 80px}
  .board{grid-template-columns:repeat(5,84vw);scroll-snap-type:x mandatory}
  .col{scroll-snap-align:start}

  .hide-m{display:none}
  .m-only{display:block}
  .head .right{margin-left:0;width:100%}
  .row2{grid-template-columns:1fr}
  .cs{border:0}
}
@media (max-width:520px){ .kpi b{font-size:22px} .kpi{padding:14px} }
@media print{
  .top,.modo,#toast,#aviso,.sep-f,.head .right,.no-print{display:none!important}
  html,body{background:#fff;color:#000}
  body.print-one .sep:not(.print-me){display:none}
  .sep{border:1px solid #999;break-inside:avoid;background:#fff;margin-bottom:12px}
  .sep-h,.chk{border-color:#ccc;color:#000}
  .chk .box{border-color:#000}
  .pic{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* v2: importação, foto, senha */
.modal{position:fixed;inset:0;z-index:60;display:none;place-items:center;padding:16px;background:rgba(20,20,18,.45);backdrop-filter:blur(4px)}
.modal.on{display:grid}
.modal .auth-box{width:min(400px,100%);margin:0;padding:22px;border:1px solid var(--line);border-radius:18px;background:var(--s1);box-shadow:0 30px 70px -30px rgba(20,20,18,.5)}
.modal .x,.box-h .x{margin-left:auto;width:30px;height:30px;border-radius:8px;border:1px solid var(--line-2);display:grid;place-items:center;color:var(--soft)}
.foto-up{display:flex;gap:12px;align-items:center}
.foto-up .pic{width:72px;height:72px;border-radius:12px}
.acts{display:inline-flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
label.btn.busy{opacity:.6;pointer-events:none}
@media (max-width:640px){.me>span:first-child{display:none}.acts .btn{padding:0 8px}}
@media (max-width:640px){.head .right{width:100%;margin-left:0}.head .right .search{width:100%!important;flex:1 1 100%}.head .right .btn{flex:1}}

@media (max-width:860px){
  .auth{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .auth-art{height:40vh;min-height:240px;-webkit-mask-image:linear-gradient(#000 62%,transparent 96%);mask-image:linear-gradient(#000 62%,transparent 96%)}
  .auth-art .stage{-webkit-mask-image:linear-gradient(90deg,transparent,#000 32%,#000 68%,transparent);mask-image:linear-gradient(90deg,transparent,#000 32%,#000 68%,transparent)}
  .auth-box{align-self:start;padding:4px 20px 40px}
  .auth-brand{margin-bottom:22px}
  .auth h1{font-size:34px}
}