@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');
:root{
  --bg:#f2f0e8;--ink:#0d0f08;--ink-soft:#5a5d4e;--line:#d8d5c7;--lime:#e4fc67;--olive:#7a7b46;
  --card:#f7f6ef;--card2:#eeece1;--green:#3f7d32;--amber:#b9821a;--red:#c0432c;
  /* admin/portal agora no tema CLARO (igual à leadpage) — tokens remapeados p/ claro */
  --dark:#f2f0e8;--dpanel:#f7f6ef;--dpanel2:#eeece1;--dline:#d8d5c7;--dink:#0d0f08;--dink-soft:#5a5d4e;
  --acc:#5f7a12; /* verde-limão escuro p/ texto/links no claro */
}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:'Space Grotesk',system-ui,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--ink);text-decoration:none}
.mono{font-family:'Space Mono',monospace}
.wrap{max-width:1080px;margin:0 auto;padding:28px}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--lime);color:#0d0f08;border:1.5px solid #0d0f08;font-family:'Space Grotesk';font-weight:700;font-size:15px;padding:12px 22px;border-radius:10px;cursor:pointer;transition:transform .08s}
.btn:hover{transform:translateY(-1px)}
.btn.ghost{background:transparent}
.btn.block{width:100%;justify-content:center}
.btn:disabled{opacity:.5;cursor:not-allowed}
input,select,textarea{font-family:'Space Grotesk';font-size:15px;padding:11px 14px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);width:100%}
label{font-size:13px;font-weight:600;color:var(--ink-soft);display:block;margin:14px 0 5px}
.err{background:#f6d9d0;color:var(--red);border-radius:8px;padding:10px 14px;font-size:14px;margin:10px 0}
.ok{background:#e3f0d6;color:var(--green);border-radius:8px;padding:10px 14px;font-size:14px;margin:10px 0}

/* topbar */
.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:18px;padding:16px 28px;background:rgba(242,240,232,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .logo{height:26px}
.top nav{margin-left:auto;display:flex;gap:6px;align-items:center}
.top nav a{font-family:'Space Mono',monospace;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);padding:8px 12px;border-radius:8px}
.top nav a:hover{background:var(--card2);color:var(--ink)}

/* hero / store */
.hero{text-align:center;padding:44px 0 20px}
.badge{display:inline-block;background:var(--lime);font-family:'Space Mono',monospace;font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:6px 14px;border-radius:999px;margin-bottom:16px}
h1{font-size:44px;line-height:1.05;letter-spacing:-.02em;margin:0 0 12px;font-weight:700}
.hero p{font-size:18px;color:var(--ink-soft);max-width:56ch;margin:0 auto}
@media(max-width:640px){h1{font-size:32px}}

.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:28px 0}
@media(max-width:640px){.tiers{grid-template-columns:1fr}}
.tier{background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:22px;text-align:center}
.tier.best{border-color:#0d0f08;box-shadow:4px 4px 0 var(--lime)}
.tier .q{font-family:'Space Mono',monospace;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--olive);font-weight:700}
.tier .p{font-size:38px;font-weight:700;letter-spacing:-.02em;margin:6px 0 2px}
.tier .u{font-size:13px;color:var(--ink-soft)}

/* configurador */
.config{background:var(--card);border:1.5px solid #0d0f08;border-radius:20px;padding:28px;max-width:520px;margin:10px auto 40px;box-shadow:6px 6px 0 var(--lime)}
.qtyrow{display:flex;align-items:center;gap:16px;justify-content:center;margin:16px 0}
.qtybtn{width:48px;height:48px;border:1.5px solid #0d0f08;background:#fff;border-radius:12px;font-size:24px;cursor:pointer;font-weight:700}
.qtyval{font-size:44px;font-weight:700;min-width:80px;text-align:center;letter-spacing:-.02em}
.calc{text-align:center;margin:14px 0}
.calc .tt{font-size:40px;font-weight:700;letter-spacing:-.02em}
.calc .br{font-family:'Space Mono',monospace;font-size:13px;color:var(--ink-soft);margin-top:4px}
.feat{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-soft);margin:8px 0}
.feat b{color:var(--ink)}

/* card genérico */
.card-b{background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:24px;max-width:440px;margin:30px auto}
.card-b h2{margin:0 0 6px;font-size:24px}
.muted{color:var(--ink-soft);font-size:14px}
.center{text-align:center}
.linkrow{text-align:center;margin-top:16px;font-size:14px;color:var(--ink-soft)}

/* ===== portal / admin (tema CLARO, igual à leadpage) ===== */
body.dark{background:var(--dark);color:var(--dink)}
body.dark a,body.admin a{color:var(--acc)}
body.dark .top{background:rgba(242,240,232,.9);border-bottom:1px solid var(--dline)}
body.dark .top nav a{color:var(--dink-soft)} body.dark .top nav a:hover{background:var(--dpanel2);color:var(--dink)}
body.dark input,body.dark select,body.dark textarea,
body.admin input,body.admin select,body.admin textarea{background:#fff;border-color:var(--dline);color:var(--dink)}
body.dark .card-b,body.dark .panel,
body.admin .card-b,body.admin .panel{background:var(--dpanel);border-color:var(--dline)}
.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:6px 20px;margin-bottom:16px;overflow-x:auto}
.order{background:var(--dpanel);border:1px solid var(--dline);border-left-width:4px;border-radius:14px;padding:18px 20px;margin-bottom:14px}
.order.st-delivered{border-left-color:var(--green)} .order.st-awaiting_delivery{border-left-color:var(--amber)}
.order.st-briefing{border-left-color:var(--lime)} .order.st-paid{border-left-color:var(--amber)} .order.st-pending{border-left-color:var(--dink-soft)}
.order .oh{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.order .oh .t{font-weight:700;font-size:17px}
.pill{font-family:'Space Mono',monospace;font-size:11px;font-weight:700;padding:3px 9px;border-radius:6px;text-transform:uppercase}
.pill.green{background:#e0efd4;color:#2f6b23} .pill.amber{background:#f6e9cf;color:#8a5e12}
.pill.red{background:#f6dbd3;color:#a5341f} .pill.gray{background:#e6e3d7;color:#6b6d5c} .pill.lime{background:var(--lime);color:#3a4210}
.itembox{background:var(--dpanel2);border:1px solid var(--dline);border-radius:12px;padding:14px 16px;margin:8px 0}
.itembox .ih{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:640px){.grid2{grid-template-columns:1fr}}
.credbox{font-family:'Space Mono',monospace;font-size:12px;background:#12140c;border:1px solid #2c3020;border-radius:8px;padding:10px 12px;color:#e4fc67;word-break:break-all;margin-top:6px}
.hbadge{font-family:'Space Mono',monospace;font-size:12px;font-weight:700;padding:4px 10px;border-radius:6px}
.h-alto{background:#e0efd4;color:#2f6b23}.h-médio{background:#f6e9cf;color:#8a5e12}.h-baixo{background:#f6dbd3;color:#a5341f}.h-banido{background:#f6dbd3;color:#a5341f}.h-\--{background:#e6e3d7;color:#6b6d5c}
.kpis{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}
.kpi{background:var(--dpanel);border:1px solid var(--dline);border-radius:12px;padding:14px 18px;flex:1;min-width:120px}
.kpi .n{font-size:28px;font-weight:700} .kpi .l{font-family:'Space Mono',monospace;font-size:10px;text-transform:uppercase;color:var(--dink-soft);margin-top:6px}
.empty{color:var(--dink-soft);text-align:center;padding:40px;font-family:'Space Mono',monospace}
h1.dh{font-size:26px;margin:6px 0 2px}
.thumb{width:44px;height:44px;border-radius:8px;object-fit:cover;border:1px solid var(--dline)}
.datesrow{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--dink-soft);margin:8px 0 12px}
.datesrow b{color:var(--dink);font-weight:600}
.tag-new{font-family:'Space Mono',monospace;font-size:10px;font-weight:700;text-transform:uppercase;background:var(--lime);color:#1a1e08;padding:2px 8px;border-radius:20px;letter-spacing:.04em}
@keyframes pulseNew{0%,100%{opacity:1}50%{opacity:.55}}
.utag{display:inline-block;font-size:11px;font-weight:600;background:#e8ecd6;color:#3a4212;border:1px solid #d3dab0;padding:1px 8px;border-radius:20px;letter-spacing:.02em;white-space:nowrap}

/* ================= PAINEL ADMIN (shell com sidebar) ================= */
body.admin{background:var(--dark);color:var(--dink)}
.ashell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
@media(max-width:820px){.ashell{grid-template-columns:1fr}}
.aside{background:#edeadf;border-right:1px solid var(--dline);padding:22px 16px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh}
@media(max-width:820px){.aside{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;border-right:none;border-bottom:1px solid var(--dline)}}
.abrand{display:flex;align-items:center;gap:9px;padding:4px 8px 22px;margin-bottom:6px}
.abrand img{height:26px}
.abrand .ptag{font-family:'Space Mono',monospace;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:#3a4210;background:var(--lime);border:1px solid #cfe053;border-radius:20px;padding:3px 9px;font-weight:700}
.anav{display:flex;flex-direction:column;gap:3px;flex:1}
@media(max-width:820px){.anav{flex-direction:row;flex-wrap:wrap}}
.anav a{display:flex;align-items:center;gap:11px;font-size:14.5px;font-weight:600;color:var(--dink-soft);padding:11px 13px;border-radius:11px;cursor:pointer;transition:.12s}
.anav a .ic{width:18px;height:18px;flex:0 0 18px;opacity:.7}
.anav a:hover{background:var(--dpanel2);color:var(--dink)}
.anav a.on{background:var(--lime);color:#1a1e08}
.anav a.on .ic{opacity:1}
.anav a .cnt{margin-left:auto;font-family:'Space Mono',monospace;font-size:11px;font-weight:700;background:#12140c;color:var(--lime);border:1px solid transparent;border-radius:20px;padding:1px 8px}
.anav a.on .cnt{background:#1a1e08;color:var(--lime);border-color:transparent}
.aside .foot{border-top:1px solid var(--dline);padding-top:14px;margin-top:8px}
.aside .who{font-size:12px;color:var(--dink-soft);padding:0 8px 10px;word-break:break-all}
.aside .who b{color:var(--dink);display:block;font-size:13px}
.aside .out{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--dink-soft);padding:10px 13px;border-radius:11px;cursor:pointer}
.aside .out .ic{width:17px;height:17px;flex:0 0 17px;opacity:.75}
.aside .out:hover{background:#f6dbd3;color:#a5341f}
.amain{padding:34px 46px;width:100%;max-width:none}
@media(max-width:820px){.amain{padding:22px}}
@media(min-width:1600px){.amain{padding:40px 60px}}
.amain .head{margin-bottom:24px}
.amain .head h1{font-size:29px;margin:0 0 4px;letter-spacing:-.02em}
.amain .head .sub{color:var(--dink-soft);font-size:14.5px}
.amain .head .sub a{color:var(--acc)}

/* KPI cards grandes do painel */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:26px}
@media(max-width:900px){.stat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.stat-grid{grid-template-columns:1fr}}
.stat{background:var(--dpanel);border:1px solid var(--dline);border-radius:16px;padding:20px 22px;position:relative;overflow:hidden}
.stat .k{font-family:'Space Mono',monospace;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--dink-soft)}
.stat .v{font-size:34px;font-weight:700;letter-spacing:-.02em;margin-top:8px;line-height:1}
.stat .cap{font-size:12.5px;color:var(--dink-soft);margin-top:8px}
.stat.hl{border-color:var(--lime)} .stat.hl:after{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--lime)}
.stat.warn:after{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#f0c04a}
.stat.bad:after{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#f0644a}

.sect{font-family:'Space Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--dink-soft);margin:26px 0 12px;display:flex;align-items:center;gap:10px}
.sect:after{content:"";flex:1;height:1px;background:var(--dline)}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:820px){.cols2{grid-template-columns:1fr}}

table{width:100%;border-collapse:collapse}
.panel th{text-align:left;font-family:'Space Mono',monospace;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--dink-soft);font-weight:700;padding:12px 10px;border-bottom:1px solid var(--dline)}
.panel td{padding:13px 10px;border-bottom:1px solid var(--dline);font-size:14px;vertical-align:middle}
.panel tr:last-child td{border-bottom:none}
.panel tbody tr[data-c]:hover,.panel tbody tr.clk:hover{background:var(--dpanel2)}
.avatar{width:34px;height:34px;border-radius:9px;background:var(--lime);border:1px solid #cfe053;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:#1a1e08}
.crow{display:flex;align-items:center;gap:11px}
.back{display:inline-flex;align-items:center;gap:6px;font-family:'Space Mono',monospace;font-size:12px;color:var(--acc);cursor:pointer;margin-bottom:14px}
.alertline{display:flex;align-items:center;gap:12px;background:#f9e4de;border:1px solid #ecc6bb;border-radius:12px;padding:13px 16px;margin-bottom:10px}
.alertline .dot{width:9px;height:9px;border-radius:50%;background:#c0432c;flex:0 0 9px}
.alertline.med{background:#f7edd2;border-color:#e6d3a0} .alertline.med .dot{background:#b9821a}

/* cabeçalho com ação à direita */
.headrow{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.btn.sm{font-size:13px;padding:9px 16px;border-radius:9px}
.btn.dark{background:#eeece1;color:#3a4210;border-color:var(--dline)}
.btn.dark:hover{border-color:#0d0f08}

/* modal */
.modal-bg{position:fixed;inset:0;background:rgba(20,18,10,.45);backdrop-filter:blur(4px);z-index:50;display:flex;align-items:flex-start;justify-content:center;padding:6vh 20px;overflow-y:auto}
.modal{background:var(--dpanel);border:1px solid var(--dline);border-radius:18px;padding:26px 28px;width:100%;max-width:560px}
.modal h2{margin:0 0 4px;font-size:22px}
.modal .x{float:right;cursor:pointer;color:var(--dink-soft);font-size:22px;line-height:1;margin:-4px -4px 0 0}
.modal .x:hover{color:var(--dink)}
.seg{display:flex;gap:6px;background:var(--dpanel2);border:1px solid var(--dline);border-radius:11px;padding:4px;margin:14px 0}
.seg button{flex:1;background:none;border:none;color:var(--dink-soft);font-family:'Space Grotesk';font-weight:600;font-size:13.5px;padding:9px;border-radius:8px;cursor:pointer}
.seg button.on{background:var(--lime);color:#1a1e08}
.mrow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.mrow{grid-template-columns:1fr}}
.hint{font-size:12px;color:var(--dink-soft);margin-top:5px;line-height:1.4}
.mfoot{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}
.selcli{width:100%;padding:11px 14px;border:1.5px solid var(--dline);border-radius:10px;background:#fff;color:var(--dink);font-family:'Space Grotesk';font-size:15px}
select{width:100%;padding:11px 14px;border:1.5px solid var(--dline);border-radius:10px;background:#fff;color:var(--dink);font-family:'Space Grotesk';font-size:15px}

/* ===== detalhe do número (estilo Meta) ===== */
.numgrid{display:grid;grid-template-columns:1fr 340px;gap:22px;align-items:start}
@media(max-width:960px){.numgrid{grid-template-columns:1fr}}
.numhead{display:flex;align-items:center;gap:18px;background:var(--dpanel);border:1px solid var(--dline);border-radius:16px;padding:20px 24px;margin-bottom:18px;flex-wrap:wrap}
.numhead .pic{width:64px;height:64px;border-radius:50%;object-fit:cover;border:1px solid var(--dline);background:var(--dpanel2);flex:0 0 64px}
.numhead .nm{font-size:20px;font-weight:700;display:flex;align-items:center;gap:8px}
.numhead .ph{font-family:'Space Mono',monospace;color:var(--dink-soft);font-size:13px;margin-top:2px}
.numhead .meta{margin-left:auto;display:flex;gap:20px;flex-wrap:wrap}
.numhead .meta .lbl{font-family:'Space Mono',monospace;font-size:10px;text-transform:uppercase;color:var(--dink-soft);letter-spacing:.06em}
.numhead .meta .val{font-weight:700;margin-top:4px}
.seal{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600}
.seal svg{width:15px;height:15px}
.vbadge{font-family:'Space Mono',monospace;font-size:10px;font-weight:700;padding:3px 8px;border-radius:6px;text-transform:uppercase}
.vbadge.ok{background:#e0efd4;color:#2f6b23} .vbadge.no{background:#f6dbd3;color:#a5341f} .vbadge.rev{background:#f6e9cf;color:#8a5e12}
.fieldcard{background:var(--dpanel);border:1px solid var(--dline);border-radius:16px;padding:22px 24px;margin-bottom:16px}
.fieldcard h3{margin:0 0 4px;font-size:16px}
.fieldcard .fh{font-size:13px;color:var(--dink-soft);margin-bottom:14px}
.counter{float:right;font-family:'Space Mono',monospace;font-size:11px;color:var(--dink-soft)}
/* preview card (lado direito) */
.preview{background:#fff;border-radius:16px;padding:0;overflow:hidden;position:sticky;top:20px;border:1px solid var(--dline);box-shadow:0 6px 24px rgba(20,18,10,.12)}
.preview .top2{background:#f0f2f5;padding:22px 20px;text-align:center;color:#111}
.preview .pv-pic{width:96px;height:96px;border-radius:50%;object-fit:cover;margin:0 auto 12px;display:block;border:3px solid #fff;background:#dfe3e8}
.preview .pv-nm{font-weight:700;font-size:18px;color:#0a0c06}
.preview .pv-ph{color:#3b4a54;font-size:14px;margin-top:2px}
.preview .pv-body{padding:16px 20px;color:#111;font-size:13.5px}
.preview .pv-row{display:flex;gap:10px;padding:9px 0;border-top:1px solid #e6e9ec;color:#1c2b33}
.preview .pv-row a{color:#0a7cff;word-break:break-all}
.preview .pv-tag{font-family:'Space Mono',monospace;font-size:10px;text-transform:uppercase;color:#8a94a0;letter-spacing:.06em;padding:10px 20px 4px}
.photorow{display:flex;align-items:center;gap:14px;margin-bottom:6px}
.photorow img{width:56px;height:56px;border-radius:50%;object-fit:cover;border:1px solid var(--dline);background:var(--dpanel2)}

/* ---- responsivo PWA (celular) ---- */
body.admin{overflow-x:hidden}
.amain{min-width:0}
.headrow{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
@media(max-width:820px){
  .amain{min-width:0;max-width:100vw;padding:16px 14px}
  .ashell{grid-template-columns:1fr}
  .aside{gap:8px;padding:12px 14px}
  .aside .foot{margin-top:0;border-top:none;padding-top:0}
  .aside .who{padding:0 8px}
  h1{font-size:22px}
  .head h1,.headrow h1{font-size:22px}
  .numhead .meta{margin-left:0;width:100%;gap:14px}
  .numhead{flex-wrap:wrap}
  .panel{padding:4px 12px}
  .panel th,.panel td{padding:10px 8px;font-size:13px}
  .btn.sm,.btn.dark.sm{padding:9px 12px}
}
@media(max-width:520px){
  .cols2,.numgrid,.grid2{grid-template-columns:1fr}
  .anav a{font-size:14px;padding:10px 11px}
}
/* área segura (notch) quando instalado como app */
@media(display-mode:standalone){
  .aside{padding-top:calc(12px + env(safe-area-inset-top))}
  .amain{padding-top:calc(16px + env(safe-area-inset-top))}
}

/* ============ CARTÕES DE NÚMERO (cliente + admin) ============ */
.numcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px;margin-bottom:8px}
.ncard{background:var(--dpanel);border:1px solid var(--dline);border-radius:16px;padding:16px 18px;cursor:pointer;transition:transform .1s,box-shadow .1s,border-color .1s;display:flex;flex-direction:column;gap:10px}
.ncard:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(20,18,10,.10);border-color:#0d0f08}
.nc-top{display:flex;align-items:center;gap:11px}
.nc-name{font-weight:700;font-size:15.5px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nc-phone{font-size:12.5px;color:var(--dink-soft);margin-top:2px}
.nc-tags{display:flex;gap:6px;flex-wrap:wrap}
.utag.ghost{background:transparent;color:var(--dink-soft);border-color:var(--dline)}
.utag.risk{background:#f6dbd3;color:#a5341f;border-color:#e6b3a6;font-weight:700}
.utag.warn{background:#f6e9cf;color:#8a5e12;border-color:#e6d3a0;font-weight:700}
.nc-obs{font-size:12.5px;color:var(--dink-soft);background:var(--dpanel2);border-radius:9px;padding:8px 11px;line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.nc-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--dline);padding-top:9px;margin-top:auto}
.avatar.sm{width:30px;height:30px;font-size:12px;border-radius:8px}

/* ============ ABAS DO PORTAL (cliente) ============ */
.phead{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.refresh-top{font-size:13px;padding:9px 16px}
.ptabs{display:flex;gap:6px;background:var(--dpanel2);border:1px solid var(--dline);border-radius:13px;padding:5px;margin-bottom:20px}
.ptabs button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;background:none;border:none;font-family:'Space Grotesk';font-weight:700;font-size:14.5px;color:var(--dink-soft);padding:11px 8px;border-radius:9px;cursor:pointer;transition:.12s}
.ptabs button.on{background:var(--lime);color:#1a1e08;box-shadow:0 2px 8px rgba(20,18,10,.08)}
.ptabs button .ti{font-size:15px}
.ptabs button .tb{font-family:'Space Mono',monospace;font-size:11px;background:#12140c;color:var(--lime);border-radius:20px;padding:1px 7px}
.ptabs button.on .tb{background:#1a1e08}

/* ============ DASHBOARD ANIMADA (cliente) ============ */
.dstat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
@media(max-width:820px){.dstat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.dstat-grid{grid-template-columns:1fr}}
.dstat{background:var(--dpanel);border:1px solid var(--dline);border-radius:16px;padding:18px 20px;position:relative;overflow:hidden}
.dstat .k{font-size:12px;color:var(--dink-soft);font-weight:600}
.dstat .v{font-size:32px;font-weight:700;letter-spacing:-.02em;margin-top:6px;line-height:1}
.dstat .cap{font-size:12px;color:var(--dink-soft);margin-top:7px}
.dstat.hl{border-color:var(--lime)} .dstat.hl:after,.dstat.warn:after,.dstat.bad:after{content:"";position:absolute;inset:0 auto 0 0;width:4px}
.dstat.hl:after{background:var(--lime)} .dstat.warn:after{background:#f0c04a} .dstat.bad:after{background:#f0644a}
.dstat.hl .v{color:#2f6b23}
.dcards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:820px){.dcards{grid-template-columns:1fr}}
.dcard{background:var(--dpanel);border:1px solid var(--dline);border-radius:16px;padding:20px 22px}
.dctitle{font-family:'Space Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--dink-soft);margin-bottom:16px}
.donut{width:150px;height:150px;flex:0 0 150px}
.donut circle{transition:stroke-dasharray .9s ease,stroke-dashoffset .9s ease}
.donut .dn-big{font-family:'Space Grotesk';font-weight:700;font-size:30px;fill:var(--dink)}
.donut .dn-sub{font-family:'Space Mono',monospace;font-size:9px;fill:var(--dink-soft);text-transform:uppercase;letter-spacing:.06em}
.hrow{display:flex;align-items:center;gap:9px;margin:9px 0;font-size:13.5px}
.hdot{width:10px;height:10px;border-radius:50%;flex:0 0 10px}
.hrow .hl{width:52px;color:var(--dink)} .hrow .hn{font-weight:700;width:26px}
.hbar{flex:1;height:8px;background:var(--dpanel2);border-radius:6px;overflow:hidden}
.hbar i{display:block;height:100%;width:0;border-radius:6px;transition:width .9s cubic-bezier(.2,.8,.2,1)}
.hrow .hp{font-family:'Space Mono',monospace;font-size:12px;color:var(--dink-soft);width:38px;text-align:right}
.trow{display:flex;align-items:center;gap:11px;padding:9px 0;border-top:1px solid var(--dline);cursor:pointer}
.trow:first-of-type{border-top:none}
.trow:hover{background:var(--dpanel2)}

/* ============ SEÇÕES DE PEDIDOS (cartões) ============ */
.osect{display:flex;align-items:center;gap:10px;margin:22px 0 12px}
.osect .ocount{font-family:'Space Mono',monospace;font-size:12px;color:var(--dink-soft)}
.ocard{background:var(--dpanel);border:1px solid var(--dline);border-left-width:4px;border-radius:14px;padding:16px 18px;margin-bottom:12px}
.ocard.st-delivered{border-left-color:var(--green)} .ocard.st-awaiting_delivery{border-left-color:var(--amber)}
.ocard.st-briefing,.ocard.st-paid{border-left-color:var(--lime)} .ocard.st-pending{border-left-color:var(--dink-soft)} .ocard.st-cancelled{border-left-color:var(--red);opacity:.85}
.ocard .oh{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.ocard .oh .t{font-weight:700;font-size:16px}
.ocard .ometa{font-size:13px;color:var(--dink-soft);margin:4px 0 8px}
.ocard .ov{font-size:14px;margin:8px 0 6px}
.ocards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-bottom:8px}
.ocards .ocard{margin-bottom:0;padding:14px 16px}
.ocards .ocard .oh .t{font-size:15px}

/* grid 2col para editor do cliente (etiqueta + valor) */
.numgrid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:640px){.numgrid2{grid-template-columns:1fr}}
.numgrid2 .fieldcard{margin-bottom:0}

/* ============ CONSTRUTOR DE TEMPLATES ============ */
.tpl-modal{max-width:920px}
.tpl-list{display:flex;flex-direction:column;gap:8px}
.tpl-item{display:flex;align-items:center;gap:10px;background:var(--dpanel2);border:1px solid var(--dline);border-radius:11px;padding:11px 14px}
.tpl-grid{display:grid;grid-template-columns:1fr 300px;gap:20px;align-items:start;margin-top:8px}
@media(max-width:720px){.tpl-grid{grid-template-columns:1fr}}
.tpl-form label{margin-top:10px}
.tpl-btnrow{display:flex;gap:8px;align-items:center;margin:6px 0;flex-wrap:wrap}
.tpl-btnrow select{width:auto;min-width:130px}
.tpl-btnrow input{flex:1;min-width:120px}
.tpl-prev{position:sticky;top:10px}
.tpl-phone{background:#e5ddd5;border-radius:16px;padding:16px 12px;min-height:180px;background-image:linear-gradient(rgba(229,221,213,.6),rgba(229,221,213,.6))}
.tpl-bubble{background:#fff;border-radius:10px;padding:10px 12px;box-shadow:0 1px 2px rgba(0,0,0,.15);max-width:100%;font-size:13.5px;color:#111}
.tpl-bubble .pv-head{font-weight:700;margin-bottom:6px;color:#111}
.tpl-bubble .pv-media{background:#f0f2f5;border-radius:8px;padding:22px;text-align:center;color:#667;margin-bottom:8px;font-size:13px}
.tpl-bubble .pv-text{white-space:pre-wrap;line-height:1.45;color:#111}
.tpl-bubble .pv-foot{color:#8a94a0;font-size:12px;margin-top:6px}
.tpl-bubble .pv-btns{border-top:1px solid #eee;margin-top:8px;padding-top:6px;display:flex;flex-direction:column;gap:4px}
.tpl-bubble .pv-btn{color:#0a7cff;text-align:center;font-weight:600;font-size:13px;padding:5px;border-top:1px solid #f0f2f5}
.tpl-bubble .pv-btn:first-child{border-top:none}
.tpl-bubble .pv-var{background:#e4fc67;color:#3a4210;border-radius:4px;padding:0 4px;font-weight:700;font-family:'Space Mono',monospace;font-size:12px}
.tpl-bubble .pv-img{width:100%;max-height:190px;object-fit:cover;border-radius:8px;margin-bottom:8px;display:block}
.tpl-item.tview:hover{border-color:#0d0f08}

/* ============ BARRA DE BUSCA + ATUALIZAR ============ */
.listbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:4px 0 8px}
.searchbox{flex:1;min-width:200px;background:#fff;border:1.5px solid var(--dline);border-radius:11px;padding:11px 14px;font-size:14.5px}
.listbar .btn{white-space:nowrap}
@media(max-width:520px){.listbar .btn{width:100%;justify-content:center}}
.groupbar{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin:2px 0 12px}
.groupbar .glabel{font-family:'Space Mono',monospace;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--dink-soft);margin-right:4px}
.groupbar button{background:var(--dpanel2);border:1px solid var(--dline);font-family:'Space Grotesk';font-weight:600;font-size:13px;color:var(--dink-soft);padding:7px 13px;border-radius:9px;cursor:pointer;transition:.12s}
.groupbar button:hover{border-color:#0d0f08}
.groupbar button.on{background:var(--lime);color:#1a1e08;border-color:#cfe053}
.numgroup{margin-bottom:6px}
.numgroup .osect{margin:16px 0 10px}
/* colunas por status dentro da seção de etiqueta (alto | médio | baixo …) */
.statuscols{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;align-items:start}
.statuscol{display:flex;flex-direction:column;gap:12px;min-width:0}
/* analytics do monitoramento */
.hrow .anl2{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--dink);font-size:13px}
.anrow{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px;border-top:1px solid var(--dline);padding-top:14px}
@media(max-width:520px){.anrow{grid-template-columns:repeat(2,1fr)}}
.anbox{text-align:center}
.anbox .ann{font-size:20px;font-weight:700;letter-spacing:-.02em;line-height:1}
.anbox .anl{font-size:11px;color:var(--dink-soft);margin-top:4px}
/* layout do painel (dashboard) */
.dashgrid{display:grid;grid-template-columns:1.55fr 1fr;gap:16px;align-items:start;margin-top:8px}
@media(max-width:1100px){.dashgrid{grid-template-columns:1fr}}
.dashmain{display:flex;flex-direction:column;gap:16px;min-width:0}
.dashside{display:flex;flex-direction:column;gap:16px;min-width:0}
.dctitle .cbadge{font-family:'Space Mono',monospace;font-size:10px;background:#f6dbd3;color:#a5341f;border-radius:20px;padding:1px 7px;margin-left:6px}
.scrolllist{display:flex;flex-direction:column;max-height:340px;overflow:auto;margin:-4px -6px;padding:0 6px}
.lrow{display:flex;align-items:center;gap:10px;padding:9px 4px;border-top:1px solid var(--dline);cursor:pointer}
.lrow:first-child{border-top:none}
.lrow:hover{background:var(--dpanel2)}
.rdot{width:9px;height:9px;border-radius:50%;flex:0 0 9px}
.tpl-chip{display:inline-block;font-size:12px;font-weight:600;background:#e8ecd6;color:#3a4212;border:1px solid #d3dab0;padding:2px 9px;border-radius:20px;margin:2px 4px 2px 0}

/* ============ DISPARADOR ============ */
.bc-card{background:var(--dpanel2);border:1px solid var(--dline);border-radius:13px;padding:14px 16px;margin-bottom:10px}
.bc-bar{height:8px;background:#e6e3d7;border-radius:6px;overflow:hidden;margin-top:8px}
.bc-bar i{display:block;height:100%;background:linear-gradient(90deg,#8ab41f,#3f7d32);border-radius:6px;transition:width .5s ease}
.bc-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.bc-fails{margin-top:8px}
.bc-faillist{background:#fbeee9;border:1px solid #ecc6bb;border-radius:8px;padding:8px 10px;max-height:160px;overflow:auto;display:flex;flex-direction:column;gap:3px}
.bc-step{background:var(--dpanel);border:1px solid var(--dline);border-radius:12px;padding:14px 16px;margin-bottom:12px}
.bc-step>b{color:var(--acc);margin-right:6px}
.bc-map{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.bc-maprow{display:flex;align-items:center;gap:10px}
.bc-maprow>span{width:90px;font-size:13px;font-weight:600;color:var(--dink-soft)}
.bc-maprow select{flex:1}

/* ===== mobile: top bar + bottom nav (estilo app PWA) ===== */
@media(max-width:820px){
  .ashell{display:block;min-height:100vh}
  .aside{display:block;position:static;height:auto;padding:0;background:transparent;border:none}
  /* TOP BAR (logo + sair) */
  .abrand{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;gap:8px;
    padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:#edeadf;border-bottom:1px solid var(--dline)}
  .abrand img{height:22px}
  .foot{position:fixed;top:0;right:8px;z-index:41;display:flex;align-items:center;border:none;padding:0;margin:0;
    height:calc(52px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top)}
  .foot .who{display:none}
  .foot .out{padding:8px 12px;border-radius:10px;font-size:13.5px}
  /* BOTTOM NAV */
  .anav{position:fixed;bottom:0;left:0;right:0;z-index:40;display:flex;flex-direction:row;gap:2px;
    background:#edeadf;border-top:1px solid var(--dline);
    padding:6px 6px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -2px 12px rgba(20,18,10,.06)}
  .anav a{position:relative;flex:1;flex-direction:column;gap:3px;align-items:center;justify-content:center;
    padding:8px 2px;border-radius:13px;font-size:10.5px;font-weight:600;text-align:center;line-height:1.1}
  .anav a span{font-size:10.5px}
  .anav a .ic{width:22px;height:22px;opacity:.75}
  .anav a.on{background:var(--lime);color:#1a1e08}
  .anav a.on .ic{opacity:1}
  .anav a .cnt{position:absolute;top:3px;right:calc(50% - 22px);margin:0;font-size:9px;padding:0 5px;min-width:16px;text-align:center}
  /* conteúdo entre as barras */
  .amain{padding:72px 14px 90px;min-width:0;max-width:100vw}
  .head,.headrow{margin-top:0}
}