:root{
  color-scheme:light;
  --bg:#f4f6fb;--panel:#ffffff;--panel-2:#f9fafb;--text:#111827;--muted:#5a6470;--line:#e5e7eb;--line-strong:#d6dbe6;--accent:#c9a34a;--accent-text:#1a1207;--accent-2:#f5d77b;--brand:#111827;--blue:#2563eb;--green:#16a34a;--red:#dc2626;--orange:#f97316;--yellow:#ca8a04;--purple:#7c3aed;--shadow:0 18px 45px rgba(var(--shadow-rgb),.08);--shadow-soft:0 8px 22px rgba(var(--shadow-rgb),.06);--radius:22px;--radius-sm:14px;--r-2xs:6px;--r-xs:8px;--r-sm:12px;--r-md:16px;--r-lg:20px;--r-pill:999px;--shadow-rgb:15,23,42;
  /* alpha.937 — MOTION (fonte única; eleva o easing dos gráficos a token global) */
  --ease-standard:cubic-bezier(.4,0,.2,1);--ease-emphasized:cubic-bezier(.34,1.56,.64,1);
  --dur-1:140ms;--dur-2:220ms;--dur-3:320ms;--transition:var(--dur-1) var(--ease-standard);
  --hover-tint:color-mix(in srgb,var(--accent) 8%,transparent);
  /* alpha.937 — RAIO unificado: o legado --radius/--radius-sm passa a apontar p/ a escala nova (density-aware colapsado) */
  --radius:var(--r-lg);--radius-sm:var(--r-sm)
}
@media (prefers-color-scheme: dark){html[data-theme="auto"]{color-scheme:dark;--bg:#080b12;--panel:#10141d;--panel-2:#151b27;--text:#f8fafc;--muted:#a7b0c0;--line:#242b3a;--line-strong:#334155;--brand:#f8fafc;--shadow:0 18px 45px rgba(0,0,0,.32);--shadow-soft:0 8px 22px rgba(0,0,0,.24);--shadow-rgb:0,0,0}}
html[data-theme="dark"]{color-scheme:dark;--bg:#080b12;--panel:#10141d;--panel-2:#151b27;--text:#f8fafc;--muted:#a7b0c0;--line:#242b3a;--line-strong:#334155;--brand:#f8fafc;--shadow:0 18px 45px rgba(0,0,0,.32);--shadow-soft:0 8px 22px rgba(0,0,0,.24);--shadow-rgb:0,0,0}
html[data-theme="light"]{color-scheme:light;--bg:#f4f6fb;--panel:#ffffff;--panel-2:#f9fafb;--text:#111827;--muted:#5a6470;--line:#e5e7eb;--line-strong:#d6dbe6;--brand:#111827;--shadow:0 18px 45px rgba(var(--shadow-rgb),.08);--shadow-soft:0 8px 22px rgba(var(--shadow-rgb),.06)}
*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);min-height:100vh;position:relative;z-index:0}a{color:inherit;text-decoration:none}small,.muted{color:var(--muted)}
.topbar{position:sticky;top:0;z-index:30;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 88%,transparent);backdrop-filter:blur(18px);box-shadow:0 1px 0 rgba(255,255,255,.04)}
.brand{display:flex;align-items:center;gap:12px;font-weight:950;font-size:20px;letter-spacing:-.03em;white-space:nowrap}.logo{width:38px;height:38px;border-radius:15px;background:linear-gradient(135deg,#111827,#3f3f46);color:#f8d36a;display:inline-flex;align-items:center;justify-content:center;font-weight:950;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 8px 20px rgba(0,0,0,.18)}.logo.big{width:78px;height:78px;border-radius:28px;font-size:36px;margin:auto}
.build-pill{display:inline-flex;align-items:center;height:22px;padding:0 8px;border:1px solid color-mix(in srgb,var(--accent) 26%,var(--line));border-radius:var(--r-pill);background:rgba(var(--accent-rgb),.08);color:color-mix(in srgb,var(--accent) 80%,var(--text));font-size:11px;font-weight:900;letter-spacing:0}
.topnav{display:flex;align-items:center;gap:8px;overflow:auto;scrollbar-width:thin;padding:4px}.topnav a{white-space:nowrap;padding:10px 13px;border-radius:var(--r-pill);color:var(--muted);font-weight:850;border:1px solid transparent;transition:.16s ease;background:transparent}.topnav a:hover,.topnav a.drag-over{background:rgba(var(--accent-rgb),.12);color:var(--text);border-color:rgba(var(--accent-rgb),.24)}.topnav a.dragging{opacity:.45;transform:scale(.96)}
.top-actions{display:flex;align-items:center;gap:8px}.icon-btn{width:40px;height:40px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel);color:var(--text);font-weight:950;cursor:pointer;box-shadow:var(--shadow-soft)}.user-menu{position:relative}.user-menu summary{list-style:none;cursor:pointer;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:11px 14px;font-weight:900;color:var(--text);box-shadow:var(--shadow-soft);max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-menu summary::-webkit-details-marker{display:none}.user-menu div{position:absolute;right:0;top:48px;min-width:190px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow);padding:12px;display:grid;gap:8px}.user-menu a{font-weight:850;color:var(--accent)}
.main{padding:30px;max-width:1680px;margin:0 auto}.main-login{min-height:100vh;display:grid;place-items:center}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px}.page-head h1{margin:0;font-size:clamp(28px,4vw,46px);letter-spacing:-.055em}.page-head p{margin:7px 0 0;color:var(--muted);font-weight:650}.page-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.card,.metric,.login-card,.tool-card{background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 96%,transparent),var(--panel));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.card{padding:22px;margin-bottom:20px}.card h2{margin:0 0 16px;font-size:20px;letter-spacing:-.02em}.cards-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px}.metric{padding:18px;display:grid;gap:8px;min-height:104px}.metric span{color:var(--muted);font-weight:800;font-size:13px}.metric strong{font-size:27px;letter-spacing:-.045em}.metric.mini{box-shadow:none;margin:0;min-width:170px}.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.tool-card{padding:18px;display:grid;gap:10px}.tool-card h3{margin:0;font-size:18px}.tool-card p{margin:0;color:var(--muted);line-height:1.45}
.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--panel);border-radius:var(--r-sm);padding:11px 16px;font-weight:900;cursor:pointer;color:var(--text);box-shadow:var(--shadow-soft);transition:.15s ease}.btn:hover{transform:translateY(-1px);border-color:rgba(var(--accent-rgb),.45)}.btn.primary{background:linear-gradient(135deg,#111827,#2b2f3a);border-color:#2b2f3a;color:white}.btn.danger{background:rgba(220,38,38,.1);color:var(--red);border-color:rgba(220,38,38,.25)}.btn.small{padding:7px 10px;border-radius:var(--r-sm);font-size:12px}.strong{font-weight:950;color:var(--accent)}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.form-stack{display:grid;gap:14px}.inline-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.full{grid-column:1/-1}label{display:grid;gap:6px;font-weight:850;color:var(--muted);font-size:13px}input,select,textarea{width:100%;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 13px;color:var(--text);font:inherit;outline:none;min-height:44px}input[type=checkbox],input[type=radio]{width:auto;min-width:0;height:auto;min-height:0;padding:0;box-shadow:none}/* alpha.967 — checkbox/radio crus não herdam width:100%/min-height:44px/padding do input (ficavam gigantes) */input:focus,select:focus,textarea:focus{border-color:rgba(var(--accent-rgb),.55);box-shadow:0 0 0 4px rgba(var(--accent-rgb),.12)}textarea{resize:vertical;min-height:90px}.check{display:flex;align-items:center;gap:8px}.check input{width:auto}.helper-box{border:1px dashed var(--line-strong);background:rgba(var(--accent-rgb),.09);padding:14px;border-radius:var(--r-md);color:var(--muted);font-weight:750;line-height:1.45}.filters{padding:16px}.filters input{min-width:min(360px,100%)}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel)}table{width:100%;border-collapse:separate;border-spacing:0}.table-wrap table{min-width:820px}/* 0.2.0-alpha.5 — min-width:820px ERA global em toda <table> → tabelas do wiki/cliente ficavam 820px no mobile e o iOS EXPANDIA o layout viewport (media queries achavam tela larga → "mobile abrindo como desktop"). Agora só nas tabelas do ERP dentro de .table-wrap (que rolam). */th,td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:middle}th{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);background:color-mix(in srgb,var(--panel-2) 86%,transparent);position:sticky;top:0;z-index:1}tr:last-child td{border-bottom:0}.orders-table tbody tr{transition:.12s ease}.orders-table tbody tr:hover{filter:saturate(1.08);box-shadow:inset 4px 0 0 rgba(var(--accent-rgb),.65)}.orders-table td:nth-child(4){min-width:240px}.orders-table td:nth-child(5){min-width:140px}.orders-table small{color:var(--muted)}.group-row td{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:950;color:var(--muted);background:var(--panel-2)!important;border-bottom:1px solid var(--line-strong)}
.status-row-open{background:rgba(239,68,68,.075)}.status-row-printing{background:rgba(249,115,22,.095)}.status-row-paused{background:rgba(245,158,11,.08)}.status-row-ready{background:rgba(234,179,8,.11)}.status-row-label{background:rgba(22,163,74,.10)}.status-row-delivered{background:rgba(37,99,235,.095)}.status-row-canceled{background:rgba(100,116,139,.075)}.status-row-warranty{background:rgba(var(--accent-rgb),.12)}
.badge{display:inline-flex;border-radius:var(--r-pill);padding:6px 10px;font-size:12px;font-weight:950;border:1px solid transparent;white-space:nowrap}.badge.gray{background:#eef0f4;color:#475569}.badge.blue,.badge.blue-soft{background:rgba(37,99,235,.13);color:var(--blue)}.badge.green,.badge.green-soft{background:rgba(22,163,74,.13);color:var(--green)}.badge.red,.badge.red-soft{background:rgba(220,38,38,.13);color:var(--red)}.badge.orange,.badge.orange-soft{background:rgba(249,115,22,.15);color:#c2410c}.badge.amber-soft{background:rgba(245,158,11,.15);color:#b45309}.badge.yellow-soft{background:rgba(234,179,8,.18);color:#9a6700}.badge.purple{background:rgba(124,58,237,.13);color:var(--purple)}.badge.gold{background:rgba(var(--accent-rgb),.18);color:#9a7416}.pill{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-pill);padding:5px 9px;font-size:12px;font-weight:900;color:var(--muted);background:rgba(127,127,127,.06)}
.flash{margin:0 0 16px;padding:13px 15px;border-radius:var(--r-sm);font-weight:850}.flash.success{background:rgba(22,163,74,.13);color:var(--green)}.flash.error{background:rgba(220,38,38,.13);color:var(--red)}.login-card{width:min(920px,94vw);display:grid;grid-template-columns:1fr 1fr;padding:26px;gap:22px}.login-hero{display:grid;place-content:center;text-align:center;padding:28px}.login-hero h1{font-size:44px;margin:16px 0 6px;letter-spacing:-.06em}.details-form{margin-top:16px}.details-form summary{cursor:pointer;font-weight:950;color:var(--accent);margin-bottom:14px}.file-list{display:grid;gap:10px;padding:0;margin:12px 0;list-style:none}.file-list li{border:1px solid var(--line);border-radius:var(--r-sm);padding:12px;display:flex;justify-content:space-between;gap:10px}.timeline{border-left:2px solid var(--line);padding-left:18px}.timeline li{margin-bottom:14px}.timeline span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.kanban{display:grid;grid-template-columns:repeat(6,minmax(250px,1fr));gap:16px;align-items:stretch;overflow-x:auto;overflow-y:hidden;max-height:calc(100dvh - 220px);min-height:360px;padding-bottom:10px}.kanban-col{display:flex;flex-direction:column;min-height:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}.kanban-col h2{flex:0 0 auto;font-size:16px;margin:0 0 12px;display:flex;justify-content:space-between;align-items:center}.kanban-col-cards{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;margin:0 -4px;padding:0 4px}.kanban-col-empty{color:var(--muted);text-align:center;padding:18px 0;font-size:13px;opacity:.6}.kanban-col h2 span{background:rgba(var(--accent-rgb),.16);color:var(--accent);border-radius:var(--r-pill);padding:4px 8px;font-size:12px}.kanban-card{display:grid;gap:7px;border:1px solid var(--line);border-radius:var(--r-md);padding:13px;margin-bottom:10px;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(127,127,127,.03));box-shadow:var(--shadow-soft)}.kanban-card:hover{border-color:rgba(var(--accent-rgb),.55);transform:translateY(-1px)}.kanban-card strong{font-size:14px}.kanban-card span{font-weight:850}.kanban-card small{color:var(--muted)}.kanban-card em{font-style:normal;color:var(--accent);font-size:12px;font-weight:850}.kanban-card.status-row-open,.kanban-card.status-row-printing,.kanban-card.status-row-ready,.kanban-card.status-row-label,.kanban-card.status-row-delivered{background:inherit}
.label-sheet{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.print-label{border:1px dashed var(--line-strong);border-radius:var(--r-md);padding:14px;background:var(--panel);display:grid;gap:8px;page-break-inside:avoid}.print-label h3{margin:0;font-size:16px}.barcode{width:100%;height:70px;color:var(--text)}.report-print{background:white;color:#111827}.report-print .topbar,.report-print .no-print{display:none!important}
@media print{body{background:white;color:#111827}.topbar,.no-print,.page-actions,.filters{display:none!important}.main{padding:0;max-width:none}.card{box-shadow:none;border:0}.label-sheet{grid-template-columns:repeat(2,1fr)}.print-label{border:1px solid #999}.table-wrap{border:0}th{position:static}.barcode{color:#000}}
@media(max-width:1200px){.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kanban{grid-template-columns:repeat(3,minmax(250px,1fr))}.topbar{grid-template-columns:1fr auto}.topnav{grid-column:1/-1;order:3}}
@media(max-width:900px){.main{padding:16px}.form-grid,.form-grid.three{grid-template-columns:1fr}.page-head{align-items:stretch;flex-direction:column}.login-card{grid-template-columns:1fr}.login-hero{padding:8px}.login-hero h1{font-size:34px}.topbar{padding:12px}.brand span:last-child{display:none}.user-menu summary{max-width:110px}.label-sheet{grid-template-columns:1fr}}
@media(max-width:560px){.cards-grid,.tool-grid{grid-template-columns:1fr}.inline-form{display:grid}.btn{width:100%}.card{padding:16px}.metric strong{font-size:23px}.file-list li{display:grid}.kanban{grid-template-columns:1fr;max-height:none;min-height:0;overflow:visible}.kanban-col{min-height:auto}.kanban-col-cards{overflow:visible}.top-actions{gap:5px}.icon-btn{width:38px;height:38px}.user-menu summary{padding:10px 11px}.form-grid,.form-stack,.inline-form{gap:10px}.login-card,.customer-portal-v49{padding:16px;gap:16px}.customer-login-card h2{font-size:20px}
  .table-wrap{overflow-x: auto;}.table-wrap table:not(.no-card-view){border-spacing: 0;width: 100%;border: 0;}.table-wrap table:not(.no-card-view) thead{display: none;}.table-wrap table:not(.no-card-view) tbody,.table-wrap table:not(.no-card-view) tr{display: block;}.table-wrap table:not(.no-card-view) tr{margin-bottom: 1rem;border: 1px solid var(--line);border-radius: var(--radius-sm);box-shadow: var(--shadow-soft);padding: 10px;background: var(--panel);}.table-wrap table:not(.no-card-view) td{display: block;text-align: right;border: none;padding: 8px 0;position: relative;font-size: 14px;clear: both;}.table-wrap table:not(.no-card-view) td::before{content: attr(data-label);float: left;font-weight: 850;text-transform: uppercase;font-size: 11px;color: var(--muted);padding-right: 10px;white-space: nowrap;}.table-wrap table:not(.no-card-view) td:last-child{border-bottom: 0;}.table-wrap table:not(.no-card-view) td .pill,.table-wrap table:not(.no-card-view) td .badge{float: right;}.table-wrap table:not(.no-card-view) td .customer-cell,.table-wrap table:not(.no-card-view) td .customer-list-name{display: flex;flex-direction: column;align-items: flex-end;text-align: right;}.table-wrap table:not(.no-card-view) td .customer-list-name img{margin-left: auto;}}

/* Zoukei UI v4 - compactação, scroll duplo, colunas arrastáveis e etiquetas QR */
html[data-density="compact"]{font-size:14px} /* alpha.937 — raio colapsado: densidade muda só a fonte, não o raio */
html[data-density="normal"]{font-size:16px}
html[data-density="comfortable"]{font-size:17px} /* alpha.937 — raio colapsado (ver acima) */
html[data-density="compact"] .main{padding:10px 12px}
html[data-density="normal"] .main{padding:16px 18px}
html[data-density="comfortable"] .main{padding:24px 28px}
.main{max-width:none;width:100%;}
.card{padding:clamp(14px,1.2vw,20px);margin-bottom:14px}.page-head{margin-bottom:14px}.page-head h1{font-size:clamp(24px,3vw,38px)}
.topbar{padding:10px 14px}.brand{font-size:18px}.topnav a{padding:8px 11px}.icon-btn{width:38px;height:38px}.density-control{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:5px 7px;box-shadow:var(--shadow-soft);font-size:12px;color:var(--muted);font-weight:900}.density-control span{white-space:nowrap}.density-control select{min-height:30px;border:0;background:transparent;padding:4px 22px 4px 4px;font-weight:900;min-width:92px}
.table-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 10px;color:var(--muted)}.table-toolbar strong{color:var(--text)}.table-toolbar small{display:block;margin-top:3px}
.dual-scroll{display:grid;gap:6px}.table-scrollbar{overflow-x:auto;overflow-y:hidden;height:16px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--panel-2)}.table-scrollbar>div{height:1px}.table-scrollbar-bottom{height:14px}.dual-scroll .table-wrap{border-radius:var(--r-sm);max-width:100%}
th[draggable="true"]{cursor:grab;user-select:none;position:sticky}th[draggable="true"]::after{content:' ⋮⋮';opacity:.35;font-weight:900}th.col-dragging{opacity:.45}th.col-drag-over{outline:2px solid rgba(var(--accent-rgb),.65);outline-offset:-3px;background:rgba(var(--accent-rgb),.12)!important}.reorderable-table td,.reorderable-table th{transition:background .12s ease}
.quick-status-form{margin:0}.quick-status-form .status-select{min-width:168px;min-height:34px;padding:6px 30px 6px 10px;border-radius:var(--r-pill);font-size:12px;font-weight:950}.status-select[data-status="fila"]{background:rgba(220,38,38,.13);color:var(--red);border-color:rgba(220,38,38,.22)}.status-select[data-status="producao"]{background:rgba(249,115,22,.15);color:#c2410c;border-color:rgba(249,115,22,.26)}.status-select[data-status="finalizado"]{background:rgba(234,179,8,.18);color:#9a6700;border-color:rgba(234,179,8,.28)}.status-select[data-status="etiqueta"]{background:rgba(22,163,74,.13);color:var(--green);border-color:rgba(22,163,74,.25)}.status-select[data-status="entregue"]{background:rgba(37,99,235,.13);color:var(--blue);border-color:rgba(37,99,235,.25)}
html[data-density="compact"] th,html[data-density="compact"] td{padding:8px 10px}html[data-density="compact"] .orders-table{font-size:13px}html[data-density="compact"] .badge{padding:5px 8px;font-size:11px}html[data-density="compact"] .quick-status-form .status-select{min-width:148px;font-size:11px;min-height:30px}.orders-table td:nth-child(4){min-width:210px}.orders-table td:nth-child(5){min-width:120px}.orders-table{min-width:1180px}
.label-sheet{grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}.qr-label{grid-template-columns:1fr auto;align-items:center}.label-main{display:grid;gap:8px}.label-qr{display:grid;justify-items:center;gap:4px}.qr-code{width:132px;height:132px;border-radius:var(--r-sm);background:white;padding:6px;border:1px solid #d1d5db}.actions-cell{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.actions-cell form{margin:0}code{background:rgba(127,127,127,.12);padding:2px 6px;border-radius:var(--r-2xs)}
@media(max-width:900px){.density-control span{display:none}.density-control select{min-width:86px}.table-toolbar{align-items:flex-start;flex-direction:column}.topbar{grid-template-columns:1fr auto}.qr-label{grid-template-columns:1fr}.label-qr{justify-items:start}.main{padding:12px}.card{border-radius:var(--r-md)}}
@media print{.table-toolbar,.table-scrollbar{display:none!important}.qr-code{border:0}.qr-label{grid-template-columns:1fr auto}}

/* Zoukei UI v4.1 - menu dropdown e filtros recolhíveis */
.topnav-dropdown{overflow:visible;gap:10px;align-items:center}
.nav-group{position:relative;display:flex;align-items:center;flex:0 0 auto}
.nav-group .nav-trigger{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:8px 12px;border-radius:var(--r-pill);color:var(--muted);font-weight:850;border:1px solid transparent;transition:.16s ease;background:transparent;cursor:pointer;font:inherit}
.nav-group .caret{font-size:11px;opacity:.75}
.nav-group:hover .nav-trigger,.nav-group:focus-within .nav-trigger,.nav-group.active .nav-trigger,.nav-group.drag-over .nav-trigger{background:rgba(var(--accent-rgb),.12);color:var(--text);border-color:rgba(var(--accent-rgb),.24)}
.nav-group.dragging{opacity:.45;transform:scale(.96)}
.dropdown-panel{position:absolute;left:0;top:calc(100% + 10px);min-width:220px;background:color-mix(in srgb,var(--panel) 96%,transparent);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow);padding:8px;display:grid;gap:4px;opacity:0;transform:translateY(8px);pointer-events:none;transition:.16s ease;backdrop-filter:blur(18px)}
.dropdown-panel a{display:flex;align-items:center;padding:11px 12px;border-radius:var(--r-sm);font-weight:800;color:var(--text)}
.dropdown-panel a:hover,.dropdown-panel a.current{background:rgba(var(--accent-rgb),.12);color:var(--text)}
.nav-group:hover .dropdown-panel,.nav-group:focus-within .dropdown-panel{opacity:1;transform:translateY(0);pointer-events:auto}

.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:14px}
.section-head h2{margin:0 0 6px;font-size:20px;letter-spacing:-.02em}
.section-head p{margin:0;color:var(--muted);font-weight:650}
.section-head-actions{display:flex;gap:8px;flex-wrap:wrap}
.filters-shell{padding:16px 18px}.filters-shell .section-head{margin-bottom:0}
.filters-body{margin-top:16px;transition:.18s ease;overflow:hidden}
.filters-body.is-collapsed{display:none}
.filters-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.filters-grid .full{grid-column:1/-1}
.filters-actions{display:flex;gap:10px;justify-content:flex-end;align-items:center;margin-top:14px;flex-wrap:wrap}

html[data-density="compact"] .filters-shell{padding:14px 16px}
html[data-density="compact"] .filters-grid{gap:10px}
html[data-density="compact"] .section-head h2{font-size:18px}

@media(max-width:1200px){.filters-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.topnav-dropdown{grid-column:1/-1;order:3;overflow:auto;padding-bottom:2px}.dropdown-panel{position:fixed;left:12px;right:12px;top:auto;min-width:0}.nav-group{position:static}.section-head{align-items:stretch;flex-direction:column}.filters-grid{grid-template-columns:1fr}.filters-actions{justify-content:stretch}.filters-actions .btn{width:100%}}

/* Zoukei UI v4.2 - configurador de colunas e diagnóstico */
.toolbar-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.column-config-panel{border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 98%,transparent);border-radius:var(--r-md);padding:14px;margin:0 0 12px;box-shadow:var(--shadow-soft)}
.column-config-panel.is-hidden{display:none}
.compact-head{margin-bottom:12px}.compact-head h3{margin:0 0 5px;font-size:18px;letter-spacing:-.02em}.compact-head p{margin:0;color:var(--muted);font-weight:650}
.column-config-grid{display:grid;grid-template-columns:repeat(5,minmax(140px,1fr));gap:10px}.column-config-item{border:1px solid var(--line);border-radius:var(--r-sm);padding:10px;background:var(--panel-2);display:grid;gap:8px}.column-config-item label{font-size:12px}.column-config-item input[type="text"]{min-height:34px;padding:7px 9px;border-radius:var(--r-sm)}.column-config-item .check{display:flex;font-size:12px;color:var(--text);font-weight:850}.col-hidden{display:none!important}.diagnostic-preview{white-space:pre-wrap;max-height:360px;overflow:auto;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:14px;color:var(--muted);font-size:12px;line-height:1.45}.diagnostic-card .btn{width:auto}
@media(max-width:1300px){.column-config-grid{grid-template-columns:repeat(3,minmax(140px,1fr))}}
@media(max-width:760px){.column-config-grid{grid-template-columns:1fr}.toolbar-actions{justify-content:stretch}.toolbar-actions .btn,.diagnostic-card .btn{width:100%}}

/* Zoukei UI v4.3 - menu configurável, versão/rollback, etiquetas térmicas e status público */
.menu-config-group{display:grid;gap:10px;margin:12px 0 18px}.menu-config-group h3{margin:0;font-size:17px}.copy-link-input{display:block;width:100%;max-width:100%;box-sizing:border-box;margin:8px 0 0;background:rgba(255,255,255,.6)}
.public-status{max-width:860px}.public-status-card{text-align:center;margin-top:clamp(18px,5vh,70px)}.public-status-card .logo.big{margin:0 auto 14px}.public-order-code{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-pill);padding:8px 14px;margin:12px auto;font-weight:950;color:var(--accent);background:rgba(var(--accent-rgb),.10)}.public-status-badge{margin:10px 0 18px}.public-status-card .table-wrap{text-align:left;margin:18px 0}.label-select-form input[readonly]{font-size:12px;min-height:34px;padding:6px 9px}.thermal-label-page .barcode{height:14mm!important;color:#000!important}.thermal-label-page .barcode text{font-size:8px!important}.thermal-label-page .qr-code{background:#fff!important}
@media print{.thermal-label-page{box-shadow:none!important;border:0!important}.thermal-label-page .qr-code{border:0!important}.thermal-label-page .barcode{color:#000!important}}

/* Zoukei UI v4.4 - mídia pública do pedido e impressão térmica guiada */
.public-media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin:14px 0}.public-media-card{margin:0;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel);padding:10px;box-shadow:var(--shadow-soft);display:grid;gap:8px}.public-media-card img,.public-media-card video{width:100%;max-height:260px;object-fit:cover;border-radius:var(--r-sm);background:#111}.public-media-card figcaption{font-weight:850;line-height:1.3}.public-media-card small{color:var(--muted)}.internal-media-grid .public-media-card img,.internal-media-grid .public-media-card video{max-height:210px}.public-status .public-media-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.copy-link-input{font-size:13px}
@media(max-width:680px){.public-media-grid{grid-template-columns:1fr}.public-media-card img,.public-media-card video{max-height:none}}

/* Zoukei ERP v4.5 - cadastro completo de cliente */
.customer-cell{display:grid;gap:2px;min-width:190px;line-height:1.18}.customer-cell strong{font-weight:850}.customer-cell small{display:block;color:var(--muted);font-weight:650}.customer-form h2,.customer-form h3{margin:6px 0 0;font-size:18px;letter-spacing:-.02em}.inline-field{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.inline-field .btn{height:42px;white-space:nowrap}.customer-photo-preview{display:grid;gap:6px;align-content:end}.customer-photo-preview img{width:84px;height:84px;object-fit:cover;border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:0 10px 30px rgba(var(--shadow-rgb),.12)}.customer-list-name{display:flex;align-items:center;gap:10px;min-width:230px}.customer-list-name img{width:44px;height:44px;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--line)}.customer-list-name span{display:grid;gap:2px}.customer-list-name small{color:var(--muted);font-weight:650}.customer-register-page{max-width:980px;margin:0 auto;display:grid;gap:18px}.customer-register-hero{display:grid;gap:10px;text-align:center;justify-items:center}.customer-register-hero p{max-width:660px;color:var(--muted);font-weight:700}.customer-register-page .customer-form{padding:22px}.customer-register-done{max-width:720px;margin:40px auto}.helper-box.success{border-color:rgba(34,197,94,.28);background:rgba(34,197,94,.08)}.helper-box.error{border-color:rgba(239,68,68,.28);background:rgba(239,68,68,.08);color:#991b1b}
@media(max-width:760px){.inline-field{grid-template-columns:1fr}.inline-field .btn{width:100%}.customer-list-name{min-width:0}.customer-register-page .customer-form{padding:16px}}

/* Zoukei ERP v4.6 - Fretes */
.helper-box.success{border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.08)}
.helper-box.error{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.08)}
.raw-api{margin-top:14px;border:1px solid var(--line);border-radius:var(--r-md);padding:12px;background:var(--soft)}
.raw-api summary{cursor:pointer;font-weight:800;color:var(--muted)}
.raw-api pre{white-space:pre-wrap;word-break:break-word;max-height:360px;overflow:auto;font-size:12px}

/* Zoukei ERP v4.7 - configurações compactas, cadastro dinâmico e cliente mais legível */
.settings-head{margin-bottom:12px}.settings-quick-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:14px}.tool-card.small{padding:14px 16px;min-height:auto;border-radius:var(--r-md)}.tool-card.small h3{font-size:15px;margin:0 0 4px}.tool-card.small p{font-size:12px;margin:0;color:var(--muted)}.settings-panels{display:grid;gap:12px}.settings-panel{padding:0;overflow:hidden}.settings-panel>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;cursor:pointer;border-radius:var(--radius);font-weight:850}.settings-panel>summary::-webkit-details-marker{display:none}.settings-panel>summary strong{font-size:17px}.settings-panel>summary span{font-size:12px;color:var(--muted);font-weight:650;text-align:right}.settings-panel[open]>summary{border-bottom:1px solid var(--line);border-radius:var(--radius) var(--radius) 0 0}.settings-panel form,.settings-panel .inline-test-form,.settings-panel .mini-config-group{margin:12px 16px}.compact-form{gap:10px}.compact-form input,.compact-form select,.compact-form textarea{min-height:38px;padding:9px 11px}.mini-config-group{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);overflow:hidden}.mini-config-group>summary{cursor:pointer;padding:10px 12px;font-weight:850}.compact-table-wrap{overflow:auto}.compact-table th,.compact-table td{padding:8px 10px;font-size:13px}.compact-table input,.compact-table select{min-height:34px;padding:7px 9px}.inline-test-form{display:flex;gap:10px;align-items:center}.inline-test-form input{max-width:360px}.customer-cell{min-width:190px;line-height:1.2}.customer-cell strong{display:block;font-size:14px;font-weight:900;color:var(--text);margin-bottom:3px}.customer-cell small{display:block;color:var(--muted);font-size:12px}.orders-table td[data-col-key="cliente"]{background:color-mix(in srgb,var(--panel) 35%,transparent)}.customer-register-v47{max-width:1020px;margin:0 auto}.social-login-panel{margin-top:16px;padding:14px;border:1px dashed var(--line-strong);border-radius:var(--r-md);background:var(--panel-2)}.social-login-panel p{margin:0 0 8px;font-weight:850}.social-buttons{display:flex;gap:8px;flex-wrap:wrap}.btn.social[disabled]{opacity:.45;cursor:not-allowed}.customer-register-v47 .customer-form h2{font-size:18px;border-bottom:1px solid var(--line);padding-bottom:8px;margin-top:6px}.customer-register-v47 .customer-form label:has(input[required]){position:relative}.customer-register-v47 .customer-form label:has(input[required])::after{content:'obrigatório';display:inline-flex;margin-left:8px;padding:2px 7px;border-radius:var(--r-pill);background:rgba(220,38,38,.08);color:var(--red);font-size:11px;font-weight:800}.helper-box.success{border-color:rgba(22,163,74,.28);background:rgba(22,163,74,.08)}.helper-box.error{border-color:rgba(220,38,38,.28);background:rgba(220,38,38,.08)}
@media(max-width:1300px){.settings-quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.settings-quick-grid{grid-template-columns:1fr 1fr}.settings-panel>summary{align-items:flex-start;flex-direction:column}.settings-panel>summary span{text-align:left}.inline-test-form{flex-direction:column;align-items:stretch}.inline-test-form input{max-width:none}}@media(max-width:520px){.settings-quick-grid{grid-template-columns:1fr}}

/* Zoukei ERP v4.8 - ajustes finos de configuração de fretes */
.settings-panel input[type="checkbox"],
.compact-table input[type="checkbox"],
.mini-config-group input[type="checkbox"]{
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  min-height:18px!important;
  max-width:18px!important;
  padding:0!important;
  margin:0 auto!important;
  border-radius:4px!important;
  display:inline-block!important;
  accent-color:#0b7cd3;
}
.compact-table th:first-child,
.compact-table td:first-child{
  width:76px;
  min-width:76px;
  max-width:76px;
  text-align:center;
}
.settings-panel .check input[type="checkbox"]{
  margin:0 8px 0 0!important;
}
.settings-panel .compact-table td{
  vertical-align:middle;
}
.settings-panel .compact-table input:not([type="checkbox"]),
.settings-panel .compact-table select{
  min-height:32px;
  padding:6px 9px;
  border-radius:var(--r-sm);
}
.settings-panel .inline-field{
  display:flex;
  gap:8px;
  align-items:center;
}
.settings-panel .inline-field input{
  flex:1 1 auto;
}
.settings-panel .inline-field .btn{
  flex:0 0 auto;
  min-height:38px;
  white-space:nowrap;
}

/* Zoukei V5.1.2 - portal do cliente sem assistente IA integrado */
.customer-portal-v49{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.75fr);gap:22px;align-items:start;max-width:1100px;margin:0 auto}
.customer-login-card h2{margin:0 0 8px;font-size:22px}.customer-login-card .btn{width:100%;justify-content:center}.customer-register-v49{max-width:1180px;margin:0 auto}.social-buttons{display:flex;gap:8px;flex-wrap:wrap}.btn.social{min-width:96px}.btn.social:disabled{opacity:.45;cursor:not-allowed}.ai-assistant-card textarea{font-size:15px;line-height:1.45}.ai-answer{margin-top:18px;border:1px solid var(--line);border-radius:var(--r-md);padding:16px;background:rgba(var(--shadow-rgb),.04)}.ai-answer pre{white-space:pre-wrap;font-family:inherit;line-height:1.5;margin:0}.ai-answer.error{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.08)}.ai-answer.ok{border-color:rgba(34,197,94,.25);background:rgba(34,197,94,.06)}
@media(max-width:900px){.customer-portal-v49{grid-template-columns:1fr}.social-buttons .btn{flex:1}}

/* V5.2 - SMTP diagnóstico guiado */
.smtp-wizard{display:grid;grid-template-columns:1.2fr .8fr;gap:14px;margin:14px 0 16px}
.smtp-preset-card,.smtp-status-card,.smtp-diagnostic-panel,.smtp-log-panel{border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,transparent);border-radius:var(--r-md);padding:16px;box-shadow:0 10px 30px rgba(var(--shadow-rgb),.04)}
.smtp-preset-card h3,.smtp-status-card h3,.smtp-diagnostic-panel h3{margin:0 0 8px;font-size:17px}.smtp-preset-card p,.smtp-diagnostic-panel p{margin:0 0 12px;color:var(--muted);font-weight:650;line-height:1.45}.smtp-preset-card .btn{margin:4px 6px 0 0}
.smtp-checklist{margin:0;padding:0;list-style:none;display:grid;gap:7px}.smtp-checklist li{display:flex;gap:8px;align-items:center;font-weight:750;font-size:13px;color:var(--text)}.smtp-checklist li:before{content:'';width:9px;height:9px;border-radius:var(--r-pill);background:#94a3b8;flex:0 0 auto}.smtp-checklist li.ok:before{background:#22c55e}.smtp-checklist li.warn:before{background:#f59e0b}.smtp-checklist li.err:before{background:#ef4444}
.smtp-diagnostic-panel{margin-top:16px}.smtp-diagnose-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0}.smtp-diagnose-row input[type="email"]{min-width:min(380px,100%);flex:1}
.smtp-result{margin:14px 0;padding:12px 14px;border-radius:var(--r-sm);display:flex;justify-content:space-between;gap:12px;align-items:center;font-weight:850}.smtp-result.ok{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0}.smtp-result.error{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}
.smtp-steps{display:grid;gap:8px;margin-top:12px}
.smtp-step{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:0;overflow:hidden}
.smtp-step summary{display:flex;align-items:center;gap:10px;cursor:pointer;padding:10px 12px;user-select:none}.smtp-step summary strong{flex:1}.smtp-step summary em{font-style:normal;color:var(--muted);font-size:12px}
.smtp-step p{margin:0;padding:0 12px 12px;color:var(--text);font-weight:650;line-height:1.5}.smtp-step pre{margin:0 12px 12px;padding:10px;border-radius:var(--r-sm);background:rgba(var(--shadow-rgb),.06);white-space:pre-wrap;word-break:break-word;font-size:12px}
.smtp-step.step-new{animation:stepSlide .25s ease}@keyframes stepSlide{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.smtp-log-panel{margin-top:16px}.smtp-log-panel summary{cursor:pointer;font-weight:850;display:flex;align-items:center;gap:8px}
.smtp-live-running{margin-top:12px;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:var(--r-sm);background:color-mix(in srgb,var(--panel) 90%,transparent);border:1px solid var(--line);font-weight:750}
.smtp-form-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-top:6px}
.smtp-form-actions form{display:contents}
.smtp-notify-statuses{border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;margin:0}.smtp-notify-statuses legend{font-weight:800;padding:0 6px}.notify-grid{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:8px}.notify-grid .check{font-weight:700;gap:5px}
.smtp-preset-hint{margin-top:10px;font-size:13px}
.diag-dot{display:inline-block;width:11px;height:11px;border-radius:var(--r-pill);background:#94a3b8;flex:0 0 auto}.diag-dot.ok{background:#22c55e}.diag-dot.warning{background:#f59e0b}.diag-dot.error{background:#ef4444}.diag-dot.pulsing{animation:pulseDot 0.9s infinite alternate}@keyframes pulseDot{from{opacity:.4}to{opacity:1;box-shadow:0 0 0 3px rgba(148,163,184,.3)}}
.status-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#94a3b8;margin-right:5px;vertical-align:middle}.status-dot.ok{background:#22c55e}.status-dot.err{background:#ef4444}
.badge-count{background:var(--muted);color:#fff;border-radius:var(--r-pill);padding:1px 7px;font-size:11px;font-weight:800}
.inline-field{display:flex;gap:6px;align-items:stretch}.inline-field input{flex:1}
@media(max-width:900px){.smtp-wizard{grid-template-columns:1fr}.smtp-result{align-items:flex-start;flex-direction:column}.smtp-diagnose-row input[type="email"]{width:100%;min-width:0}.smtp-form-actions{flex-direction:column;align-items:flex-start}.smtp-form-actions input[type="email"]{width:100%}}

/* ==========================================================================
   ZOUKEI UI V5.4 - MOTOR DE TEMAS MONOCROMÁTICO AVANÇADO
   ========================================================================= */
:root {
  /* O RGB base para calcular as transparências no sistema */
  --accent-rgb: 201, 163, 74;
  /* 0.2.0-alpha.18 — tokens derivados p/ interface mais vibrante/moderna (theme-agnostic: seguem o accent do tema) */
  --accent-grad: linear-gradient(135deg, var(--accent), var(--accent-2));
  --glow: 0 10px 26px rgba(var(--accent-rgb), .30);
  --shadow-lift: 0 20px 44px rgba(var(--shadow-rgb), .14);
}

/* Perfis de cores base */
html[data-color="gold"] { --accent: #c9a34a; --accent-2: #f5d77b; --accent-rgb: 201, 163, 74; }
html[data-color="medical"] { --accent: #0284c7; --accent-2: #38bdf8; --accent-rgb: 2, 132, 199; }
html[data-color="indigo"] { --accent: #4f46e5; --accent-2: #818cf8; --accent-rgb: 79, 70, 229; }
html[data-color="emerald"] { --accent: #10b981; --accent-2: #34d399; --accent-rgb: 16, 185, 129; }
html[data-color="rose"] { --accent: #e11d48; --accent-2: #fb7185; --accent-rgb: 225, 29, 72; }
html[data-color="purple"] { --accent: #8b5cf6; --accent-2: #a78bfa; --accent-rgb: 139, 92, 246; }
html[data-color="orange"] { --accent: #f97316; --accent-2: #fb923c; --accent-rgb: 249, 115, 22; }
html[data-color="graphite"] { --accent: #475569; --accent-2: #94a3b8; --accent-rgb: 71, 85, 105; }

/* alpha.242 — REMOVIDO: o bloco de "tema automatico por sexo" sequestrava
   o tema gold (Zoukei Original) e o substituia por rosa (F) ou azul (M),
   ignorando a escolha do usuario. Agora o gold aplica corretamente
   #c9a34a para qualquer usuario. Se voce quiser um tema rosa ou azul,
   selecione explicitamente "Rubi" ou "Azul Clinico" no seletor.
   Linhas antigas:
     html[data-user-sex="F"][data-color="gold"] { ... rosa ... }
     html[data-user-sex="M"][data-color="gold"] { ... azul ... }
*/

/* ── ADAPTAÇÃO AUTOMÁTICA DOS FUNDOS BRANCOS E CINZAS (LIGHT MODE) ── */
html[data-theme="light"], html:not([data-theme="dark"]) {
  --bg: color-mix(in srgb, var(--accent) 5%, #f4f6fb) !important;
  --panel: color-mix(in srgb, var(--accent) 2%, #ffffff) !important;
  --panel-2: color-mix(in srgb, var(--accent) 4%, #ffffff) !important;
}

/* ── ADAPTAÇÃO AUTOMÁTICA DOS FUNDOS (DARK MODE) ── */
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    --bg: color-mix(in srgb, var(--accent) 6%, #080b12) !important;
    --panel: color-mix(in srgb, var(--accent) 4%, #10141d) !important;
    --panel-2: color-mix(in srgb, var(--accent) 6%, #151b27) !important;
  }
}
html[data-theme="dark"] {
  --bg: color-mix(in srgb, var(--accent) 6%, #080b12) !important;
  --panel: color-mix(in srgb, var(--accent) 4%, #10141d) !important;
  --panel-2: color-mix(in srgb, var(--accent) 6%, #151b27) !important;
}

/* ── PROTEÇÃO ESTRITA (MARCADO EM VERMELHO): Mantém os códigos na cor original Zoukei ── */
.orders-table td[data-col-key="codigo"] a.strong,
.orders-table a.strong,
.kanban-card a.strong {
  color: var(--accent) !important;
}

/* ── PINTURA DOS ELEMENTOS DA INTERFACE ── */
.btn.primary { 
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 76%, #000)) !important; 
  border-color: color-mix(in srgb, var(--accent) 85%, #000) !important; 
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(var(--accent-rgb), 0.20) !important;
}
.btn.primary:hover { 
  background: linear-gradient(135deg, var(--accent-2), var(--accent)) !important;
  box-shadow: 0 6px 16px rgba(var(--accent-rgb), 0.30) !important;
}

.logo { 
  color: var(--accent-2) !important; 
  background: linear-gradient(135deg, #111827, color-mix(in srgb, var(--accent) 35%, #111827)) !important;
}

.metric { 
  border-top: 4px solid var(--accent) !important; 
}

.nav-group.active .nav-trigger { 
  background: rgba(var(--accent-rgb), 0.14) !important; 
  border-color: rgba(var(--accent-rgb), 0.30) !important; 
}
.dropdown-panel a.current { 
  background: var(--accent) !important; 
  color: #ffffff !important; 
}
.topnav a:hover, .nav-group:hover .nav-trigger { 
  background: rgba(var(--accent-rgb), 0.10) !important; 
  border-color: rgba(var(--accent-rgb), 0.20) !important; 
}

input:focus, select:focus, textarea:focus { 
  border-color: var(--accent) !important; 
  box-shadow: 0 0 0 4px rgba(var(--accent-rgb), 0.15) !important; 
}

.orders-table tbody tr:hover { 
  box-shadow: inset 5px 0 0 var(--accent) !important; 
  background: rgba(var(--accent-rgb), 0.04) !important; 
}

.helper-box { background: rgba(var(--accent-rgb), 0.06) !important; border-color: rgba(var(--accent-rgb), 0.20) !important; }
.public-order-code { background: rgba(var(--accent-rgb), 0.10) !important; color: var(--accent) !important; }

/* ==========================================================================
   Zoukei ERP V5.3.0 - Melhorias Visuais
   ========================================================================== */

/* 4.1 FAIXA LATERAL COLORIDA NA TABELA DE PEDIDOS */
.orders-table tbody tr.status-row-open { border-left: 3px solid var(--red) !important; background: rgba(239, 68, 68, 0.07); }
.orders-table tbody tr.status-row-printing { border-left: 3px solid var(--orange) !important; background: rgba(249, 115, 22, 0.09); }
.orders-table tbody tr.status-row-paused { border-left: 3px solid var(--amber, #f59e0b) !important; background: rgba(245, 158, 11, 0.08); }
.orders-table tbody tr.status-row-ready { border-left: 3px solid var(--yellow) !important; background: rgba(234, 179, 8, 0.10); }
.orders-table tbody tr.status-row-label { border-left: 3px solid var(--green) !important; background: rgba(22, 163, 74, 0.09); }
.orders-table tbody tr.status-row-delivered { border-left: 3px solid var(--blue) !important; background: rgba(37, 99, 235, 0.08); }
.orders-table tbody tr.status-row-canceled { border-left: 3px solid var(--slate, #64748b) !important; background: rgba(100, 116, 139, 0.07); }
.orders-table tbody tr.status-row-warranty { border-left: 3px solid var(--accent) !important; background: rgba(var(--accent-rgb), 0.10); }
.orders-table { border-collapse: separate; border-spacing: 0; }

/* 4.2 MÉTRICAS DO DASHBOARD — watermark de emoji 72px removido (auditoria UI 2026 / F5, minimalismo) */
.metric { position: relative; }
.metric strong { font-size: 30px; letter-spacing: -0.05em; line-height: 1; }
.metric em { font-size: 12px; color: var(--muted); font-style: normal; font-weight: 750; }
.metric.metric-danger  strong { color: var(--red); }
.metric.metric-warning strong { color: var(--orange); }
.metric.metric-success strong { color: var(--green); }
.metric.metric-gold    strong { color: var(--accent); }
.metric.metric-blue    strong { color: var(--blue); }
.metric.metric-danger  { border-top: 3px solid var(--red) !important; }
.metric.metric-warning { border-top: 3px solid var(--orange) !important; }
.metric.metric-success { border-top: 3px solid var(--green) !important; }
.metric.metric-gold    { border-top: 3px solid var(--accent) !important; }
.metric.metric-blue    { border-top: 3px solid var(--blue) !important; }

/* 4.3 KANBAN COM CABEÇALHO COLORIDO POR COLUNA */
.kanban-col { border-top: 4px solid var(--line-strong); }
.kanban-col[data-status="fila"]       { border-top-color: var(--red); }
.kanban-col[data-status="producao"]   { border-top-color: var(--orange); }
.kanban-col[data-status="pausado"]    { border-top-color: #f59e0b; }
.kanban-col[data-status="finalizado"] { border-top-color: var(--yellow); }
.kanban-col[data-status="etiqueta"]   { border-top-color: var(--green); }
.kanban-col[data-status="entregue"]   { border-top-color: var(--blue); }
.kanban-col[data-status="cancelado"]  { border-top-color: #64748b; }
.kanban-col[data-status="garantia"]   { border-top-color: var(--purple); }
.kanban-col[data-status="fila"]       h2 { color: var(--red); }
.kanban-col[data-status="producao"]   h2 { color: var(--orange); }
.kanban-col[data-status="pausado"]    h2 { color: #d97706; }
.kanban-col[data-status="finalizado"] h2 { color: var(--yellow); }
.kanban-col[data-status="etiqueta"]   h2 { color: var(--green); }
.kanban-col[data-status="entregue"]   h2 { color: var(--blue); }
.kanban-col[data-status="cancelado"]  h2 { color: #64748b; }
.kanban-col[data-status="garantia"]   h2 { color: var(--purple); }
.kanban-col h2 span { background: rgba(127, 127, 127, 0.12); color: var(--muted); }

/* 4.4 HIERARQUIA VISUAL DA TOPBAR */
.brand { font-size: 19px; font-weight: 950; letter-spacing: -0.04em; }
.logo { width: 36px; height: 36px; border-radius: 13px; font-size: 17px; }
.top-actions::before { content: ''; display: block; width: 1px; height: 24px; background: var(--line-strong); margin-right: 2px; flex-shrink: 0; }
.nav-group .nav-trigger:hover, .nav-group:hover .nav-trigger, .nav-group:focus-within .nav-trigger { background: rgba(var(--accent-rgb), 0.14); color: var(--text); border-color: rgba(var(--accent-rgb), 0.30); font-weight: 900; }
.dropdown-panel { box-shadow: 0 24px 60px rgba(var(--shadow-rgb), 0.14), 0 0 0 1px rgba(255,255,255,0.04); border-radius: 20px; }
.dropdown-panel a { border-radius: 13px; padding: 10px 13px; font-size: 13px; transition: background 0.12s ease; }

/* 4.5 ESTADOS VAZIOS ILUSTRADOS (EMPTY STATES) */
.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 48px 24px; text-align: center; color: var(--muted); }
.empty-state-icon { font-size: 52px; line-height: 1; opacity: 0.45; filter: grayscale(0.2); }
.empty-state-title { font-size: 16px; font-weight: 850; color: var(--text); margin: 0; }
.empty-state-desc { font-size: 13px; font-weight: 650; color: var(--muted); max-width: 360px; line-height: 1.55; margin: 0; }
.empty-state .btn { margin-top: 6px; }

/* 4.6 MELHORIAS GERAIS DE POLISH */
.page-head h1 { font-size: clamp(26px, 3.5vw, 42px); letter-spacing: -0.06em; font-weight: 950; line-height: 1.05; }
.page-head p { font-size: 13px; margin-top: 5px; color: var(--muted); font-weight: 650; }
.card { box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 18px 45px rgba(var(--shadow-rgb),0.07); transition: box-shadow 0.2s ease; }
.card:hover { box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 24px 55px rgba(var(--shadow-rgb),0.10); }
.btn.primary:hover { transform: translateY(-1px); } /* alpha.656 — remove o hover grafite legado; o tratamento oficial é o accent (linha ~252, !important) */
th { font-size: 11px; letter-spacing: 0.06em; font-weight: 900; border-bottom: 2px solid var(--line-strong); }
.kanban-card:hover { border-color: rgba(var(--accent-rgb), 0.6); transform: translateY(-2px); box-shadow: 0 12px 28px rgba(var(--shadow-rgb),0.12); }
input:focus, select:focus, textarea:focus { border-color: rgba(var(--accent-rgb), 0.7) !important; box-shadow: 0 0 0 4px rgba(var(--accent-rgb), 0.14) !important; }
[data-theme="dark"] .card { box-shadow: 0 1px 0 rgba(255,255,255,0.03) inset, 0 18px 45px rgba(0,0,0,0.28); }
/* [data-theme="dark"] .metric::after — removido junto com o watermark (auditoria UI 2026 / F5) */
[data-theme="dark"] .topbar { border-bottom-color: var(--line); box-shadow: 0 1px 0 rgba(255,255,255,0.02); }
[data-theme="dark"] .kanban-col { box-shadow: 0 12px 32px rgba(0,0,0,0.22); }

/* Zoukei UI v5.3.1 - topbar premium e dropdown touch-first */
.topbar{
  z-index:100;
  border-bottom:1px solid color-mix(in srgb,var(--line) 74%,transparent);
  background:color-mix(in srgb,var(--panel) 82%,transparent);
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 14px 40px rgba(var(--shadow-rgb),.06);
}
.brand{letter-spacing:0}
.topnav-dropdown{gap:6px}
.nav-group{isolation:isolate}
.nav-group .nav-trigger{
  min-height:38px;
  padding:0 13px;
  border-radius:var(--r-pill);
  color:color-mix(in srgb,var(--text) 68%,var(--muted));
  font-weight:820;
}
.nav-group .caret{
  width:16px;
  height:16px;
  display:inline-grid;
  place-items:center;
  border-radius:var(--r-pill);
  font-size:10px;
  transition:transform .16s ease,background .16s ease;
}
.nav-group.is-open .caret{transform:rotate(180deg);background:rgba(var(--accent-rgb),.10)}
.nav-group.active .nav-trigger,
.nav-group.is-open .nav-trigger,
.nav-group .nav-trigger:hover,
.nav-group:focus-within .nav-trigger{
  background:color-mix(in srgb,var(--accent) 12%,var(--panel));
  border-color:color-mix(in srgb,var(--accent) 28%,var(--line));
  color:var(--text);
  box-shadow:0 8px 22px rgba(var(--accent-rgb),.10);
}
.dropdown-panel{
  z-index:140;
  min-width:232px;
  padding:10px;
  gap:3px;
  border-radius:var(--r-md);
  background:color-mix(in srgb,var(--panel) 94%,transparent);
  box-shadow:0 28px 70px rgba(var(--shadow-rgb),.18),0 0 0 1px rgba(255,255,255,.18) inset;
  transform:translateY(10px) scale(.98);
  transform-origin:top left;
}
.dropdown-panel a{
  min-height:40px;
  padding:0 14px;
  border-radius:var(--r-sm);
  color:color-mix(in srgb,var(--text) 88%,var(--muted));
  font-weight:850;
}
.dropdown-panel a:hover{
  background:color-mix(in srgb,var(--accent) 10%,var(--panel-2));
}
.nav-group:hover .dropdown-panel,
.nav-group:focus-within .dropdown-panel,
.nav-group.is-open .dropdown-panel{
  opacity:1;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}
.nav-menu-open::before{
  content:'';
  position:fixed;
  inset:0;
  z-index:90;
  background:rgba(var(--shadow-rgb),.10);
  backdrop-filter:blur(2px);
}
.top-actions{
  padding-left:8px;
  border-left:1px solid var(--line);
}
.top-actions::before{display:none}
.density-control,
.icon-btn,
.user-menu summary{
  border-color:color-mix(in srgb,var(--line) 82%,transparent);
  box-shadow:0 10px 28px rgba(var(--shadow-rgb),.06);
}

@media(max-width:900px){
  body.nav-menu-open{overflow:hidden}
  .topbar{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:10px;
    padding:10px 12px;
  }
  .topnav-dropdown{
    grid-column:1/-1;
    order:3;
    display:flex;
    gap:8px;
    overflow-x:auto;
    overflow-y:visible;
    padding:2px 2px 6px;
    scrollbar-width:none;
  }
  .topnav-dropdown::-webkit-scrollbar{display:none}
  .nav-group{position:static}
  .nav-group .nav-trigger{
    min-height:42px;
    padding:0 15px;
    border:1px solid var(--line);
    background:color-mix(in srgb,var(--panel) 88%,transparent);
  }
  .dropdown-panel{
    position:fixed;
    left:12px;
    right:12px;
    bottom:12px;
    top:auto;
    max-height:min(72vh,520px);
    overflow:auto;
    min-width:0;
    padding:12px;
    border-radius:24px;
    transform:translateY(24px) scale(.98);
    transform-origin:bottom center;
    box-shadow:0 34px 90px rgba(var(--shadow-rgb),.32),0 0 0 1px rgba(255,255,255,.20) inset;
  }
  .nav-group:hover .dropdown-panel,
  .nav-group:focus-within .dropdown-panel{
    opacity:0;
    transform:translateY(24px) scale(.98);
    pointer-events:none;
  }
  .nav-group.is-open .dropdown-panel{
    opacity:1;
    transform:translateY(0) scale(1);
    pointer-events:auto;
  }
  .dropdown-panel::before{
    content:'';
    width:42px;
    height:4px;
    border-radius:var(--r-pill);
    background:color-mix(in srgb,var(--muted) 35%,transparent);
    display:block;
    justify-self:center;
    margin:2px 0 6px;
  }
  .dropdown-panel a{
    min-height:48px;
    padding:0 16px;
    font-size:15px;
  }
  .top-actions{
    max-width:100%;
    overflow-x:auto;
    padding-left:0;
    border-left:0;
    scrollbar-width:none;
  }
  .top-actions::-webkit-scrollbar{display:none}
}

@media(max-width:560px){
  .brand{min-width:44px}
  .topbar{padding:8px 10px}
  .density-control{min-width:44px}
  .density-control select{max-width:96px}
  .user-menu summary{max-width:92px}
}

.settings-quick-grid .tool-card.small{
  position:relative;
  overflow:hidden;
  min-height:78px;
  border-radius:var(--r-md);
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 98%,transparent),color-mix(in srgb,var(--panel-2) 82%,transparent));
}
.settings-quick-grid .tool-card.small::after{
  content:'';
  position:absolute;
  inset:auto 14px 0 14px;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);
  opacity:0;
  transition:opacity .16s ease;
}
.settings-quick-grid .tool-card.small:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--accent) 22%,var(--line));
}
.settings-quick-grid .tool-card.small:hover::after{opacity:.7}
.settings-panel{
  border-radius:var(--r-lg);
  box-shadow:0 18px 45px rgba(var(--shadow-rgb),.065);
}
[data-theme="dark"] th { background: color-mix(in srgb, var(--panel-2) 90%, transparent); }

/* Zoukei UI v5.3.2 - polish global estilo produto enterprise */
:root{
  --surface-glow:rgba(255,255,255,.72);
  --shell-border:color-mix(in srgb,var(--line) 76%,transparent);
  --control-bg:color-mix(in srgb,var(--panel) 88%,#fff);
}
html[data-theme="dark"]{
  --surface-glow:rgba(255,255,255,.035);
  --shell-border:color-mix(in srgb,var(--line) 82%,transparent);
  --control-bg:color-mix(in srgb,var(--panel) 92%,#0f172a);
}
body{
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--accent) 7%,transparent),transparent 340px),
    radial-gradient(circle at 16px 16px,rgba(var(--accent-rgb),.055),transparent 28vw),
    var(--bg);
}
.main{
  padding:clamp(14px,1.7vw,28px);
}
.page-head{
  padding:2px 0 4px;
}
.page-head h1{
  letter-spacing:0;
  font-size:clamp(28px,3vw,44px);
  line-height:1;
}
.page-head p{
  max-width:820px;
  font-size:14px;
  color:color-mix(in srgb,var(--muted) 88%,var(--text));
}
.card,.metric,.tool-card,.settings-panel,.smtp-preset-card,.smtp-status-card,.smtp-diagnostic-panel,.smtp-log-panel,.kanban-col{
  border-color:var(--shell-border);
  background:
    linear-gradient(180deg,var(--surface-glow),transparent 42%),
    color-mix(in srgb,var(--panel) 96%,transparent);
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 16px 46px rgba(var(--shadow-rgb),.075);
}
.card:hover,.tool-card:hover,.settings-panel:hover{
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 22px 58px rgba(var(--shadow-rgb),.10);
}
.card h2,.settings-panel>summary strong,.smtp-preset-card h3,.smtp-status-card h3,.smtp-diagnostic-panel h3{
  letter-spacing:0;
  color:var(--text);
}
.btn{
  min-height:40px;
  border-radius:var(--r-sm);
  border-color:var(--shell-border);
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 98%,#fff),color-mix(in srgb,var(--panel-2) 88%,transparent));
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 10px 24px rgba(var(--shadow-rgb),.065);
}
.btn:hover{
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--accent) 34%,var(--line));
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 14px 32px rgba(var(--shadow-rgb),.09);
}
.btn.primary{
  background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 72%,#111827))!important;
  border-color:color-mix(in srgb,var(--accent) 78%,#111827)!important;
}
input,select,textarea{
  border-radius:var(--r-sm);
  border-color:var(--shell-border);
  background:var(--control-bg);
  box-shadow:0 1px 0 rgba(255,255,255,.42) inset;
}
input:hover,select:hover,textarea:hover{
  border-color:color-mix(in srgb,var(--accent) 22%,var(--line));
}
label{
  color:color-mix(in srgb,var(--muted) 88%,var(--text));
}
.table-wrap{
  border-color:var(--shell-border);
  border-radius:var(--r-md);
  box-shadow:0 1px 0 rgba(255,255,255,.48) inset;
}
th{
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel-2) 96%,transparent),color-mix(in srgb,var(--panel-2) 82%,transparent));
  color:color-mix(in srgb,var(--muted) 86%,var(--text));
}
td{
  border-bottom-color:color-mix(in srgb,var(--line) 80%,transparent);
}
.badge,.pill{
  border-radius:var(--r-pill);
  box-shadow:0 1px 0 rgba(255,255,255,.45) inset;
}
.settings-quick-grid{
  gap:12px;
}
.settings-panel>summary{
  min-height:58px;
  padding:16px 18px;
}
.settings-panel>summary span{
  font-size:12px;
  color:color-mix(in srgb,var(--muted) 82%,var(--text));
}
.mini-config-group{
  border-color:var(--shell-border);
  background:color-mix(in srgb,var(--panel-2) 76%,transparent);
}
.mini-config-group>summary{
  min-height:42px;
  display:flex;
  align-items:center;
  border-radius:var(--r-sm);
}
.compact-table th,.compact-table td{
  font-size:12px;
}
.smtp-wizard{
  gap:16px;
}
.smtp-checklist li{
  min-height:24px;
}
.topbar{
  min-height:64px;
}
.user-menu div{
  z-index:160;
  border-color:var(--shell-border);
  background:color-mix(in srgb,var(--panel) 96%,transparent);
  backdrop-filter:blur(18px);
}

@media(max-width:900px){
  .main{
    padding:12px;
  }
  .page-head h1{
    font-size:32px;
  }
  .settings-quick-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .card,.settings-panel{
    border-radius:var(--r-md);
  }
  .topbar{
    min-height:0;
  }
}
@media(max-width:560px){
  .settings-quick-grid{
    grid-template-columns:1fr;
  }
  .page-head h1{
    font-size:30px;
  }
  .page-head p{
    font-size:13px;
  }
  .card{
    padding:14px;
  }
}

/* Zoukei UI v5.3.3 - camada visual mais evidente para settings e navegação */
.topbar{
  padding:12px 18px;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--panel) 94%,transparent),color-mix(in srgb,var(--panel) 82%,transparent));
}
.brand{
  padding:5px 8px 5px 0;
}
.topnav-dropdown{
  justify-content:flex-start;
}
.nav-group .nav-trigger{
  position:relative;
  overflow:hidden;
}
.nav-group.active .nav-trigger::before,
.nav-group.is-open .nav-trigger::before{
  content:'';
  position:absolute;
  left:10px;
  right:10px;
  bottom:5px;
  height:2px;
  border-radius:var(--r-pill);
  background:var(--accent);
}
.dropdown-panel{
  padding:12px;
}
.dropdown-panel a{
  position:relative;
  gap:10px;
}
.dropdown-panel a::before{
  content:'';
  width:8px;
  height:8px;
  border-radius:50%;
  background:color-mix(in srgb,var(--muted) 32%,transparent);
  flex:0 0 auto;
}
.dropdown-panel a.current::before,
.dropdown-panel a:hover::before{
  background:var(--accent);
}
.settings-head{
  padding:8px 2px 2px;
}
.settings-head h1{
  font-size:clamp(34px,3.6vw,54px);
}
.settings-head p{
  font-size:14px;
  font-weight:760;
}
.settings-quick-grid.compact-tools{
  display:grid;
  grid-template-columns:repeat(6,minmax(150px,1fr));
  gap:14px;
}
.settings-quick-grid .tool-card.small{
  min-height:106px;
  padding:18px 18px 16px;
  align-content:start;
  gap:10px;
}
.settings-quick-grid .tool-card.small::before{
  content:'';
  width:34px;
  height:34px;
  border-radius:var(--r-sm);
  display:block;
  margin-bottom:2px;
  background:
    linear-gradient(135deg,rgba(var(--accent-rgb),.24),rgba(var(--accent-rgb),.08)),
    color-mix(in srgb,var(--panel-2) 90%,transparent);
  box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.16),0 10px 24px rgba(var(--accent-rgb),.10);
}
.settings-quick-grid .tool-card.small h3{
  font-size:16px;
  letter-spacing:0;
}
.settings-quick-grid .tool-card.small p{
  font-size:12px;
  line-height:1.4;
  max-width:18ch;
}
.settings-panel{
  overflow:hidden;
}
.settings-panel>summary{
  position:relative;
  background:
    linear-gradient(90deg,rgba(var(--accent-rgb),.10),transparent 42%),
    color-mix(in srgb,var(--panel) 92%,transparent);
}
.settings-panel>summary::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:linear-gradient(180deg,var(--accent),color-mix(in srgb,var(--accent) 55%,#111827));
}
.settings-panel[open]>summary{
  border-bottom-color:color-mix(in srgb,var(--accent) 22%,var(--line));
}
.mini-config-group{
  border-radius:var(--r-md);
}
.mini-config-group>summary{
  font-size:14px;
}
.smtp-preset-card,
.smtp-status-card{
  min-height:160px;
}
.smtp-status-card{
  background:
    linear-gradient(135deg,rgba(34,197,94,.08),transparent 58%),
    color-mix(in srgb,var(--panel) 96%,transparent);
}
.smtp-checklist{
  gap:9px;
}
.smtp-checklist li{
  padding:2px 0;
}

@media(max-width:1300px){
  .settings-quick-grid.compact-tools{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media(max-width:900px){
  .settings-quick-grid.compact-tools{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .settings-quick-grid .tool-card.small{
    min-height:96px;
  }
  .topbar{
    padding:10px 12px;
  }
}
@media(max-width:560px){
  .settings-quick-grid.compact-tools{
    grid-template-columns:1fr;
  }
  .settings-head h1{
    font-size:34px;
  }
  .settings-quick-grid .tool-card.small{
    min-height:88px;
    grid-template-columns:auto 1fr;
    align-items:center;
  }
  .settings-quick-grid .tool-card.small::before{
    grid-row:1 / span 2;
    margin:0;
  }
}

/* Settings page - alpha.5 compact pass */
.settings-panel{
  border-radius:var(--r-sm);
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 10px 28px rgba(var(--shadow-rgb),.055);
}
.settings-panel>summary{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  grid-template-rows:auto auto!important;
  min-height:50px!important;
  column-gap:12px;
  row-gap:1px;
  padding:10px 16px!important;
  background:var(--panel)!important;
  overflow:visible;
}
.settings-panel>summary::before{
  content:none!important;
  display:none!important;
  position:static!important;
  inset:auto!important;
}
.settings-panel>summary::after{
  content:'v';
  grid-column:2!important;
  grid-row:1 / span 2!important;
  align-self:center;
  width:auto;
  height:auto;
  color:var(--accent);
  font-size:13px;
  font-weight:900;
  line-height:1;
  transform:none;
}
.settings-panel[open]>summary::after{
  transform:rotate(180deg);
}
.settings-panel>summary strong,
.settings-panel>summary span{
  grid-column:1!important;
  min-width:0;
}
.settings-panel>summary strong{
  font-size:14px!important;
  line-height:1.15;
}
.settings-panel>summary span{
  font-size:11px!important;
  line-height:1.25;
  max-width:72ch;
  text-align:left!important;
}
.settings-panel[open]>summary{
  border-bottom:1px solid var(--line);
}

#email.settings-panel>summary{
  min-height:46px!important;
}
#email .smtp-wizard,
#email .smtp-diagnostic-panel,
#email .smtp-log-panel{
  margin-left:14px;
  margin-right:14px;
}
#email .smtp-wizard{
  grid-template-columns:minmax(0,1fr) minmax(260px,340px);
  gap:10px;
  margin-top:12px;
  margin-bottom:10px;
}
#email .smtp-preset-card,
#email .smtp-status-card,
#email .smtp-diagnostic-panel,
#email .smtp-log-panel{
  min-height:0!important;
  padding:12px 14px!important;
  border-radius:var(--r-sm);
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 8px 22px rgba(var(--shadow-rgb),.04);
}
#email .smtp-preset-card h3,
#email .smtp-status-card h3,
#email .smtp-diagnostic-panel h3{
  margin:0 0 6px;
  font-size:14px!important;
  line-height:1.2;
}
#email .smtp-preset-card p,
#email .smtp-diagnostic-panel p{
  margin:0 0 10px;
  font-size:12px;
  line-height:1.35;
  max-width:78ch;
}
#email .smtp-preset-card .btn{
  min-height:34px;
  padding:7px 10px;
  margin:2px 5px 0 0;
  font-size:12px;
}
#email .smtp-checklist{
  gap:5px;
}
#email .smtp-checklist li{
  min-height:20px;
  font-size:12px;
}
#email .smtp-config-form{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 10px;
  margin-top:8px;
  margin-bottom:10px;
}
#email .smtp-config-form label{
  font-size:12px;
}
#email .smtp-config-form input,
#email .smtp-config-form select,
#email .smtp-config-form textarea{
  min-height:34px;
  padding:7px 10px;
  border-radius:var(--r-sm);
  font-size:13px;
}
#email .smtp-config-form textarea{
  min-height:58px;
  resize:vertical;
}
#email .smtp-form-actions{
  padding-top:2px;
}
#email .smtp-form-actions .btn{
  min-height:36px;
}
#email .smtp-diagnostic-panel{
  margin-top:10px;
}
#email .inline-test-form{
  gap:8px;
  margin:8px 0 10px;
}
#email .inline-test-form input[type="email"]{
  min-height:34px;
}
#email .smtp-result{
  margin:8px 0;
  padding:9px 12px;
  border-radius:var(--r-sm);
}
#email .smtp-steps{
  gap:6px;
  margin-top:8px;
}
#email .smtp-step{
  border-radius:var(--r-sm);
}
#email .smtp-step summary{
  min-height:38px;
  padding:8px 10px;
}
#email .smtp-step p{
  padding:0 10px 8px;
  font-size:12px;
  line-height:1.35;
}
#email .smtp-step pre{
  max-height:120px;
  overflow:auto;
  margin:0 10px 10px;
  padding:9px;
  font-size:11px;
  line-height:1.35;
}
#email .smtp-log-panel{
  margin-top:10px;
  margin-bottom:14px;
}
#email .smtp-log-panel summary{
  min-height:32px;
  font-size:13px;
}

@media(max-width:900px){
  #email .smtp-wizard,
  #email .smtp-config-form{
    grid-template-columns:1fr;
  }
  #email .smtp-wizard,
  #email .smtp-diagnostic-panel,
  #email .smtp-log-panel{
    margin-left:10px;
    margin-right:10px;
  }
}

@media(max-width:900px){
  .brand .brand-name{display:none}
  .brand .build-pill{display:inline-flex}
}

/* Menu editor enterprise — alpha 0.1.0 */
.menu-editor{display:grid;gap:10px;padding:14px 0}
.menu-group-panel{border:1px solid var(--shell-border);border-radius:var(--r-md);overflow:hidden;background:color-mix(in srgb,var(--panel-2) 68%,transparent)}
.menu-group-header{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:1px solid color-mix(in srgb,var(--line) 72%,transparent);background:color-mix(in srgb,var(--panel) 88%,transparent)}
.menu-group-name{flex:1;font-weight:900;font-size:14px;letter-spacing:0;color:var(--text)}
.menu-group-badge{padding:3px 9px;border-radius:var(--r-pill);background:rgba(var(--accent-rgb),.13);color:color-mix(in srgb,var(--accent) 82%,var(--text));font-size:11px;font-weight:900;border:1px solid rgba(var(--accent-rgb),.18)}
.menu-group-items{display:grid}
.menu-item-row{display:flex;align-items:center;gap:14px;padding:10px 16px;border-bottom:1px solid color-mix(in srgb,var(--line) 50%,transparent);transition:background .12s ease}
.menu-item-row:last-child{border-bottom:0}
.menu-item-row:hover{background:rgba(var(--accent-rgb),.04)}
.menu-item-meta{flex:1;display:grid;gap:2px;min-width:0}
.menu-item-meta-custom{grid-template-columns:1fr 1fr auto;gap:6px;align-items:center}
.menu-label-input{width:100%;background:transparent;border:1px solid transparent;border-radius:var(--r-xs);padding:5px 7px;font-weight:850;font-size:14px;color:var(--text);min-height:30px;transition:.15s ease;box-shadow:none}
.menu-label-input:hover{border-color:var(--shell-border);background:var(--control-bg)}
.menu-label-input:focus{border-color:rgba(var(--accent-rgb),.55);background:var(--control-bg);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.11);outline:none}
.menu-item-meta>small{color:var(--muted);font-size:11px;font-weight:750;padding:0 7px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu-url-input{background:var(--control-bg);border:1px solid var(--shell-border);border-radius:var(--r-xs);padding:5px 8px;font-size:12px;color:var(--muted);min-height:30px;width:100%}
.menu-group-sel{background:var(--control-bg);border:1px solid var(--shell-border);border-radius:var(--r-xs);padding:4px 8px;font-size:12px;min-height:28px;width:auto;color:var(--text)}
.menu-item-new{background:rgba(var(--accent-rgb),.025)}
.menu-new-icon{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-xs);border:1.5px dashed var(--line-strong);color:var(--muted);font-size:17px;flex-shrink:0;font-weight:400;line-height:1}
.menu-editor-actions{padding:12px 0 2px}
/* Toggle switch */
.toggle-sw{display:inline-flex;align-items:center;cursor:pointer;flex-shrink:0}
.toggle-sw input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.toggle-sw-track{width:40px;height:22px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--line-strong) 85%,transparent);border:1px solid var(--shell-border);transition:.18s ease;position:relative;box-shadow:inset 0 1px 3px rgba(0,0,0,.10);flex-shrink:0}
.toggle-sw-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:var(--r-pill);background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.20);transition:.18s ease}
.toggle-sw input:checked~.toggle-sw-track{background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 68%,#111827));border-color:color-mix(in srgb,var(--accent) 76%,#111827)}
.toggle-sw input:checked~.toggle-sw-track .toggle-sw-thumb{left:calc(100% - 18px)}
.toggle-sw-danger .toggle-sw-track{background:rgba(220,38,38,.10);border-color:rgba(220,38,38,.22)}
.toggle-sw-danger input:checked~.toggle-sw-track{background:var(--red);border-color:color-mix(in srgb,var(--red) 78%,#111827)}

/* Zoukei UI alpha 0.1.0 - navigation shell redesign */
.mobile-nav-toggle,
.nav-mobile-head{display:none}
.topbar{
  grid-template-columns:auto minmax(360px,1fr) auto;
  gap:18px;
  min-height:62px;
  padding:10px 18px;
}
.brand{
  gap:10px;
  min-width:max-content;
}
.topnav-dropdown{
  justify-self:start;
  gap:4px;
  padding:0;
}
.nav-group .nav-trigger{
  min-height:36px;
  padding:0 12px 0 9px;
  gap:7px;
  border-radius:var(--r-sm);
}
.nav-trigger-icon{
  width:22px;
  height:22px;
  display:inline-grid;
  place-items:center;
  border-radius:var(--r-xs);
  background:rgba(var(--accent-rgb),.08);
  color:var(--accent);
  font-size:12px;
}
.dropdown-panel{
  min-width:310px;
  padding:12px;
  border-radius:var(--r-md);
}
.dropdown-head{
  display:grid;
  gap:3px;
  padding:6px 8px 10px;
  border-bottom:1px solid var(--line);
  margin-bottom:6px;
}
.dropdown-head strong{
  font-size:13px;
  letter-spacing:0;
}
.dropdown-head small{
  color:var(--muted);
  font-size:12px;
  font-weight:700;
}
.dropdown-panel a{
  min-height:52px;
  align-items:center;
  padding:7px 9px;
  gap:10px;
}
.dropdown-panel a::before{display:none}
.menu-item-icon{
  width:30px;
  height:30px;
  display:inline-grid;
  place-items:center;
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--panel-2) 90%,transparent);
  border:1px solid var(--line);
  color:var(--accent);
  font-size:13px;
  flex:0 0 auto;
}
.menu-item-text{
  display:grid;
  gap:2px;
  min-width:0;
}
.menu-item-text strong{
  font-size:13px;
  line-height:1.1;
}
.menu-item-text small{
  color:var(--muted);
  font-size:11px;
  font-weight:650;
  line-height:1.2;
}
.dropdown-panel a.current .menu-item-icon,
.dropdown-panel a:hover .menu-item-icon{
  border-color:rgba(var(--accent-rgb),.28);
  background:rgba(var(--accent-rgb),.12);
}
.top-actions{
  gap:8px;
  padding-left:12px;
}
.prefs-menu,
.user-menu{position:relative}
.prefs-menu summary,
.user-menu summary{
  list-style:none;
  min-height:38px;
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:var(--panel);
  padding:0 12px;
  cursor:pointer;
  font-weight:900;
  box-shadow:var(--shadow-soft);
}
.prefs-menu summary::-webkit-details-marker,
.user-menu summary::-webkit-details-marker{display:none}
.prefs-menu summary b{
  color:var(--muted);
  font-size:12px;
}
.prefs-panel{
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  width:310px;
  z-index:170;
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:var(--r-md);
  background:color-mix(in srgb,var(--panel) 96%,transparent);
  box-shadow:0 28px 70px rgba(var(--shadow-rgb),.18),0 0 0 1px rgba(255,255,255,.16) inset;
  backdrop-filter:blur(18px);
}
.prefs-panel .density-control{
  display:grid;
  grid-template-columns:78px 1fr;
  align-items:center;
  width:100%;
  box-shadow:none;
}
.prefs-panel .density-control select{
  min-width:0;
}
.prefs-actions{
  display:flex;
  gap:8px;
}
.prefs-actions .icon-btn{
  flex:1;
  width:auto;
}
.user-chip{
  width:24px;
  height:24px;
  border-radius:var(--r-xs);
  display:inline-grid;
  place-items:center;
  background:rgba(var(--accent-rgb),.12);
  color:var(--accent);
  font-size:12px;
  font-weight:950;
}
.user-menu summary{
  max-width:170px;
}
.user-menu summary>span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.user-menu div{
  top:calc(100% + 10px);
}

@media(max-width:1180px){
  .topbar{
    grid-template-columns:auto 1fr auto;
  }
  .topnav-dropdown{
    max-width:100%;
    overflow-x:auto;
  }
}

@media(max-width:900px){
  .topbar{
    grid-template-columns:auto 1fr auto;
    gap:10px;
  }
  .mobile-nav-toggle{
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    gap:4px;
    order:3;
    border:1px solid var(--line);
    border-radius:var(--r-sm);
    background:var(--panel);
    box-shadow:var(--shadow-soft);
  }
  .mobile-nav-toggle span{
    width:17px;
    height:2px;
    border-radius:var(--r-pill);
    background:var(--text);
  }
  .top-actions{
    justify-self:end;
    order:2;
  }
  .prefs-menu summary span{
    display:none;
  }
  .prefs-menu summary{
    width:42px;
    justify-content:center;
    padding:0;
  }
  .prefs-menu summary b{
    font-size:16px;
  }
  .user-menu summary{
    width:42px;
    justify-content:center;
    padding:0;
  }
  .user-menu summary>span:last-child{
    display:none;
  }
  .topnav-dropdown{
    position:fixed;
    inset:10px;
    z-index:180;
    display:block;
    max-width:none;
    overflow:auto;
    padding:14px;
    border:1px solid var(--line);
    border-radius:24px;
    background:color-mix(in srgb,var(--panel) 97%,transparent);
    box-shadow:0 36px 120px rgba(var(--shadow-rgb),.30);
    transform:translateY(18px) scale(.98);
    opacity:0;
    pointer-events:none;
    transition:opacity .16s ease,transform .16s ease;
  }
  body.nav-drawer-open .topnav-dropdown{
    transform:translateY(0) scale(1);
    opacity:1;
    pointer-events:auto;
  }
  body.nav-drawer-open::before{
    content:'';
    position:fixed;
    inset:0;
    z-index:170;
    background:rgba(var(--shadow-rgb),.26);
    backdrop-filter:blur(4px);
  }
  .nav-mobile-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:2px 2px 12px;
    border-bottom:1px solid var(--line);
    margin-bottom:10px;
  }
  .nav-mobile-head div{
    display:grid;
    gap:2px;
  }
  .nav-mobile-head strong{
    font-size:18px;
  }
  .nav-mobile-head span{
    color:var(--muted);
    font-size:12px;
    font-weight:750;
  }
  .nav-group{
    display:block;
    width:100%;
    margin:6px 0;
  }
  .nav-group .nav-trigger{
    width:100%;
    min-height:52px;
    justify-content:flex-start;
    padding:0 12px;
    border:1px solid var(--line);
    background:color-mix(in srgb,var(--panel-2) 72%,transparent);
  }
  .nav-group .nav-trigger span:nth-child(2){
    flex:1;
    text-align:left;
  }
  .nav-group .dropdown-panel{
    position:static;
    min-width:0;
    width:100%;
    max-height:none;
    margin:8px 0 10px;
    padding:10px;
    opacity:1;
    transform:none;
    pointer-events:auto;
    display:none;
    box-shadow:none;
    border-radius:var(--r-md);
    background:color-mix(in srgb,var(--panel-2) 54%,transparent);
  }
  .nav-group.mobile-expanded .dropdown-panel,
  .nav-group.active .dropdown-panel{
    display:grid;
  }
  .dropdown-panel::before{display:none}
  .dropdown-panel a{
    min-height:54px;
  }
  body.nav-drawer-open{
    overflow:hidden;
  }
  .prefs-panel{
    position:fixed;
    right:12px;
    left:12px;
    top:72px;
    width:auto;
  }
}

/* Alpha 0.1.0 polish from recorded dashboard review */
.build-pill{
  height:20px;
  padding:0 7px;
  font-size:10px;
  text-transform:lowercase;
}
.dropdown-panel{
  background:var(--panel);
  border-color:color-mix(in srgb,var(--line) 86%,var(--accent));
  box-shadow:0 30px 80px rgba(var(--shadow-rgb),.18),0 1px 0 rgba(255,255,255,.65) inset;
  backdrop-filter:blur(10px) saturate(1.05);
}
.dropdown-panel a,
.nav-group .nav-trigger,
.prefs-menu summary,
.user-menu summary{
  outline:none;
}
.dropdown-panel a:focus-visible,
.nav-group .nav-trigger:focus-visible,
.prefs-menu summary:focus-visible,
.user-menu summary:focus-visible,
.mobile-nav-toggle:focus-visible{
  outline:2px solid rgba(var(--accent-rgb),.42);
  outline-offset:2px;
}
.dropdown-panel a.current{
  box-shadow:inset 3px 0 0 rgba(var(--accent-rgb),.62);
}
.metric.metric-danger,
.metric.metric-warning,
.metric.metric-success,
.metric.metric-gold,
.metric.metric-blue{
  border-top:1px solid var(--line)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.72) inset,0 16px 38px rgba(var(--shadow-rgb),.06);
}
.metric.metric-gold{background:linear-gradient(180deg,rgba(var(--accent-rgb),.055),var(--panel))}
.metric strong{
  letter-spacing:0;
}

/* ─── Zoukei UI polish final — nav clean (alpha 0.1.x) ───────────────────── */

/* 1. Esconde ícones Unicode inconsistentes do nav-trigger */
.nav-trigger-icon{display:none}

/* 2. Nav triggers: sem borda, só texto + caret — estilo Linear */
.nav-group .nav-trigger{
  border:1px solid transparent;
  background:transparent;
  box-shadow:none;
  gap:5px;
  padding:0 10px;
  font-size:14px;
  font-weight:820;
  color:color-mix(in srgb,var(--text) 72%,var(--muted));
  transition:color .14s ease,background .14s ease;
}
.nav-group.active .nav-trigger,
.nav-group.is-open .nav-trigger,
.nav-group .nav-trigger:hover,
.nav-group:focus-within .nav-trigger{
  border-color:transparent;
  background:color-mix(in srgb,var(--accent) 10%,var(--panel));
  color:var(--text);
  box-shadow:none;
}
.nav-group .caret{
  font-size:9px;
  width:auto;
  height:auto;
  color:var(--muted);
}
.nav-group.is-open .caret{
  color:var(--accent);
}

/* 3. Dropdown items: sem caixa de ícone — só texto limpo */
.menu-item-icon{display:none}
.dropdown-panel a{
  min-height:36px;
  padding:7px 12px;
  gap:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  border-radius:var(--r-sm);
}
.menu-item-text{
  gap:1px;
}
.menu-item-text strong{
  font-size:13px;
  font-weight:880;
  letter-spacing:0;
  line-height:1.2;
}
.menu-item-text small{
  font-size:11px;
  font-weight:650;
  color:var(--muted);
  line-height:1.3;
}
.dropdown-panel a:hover .menu-item-text strong{
  color:var(--accent);
}
.dropdown-panel a.current .menu-item-text strong{
  color:var(--accent);
}
.dropdown-panel a.current{
  background:color-mix(in srgb,var(--accent) 8%,var(--panel-2));
  box-shadow:none;
}

/* 4. Dropdown head mais compacto */
.dropdown-head{
  padding:4px 8px 8px;
  margin-bottom:4px;
}
.dropdown-head strong{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--muted);
  font-weight:900;
}
.dropdown-head small{display:none}

/* 5. Dropdown panel tamanho correto */
.dropdown-panel{
  min-width:200px;
  max-width:260px;
  padding:8px;
  gap:2px;
}

/* 6. Prefs-menu summary mais limpo */
.prefs-menu summary{
  font-size:13px;
  font-weight:820;
  color:color-mix(in srgb,var(--text) 72%,var(--muted));
  border-color:color-mix(in srgb,var(--line) 80%,transparent);
}
.prefs-menu summary b{font-size:11px}
[open].prefs-menu summary,
.prefs-menu summary:hover{
  color:var(--text);
  border-color:color-mix(in srgb,var(--accent) 28%,var(--line));
}

/* 7. User-menu summary alinhado */
.user-menu summary{
  font-size:13px;
  font-weight:820;
}

/* 8. Build pill mais discreta */
.build-pill{
  font-size:10px;
  font-weight:800;
  opacity:.75;
}
.build-pill:hover{opacity:1}

/* 9. Topnav sem gap excessivo */
.topnav-dropdown{gap:2px}

/* 10. Dark mode: nav trigger refinado */
[data-theme="dark"] .nav-group .nav-trigger{
  color:color-mix(in srgb,var(--text) 65%,var(--muted));
}
[data-theme="dark"] .nav-group.active .nav-trigger,
[data-theme="dark"] .nav-group.is-open .nav-trigger,
[data-theme="dark"] .nav-group .nav-trigger:hover{
  background:color-mix(in srgb,var(--accent) 14%,var(--panel));
}
/* ─────────────────────────────────────────────────────────────────────────── */

/* Alpha 0.1.0-alpha.3 - nav interaction and mobile shell */
.nav-group.is-open .dropdown-panel{
  opacity:1;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}
.nav-group .nav-trigger{
  touch-action:manipulation;
}
.dropdown-panel{
  background:color-mix(in srgb,var(--panel) 98%,white);
}
.dropdown-panel a{
  cursor:pointer;
}

@media(min-width:901px){
  .nav-group:hover .dropdown-panel,
  .nav-group:focus-within .dropdown-panel,
  .nav-group.is-open .dropdown-panel{
    opacity:1;
    transform:translateY(0) scale(1);
    pointer-events:auto;
  }
}

@media(max-width:900px){
  body.nav-drawer-open{
    overflow:hidden;
  }
  .topbar{
    position:sticky;
    top:0;
    grid-template-columns:auto 1fr auto auto;
    min-height:58px;
    padding:8px 10px;
    gap:8px;
  }
  .brand{
    min-width:0;
  }
  .brand .build-pill{
    max-width:92px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .top-actions{
    order:2;
    gap:6px;
    padding-left:0;
  }
  .top-actions::before{
    display:none;
  }
  .mobile-nav-toggle{
    order:4;
    width:42px;
    height:42px;
    flex:0 0 auto;
  }
  .topnav-dropdown{
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:auto;
    width:min(88vw,380px);
    max-width:none;
    height:100dvh;
    z-index:220;
    display:flex;
    flex-direction:column;
    gap:8px;
    padding:14px;
    overflow:auto;
    border:0;
    border-left:1px solid var(--line);
    border-radius:0;
    background:var(--panel);
    box-shadow:-32px 0 90px rgba(var(--shadow-rgb),.24);
    transform:translateX(100%);
    opacity:1;
    pointer-events:none;
    transition:transform .18s ease;
  }
  body.nav-drawer-open .topnav-dropdown{
    transform:translateX(0);
    pointer-events:auto;
  }
  body.nav-drawer-open::before{
    content:'';
    position:fixed;
    inset:0;
    z-index:210;
    background:rgba(var(--shadow-rgb),.34);
    backdrop-filter:blur(3px);
  }
  .nav-mobile-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:2px 0 12px;
    border-bottom:1px solid var(--line);
    margin-bottom:4px;
  }
  .nav-mobile-head strong{
    font-size:17px;
    letter-spacing:0;
  }
  .nav-mobile-head span{
    display:block;
    margin-top:2px;
    color:var(--muted);
    font-size:12px;
    font-weight:750;
  }
  .nav-group{
    display:block;
    width:100%;
    margin:0;
    position:static;
  }
  .nav-group .nav-trigger{
    width:100%;
    min-height:50px;
    display:flex;
    justify-content:flex-start;
    align-items:center;
    gap:8px;
    padding:0 12px;
    border:1px solid var(--line);
    border-radius:var(--r-sm);
    background:var(--panel-2);
    color:var(--text);
    box-shadow:none;
  }
  .nav-group .nav-trigger span:nth-child(2){
    flex:1;
    text-align:left;
  }
  .nav-group .caret{
    font-size:11px;
    transition:transform .16s ease;
  }
  .nav-group.mobile-expanded .caret{
    transform:rotate(180deg);
    color:var(--accent);
  }
  .nav-group .dropdown-panel,
  .nav-group:hover .dropdown-panel,
  .nav-group:focus-within .dropdown-panel,
  .nav-group.is-open .dropdown-panel{
    position:static;
    display:none;
    width:100%;
    min-width:0;
    max-width:none;
    margin:6px 0 8px;
    padding:8px;
    border:1px solid var(--line);
    border-radius:var(--r-md);
    background:color-mix(in srgb,var(--panel-2) 72%,var(--panel));
    box-shadow:none;
    opacity:1;
    transform:none;
    pointer-events:auto;
  }
  .nav-group.mobile-expanded .dropdown-panel{
    display:grid;
  }
  .dropdown-head{
    padding:4px 6px 8px;
    margin:0 0 4px;
  }
  .dropdown-head small{
    display:block;
    font-size:11px;
    line-height:1.25;
  }
  .dropdown-panel a{
    min-height:48px;
    padding:8px 10px;
    border-radius:var(--r-sm);
  }
  .menu-item-text strong{
    font-size:14px;
  }
  .menu-item-text small{
    font-size:12px;
  }
  .prefs-panel{
    left:10px;
    right:10px;
    top:64px;
    width:auto;
    max-width:none;
  }
  .user-menu div{
    position:fixed;
    top:64px;
    right:10px;
    width:min(260px,calc(100vw - 20px));
  }
}

@media(max-width:430px){
  .topbar{
    grid-template-columns:auto 1fr auto auto;
  }
  .brand .logo{
    width:34px;
    height:34px;
  }
  .build-pill{
    font-size:9px;
    padding:0 6px;
  }
  .topnav-dropdown{
    width:min(92vw,370px);
  }
}

/* Settings page - alpha.4 hierarchy polish */
.settings-quick-grid .tool-card.small::before{
  display:none;
}
.settings-quick-grid .tool-card.small{
  display:grid;
  align-content:start;
  gap:4px;
  min-height:112px;
  padding:16px;
}
.tool-card-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:var(--r-sm);
  margin-bottom:6px;
  background:color-mix(in srgb,var(--accent) 12%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
  color:var(--accent);
  font-size:15px;
  font-weight:950;
  letter-spacing:0;
}
.settings-quick-grid .tool-card.small h3{
  margin:0;
  font-size:14px;
  font-weight:900;
  letter-spacing:0;
}
.settings-quick-grid .tool-card.small p{
  margin:0;
  max-width:none;
  color:var(--muted);
  font-size:12px;
  line-height:1.4;
}
.settings-section-label{
  margin:6px 0 10px;
  padding:18px 2px 8px;
  border-bottom:1px solid var(--line);
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  letter-spacing:.07em;
  line-height:1;
  text-transform:uppercase;
}
.settings-panel>summary{
  display:grid;
  grid-template-columns:auto 1fr auto;
  grid-template-rows:auto auto;
  align-items:center;
  column-gap:14px;
  row-gap:2px;
  min-height:62px;
  padding:12px 20px;
  text-align:left;
}
.settings-panel>summary::before{
  content:'';
  grid-column:1;
  grid-row:1 / span 2;
  width:32px;
  height:32px;
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--accent) 10%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));
  box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--panel) 80%,transparent);
}
.settings-panel>summary::after{
  content:'>';
  grid-column:3;
  grid-row:1 / span 2;
  color:var(--muted);
  font-size:18px;
  font-weight:900;
  line-height:1;
  transition:transform .18s ease,color .18s ease;
}
.settings-panel[open]>summary::after{
  color:var(--accent);
  transform:rotate(90deg);
}
.settings-panel>summary strong{
  grid-column:2;
  grid-row:1;
  margin:0;
  font-size:15px;
  font-weight:900;
  line-height:1.2;
}
.settings-panel>summary span{
  grid-column:2;
  grid-row:2;
  margin:0;
  color:var(--muted);
  font-size:12px;
  font-weight:650;
  line-height:1.3;
  text-align:left;
}
.settings-panel:hover{
  border-color:color-mix(in srgb,var(--accent) 18%,var(--line));
}

@media(max-width:900px){
  .settings-quick-grid.compact-tools{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .settings-quick-grid .tool-card.small{
    min-height:104px;
  }
}

@media(max-width:560px){
  .settings-quick-grid.compact-tools{
    grid-template-columns:1fr;
  }
  .settings-quick-grid .tool-card.small{
    grid-template-columns:auto 1fr;
    grid-template-rows:auto auto;
    align-items:center;
    min-height:74px;
    column-gap:12px;
  }
  .tool-card-icon{
    grid-column:1;
    grid-row:1 / span 2;
    margin-bottom:0;
  }
  .settings-panel>summary{
    grid-template-columns:auto 1fr auto;
    padding:12px 14px;
  }
  .settings-panel>summary::before{
    width:28px;
    height:28px;
  }
}

/* Settings page - alpha.5 final override */
.settings-panel>summary{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  grid-template-rows:auto auto!important;
  min-height:50px!important;
  padding:10px 16px!important;
  background:var(--panel)!important;
  overflow:visible!important;
}
.settings-panel>summary::before{
  content:none!important;
  display:none!important;
  position:static!important;
  inset:auto!important;
  width:0!important;
  height:0!important;
  border:0!important;
  box-shadow:none!important;
}
.settings-panel>summary::after{
  content:'v'!important;
  grid-column:2!important;
  grid-row:1 / span 2!important;
  align-self:center;
  color:var(--accent);
  font-size:13px;
  font-weight:900;
  transform:none;
}
.settings-panel[open]>summary::after{
  transform:rotate(180deg);
}
.settings-panel>summary strong,
.settings-panel>summary span{
  grid-column:1!important;
  min-width:0;
  text-align:left!important;
}
.settings-panel>summary strong{
  font-size:14px!important;
}
.settings-panel>summary span{
  font-size:11px!important;
  max-width:72ch;
}

/* Settings page - alpha.6 visible build + SMTP compact final layer */
.build-pill{
  min-width:auto!important;
  max-width:none!important;
  height:20px!important;
  padding:0 8px!important;
  font-size:10px!important;
  font-weight:900!important;
  opacity:1!important;
}
#email.settings-panel{
  border-radius:14px!important;
}
#email.settings-panel>summary{
  min-height:44px!important;
  padding:9px 14px!important;
}
#email .smtp-wizard{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(220px,320px)!important;
  gap:10px!important;
  margin:10px 12px 8px!important;
}
#email .smtp-preset-card,
#email .smtp-status-card,
#email .smtp-diagnostic-panel,
#email .smtp-log-panel{
  min-height:0!important;
  padding:10px 12px!important;
  border-radius:12px!important;
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 6px 18px rgba(var(--shadow-rgb),.035)!important;
}
#email .smtp-preset-card h3,
#email .smtp-status-card h3,
#email .smtp-diagnostic-panel h3{
  margin:0 0 5px!important;
  font-size:13px!important;
  line-height:1.2!important;
}
#email .smtp-preset-card p,
#email .smtp-diagnostic-panel p{
  margin:0 0 8px!important;
  font-size:12px!important;
  line-height:1.3!important;
}
#email .smtp-preset-card .btn{
  min-height:32px!important;
  padding:6px 9px!important;
  font-size:12px!important;
}
#email .smtp-checklist{
  gap:4px!important;
}
#email .smtp-checklist li{
  min-height:18px!important;
  font-size:12px!important;
}
#email .smtp-config-form{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px 10px!important;
  margin:8px 14px 10px!important;
}
#email .smtp-config-form label{
  font-size:12px!important;
}
#email .smtp-config-form input,
#email .smtp-config-form select,
#email .smtp-config-form textarea{
  min-height:32px!important;
  padding:6px 9px!important;
  border-radius:10px!important;
  font-size:13px!important;
}
#email .smtp-config-form textarea{
  min-height:52px!important;
}
#email .smtp-form-actions .btn{
  min-height:34px!important;
}
#email .smtp-diagnostic-panel,
#email .smtp-log-panel{
  margin-left:14px!important;
  margin-right:14px!important;
}
#email .smtp-diagnostic-panel{
  margin-top:8px!important;
}
#email .inline-test-form{
  margin:7px 0 8px!important;
  gap:8px!important;
}
#email .smtp-result{
  margin:7px 0!important;
  padding:8px 10px!important;
  border-radius:10px!important;
}
#email .smtp-steps{
  gap:5px!important;
  margin-top:7px!important;
}
#email .smtp-step{
  border-radius:10px!important;
}
#email .smtp-step summary{
  min-height:34px!important;
  padding:7px 9px!important;
}
#email .smtp-step p{
  padding:0 9px 7px!important;
  font-size:12px!important;
}
#email .smtp-step pre{
  max-height:96px!important;
  overflow:auto!important;
  margin:0 9px 9px!important;
  padding:8px!important;
  font-size:11px!important;
}
#email .smtp-log-panel{
  margin-top:8px!important;
  margin-bottom:12px!important;
}
#email .smtp-log-panel summary{
  min-height:30px!important;
  font-size:13px!important;
}
@media(max-width:900px){
  #email .smtp-wizard,
  #email .smtp-config-form{
    grid-template-columns:1fr!important;
  }
  #email .smtp-wizard,
  #email .smtp-config-form,
  #email .smtp-diagnostic-panel,
  #email .smtp-log-panel{
    margin-left:10px!important;
    margin-right:10px!important;
  }
}

/* Settings menu editor - alpha.7 compact blocks */
#menu .menu-editor{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important;
  gap:12px!important;
  padding:12px 14px!important;
}
#menu .menu-group-panel{
  min-width:0;
  border-radius:14px!important;
  background:color-mix(in srgb,var(--panel) 88%,var(--panel-2))!important;
  box-shadow:0 1px 0 rgba(255,255,255,.50) inset,0 8px 20px rgba(var(--shadow-rgb),.035)!important;
}
#menu .menu-group-header{
  min-height:38px;
  padding:8px 10px!important;
  background:color-mix(in srgb,var(--panel) 94%,transparent)!important;
}
#menu .menu-group-name{
  font-size:13px!important;
  line-height:1.2;
}
#menu .menu-group-badge{
  padding:2px 7px!important;
  font-size:10px!important;
}
#menu .menu-group-items{
  display:grid!important;
  gap:6px!important;
  padding:8px!important;
}
#menu .menu-item-row{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:9px!important;
  min-height:44px!important;
  padding:7px 9px!important;
  border:1px solid color-mix(in srgb,var(--line) 72%,transparent)!important;
  border-radius:11px!important;
  background:color-mix(in srgb,var(--panel) 88%,transparent)!important;
}
#menu .menu-item-row:hover{
  background:color-mix(in srgb,var(--accent) 6%,var(--panel))!important;
}
#menu .toggle-sw-track{
  width:34px!important;
  height:19px!important;
}
#menu .toggle-sw-thumb{
  width:13px!important;
  height:13px!important;
}
#menu .toggle-sw input:checked~.toggle-sw-track .toggle-sw-thumb{
  left:calc(100% - 15px)!important;
}
#menu .menu-item-meta{
  gap:0!important;
}
#menu .menu-label-input{
  min-height:25px!important;
  padding:3px 5px!important;
  font-size:13px!important;
  font-weight:850!important;
}
#menu .menu-item-meta>small{
  padding:0 5px!important;
  font-size:10px!important;
  line-height:1.2!important;
  opacity:.72;
}
#menu .menu-item-custom{
  grid-template-columns:auto minmax(0,1fr) auto!important;
}
#menu .menu-item-meta-custom{
  grid-template-columns:1fr!important;
  gap:5px!important;
}
#menu .menu-url-input,
#menu .menu-group-sel{
  min-height:26px!important;
  padding:4px 7px!important;
  font-size:11px!important;
}
#menu .menu-new-icon{
  width:28px!important;
  height:28px!important;
  border-radius:8px!important;
  font-size:15px!important;
}
#menu .menu-editor-actions{
  grid-column:1 / -1;
  display:flex;
  justify-content:flex-end;
  padding:2px 0 0!important;
}
#menu .menu-editor-actions .btn{
  min-width:180px;
}

@media(min-width:1280px){
  #menu .menu-editor{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:720px){
  #menu .menu-editor{
    grid-template-columns:1fr!important;
    padding:10px!important;
  }
  #menu .menu-item-row,
  #menu .menu-item-custom{
    grid-template-columns:auto minmax(0,1fr)!important;
  }
  #menu .toggle-sw-danger{
    grid-column:2;
    justify-self:start;
  }
  #menu .menu-editor-actions .btn{
    width:100%;
  }
}

/* Settings and reports - alpha.8 compact navigation */
.settings-system-layout{
  display:grid;
  grid-template-columns:172px minmax(0,1fr);
  gap:12px;
  align-items:start;
}
.settings-side-nav{
  position:sticky;
  top:74px;
  display:grid;
  gap:6px;
  padding:8px;
  border:1px solid color-mix(in srgb,var(--line) 86%,transparent);
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--panel) 92%,transparent);
  box-shadow:0 8px 20px rgba(var(--shadow-rgb),.035);
}
.settings-side-nav a{
  display:flex;
  align-items:center;
  min-height:32px;
  padding:7px 9px;
  border-radius:var(--r-sm);
  color:var(--muted);
  font-size:12px;
  font-weight:850;
  text-decoration:none;
}
.settings-side-nav a:hover,
.settings-side-nav a:focus-visible{
  background:color-mix(in srgb,var(--accent) 10%,transparent);
  color:var(--text);
}
.tool-card-icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.settings-quick-grid.compact-tools{
  gap:8px!important;
}
.settings-quick-grid .tool-card.small{
  min-height:88px!important;
  padding:12px 14px!important;
}
.settings-quick-grid .tool-card.small .tool-card-icon{
  width:32px!important;
  height:32px!important;
  margin-bottom:4px!important;
}
#menu.settings-panel>summary,
#login-social.settings-panel>summary,
#whatsapp.settings-panel>summary{
  min-height:42px!important;
  padding:9px 14px!important;
}
#menu .menu-editor{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;
  gap:9px!important;
  padding:10px!important;
}
#menu .menu-group-header{
  min-height:32px!important;
  padding:6px 8px!important;
}
#menu .menu-group-items{
  gap:5px!important;
  padding:6px!important;
}
#menu .menu-item-row{
  min-height:36px!important;
  padding:5px 7px!important;
  gap:7px!important;
}
#menu .menu-label-input{
  min-height:22px!important;
  font-size:12px!important;
}
#menu .menu-item-meta>small{
  display:none!important;
}
#menu .toggle-sw-track{
  width:30px!important;
  height:17px!important;
}
#menu .toggle-sw-thumb{
  width:11px!important;
  height:11px!important;
}
#menu .toggle-sw input:checked~.toggle-sw-track .toggle-sw-thumb{
  left:calc(100% - 13px)!important;
}
#menu .menu-editor-actions{
  padding:0 10px 10px!important;
}
/* alpha.215 — cards do login social um abaixo do outro (coluna unica) */
#login-social .social-provider-grid{
  display:grid!important;
  grid-template-columns:1fr;
  gap:12px;
  margin:12px 14px!important;
  max-width:680px;
}
#login-social .social-provider-card{
  display:grid;
  gap:8px;
  min-width:0;
  padding:12px;
  border:1px solid color-mix(in srgb,var(--line) 82%,transparent);
  border-radius:var(--r-sm);
  background:linear-gradient(135deg,color-mix(in srgb,var(--panel) 96%,transparent),color-mix(in srgb,var(--panel-2) 88%,transparent));
}
#login-social .social-provider-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
#login-social .social-provider-head .check{
  margin:0!important;
  font-size:13px!important;
  font-weight:900!important;
}
#login-social .social-provider-head span{
  padding:2px 7px;
  border-radius:var(--r-pill);
  background:color-mix(in srgb,var(--accent) 10%,transparent);
  color:var(--muted);
  font-size:10px;
  font-weight:900;
}
#login-social .social-provider-card label:not(.check){
  font-size:11px!important;
}
#login-social .social-provider-card input{
  min-height:32px!important;
  padding:6px 9px!important;
  border-radius:10px!important;
  font-size:12px!important;
}
#login-social .helper-box{
  margin:0!important;
}
#login-social .btn.primary{
  width:auto!important;
  min-width:190px;
}
/* pill de status ao lado do nome do provedor */
#login-social .prov-status-pill{
  margin-left:auto;
  padding:2px 8px;
  border-radius:var(--r-pill);
  font-size:10px;
  font-weight:700;
  letter-spacing:.4px;
  text-transform:uppercase;
}
#login-social .prov-status-pill.pill-ok{
  background:color-mix(in srgb,#22c55e 18%,transparent);
  color:#16a34a;
}
#login-social .prov-status-pill.pill-off{
  background:color-mix(in srgb,var(--muted) 15%,transparent);
  color:var(--muted);
}
#login-social .prov-status-pill.pill-soon{
  background:color-mix(in srgb,var(--muted) 10%,transparent);
  color:var(--muted);
  font-style:italic;
}

/* ── OAuth Audit Panel — result wrap ─────────────────────────────────── */
.oauth-diag-result-wrap{
  margin:0 14px 14px;
  border:1px solid color-mix(in srgb,var(--border) 55%,transparent);
  border-radius:var(--r-sm);
  overflow:hidden;
  background:color-mix(in srgb,var(--panel-2) 60%,transparent);
}
.oauth-diag-result-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 12px;
  border-bottom:1px solid color-mix(in srgb,var(--border) 35%,transparent);
  background:color-mix(in srgb,var(--panel) 80%,transparent);
}
.oauth-audit-subtitle{
  font-size:11px;
  color:var(--muted);
  flex:1;
}
.oauth-diag-result-header .btn{
  padding:3px 9px!important;
  font-size:11px!important;
  min-height:26px!important;
}
@keyframes oauth-spin { to { transform:rotate(360deg); } }
.oauth-diag-run-btn{ gap:5px; }

/* Hint de campo faltando */
.spc-missing-hint{
  font-size:11px;
  color:#b45309;
  background:color-mix(in srgb,#f59e0b 12%,transparent);
  border-radius:var(--r-2xs);
  padding:5px 9px;
  line-height:1.4;
}
.spc-hint-error{
  color:#dc2626;
  background:color-mix(in srgb,#ef4444 10%,transparent);
}
.spc-type{
  font-size:10px;
  color:var(--muted);
  background:color-mix(in srgb,var(--border) 30%,transparent);
  padding:2px 7px;
  border-radius:var(--r-pill);
}
.spc-soon{ opacity:.65; }
.input-invalid{
  border-color:#ef4444!important;
  background:color-mix(in srgb,#ef4444 5%,transparent)!important;
}
.spc-ready{
  border-color:color-mix(in srgb,#22c55e 40%,transparent)!important;
}

/* footer do formulário */
.social-footer{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 0 0;
  flex-wrap:wrap;
}
.social-footer-note{
  font-size:11px;
  color:var(--muted);
  flex:1;
  line-height:1.5;
}
.social-footer-actions{
  display:flex;
  gap:8px;
  flex-shrink:0;
}

/* Loading */
.oauth-audit-loading{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:22px;
  font-size:12px;
  color:var(--muted);
}
@keyframes diag-spin { to { transform:rotate(360deg); } }
.oauth-diag-spinner{
  width:20px; height:20px;
  border:2.5px solid color-mix(in srgb,var(--accent) 25%,transparent);
  border-top-color:var(--accent);
  border-radius:50%;
  animation:diag-spin .8s linear infinite;
  flex-shrink:0;
}
/* Fetch error */
.oauth-diag-fetch-error{
  padding:16px;
  font-size:12px;
  color:#dc2626;
  background:color-mix(in srgb,#ef4444 8%,transparent);
}

/* ── Resumo ── */
.oauth-diag-summary{
  padding:10px 14px 8px;
  border-bottom:1px solid color-mix(in srgb,var(--border) 35%,transparent);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.diag-summary-meta{
  font-size:10.5px;
  color:var(--muted);
  display:flex;
  flex-wrap:wrap;
  gap:4px 10px;
}
.diag-summary-count{
  font-size:12px;
  font-weight:700;
  padding:2px 10px;
  border-radius:var(--r-pill);
}
.diag-summary-count.all-ok  { background:color-mix(in srgb,#22c55e 18%,transparent); color:#16a34a; }
.diag-summary-count.all-err { background:color-mix(in srgb,#ef4444 15%,transparent); color:#dc2626; }
.diag-summary-count.partial { background:color-mix(in srgb,#f59e0b 18%,transparent); color:#b45309; }

/* ── Grid de provedores ── */
.oauth-diag-providers{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.oauth-diag-provider{
  padding:12px 14px;
  border-right:1px solid color-mix(in srgb,var(--border) 30%,transparent);
  border-bottom:1px solid color-mix(in srgb,var(--border) 30%,transparent);
}
.oauth-diag-provider:nth-child(2n){ border-right:none; }
.oauth-diag-provider:nth-last-child(-n+2){ border-bottom:none; }

.oauth-diag-prov-head{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:7px;
}
/* Luz de status */
.diag-light{
  width:10px; height:10px;
  border-radius:50%;
  flex-shrink:0;
  box-shadow:0 0 0 2px transparent;
}
.diag-light-ok{
  background:#22c55e;
  box-shadow:0 0 0 3px color-mix(in srgb,#22c55e 25%,transparent);
  animation:pulse-ok 2.5s ease-in-out infinite;
}
.diag-light-warn{
  background:#f59e0b;
  box-shadow:0 0 0 3px color-mix(in srgb,#f59e0b 25%,transparent);
}
.diag-light-err{
  background:#ef4444;
  box-shadow:0 0 0 3px color-mix(in srgb,#ef4444 22%,transparent);
}
@keyframes pulse-ok{
  0%,100%{ box-shadow:0 0 0 3px color-mix(in srgb,#22c55e 25%,transparent); }
  50%    { box-shadow:0 0 0 6px color-mix(in srgb,#22c55e 10%,transparent); }
}
.prov-name{
  font-size:12px;
  flex:1;
}
.prov-score{
  font-size:10px;
  color:var(--muted);
}
.prov-badge{
  font-size:10px;
  font-weight:700;
  padding:1px 7px;
  border-radius:var(--r-pill);
}
.prov-badge-ok     { background:color-mix(in srgb,#22c55e 18%,transparent); color:#16a34a; }
.prov-badge-warning{ background:color-mix(in srgb,#f59e0b 18%,transparent); color:#b45309; }
.prov-badge-error  { background:color-mix(in srgb,#ef4444 14%,transparent); color:#dc2626; }

/* Barra de progresso */
.prov-progress-wrap{
  height:3px;
  background:color-mix(in srgb,var(--border) 40%,transparent);
  border-radius:var(--r-pill);
  margin-bottom:9px;
  overflow:hidden;
}
.prov-progress-bar{
  height:100%;
  border-radius:var(--r-pill);
  transition:width .4s ease;
}
.prov-progress-ok   { background:#22c55e; }
.prov-progress-warning{ background:#f59e0b; }
.prov-progress-error{ background:#ef4444; }

/* Lista de checks */
.oauth-diag-checks{
  list-style:none;
  padding:0; margin:0;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.oauth-diag-checks li{
  display:grid;
  grid-template-columns:12px 1fr;
  grid-template-rows:auto auto;
  column-gap:6px;
  font-size:11px;
  line-height:1.35;
}
.chk-dot{
  grid-row:1/3;
  width:8px; height:8px;
  border-radius:50%;
  margin-top:3px;
  flex-shrink:0;
}
.dot-ok  { background:#22c55e; }
.dot-err { background:#ef4444; }
.chk-label{
  font-weight:600;
  display:flex;
  align-items:center;
  gap:5px;
}
.chk-live-tag{
  font-size:9px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.5px;
  padding:1px 5px;
  border-radius:var(--r-pill);
  background:color-mix(in srgb,var(--accent) 15%,transparent);
  color:var(--accent);
  line-height:1.4;
}
.chk-detail{
  grid-column:2;
  font-size:10px;
  color:var(--muted);
  line-height:1.3;
}
.chk-fail .chk-detail{ color:#dc2626; }
.chk-latency{
  margin-left:6px;
  font-size:9px;
  color:var(--muted);
  font-style:italic;
}

/* JSON expandido */
.oauth-audit-json-wrap{
  border-top:1px solid color-mix(in srgb,var(--border) 40%,transparent);
}
.oauth-audit-json{
  margin:0;
  padding:12px 14px;
  font-size:10.5px;
  line-height:1.5;
  white-space:pre-wrap;
  word-break:break-all;
  background:color-mix(in srgb,var(--panel-2) 50%,transparent);
  color:var(--text);
  max-height:300px;
  overflow:auto;
}

#email .smtp-steps{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;
}
#email .smtp-step summary{
  gap:7px!important;
}
#email .smtp-step summary em{
  margin-left:auto!important;
  font-size:10px!important;
}
#email .smtp-step:not([open]) summary{
  border-bottom:0!important;
}
.reports-head{
  margin-bottom:8px!important;
}
.reports-head h1{
  font-size:clamp(28px,3.2vw,44px)!important;
  line-height:.95!important;
}
.reports-head p{
  font-size:13px!important;
}
.reports-filter{
  padding:12px 14px!important;
  margin-bottom:12px!important;
}
.reports-filter-form{
  display:grid!important;
  grid-template-columns:minmax(180px,1fr) 150px 150px auto;
  gap:8px!important;
  align-items:end!important;
}
.reports-filter-form select,
.reports-filter-form input{
  min-height:36px!important;
  padding:8px 10px!important;
  border-radius:11px!important;
}
.reports-filter-form .btn{
  min-height:36px!important;
}
.reports-metrics{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  margin-bottom:12px!important;
}
.reports-metrics .metric{
  min-height:72px!important;
  padding:12px 14px!important;
  border-top:1px solid var(--line)!important;
  border-radius:14px!important;
  box-shadow:0 8px 18px rgba(var(--shadow-rgb),.035)!important;
}
.reports-metrics .metric span{
  font-size:12px!important;
}
.reports-metrics .metric strong{
  font-size:clamp(22px,2.3vw,30px)!important;
}
.reports-card{
  padding:14px!important;
  margin-bottom:12px!important;
}
.reports-card h2{
  margin:0 0 10px!important;
  font-size:16px!important;
}
.reports-card th,
.reports-card td{
  padding:8px 10px!important;
  font-size:12px!important;
}

@media(min-width:1280px){
  #menu .menu-editor{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}
@media(max-width:1020px){
  .settings-system-layout{
    grid-template-columns:1fr;
  }
  .settings-side-nav{
    position:sticky;
    top:58px;
    z-index:8;
    display:flex;
    overflow:auto;
    scrollbar-width:none;
  }
  .settings-side-nav::-webkit-scrollbar{
    display:none;
  }
  .settings-side-nav a{
    flex:0 0 auto;
    white-space:nowrap;
  }
  .reports-filter-form{
    grid-template-columns:1fr 1fr;
  }
  .reports-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:680px){
  .settings-quick-grid.compact-tools{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .settings-quick-grid .tool-card.small{
    min-height:78px!important;
  }
  #login-social .social-provider-grid,
  .reports-filter-form,
  .reports-metrics{
    grid-template-columns:1fr!important;
  }
  #login-social .btn.primary{
    width:100%!important;
  }
  .reports-head{
    gap:10px!important;
  }
  .reports-head .page-actions{
    width:100%;
  }
  .reports-head .page-actions .btn{
    flex:1 1 auto;
  }
}

/* Updates page - alpha.9 menu-style cards */
.updates-head{
  margin-bottom:10px!important;
}
.updates-command-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:0 0 12px;
}
.updates-command-card{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:10px 12px;
  align-items:start;
  min-width:0;
  padding:13px;
  border:1px solid color-mix(in srgb,var(--line) 82%,transparent);
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--panel) 92%,var(--panel-2));
  box-shadow:0 8px 20px rgba(var(--shadow-rgb),.035);
}
.updates-command-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--accent) 10%,var(--panel));
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
  color:var(--accent);
}
.updates-command-icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.updates-command-card strong{
  display:block;
  font-size:13px;
  line-height:1.2;
}
.updates-command-card code{
  display:inline-flex;
  margin-top:4px;
  padding:2px 7px;
  border-radius:var(--r-pill);
  background:var(--panel-2);
  font-size:11px;
}
.updates-command-card p{
  grid-column:1 / -1;
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}
.updates-panel{
  padding:0!important;
  overflow:hidden;
  margin-bottom:12px!important;
}
.updates-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:48px;
  padding:10px 14px;
  border-bottom:1px solid var(--line);
}
.updates-panel-head h2{
  margin:0;
  font-size:16px;
  line-height:1.2;
}
.updates-panel-head p{
  margin:3px 0 0;
  color:var(--muted);
  font-size:12px;
  font-weight:750;
}
.updates-upload-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) 180px;
  gap:10px;
  align-items:end;
  padding:12px 14px 14px;
}
.updates-file-drop{
  display:grid;
  gap:7px;
  min-width:0;
  font-size:12px;
}
.updates-file-drop input[type="file"]{
  min-height:38px!important;
  padding:7px!important;
  border-radius:11px!important;
  background:var(--panel-2)!important;
}
.updates-file-drop input[type="file"]::file-selector-button{
  min-height:24px;
  margin-right:10px;
  border:1px solid color-mix(in srgb,var(--line) 92%,transparent);
  border-radius:var(--r-xs);
  background:var(--panel);
  color:var(--text);
  font-weight:850;
  cursor:pointer;
}
.updates-file-drop small{
  color:var(--muted);
  font-size:11px;
}
.updates-upload-form .btn{
  min-height:38px!important;
}
.update-package-grid,
.update-backup-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:10px;
  padding:12px 14px 14px;
}
.update-package-card,
.update-backup-card{
  min-width:0;
  border:1px solid color-mix(in srgb,var(--line) 82%,transparent);
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--panel) 92%,transparent);
}
.update-package-card{
  display:grid;
  grid-template-rows:auto 1fr auto;
  gap:10px;
  padding:12px;
}
.update-package-main{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:9px;
}
.update-status-dot{
  width:10px;
  height:10px;
  margin-top:5px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 12%,transparent);
}
.update-package-card.is-invalid .update-status-dot{
  background:var(--red);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--red) 12%,transparent);
}
.update-package-card h3,
.update-backup-card h3{
  margin:0;
  color:var(--text);
  font-size:13px;
  line-height:1.25;
  overflow-wrap:anywhere;
}
.update-package-card p,
.update-backup-card p{
  margin:4px 0 0;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}
.update-package-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  margin:0;
}
.update-package-meta div{
  min-width:0;
  padding:7px 8px;
  border-radius:var(--r-sm);
  background:var(--panel-2);
}
.update-package-meta dt{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
}
.update-package-meta dd{
  margin:2px 0 0;
  color:var(--text);
  font-size:12px;
  font-weight:850;
  overflow-wrap:anywhere;
}
.update-package-actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
  flex-wrap:wrap;
}
.update-package-actions form{
  margin:0;
}
.update-backup-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:11px 12px;
}
.update-backup-card form{
  margin:0;
  flex:0 0 auto;
}
/* update-history: regras consolidadas no bloco alpha.43 no final do arquivo */
.updates-empty{
  margin:12px 14px 14px;
  padding:12px;
  border:1px dashed color-mix(in srgb,var(--line-strong) 78%,transparent);
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--panel-2) 82%,transparent);
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

@media(max-width:960px){
  .updates-command-grid,
  .updates-upload-form{
    grid-template-columns:1fr;
  }
}
@media(max-width:620px){
  .update-package-grid,
  .update-backup-grid{
    grid-template-columns:1fr;
    padding:10px;
  }
  .update-backup-card,
  .update-package-actions{
    align-items:stretch;
    flex-direction:column;
  }
  .update-backup-card .btn,
  .update-package-actions .btn,
  .updates-upload-form .btn{
    width:100%;
  }
}

/* Dashboard and top preferences - alpha.10 */
.top-preferences{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.interface-stepper{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:38px;
  padding:3px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:var(--panel);
  box-shadow:var(--shadow-soft);
}
.interface-stepper .icon-btn{
  width:30px;
  height:30px;
  border-radius:var(--r-sm);
  box-shadow:none;
  font-size:15px;
}
.interface-stepper .icon-btn:disabled{
  opacity:.35;
  cursor:not-allowed;
  transform:none;
}
.interface-stepper span{
  min-width:66px;
  text-align:center;
  color:var(--text);
  font-size:12px;
  font-weight:900;
}
.top-color-select{
  width:auto;
  max-width:168px;
  min-height:38px!important;
  padding:7px 32px 7px 11px!important;
  border-radius:14px!important;
  background-color:var(--panel)!important;
  font-size:12px!important;
  font-weight:900!important;
  box-shadow:var(--shadow-soft);
}
.top-preferences>.icon-btn{
  width:38px;
  height:38px;
  border-radius:var(--r-sm);
}
.dashboard-metrics{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  margin-bottom:14px!important;
}
.dashboard-metrics .metric{
  min-height:74px!important;
  padding:12px 14px!important;
  gap:4px!important;
  border-radius:14px!important;
  border-top:1px solid var(--line)!important;
  box-shadow:0 8px 18px rgba(var(--shadow-rgb),.04)!important;
}
.dashboard-metrics .metric span{
  font-size:12px!important;
  line-height:1.2!important;
}
.dashboard-metrics .metric strong{
  font-size:clamp(22px,2.2vw,30px)!important;
  line-height:1!important;
  letter-spacing:-.02em!important;
}
.dashboard-recent-card{
  padding:16px!important;
}
.dashboard-recent-card>.section-head{
  margin-bottom:10px;
}
.view-switch{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:3px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:var(--panel-2);
}
.view-switch .btn{
  min-height:30px!important;
  padding:6px 10px!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
.view-switch .btn.is-active{
  background:var(--panel)!important;
  border-color:color-mix(in srgb,var(--accent) 22%,var(--line))!important;
  color:var(--text);
  box-shadow:0 4px 12px rgba(var(--shadow-rgb),.06)!important;
}
.dashboard-order-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:10px;
}
.dashboard-order-card{
  display:grid;
  gap:8px;
  min-width:0;
  padding:12px;
  border:1px solid color-mix(in srgb,var(--line) 82%,transparent);
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--panel) 92%,transparent);
  color:var(--text);
  text-decoration:none;
  box-shadow:0 8px 18px rgba(var(--shadow-rgb),.035);
}
.dashboard-order-card:hover{
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--accent) 24%,var(--line));
}
.dashboard-order-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.dashboard-order-card-head strong{
  color:var(--accent);
  font-size:13px;
}
.dashboard-order-card h3{
  margin:0;
  font-size:14px;
  line-height:1.25;
}
.dashboard-order-card p{
  min-height:34px;
  margin:0;
  color:var(--text);
  font-size:12px;
  line-height:1.4;
}
.dashboard-order-card-meta{
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:6px;
  align-items:center;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}
.dashboard-order-card-meta span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

@media(max-width:1180px){
  .top-preferences{
    gap:6px;
  }
  .interface-stepper span{
    display:none;
  }
  .top-color-select{
    max-width:132px;
  }
}
@media(max-width:900px){
  .top-preferences{
    order:3;
    grid-column:1 / -1;
    justify-self:stretch;
    overflow:auto;
    padding-top:2px;
  }
  .top-color-select{
    flex:1 1 160px;
    max-width:none;
  }
  .dashboard-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:560px){
  .dashboard-metrics,
  .dashboard-order-cards{
    grid-template-columns:1fr!important;
  }
  .dashboard-recent-card .section-head{
    align-items:stretch;
    flex-direction:column;
  }
  .view-switch{
    width:100%;
  }
  .view-switch .btn{
    flex:1;
  }
  .dashboard-order-card-meta{
    grid-template-columns:1fr;
  }
}

/* ─── Pepzen Glass System — alpha.11 ─── */

/* Fundo multi-radial fixo (sem parallax) — adaptado ao dourado Zoukei */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(ellipse 70% 55% at 12% 6%,  rgba(var(--accent-rgb),.12),transparent 55%),
    radial-gradient(ellipse 55% 60% at 88% 92%,  rgba(52,199,89,.06),transparent 55%),
    radial-gradient(ellipse 45% 45% at 80% 10%,  rgba(124,58,237,.06),transparent 50%),
    radial-gradient(ellipse 60% 40% at 38% 82%,  rgba(249,115,22,.05),transparent 55%);
}
html[data-theme="dark"] body::before{
  background:
    radial-gradient(ellipse 70% 55% at 12% 6%,  rgba(var(--accent-rgb),.22),transparent 55%),
    radial-gradient(ellipse 55% 60% at 88% 92%,  rgba(48,209,88,.09),transparent 55%),
    radial-gradient(ellipse 45% 45% at 80% 10%,  rgba(124,58,237,.13),transparent 50%),
    radial-gradient(ellipse 60% 40% at 38% 82%,  rgba(249,115,22,.07),transparent 55%);
}
@media(prefers-color-scheme:dark){
  html[data-theme="auto"] body::before{
    background:
      radial-gradient(ellipse 70% 55% at 12% 6%,  rgba(var(--accent-rgb),.22),transparent 55%),
      radial-gradient(ellipse 55% 60% at 88% 92%,  rgba(48,209,88,.09),transparent 55%),
      radial-gradient(ellipse 45% 45% at 80% 10%,  rgba(124,58,237,.13),transparent 50%),
      radial-gradient(ellipse 60% 40% at 38% 82%,  rgba(249,115,22,.07),transparent 55%);
  }
}

/* Glass backdrop nas cards e painéis */
@supports((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .card,.metric,.login-card,.tool-card,.kanban-col{
    -webkit-backdrop-filter:blur(24px) saturate(180%) brightness(1.01);
    backdrop-filter:blur(24px) saturate(180%) brightness(1.01);
    background:color-mix(in srgb,var(--panel) 80%,transparent)!important;
  }
  html[data-theme="dark"] .card,
  html[data-theme="dark"] .metric,
  html[data-theme="dark"] .login-card,
  html[data-theme="dark"] .tool-card,
  html[data-theme="dark"] .kanban-col{
    background:color-mix(in srgb,var(--panel) 72%,transparent)!important;
  }
  .topbar{
    -webkit-backdrop-filter:blur(32px) saturate(200%);
    backdrop-filter:blur(32px) saturate(200%);
    background:color-mix(in srgb,var(--panel) 84%,transparent)!important;
  }
  .dropdown-panel{
    -webkit-backdrop-filter:blur(28px) saturate(180%);
    backdrop-filter:blur(28px) saturate(180%);
    background:color-mix(in srgb,var(--panel) 88%,transparent)!important;
  }
  .user-menu div{
    -webkit-backdrop-filter:blur(24px) saturate(180%);
    backdrop-filter:blur(24px) saturate(180%);
    background:color-mix(in srgb,var(--panel) 88%,transparent)!important;
  }
}

/* Shimmer sutil no topo das cards */
.card{position:relative;overflow:hidden;isolation:isolate;}
.card::before{
  content:"";position:absolute;inset:0 0 auto 0;height:50%;
  border-radius:inherit;pointer-events:none;z-index:0;
  background:radial-gradient(ellipse 90% 55% at 50% -10%,rgba(255,255,255,.18),transparent 65%);
}
html[data-theme="dark"] .card::before{
  background:radial-gradient(ellipse 90% 55% at 50% -10%,rgba(255,255,255,.06),transparent 65%);
}
.card>*{position:relative;z-index:1;}

/* Tabelas e rows ficam flat (legibilidade em dados densos) */
.table-wrap,.orders-table tbody tr{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}

/* ─── Status badge dropdown — alpha.18 ─── */
.status-badge-btn{
  all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:4px;
  border-radius:var(--r-pill);padding:6px 10px;font-size:12px;font-weight:950;
  border:1px solid transparent;white-space:nowrap;
  transition:filter .15s, transform .1s;
}
.status-badge-btn:hover{filter:brightness(.92);transform:translateY(-1px);}
.status-pop{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--shadow);padding:8px;min-width:200px;
  display:grid;gap:3px;
  animation:popIn .14s ease;
}
@keyframes popIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.status-pop-head{
  font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);padding:4px 8px 8px;border-bottom:1px solid var(--line);margin-bottom:4px;
}
.status-pop-item{
  all:unset;cursor:pointer;padding:5px 8px;border-radius:var(--r-sm);display:flex;align-items:center;
  transition:.12s;
}
.status-pop-item:hover{background:rgba(var(--accent-rgb),.10);}
.status-pop-item.is-current{background:rgba(var(--accent-rgb),.14);}
.status-pop-saving{font-size:12px;color:var(--muted);padding:6px 8px;}

/* ─── alpha.17: categorias de despesas + cards etiquetas ─── */

/* Categorias de despesas */
.expense-cat-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:4px}
.expense-cat-item{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:var(--r-pill);padding:5px 10px 5px 14px;background:var(--panel-2);font-size:13px;font-weight:700}

/* Cards de etiquetas */
.label-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;padding:4px 0}
.label-select-card{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--line);border-radius:var(--r-sm);padding:12px;background:var(--panel);cursor:pointer;transition:.12s}
.label-select-card:hover{border-color:rgba(var(--accent-rgb),.45)}
.label-select-card input[type=checkbox]{flex-shrink:0;margin-top:3px;width:16px;height:16px}
.label-card-body{display:grid;gap:3px;min-width:0}
.label-card-body strong{font-size:13px}
.label-card-body span{font-size:12px;color:var(--muted)}
.label-card-body small{font-size:11px;color:var(--muted)}

/* ─── Botões compactos em grids — alpha.17 ─── */
/* Impede btn de esticar para preencher célula do grid/flex */
.form-grid > .btn,
.form-grid > button.btn,
.form-stack > .btn,
.form-stack > button.btn,
.inline-form > .btn,
.inline-form > button.btn {
  width: auto !important;
  align-self: end;
}
/* Exceção: .full deve continuar largura total */
.form-grid > .btn.full,
.form-stack > .btn.full,
.form-grid > button.btn.full { width: 100% !important; }

/* ─── Updates fixes — alpha.16 ─── */

/* Upload form compacto */
.updates-upload-form{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.updates-file-drop{flex:1;min-width:200px;}

/* Backup card: info + actions separados */
.update-backup-card{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.update-backup-info{flex:1;min-width:0;}
.update-backup-info h3{font-size:13px;font-weight:700;margin:0 0 2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.update-backup-info p{font-size:12px;color:var(--muted);margin:0;}
.update-backup-actions{display:flex;gap:6px;flex-shrink:0;align-items:center;}
.update-backup-card.is-github-backup{border-left:3px solid var(--blue);}

/* update-history GitHub deploy rows: regras consolidadas no bloco alpha.43 */
.updates-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;}

/* ─── Fixes alpha.13 ─── */

/* .is-hidden global — corrige toggle Lista/Cards */
[data-order-view-panel].is-hidden{display:none!important;}

/* view-switch: botão ativo destacado */
.view-switch .btn.is-active{
  background:var(--text)!important;
  color:var(--panel)!important;
  border-color:var(--text)!important;
}

/* Stepper sem label — apenas + e - juntos */
.interface-stepper{gap:2px;}
.interface-stepper span{display:none;}

/* Logo brand: remove gap excessivo */
.brand{gap:8px;}

/* ─── Brand Logo SVG — alpha.12 ─── */
.brand{gap:10px;align-items:center}
.brand-logo-svg{
  height:44px;width:auto;display:block;
  transition:opacity .2s;
}
.brand:hover .brand-logo-svg{opacity:.82}
/* Logo acompanha o accent da interface */
/* SVG usa currentColor — herdado do elemento pai .brand */
.brand-logo-svg{color:var(--accent);}
.brand-logo-box{stroke:currentColor;}
/* Texto usa fill explícito via CSS — var() funciona em SVG inline */
.brand-logo-name{fill:var(--text)!important;}
.brand-logo-sub{fill:var(--muted)!important;}
/* Esconde brand-name texto antigo se ainda existir */
.brand-name{display:none}

/* ─── Kanban card refactor — alpha.19 ─── */
.kanban-card{display:flex;flex-direction:column;gap:4px;background:rgba(255,255,255,.06);border-radius:var(--r-sm);border:1px solid var(--line);padding:0;overflow:hidden;transition:box-shadow .15s;}
.kanban-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.18);}
.kanban-card-top{padding:6px 10px 0;display:flex;align-items:center;gap:6px;}
.kanban-card-body{display:flex;flex-direction:column;gap:3px;padding:4px 10px 10px;text-decoration:none;color:inherit;}
.kanban-card-body strong{font-size:13px;font-weight:700;color:var(--text);}
.kanban-card-body span{font-size:12px;color:var(--muted);}
.kanban-card-body small,.kanban-card-body em{font-size:11px;color:var(--muted);}

/* ─── Dashboard order card refactor — alpha.20 ─── */
.dashboard-order-card{display:flex;flex-direction:column;cursor:default;}
.dashboard-order-card-body{display:flex;flex-direction:column;gap:4px;text-decoration:none;color:inherit;flex:1;}
.dashboard-order-card-body h3{margin:0;font-size:13px;font-weight:700;color:var(--text);}
.dashboard-order-card-body p{margin:0;font-size:12px;color:var(--muted);}

/* ─── Menus flutuantes glass — alpha.21 ─── */
.dropdown-panel,
.user-menu-panel,
.status-pop,
[class*="dropdown"],
.prefs-menu {
  background: rgba(20,20,28,.45) !important;
  backdrop-filter: blur(24px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.status-pop-item:hover {
  background: rgba(255,255,255,.08) !important;
}
.status-pop-item.is-current {
  background: rgba(var(--accent-rgb),.18) !important;
}

/* ─── Fix menus flutuantes glass — alpha.22 (sobrescreve alpha.21) ─── */
/* Remove seletor [class*="dropdown"] que quebrava o nav */
[class*="dropdown"] {
  background: revert !important;
  backdrop-filter: revert !important;
  -webkit-backdrop-filter: revert !important;
  border: revert !important;
  box-shadow: revert !important;
}
/* Aplica glass apenas nos paineis corretos */
.dropdown-panel {
  background: rgba(18,18,26,.55) !important;
  backdrop-filter: blur(20px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
.user-menu-panel {
  background: rgba(18,18,26,.55) !important;
  backdrop-filter: blur(20px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.32) !important;
}
.status-pop {
  background: rgba(18,18,26,.65) !important;
  backdrop-filter: blur(20px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.30) !important;
}

/* ─── API test panels — alpha.22 ─── */
.api-test-panel{padding:12px 0 4px;border-top:1px solid var(--line);margin-top:12px;}
.api-test-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px;}
.api-test-result{display:none;padding:8px 12px;border-radius:var(--r-sm);font-size:12px;font-weight:600;margin-bottom:6px;}
.api-test-result.ok{display:block;background:rgba(34,197,94,.12);color:#16a34a;border:1px solid rgba(34,197,94,.25);}
.api-test-result.err{display:block;background:rgba(239,68,68,.10);color:#dc2626;border:1px solid rgba(239,68,68,.22);}
.api-test-result.loading{display:block;background:rgba(var(--accent-rgb),.10);color:var(--muted);border:1px solid var(--line);}

/* ─── Painel de etiqueta (status/ações) — reusado pelo card Frenet ─── */
.sf-status-bar{display:none;padding:10px 14px;border-radius:var(--r-sm);font-size:13px;font-weight:600;margin-bottom:12px;}
.sf-status-bar.ok{background:rgba(34,197,94,.12);color:#16a34a;border:1px solid rgba(34,197,94,.25);}
.sf-status-bar.err{background:rgba(239,68,68,.10);color:#dc2626;border:1px solid rgba(239,68,68,.22);}
.sf-status-bar.loading{background:rgba(var(--accent-rgb),.10);color:var(--muted);border:1px solid var(--line);}
.sf-actions-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;}
.sf-info-box{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px;font-size:12px;white-space:pre-wrap;margin-top:8px;}
.btn.danger{background:rgba(239,68,68,.12);color:#dc2626;border-color:rgba(239,68,68,.3);}
.btn.danger:hover{background:rgba(239,68,68,.22);}
.btn.ghost{background:transparent;border-color:var(--line);color:var(--muted);}
.btn.ghost:hover{background:var(--panel-2);color:var(--text);}

/* ─── Menus flutuantes: segue o tema — alpha.25 ─── */
.dropdown-panel,
.user-menu-panel {
  background: var(--panel) !important;
  backdrop-filter: blur(16px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(140%) !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.10) !important;
  color: var(--text) !important;
}
.status-pop {
  background: var(--panel) !important;
  backdrop-filter: blur(16px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(140%) !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.18) !important;
}
.status-pop-item {
  color: var(--text) !important;
}
.status-pop-item:hover {
  background: rgba(128,128,128,.10) !important;
}
.status-pop-item.is-current {
  background: rgba(var(--accent-rgb),.12) !important;
}
.status-pop-head {
  color: var(--muted) !important;
  border-bottom-color: var(--line) !important;
}

/* ─── Quick actions on order code — alpha.25 ─── */
.order-quick-wrap{display:inline-flex;align-items:center;gap:4px;}
.order-quick-btn{all:unset;cursor:pointer;font-size:11px;color:var(--muted);padding:1px 4px;border-radius:var(--r-2xs);line-height:1;}
.order-quick-btn:hover{background:rgba(128,128,128,.12);color:var(--text);}
.order-quick-pop{position:fixed;z-index:9999;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 8px 24px rgba(0,0,0,.18);padding:6px;min-width:180px;animation:popIn .12s ease;}
.order-quick-pop-item{all:unset;display:flex;align-items:center;gap:8px;cursor:pointer;padding:7px 10px;border-radius:var(--r-xs);font-size:13px;color:var(--text);width:100%;box-sizing:border-box;}
.order-quick-pop-item:hover{background:rgba(128,128,128,.10);}
.order-quick-pop-item a{all:unset;display:flex;align-items:center;gap:8px;width:100%;cursor:pointer;}

/* ─── CORREÇÃO DEFINITIVA menus flutuantes — alpha.27 ─── */
/* Neutraliza acúmulo de !important dos alpha.21/22/25.    */
/* NUNCA usar [class*="dropdown"] — bate em .topnav-dropdown e quebra o nav. */
.dropdown-panel {
  background: color-mix(in srgb, var(--panel) 96%, transparent) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
  color: var(--text) !important;
}
.dropdown-panel .dropdown-item,
.dropdown-panel .nav-dd-item {
  color: var(--text) !important;
}
.dropdown-panel .dropdown-item:hover,
.dropdown-panel .nav-dd-item:hover {
  background: rgba(128,128,128,.10) !important;
}
.user-menu-panel {
  background: color-mix(in srgb, var(--panel) 96%, transparent) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
  color: var(--text) !important;
}
.status-pop {
  background: var(--panel) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.15) !important;
  color: var(--text) !important;
}
/* Garante que o container .topnav-dropdown NÃO receba estilos de painel flutuante */
.topnav-dropdown {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* ─── alpha.28: tema reativo no fundo, botões compactos, filtro de status ─── */

/* Fundo multi-radial reativo ao tema de cor — usa var(--accent-rgb) */
body::before {
  background:
    radial-gradient(ellipse 70% 55% at 12%  6%, rgba(var(--accent-rgb),.13),transparent 55%),
    radial-gradient(ellipse 55% 60% at 88% 92%, rgba(52,199,89,.06),transparent 55%),
    radial-gradient(ellipse 45% 45% at 80% 10%, rgba(124,58,237,.06),transparent 50%),
    radial-gradient(ellipse 60% 40% at 38% 82%, rgba(249,115,22,.05),transparent 55%) !important;
}
html[data-theme="dark"] body::before,
html[data-theme="auto"] body::before {
  background:
    radial-gradient(ellipse 70% 55% at 12%  6%, rgba(var(--accent-rgb),.24),transparent 55%),
    radial-gradient(ellipse 55% 60% at 88% 92%, rgba(48,209,88,.09),transparent 55%),
    radial-gradient(ellipse 45% 45% at 80% 10%, rgba(124,58,237,.13),transparent 50%),
    radial-gradient(ellipse 60% 40% at 38% 82%, rgba(249,115,22,.07),transparent 55%) !important;
}
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] body::before {
    background:
      radial-gradient(ellipse 70% 55% at 12%  6%, rgba(var(--accent-rgb),.24),transparent 55%),
      radial-gradient(ellipse 55% 60% at 88% 92%, rgba(48,209,88,.09),transparent 55%),
      radial-gradient(ellipse 45% 45% at 80% 10%, rgba(124,58,237,.13),transparent 50%),
      radial-gradient(ellipse 60% 40% at 38% 82%, rgba(249,115,22,.07),transparent 55%) !important;
  }
}

/* Botões compactos globais */
.btn {
  padding: 8px 14px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
}
.btn.small {
  padding: 5px 9px;
  font-size: 12px;
  border-radius: var(--r-xs);
}
/* Botões dentro de form-grid não esticam */
.form-grid .btn, .form-stack .btn, .inline-form .btn,
.filters .btn, .page-actions .btn, .reports-filter-form .btn {
  width: auto !important;
}
/* Ícone-botões da topbar ficam menores */
.icon-btn {
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
}

/* Link de filtro de status no relatório */
.status-filter-link {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  transition: opacity .15s;
}
.status-filter-link:hover { opacity: .75; }
.status-filter-count {
  font-weight: 900;
  color: var(--text);
  font-size: 14px;
}

/* update-history: regras consolidadas no bloco alpha.43 no final do arquivo */

/* ─── Order view toggle hardening — alpha.31 ─── */
[data-order-view-panel][hidden],
[data-order-view-panel].is-hidden,
.dashboard-order-cards[hidden],
.dashboard-order-cards.is-hidden,
.label-cards-grid[hidden],
.label-cards-grid.is-hidden {
  display: none !important;
}
[data-order-view-button] {
  cursor: pointer;
}
[data-order-view-button].is-active {
  background: var(--text) !important;
  color: var(--panel) !important;
  border-color: var(--text) !important;
}

/* Topbar dropdown polish - alpha.32 */
.dropdown-panel,
.user-menu .user-menu-panel {
  background: var(--panel) !important;
  color: var(--text) !important;
  border: 1px solid color-mix(in srgb, var(--line) 88%, var(--accent)) !important;
  box-shadow: 0 18px 48px rgba(var(--shadow-rgb),.14), 0 1px 0 rgba(255,255,255,.70) inset !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.dropdown-panel a,
.user-menu .user-menu-panel a {
  color: var(--text) !important;
  text-decoration: none;
}

.dropdown-panel a:hover,
.dropdown-panel a.current,
.user-menu .user-menu-panel a:hover {
  background: color-mix(in srgb, var(--accent) 9%, var(--panel-2)) !important;
  color: var(--text) !important;
}

.user-menu .user-menu-panel {
  min-width: 212px;
  padding: 8px;
  gap: 4px;
  border-radius: 16px;
}

.user-menu .user-menu-panel small {
  padding: 4px 8px 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
}

.user-menu .user-menu-panel > a {
  display: flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 9px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 850;
}

.user-menu .user-menu-panel > a[href*="logout"] {
  color: #dc2626 !important;
}

.user-menu .user-menu-panel > a[href*="logout"]:hover {
  background: rgba(239,68,68,.10) !important;
}

.git-sync-form {
  margin: 3px 0;
  display: block;
}

.git-sync-btn {
  width: 100%;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent) 8%, var(--panel));
  color: var(--text);
  box-shadow: none;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 880;
  line-height: 1;
  transition: background .14s ease, border-color .14s ease, transform .14s ease;
}

.git-sync-btn:hover {
  background: color-mix(in srgb, var(--accent) 14%, var(--panel));
  border-color: color-mix(in srgb, var(--accent) 42%, var(--line));
  transform: translateY(-1px);
}

.git-sync-btn:disabled {
  opacity: .62;
  cursor: wait;
  transform: none;
}

.git-sync-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  color: var(--accent);
}

html[data-theme="dark"] .dropdown-panel,
html[data-theme="dark"] .user-menu .user-menu-panel {
  background: var(--panel) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.34), 0 1px 0 rgba(255,255,255,.08) inset !important;
}

@media(max-width:900px) {
  .user-menu .user-menu-panel {
    right: 10px;
    width: min(240px, calc(100vw - 20px));
  }
}

/* update-history: regras consolidadas no bloco alpha.43 no final do arquivo */

.update-backup-grid {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: 10px !important;
  padding: 12px !important;
}

.update-backup-card {
  min-height: 116px !important;
  padding: 12px !important;
  border-radius: 14px !important;
}

.reports-insights {
  display: grid;
  grid-template-columns: minmax(280px,1.25fr) minmax(240px,1fr) minmax(240px,1fr);
  gap: 12px;
  margin: 0 0 12px;
}

.report-chart-card {
  padding: 14px !important;
  margin: 0 !important;
  min-width: 0;
}

.report-chart-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.report-chart-head h2 {
  margin: 0 !important;
  font-size: 15px !important;
}

.report-chart-head span,
.report-chart-legend {
  color: var(--muted);
  font-size: 12px;
  font-weight: 780;
}

.report-line-shell {
  height: 150px;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 8px;
  background:
    linear-gradient(to bottom, transparent 0 24%, color-mix(in srgb, var(--line) 55%, transparent) 24% 25%, transparent 25% 49%, color-mix(in srgb, var(--line) 55%, transparent) 49% 50%, transparent 50% 74%, color-mix(in srgb, var(--line) 55%, transparent) 74% 75%, transparent 75%),
    color-mix(in srgb, var(--panel) 90%, var(--panel-2));
}

.report-line-shell svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.report-line-shell line {
  stroke: var(--line);
  stroke-width: .5;
}

.report-line-shell polyline {
  fill: none;
  stroke: var(--accent);
  stroke-width: 2.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.report-chart-legend {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
}

.report-chart-legend strong {
  color: var(--text);
}

.report-empty-chart {
  min-height: 120px;
  display: grid;
  place-items: center;
  color: var(--muted);
  border: 1px dashed var(--line);
  border-radius: 14px;
  margin: 0;
}

.report-bar-list {
  display: grid;
  gap: 8px;
}

.report-bar-row {
  display: grid;
  grid-template-columns: minmax(96px,1fr) minmax(90px,1.4fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 30px;
  color: var(--text);
  text-decoration: none;
  font-size: 12px;
  font-weight: 780;
}

.report-bar-list.compact .report-bar-row {
  grid-template-columns: minmax(110px,1.2fr) minmax(90px,1fr) auto;
}

.report-bar-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.report-bar-track {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(in srgb, var(--line) 74%, transparent);
}

.report-bar-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 64%, var(--text)));
}

.report-bar-row strong {
  font-size: 12px;
}

.label-select-form {
  padding: 14px !important;
}

.label-print-link {
  display: inline-flex;
  color: var(--accent);
  text-decoration: none;
}

.label-print-link:hover {
  text-decoration: underline;
}

.label-row-hint {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.label-select-card {
  display: grid !important;
  grid-template-rows: auto 1fr auto;
  gap: 10px !important;
  min-height: 158px;
  padding: 12px !important;
  cursor: default !important;
}

.label-select-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.label-select-top input[type=checkbox] {
  margin: 0 !important;
}

.label-card-body {
  color: inherit;
  text-decoration: none;
  display: grid;
  gap: 4px;
  min-width: 0;
}

.label-card-body strong,
.label-card-body span,
.label-card-body small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.label-card-edit {
  justify-self: start;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.label-card-edit:hover {
  color: var(--text);
}

@media(max-width:1180px) {
  .reports-insights {
    grid-template-columns: 1fr;
  }
}

@media(max-width:680px) {
  .report-bar-row,
  .report-bar-list.compact .report-bar-row {
    grid-template-columns: minmax(82px,1fr) minmax(70px,1fr) auto;
  }
}

/* QR source selector na barra de etiquetas — alpha.35 */
.label-qr-choice{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted);margin-right:6px}
.label-qr-select{height:30px;padding:3px 8px;border-radius:var(--r-xs);border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:12px;font-weight:600;cursor:pointer}
.label-qr-select:focus{outline:2px solid var(--accent);outline-offset:1px}

/* ═══════════════════════════════════════════════════════════════
   alpha.38 — Design system: selects, botões em formulários,
   top-color-select, auditoria global
   ═══════════════════════════════════════════════════════════════ */

/* --- Select customizados: remove aparência nativa, adiciona seta SVG --- */
select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  background-size: 15px !important;
  padding-right: 34px !important;
  cursor: pointer;
}
html[data-theme="dark"] select,
html[data-theme="auto"] select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a7b0c0' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
}
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a7b0c0' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  }
}

/* Exceções: selects que já têm seta própria */
.label-qr-select,
.status-select,
.density-control select {
  appearance: none !important;
  -webkit-appearance: none !important;
}

/* --- top-color-select: compacto, inline na topbar --- */
.top-color-select {
  height: 34px !important;
  min-height: 34px !important;
  width: auto !important;
  min-width: 120px !important;
  max-width: 180px !important;
  padding: 4px 32px 4px 10px !important;
  border-radius: 10px !important;
  border: 1px solid var(--line) !important;
  background-color: var(--panel) !important;
  color: var(--text) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  box-shadow: var(--shadow-soft) !important;
  cursor: pointer;
}
.top-color-select:focus {
  border-color: rgba(var(--accent-rgb), .55) !important;
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .12) !important;
  outline: none !important;
}

/* --- Botões em formulários: não esticam na grid --- */
.form-grid > .btn,
.form-grid > button,
.form-stack > .btn,
.form-stack > button {
  justify-self: start !important;
  align-self: center !important;
  width: auto !important;
}

/* Wrapper semântico para ações de formulário */
.form-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  grid-column: 1 / -1;
  padding-top: 4px;
}
.form-actions .btn {
  width: auto !important;
}

/* --- Inputs e selects com foco accent-rgb --- */
input:focus,
select:focus,
textarea:focus {
  border-color: rgba(var(--accent-rgb), .55) !important;
  box-shadow: 0 0 0 4px rgba(var(--accent-rgb), .12) !important;
}

/* --- Refinar inputs dentro de forms compactos --- */
.compact-form input,
.compact-form select,
.compact-form textarea {
  min-height: 40px;
  font-size: 13px;
}

/* --- Inline-form select: não fica 100% wide --- */
.inline-form select {
  width: auto !important;
  min-width: 120px;
}

/* --- Corrigir btn.primary dentro de mobile media (não deixar 100%) --- */
@media(max-width:560px) {
  .form-grid > .btn,
  .form-grid > button,
  .form-stack > .btn,
  .form-stack > button {
    width: 100% !important;
    justify-self: stretch !important;
  }
}

/* ─── Color-picker custom (substituição do <select> nativo) — alpha.38b ─── */

/* Bolinhas de cor para cada tema */
.color-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  border: 1.5px solid rgba(255,255,255,.35);
  box-shadow: 0 0 0 1px rgba(0,0,0,.15);
}
.color-dot-gold      { background: #c9a34a; }
.color-dot-medical   { background: #0ea5e9; }
.color-dot-indigo    { background: #4f46e5; }
.color-dot-emerald   { background: #10b981; }
.color-dot-rose      { background: #f43f5e; }
.color-dot-purple    { background: #9333ea; }
.color-dot-orange    { background: #f97316; }
.color-dot-graphite  { background: #6b7280; }

/* Wrapper posicionado */
.color-picker {
  position: relative;
}

/* Botão de trigger */
.color-picker-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 34px;
  padding: 0 10px 0 9px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: var(--shadow-soft);
  transition: border-color .14s, background .14s;
  white-space: nowrap;
  max-width: 178px;
}
.color-picker-btn:hover {
  border-color: rgba(var(--accent-rgb), .42);
  background: color-mix(in srgb, var(--accent) 6%, var(--panel));
}
.color-picker-label {
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 116px;
}
.color-picker-caret {
  flex-shrink: 0;
  color: var(--muted);
  transition: transform .15s;
}
.color-picker-btn[aria-expanded="true"] .color-picker-caret {
  transform: rotate(180deg);
}

/* Painel dropdown */
.color-picker-panel {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  min-width: 210px;
  background: var(--panel);
  border: 1px solid color-mix(in srgb, var(--line) 88%, var(--accent));
  border-radius: 16px;
  box-shadow: 0 18px 48px rgba(var(--shadow-rgb),.14), 0 1px 0 rgba(255,255,255,.70) inset;
  padding: 6px;
  display: grid;
  gap: 2px;
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
  transition: opacity .14s ease, transform .14s ease;
  z-index: 100;
}
.color-picker-panel.is-open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
html[data-theme="dark"] .color-picker-panel,
html[data-theme="auto"] .color-picker-panel {
  box-shadow: 0 18px 48px rgba(0,0,0,.34), 0 1px 0 rgba(255,255,255,.08) inset;
}
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] .color-picker-panel {
    box-shadow: 0 18px 48px rgba(0,0,0,.34), 0 1px 0 rgba(255,255,255,.08) inset;
  }
}

/* Opções */
.color-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  border: none;
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 780;
  cursor: pointer;
  text-align: left;
  transition: background .12s;
}
.color-opt:hover {
  background: color-mix(in srgb, var(--accent) 9%, var(--panel-2));
}
.color-opt.is-active {
  background: color-mix(in srgb, var(--accent) 13%, var(--panel-2));
  font-weight: 950;
}

@media(max-width:900px) {
  .color-picker-panel {
    left: auto;
    right: 0;
  }
}
@media(max-width:560px) {
  .color-picker-label { display: none; }
  .color-picker-btn { max-width: 46px; padding: 0 8px; gap: 0; }
  .color-picker-caret { display: none; }
}

/* ═══════════════════════════════════════════════════════════════
   alpha.39 — Recuperação de conta: layout, PIN, QR, métodos
   ═══════════════════════════════════════════════════════════════ */

/* Wrapper centralizado */
.recover-wrap {
  min-height: 80vh;
  display: grid;
  place-items: center;
  padding: 32px 16px;
}

/* Card principal */
.recover-card {
  width: min(460px, 100%);
  background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 96%, transparent), var(--panel));
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 36px 32px 32px;
  display: grid;
  gap: 16px;
  text-align: center;
}
.recover-card h2 {
  margin: 0;
  font-size: 22px;
  letter-spacing: -.03em;
}
.recover-card p {
  margin: 0;
  color: var(--muted);
  font-weight: 650;
  line-height: 1.5;
  font-size: 14px;
}

/* Ícone topo */
.recover-icon {
  font-size: 40px;
  line-height: 1;
  margin: 0 auto;
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(var(--accent-rgb), .10);
  border: 1.5px solid rgba(var(--accent-rgb), .22);
}
.recover-icon-success { background: rgba(22,163,74,.12); border-color: rgba(22,163,74,.28); }
.recover-icon-error   { background: rgba(220,38,38,.12); border-color: rgba(220,38,38,.28); }

/* Formulário interno */
.recover-form {
  display: grid;
  gap: 14px;
  text-align: left;
}
.recover-form label {
  font-size: 13px;
  font-weight: 850;
  color: var(--muted);
  display: grid;
  gap: 6px;
}
.recover-form input[type=text],
.recover-form input[type=email],
.recover-form input[type=password],
.recover-form input[type=tel] {
  width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel-2);
  color: var(--text);
  font: inherit;
  font-size: 15px;
}
.recover-form input:focus {
  border-color: rgba(var(--accent-rgb), .55);
  box-shadow: 0 0 0 4px rgba(var(--accent-rgb), .12);
  outline: none;
}
.recover-submit {
  width: 100% !important;
  min-height: 46px !important;
  justify-content: center !important;
  font-size: 14px !important;
  border-radius: 14px !important;
}

/* Métodos de recuperação */
.recover-methods {
  border: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.recover-methods legend {
  font-size: 12px;
  font-weight: 850;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 10px;
  grid-column: 1/-1;
}
.recover-method-opt {
  cursor: pointer;
}
.recover-method-opt input[type=radio] {
  display: none;
}
.recover-method-card {
  display: grid;
  gap: 4px;
  padding: 12px 10px;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  text-align: center;
  transition: border-color .14s, background .14s, transform .12s;
  background: var(--panel-2);
  cursor: pointer;
}
.recover-method-card:hover {
  border-color: rgba(var(--accent-rgb), .42);
  transform: translateY(-1px);
}
.recover-method-opt input:checked + .recover-method-card {
  border-color: var(--accent);
  background: rgba(var(--accent-rgb), .09);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .12);
}
.recover-method-icon { font-size: 22px; display: block; }
.recover-method-card strong { font-size: 12px; font-weight: 950; color: var(--text); }
.recover-method-card small  { font-size: 10px; color: var(--muted); line-height: 1.3; }

/* PIN: 6 caixas individuais */
.pin-inputs {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin: 6px 0;
}
.pin-digit {
  width: 52px !important;
  height: 60px !important;
  min-height: unset !important;
  padding: 0 !important;
  text-align: center !important;
  font-size: 26px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  border-radius: 14px !important;
  border: 1.5px solid var(--line) !important;
  background: var(--panel-2) !important;
  color: var(--text) !important;
  caret-color: transparent;
  transition: border-color .14s, box-shadow .14s;
}
.pin-digit:focus {
  border-color: rgba(var(--accent-rgb), .7) !important;
  box-shadow: 0 0 0 4px rgba(var(--accent-rgb), .14) !important;
  outline: none !important;
}
.pin-digit.filled {
  border-color: color-mix(in srgb, var(--accent) 60%, var(--line)) !important;
  background: rgba(var(--accent-rgb), .06) !important;
}

/* Erro de recuperação */
.recover-error {
  padding: 10px 14px;
  background: rgba(220,38,38,.10);
  border: 1px solid rgba(220,38,38,.25);
  border-radius: 12px;
  color: var(--red);
  font-size: 13px;
  font-weight: 800;
  text-align: left;
}

/* Hint (onde o PIN foi enviado) */
.recover-hint {
  color: var(--green) !important;
  background: rgba(22,163,74,.08);
  border: 1px solid rgba(22,163,74,.22);
  border-radius: 12px;
  padding: 9px 13px;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

/* Voltar */
.recover-back {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
  display: block;
  margin-top: -4px;
  transition: color .14s;
}
.recover-back:hover { color: var(--text); }

/* QR Code */
.qr-recover-wrap {
  display: grid;
  place-items: center;
  gap: 12px;
}
.qr-recover-img {
  border-radius: 16px;
  border: 1px solid var(--line);
  padding: 8px;
  background: white;
  box-shadow: var(--shadow-soft);
}
.qr-recover-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
  color: var(--muted);
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(var(--accent-rgb), .07);
  border: 1px solid rgba(var(--accent-rgb), .18);
}
.qr-pulse {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--accent);
  animation: qr-pulse-anim 1.4s ease-in-out infinite;
}
@keyframes qr-pulse-anim {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: .4; transform: scale(.7); }
}

/* Link de recuperação na tela de login */
.login-recover-link {
  text-align: center;
  font-size: 13px;
  color: var(--muted);
}
.login-recover-link a {
  color: var(--muted);
  text-decoration: none;
  transition: color .14s;
}
.login-recover-link a:hover { color: var(--text); }
.login-recover-link strong  { color: var(--accent); }

@media(max-width:560px) {
  .recover-card { padding: 24px 18px 20px; }
  .recover-methods { grid-template-columns: 1fr; }
  .pin-inputs { gap: 6px; }
  .pin-digit { width: 42px !important; height: 52px !important; font-size: 22px !important; }
  .recover-form input { font-size: 16px; } /* alpha.1019 — <16px dispara auto-zoom do iOS Safari (inputs crus, fora do guard .icon-input) */
}
/* alpha.1019 — 6 caixas de PIN (6×42+5×6=282px) estouravam o card (~252px úteis) em ≤349px */
@media(max-width:360px) {
  .pin-inputs { gap: 4px; }
  .pin-digit { width: 34px !important; height: 48px !important; font-size: 20px !important; }
}

/* ── alpha.40: Novo Pedido + Modelos ──────────────────────────────── */
.new-order-section-head {
  margin: 18px 0 4px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted);
}
.new-order-section-head:first-child { margin-top: 0; }

.new-customer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 10px;
}
.new-customer-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; }
.new-customer-grid label input { font-weight: 400; }

.inline-field { display: flex; gap: 6px; align-items: flex-end; }
.inline-field input { flex: 1; }

.helper-box {
  padding: 7px 11px;
  border-radius: 6px;
  font-size: 12.5px;
  background: rgba(var(--accent-rgb),.07);
  border: 1px solid rgba(var(--accent-rgb),.18);
  color: var(--text);
}

/* Freight calculator */
.freight-calc-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}
.freight-calc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: rgba(var(--accent-rgb),.05);
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.freight-calc-head strong { font-weight: 700; }
.freight-calc-body {
  padding: 14px;
  transition: max-height .22s ease, padding .22s ease, opacity .2s;
  max-height: 600px;
  opacity: 1;
}
.freight-calc-body.is-collapsed { max-height: 0; padding: 0 14px; opacity: 0; overflow: hidden; }
.freight-calc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.freight-calc-grid label { display: flex; flex-direction: column; gap: 3px; font-size: 13px; font-weight: 600; }
.freight-calc-grid input { font-weight: 400; }
.freight-calc-actions { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.freight-results { display: flex; flex-direction: column; gap: 6px; }
.freight-result-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 12px;
  border-radius: 7px;
  border: 1.5px solid var(--line);
  background: var(--panel);
  cursor: pointer;
  transition: border-color .14s, background .14s;
  font-size: 13px;
}
.freight-result-item:hover,
.freight-result-item.is-selected {
  border-color: var(--accent);
  background: rgba(var(--accent-rgb),.08);
}
.freight-result-item .fr-name { font-weight: 700; }
.freight-result-item .fr-price { color: var(--accent); font-weight: 800; font-size: 14px; }
.freight-result-item .fr-time { font-size: 11.5px; color: var(--muted); }

/* Model color chips */
.model-colors-section { margin-top: 10px; }
.model-color-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  min-height: 46px;
}
.color-chip {
  padding: 4px 11px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  border: 1.5px solid var(--line);
  background: var(--panel);
  color: var(--text);
  transition: border-color .12s, background .12s, color .12s;
  user-select: none;
}
.color-chip:hover { border-color: var(--accent); }
.color-chip.is-selected {
  border-color: var(--accent);
  background: rgba(var(--accent-rgb),.15);
  color: var(--text);
}
.custom-color-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 9px 4px 11px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 600;
  border: 1.5px solid var(--accent);
  background: rgba(var(--accent-rgb),.1);
  color: var(--text);
}
.remove-custom-color {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px; height: 16px;
  border-radius: 50%;
  border: none;
  background: rgba(var(--accent-rgb),.2);
  color: var(--text);
  cursor: pointer;
  font-size: 12px;
  line-height: 1;
  padding: 0;
}
.remove-custom-color:hover { background: rgba(var(--accent-rgb),.4); }

/* CPF validation state */
input[data-cpf].cpf-invalid {
  border-color: #e53e3e;
  background: rgba(229,62,62,.06);
}
input[data-cpf].cpf-valid {
  border-color: #38a169;
  background: rgba(56,161,105,.06);
}
.cpf-hint {
  font-size: 11.5px;
  margin-top: 3px;
  color: #e53e3e;
}

@media(max-width:640px) {
  .new-customer-grid { grid-template-columns: 1fr; }
  .freight-calc-grid { grid-template-columns: 1fr 1fr; }
}

/* ═════════════════════════════════════════════════════════════
   alpha.41 — Criador de temas, extensões/SDK, logo refinada,
   color-picker com temas customizados
   ═════════════════════════════════════════════════════════════ */

/* Separador no color-picker entre temas built-in e customizados */
.color-picker-separator {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 8px 12px 4px;
  border-top: 1px solid var(--line);
  margin-top: 4px;
}

/* Logo: faces sutis seguem a cor de destaque */
.brand-logo-svg .brand-logo-box { color: var(--accent); }
.brand-logo-svg .brand-logo-name { fill: var(--text); }
.brand-logo-svg .brand-logo-sub  { fill: var(--muted); }

/* Theme builder — paleta de color pickers */
.theme-color-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 12px;
}
.theme-color-pick {
  display: grid;
  grid-template-rows: minmax(36px, auto) auto minmax(26px, auto); /* label + picker + small, todos uniformes */
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  font-size: 13px;
}
.theme-color-pick > span {
  font-weight: 700;
  font-size: 12.5px;
  line-height: 1.3;
}
.theme-color-pick > small {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.3;
}
/* Quando não há <small> (ex: "Texto principal"), a 3ª linha do grid permanece vazia
   mantendo todos os cards na mesma altura */

.theme-preview-box {
  padding: 16px;
  border-radius: 12px;
  border: 1px dashed rgba(var(--accent-rgb), .35);
  background: var(--bg);
  color: var(--text);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.theme-preview-box strong { color: var(--text); }
.theme-preview-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.theme-preview-box .preview-btn {
  padding: 7px 14px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--panel);
  font-weight: 700;
}
.theme-preview-box .preview-btn.primary {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
.theme-preview-box .preview-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(var(--accent-rgb), .15);
  color: var(--text);
  font-size: 11px;
  font-weight: 700;
}

/* Cards de tema na listagem */
.theme-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}
.theme-card {
  display: flex;
  align-items: stretch;
  gap: 0;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: var(--panel);
  transition: border-color .14s, transform .14s;
}
.theme-card:hover {
  border-color: rgba(var(--accent-rgb), .45);
  transform: translateY(-1px);
}
.theme-card-swatch { width: 60px; min-height: 100px; flex-shrink: 0; }
.theme-card-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px;
  flex: 1;
}
.theme-card-body code {
  background: rgba(var(--accent-rgb), .08);
  padding: 1px 6px;
  border-radius: 5px;
  font-size: 11px;
}
.theme-card-actions { margin-top: auto; display: flex; gap: 6px; }
form.inline { display: inline-block; }

/* Extensões */
.extension-kinds-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.extension-kind {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.extension-kind strong { font-size: 13.5px; }
.extension-kind code {
  display: inline-block;
  background: rgba(var(--accent-rgb), .08);
  padding: 1px 7px;
  border-radius: 5px;
  font-size: 11px;
  width: max-content;
}
.extension-kind p { font-size: 12.5px; color: var(--muted); margin: 4px 0 0; }

.extension-list { display: flex; flex-direction: column; gap: 8px; }
.extension-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  gap: 16px;
  flex-wrap: wrap;
}
.extension-row.is-disabled { opacity: .55; }
.extension-row .ext-meta { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 200px; }
.extension-row .ext-meta strong { font-size: 14px; }
.extension-row .ext-meta p { font-size: 12.5px; margin: 0; }
.ext-kind-pill {
  display: inline-flex;
  width: max-content;
  align-items: center;
  padding: 2px 9px;
  border-radius: 999px;
  background: rgba(var(--accent-rgb), .12);
  color: var(--text);
  font-size: 11px;
  font-weight: 700;
}
.ext-actions { display: flex; gap: 6px; flex-wrap: wrap; }

.btn-danger {
  background: rgba(229, 62, 62, .1);
  color: #c43030;
  border-color: rgba(229, 62, 62, .3);
}
.btn-danger:hover { background: rgba(229, 62, 62, .18); }

@media (max-width: 700px) {
  .theme-color-grid { grid-template-columns: repeat(2, 1fr); }
  .extension-row { flex-direction: column; align-items: flex-start; }
}

/* ═════════════════════════════════════════════════════════════
   alpha.42 — Custom Color Picker (HSV + lightness + alpha)
   ═════════════════════════════════════════════════════════════ */

.ccp {
  position: relative;
  display: inline-block;
  width: 100%;
}
.ccp-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--bg);
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  transition: border-color .14s, box-shadow .14s;
  min-height: 40px;
  text-align: left;
}
.ccp-trigger:hover { border-color: rgba(var(--accent-rgb), .45); }
.ccp-trigger:focus { outline: 2px solid rgba(var(--accent-rgb), .35); outline-offset: 1px; }

.ccp-swatch {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  flex-shrink: 0;
  /* xadrez para transparência */
  background-image:
    linear-gradient(45deg, #ccc 25%, transparent 25%),
    linear-gradient(-45deg, #ccc 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #ccc 75%),
    linear-gradient(-45deg, transparent 75%, #ccc 75%);
  background-size: 10px 10px;
  background-position: 0 0, 0 5px, 5px -5px, -5px 0;
  border: 1px solid rgba(0,0,0,.1);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.4);
  position: relative;
}
.ccp-swatch::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--ccp-color, #c9a34a);
}
/* O JS define a cor diretamente no style.background — sobrepõe a base xadrez */
.ccp-trigger .ccp-swatch[style*="background"]::after { display: none; }

.ccp-value {
  font-family: var(--mono);
  font-size: 12.5px;
  color: var(--muted);
  flex: 1;
  letter-spacing: 0.02em;
}

.ccp-popover {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 9999;
  width: 256px;
  padding: 12px;
  border-radius: 12px;
  background: var(--panel);
  border: 1px solid var(--line);
  box-shadow: 0 10px 30px rgba(var(--shadow-rgb), 0.18), 0 0 0 1px rgba(var(--accent-rgb), 0.06);
  display: none;
  flex-direction: column;
  gap: 10px;
  color: var(--text);
}
.ccp.ccp-open .ccp-popover { display: flex; }

/* Área SV */
.ccp-sv {
  position: relative;
  width: 100%;
  height: 160px;
  border-radius: 8px;
  cursor: crosshair;
  overflow: hidden;
  border: 1px solid var(--line);
  /* fallback */
  background: linear-gradient(to top, #000, transparent),
              linear-gradient(to right, #fff, hsl(45, 100%, 50%));
}
.ccp-sv-pointer {
  position: absolute;
  width: 14px;
  height: 14px;
  margin: -7px 0 0 -7px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,.45), 0 1px 4px rgba(0,0,0,.35);
  pointer-events: none;
}

/* Barras (hue, lightness, alpha) */
.ccp-strip {
  position: relative;
  height: 14px;
  border-radius: 7px;
  cursor: ew-resize;
  overflow: hidden;
  border: 1px solid var(--line);
}
.ccp-strip-pointer {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 18px;
  margin: -9px 0 0 -6px;
  border-radius: 4px;
  background: #fff;
  border: 2px solid rgba(0,0,0,.55);
  box-shadow: 0 1px 3px rgba(0,0,0,.35);
  pointer-events: none;
}
.ccp-hue {
  background: linear-gradient(to right,
    #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%,
    #0000ff 67%, #ff00ff 83%, #ff0000 100%);
}
.ccp-lightness {
  /* JS injeta gradiente preto→cor→branco */
  background: linear-gradient(to right, #000 0%, #888 50%, #fff 100%);
}
.ccp-alpha {
  background-image:
    linear-gradient(45deg, #ccc 25%, transparent 25%),
    linear-gradient(-45deg, #ccc 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #ccc 75%),
    linear-gradient(-45deg, transparent 75%, #ccc 75%);
  background-size: 8px 8px;
  background-position: 0 0, 0 4px, 4px -4px, -4px 0;
}
.ccp-alpha-color {
  position: absolute;
  inset: 0;
}

/* Toolbar do picker (conta-gotas, futuras ferramentas) */
.ccp-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 0;
  min-height: 28px;
}
.ccp-eyedrop-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  font-size: 11.5px;
  font-weight: 700;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--bg);
  color: var(--text);
  cursor: pointer;
  transition: background .14s, border-color .14s;
}
.ccp-eyedrop-btn:hover {
  background: rgba(var(--accent-rgb), .08);
  border-color: rgba(var(--accent-rgb), .45);
}
.ccp-eyedrop-btn:active { transform: translateY(1px); }
.ccp-eyedrop-btn:disabled,
.ccp-eyedrop-btn.is-loading {
  opacity: .55;
  cursor: not-allowed;
}
.ccp-eyedrop-btn svg { color: var(--accent); }
.ccp-eyedrop-unsupported {
  font-size: 10.5px;
  color: var(--muted);
  font-style: italic;
}

/* Inputs HEX / RGB / A */
.ccp-fields {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  gap: 5px;
  margin-top: 2px;
}
.ccp-fields label {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
  text-align: center;
}
.ccp-fields input {
  width: 100%;
  padding: 5px 4px !important;
  font-size: 11.5px;
  font-family: var(--mono);
  text-align: center;
  border-radius: 5px;
  border: 1px solid var(--line);
  background: var(--bg);
  color: var(--text);
  font-weight: 600;
  min-height: 28px;
  /* remove o chevron de select padrão dos number */
  background-image: none !important;
  padding-right: 4px !important;
}
.ccp-fields input::-webkit-outer-spin-button,
.ccp-fields input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.ccp-fields input[type="number"] { -moz-appearance: textfield; }
.ccp-fields input:focus {
  border-color: rgba(var(--accent-rgb), .55);
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb), .15);
  outline: none;
}

@media (max-width: 360px) {
  .ccp-popover { width: 100%; min-width: 240px; }
  .ccp-fields { grid-template-columns: 2fr 1fr 1fr 1fr; }
  .ccp-fields label:last-child { grid-column: span 2; }
}

/* ═════════════════════════════════════════════════════════════
   alpha.43 — Histórico de updates (consolidação única, sem !important)
   Substitui 4 blocos competindo entre si que quebravam o layout.
   ═════════════════════════════════════════════════════════════ */

.update-history-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
}

.update-history-row {
  border: 1px solid var(--line);
  border-left: 3px solid color-mix(in srgb, var(--accent) 70%, var(--line));
  border-radius: 12px;
  background: var(--panel);
  overflow: hidden;
  transition: border-color .14s, box-shadow .14s;
}
.update-history-row:hover { box-shadow: 0 6px 16px rgba(var(--shadow-rgb),.06); }
.update-history-row.is-github-deploy { border-left-color: #2563eb; }
.update-history-row > summary { list-style: none; }
.update-history-row > summary::-webkit-details-marker { display: none; }

.update-history-summary {
  display: grid;
  grid-template-columns: 22px auto auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  cursor: pointer;
  user-select: none;
  font-size: 13px;
}
.update-history-summary::before {
  content: '›';
  font-size: 18px;
  color: var(--muted);
  transition: transform .14s;
  width: 22px;
  text-align: center;
  line-height: 1;
}
.update-history-row[open] > .update-history-summary::before {
  transform: rotate(90deg);
}
.update-history-row[open] > .update-history-summary {
  background: rgba(128,128,128,.05);
}
.update-history-summary:hover { background: rgba(128,128,128,.04); }

.update-history-summary > .badge {
  font-size: 10px;
  padding: 3px 10px;
  margin: 0;
  letter-spacing: 0.04em;
}
.update-history-date {
  color: var(--muted);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.update-history-title {
  min-width: 0;
  font-weight: 700;
  font-size: 13.5px;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.update-history-ver {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--accent);
  background: rgba(var(--accent-rgb), .12);
  padding: 3px 9px;
  border-radius: 999px;
  white-space: nowrap;
}
.update-history-snap {
  color: var(--muted);
  font-size: 11.5px;
  white-space: nowrap;
}

/* Detalhe expandido — separado da summary */
.update-history-detail {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px 18px 14px 58px;
  border-top: 1px dashed var(--line);
  background: rgba(128,128,128,.03);
}
.update-detail-msg {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  background: var(--panel);
  border-left: 3px solid var(--accent);
  padding: 8px 12px;
  border-radius: 0 8px 8px 0;
}
.update-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: center;
}
.update-detail-meta span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  font-size: 11.5px;
  color: var(--muted);
  max-width: 100%;
  white-space: nowrap;
}
.update-detail-meta strong {
  color: var(--text);
  font-weight: 800;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.update-detail-meta code {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text);
  background: rgba(var(--accent-rgb), .08);
  padding: 1px 7px;
  border-radius: 5px;
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  vertical-align: middle;
}

@media (max-width: 980px) {
  .update-history-summary {
    grid-template-columns: 22px auto minmax(0,1fr) auto;
  }
  .update-history-date,
  .update-history-snap { display: none; }
  .update-history-detail { padding-left: 18px; }
  .update-detail-meta code { max-width: 200px; }
}
@media (max-width: 600px) {
  .update-history-summary { grid-template-columns: 22px minmax(0,1fr) auto; }
  .update-history-summary > .badge { display: none; }
  .update-history-ver { font-size: 10px; padding: 2px 7px; }
  .update-detail-meta code { max-width: 160px; }
}

/* ═════════════════════════════════════════════════════════════
   alpha.43 — Auditoria de interface
   ═════════════════════════════════════════════════════════════ */

.audit-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 12px;
}
.audit-toolbar .btn.is-active {
  background: rgba(var(--accent-rgb), .15);
  border-color: var(--accent);
  color: var(--accent);
}
.audit-toolbar .audit-upload-label { cursor: pointer; }
.audit-toolbar .inline-import, .audit-toolbar .inline { display: inline-flex; }

.audit-form { display: flex; flex-direction: column; gap: 12px; }

.audit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.audit-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
}
.audit-field > label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 700;
}
.audit-field > label code {
  font-family: var(--mono);
  font-size: 10.5px;
  background: rgba(var(--accent-rgb), .08);
  padding: 1px 6px;
  border-radius: 4px;
  color: var(--muted);
  font-weight: 500;
}
.audit-size { display: flex; gap: 8px; align-items: center; }
.audit-size input[type="range"] { flex: 1; accent-color: var(--accent); }
.audit-size-val { width: 70px; text-align: center; font-family: var(--mono); font-size: 12px; }

.audit-actions {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px 0;
}

/* Inspetor flutuante */
.audit-inspector {
  position: fixed;
  right: 16px;
  bottom: 16px;
  width: 320px;
  max-height: 70vh;
  z-index: 9998;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(var(--shadow-rgb),.2);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.audit-inspector-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  background: rgba(var(--accent-rgb), .06);
}
.audit-inspector-body {
  padding: 12px 14px;
  overflow-y: auto;
  font-size: 12.5px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.audit-insp-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 4px 0;
  border-bottom: 1px dashed var(--line);
}
.audit-insp-row:last-child { border-bottom: none; }
.audit-insp-row strong {
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}
.audit-insp-row code {
  font-family: var(--mono);
  font-size: 11.5px;
  color: var(--text);
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.audit-inspector-body details { font-size: 12px; }
.audit-inspector-body details summary {
  cursor: pointer;
  font-weight: 700;
  padding: 4px 0;
  user-select: none;
}
.audit-inspector-body input[type="text"] {
  width: 100%;
  padding: 6px 8px;
  font-size: 12px;
  border-radius: 6px;
  border: 1px solid var(--line);
  background: var(--bg);
}

/* Modo inspetor: realça elementos sob hover */
body.audit-inspecting * { cursor: crosshair !important; }
body.audit-inspecting *:hover {
  outline: 2px dashed var(--accent) !important;
  outline-offset: 1px;
}
body.audit-inspecting .audit-inspector,
body.audit-inspecting .audit-inspector * { outline: none !important; cursor: default !important; }

/* ═════════════════════════════════════════════════════════════
   alpha.45 — Design System "Expo3D" (auth + modals + gradient)
   Aplicado nas páginas públicas (login, cadastro, recuperação)
   e nos componentes compartilhados (modal, btn gradient).
   ═════════════════════════════════════════════════════════════ */

/* Variáveis específicas do design Expo3D — seguem o tema global */
:root {
  --gradient-primary: linear-gradient(90deg, #3b82f6 0%, #a855f7 50%, #ec4899 100%);
  --gradient-primary-hover: linear-gradient(90deg, #2563eb 0%, #9333ea 50%, #db2777 100%);
  /* auth vars herdam do tema global — mudam automaticamente com dark/light */
  --auth-bg:       var(--bg);
  --auth-card:     var(--panel);
  --auth-input-bg: var(--panel-2);
  --auth-border:   var(--line);
  --auth-text:     var(--text);
  --auth-muted:    var(--muted);
  --auth-accent:   var(--accent);
}

/* ── Botão gradient (azul → roxo → rosa) ──────────────────── */
.btn-gradient {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 13px 20px;
  border: none;
  border-radius: 10px;
  background: var(--gradient-primary);
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  transition: opacity .15s, transform .12s, box-shadow .15s;
  box-shadow: 0 4px 12px rgba(168, 85, 247, .25);
  letter-spacing: 0.01em;
}
.btn-gradient:hover {
  background: var(--gradient-primary-hover);
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(168, 85, 247, .35);
}
.btn-gradient:active { transform: translateY(0); }
.btn-gradient:disabled {
  opacity: .55;
  cursor: not-allowed;
  transform: none;
}

.btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 20px;
  border: 1px solid var(--auth-border, #e5e7eb);
  border-radius: 10px;
  background: var(--auth-card, #fff);
  color: var(--auth-text, #111827);
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: background .14s, border-color .14s;
}
.btn-outline:hover {
  border-color: var(--auth-muted, #6b7280);
  background: rgba(0, 0, 0, .02);
}

/* ── Página de autenticação ───────────────────────────────── */
body:has(.auth-page-wrap) {
  background: var(--auth-bg);
}
.main.main-login,
body:has(.auth-page-wrap) .main,
body:has(.auth-page-wrap) .pub-main {
  background: var(--auth-bg);
  min-height: 100vh;
  padding: 40px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.auth-page-wrap {
  width: 100%;
  max-width: 480px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

/* Brand no topo */
.auth-brand { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.auth-brand-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  color: inherit;
}
.auth-brand-logo { display: block; }
.auth-brand-name {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.25em;
  color: var(--auth-muted);
}
.auth-subtitle {
  margin: 0;
  font-size: 16px;
  color: var(--auth-muted);
  text-align: center;
}

/* Card central */
.auth-card {
  width: 100%;
  background: var(--auth-card);
  border-radius: 20px;
  padding: 28px;
  box-shadow:
    0 1px 3px rgba(0, 0, 0, .04),
    0 0 0 1px rgba(0, 0, 0, .03);
}
.auth-card-wide { max-width: 560px; }

/* Tabs */
.auth-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  padding: 4px;
  background: var(--auth-input-bg);
  border-radius: 12px;
  margin-bottom: 24px;
}
.auth-tab {
  padding: 9px 12px;
  border-radius: 9px;
  background: transparent;
  color: var(--auth-muted);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background .14s, color .14s, box-shadow .14s;
}
.auth-tab.is-active {
  background: var(--auth-card);
  color: var(--auth-text);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
}
.auth-tab:hover:not(.is-active) { color: var(--auth-text); }

/* Form layout */
.auth-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.icon-input-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.icon-input-label {
  font-size: 14px;
  font-weight: 700;
  color: var(--auth-text);
}
.icon-input {
  position: relative;
  display: flex;
  align-items: center;
}
.icon-input-icon {
  position: absolute;
  left: 12px;
  display: flex;
  align-items: center;
  color: var(--auth-muted);
  pointer-events: none;
}
.icon-input input {
  width: 100%;
  padding: 11px 14px 11px 42px !important;
  background: var(--auth-input-bg) !important;
  border: 1px solid var(--auth-border) !important;
  border-radius: 10px !important;
  color: var(--auth-text) !important;
  font-size: 14.5px;
  font-family: inherit;
  transition: border-color .15s, background .15s, box-shadow .15s;
  box-shadow: none !important;
}
.icon-input input:focus {
  outline: none;
  border-color: var(--auth-accent) !important;
  background: var(--panel) !important;
  box-shadow: 0 0 0 3px rgba(168, 85, 247, .12) !important;
}
.icon-input input::placeholder { color: var(--auth-muted); }

.icon-input.has-toggle input { padding-right: 48px !important; }
.icon-input-toggle {
  position: absolute;
  right: 4px;
  width: 40px;  /* alpha.1019 — alvo de toque (era 32px) */
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: transparent;
  color: var(--auth-muted);
  cursor: pointer;
  border-radius: 6px;
  transition: background .14s, color .14s;
}
.icon-input-toggle:hover { background: rgba(0,0,0,.04); color: var(--auth-text); }

.icon-input-hint {
  font-size: 12px;
  color: var(--auth-muted);
  margin-left: 2px;
}

.auth-forgot {
  display: flex;
  justify-content: flex-end;
  margin-top: -6px;
}
.auth-forgot a {
  color: var(--accent);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.auth-forgot a:hover { text-decoration: underline; }

.auth-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13.5px;
  color: var(--auth-text);
  cursor: pointer;
  line-height: 1.5;
}
.auth-checkbox input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 1px 0 0 0;
  flex-shrink: 0;
  accent-color: var(--auth-accent);
  cursor: pointer;
}
.auth-checkbox a {
  color: var(--auth-accent);
  text-decoration: none;
  font-weight: 600;
}
.auth-checkbox a:hover { text-decoration: underline; }
.auth-checkbox svg { display: inline; vertical-align: -2px; }

/* Divisor "OU CONTINUE COM" */
.auth-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 8px 0 4px;
  color: var(--auth-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.auth-divider::before,
.auth-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--auth-border);
}

/* Google button */
.btn-social-google {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  padding: 11px 16px;
  border: 1px solid var(--auth-border);
  border-radius: 10px;
  background: var(--auth-card);
  color: var(--auth-text);
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: border-color .14s, background .14s;
}
.btn-social-google:hover {
  border-color: var(--auth-muted);
  background: rgba(0, 0, 0, .02);
}
.btn-social-google:disabled { opacity: .55; cursor: not-allowed; }
.btn-social-google svg { flex-shrink: 0; }

.auth-social {
  display: grid;
  gap: 8px;
}

.auth-social-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.btn-social {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  padding: 11px 14px;
  border: 1px solid var(--auth-border);
  border-radius: 10px;
  background: var(--auth-card);
  color: var(--auth-text);
  font-size: 14px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  transition: border-color .14s, background .14s, transform .14s;
}

.btn-social:hover {
  border-color: var(--auth-muted);
  background: rgba(0,0,0,.02);
  transform: translateY(-1px);
}

.btn-social:disabled {
  opacity: .45;
  cursor: not-allowed;
  transform: none;
}

.btn-social-meta {
  color: #0866ff;
}

/* alpha.47 - portal do cliente usa o padrão orgânico do auth */
.customer-portal-v49 {
  min-height: auto !important;
  display: grid !important;
  place-items: start center !important;
  padding: 0 !important;
}

.customer-portal-v49 .customer-register-hero {
  display: none !important;
}

.customer-login-card {
  width: min(100%, 452px) !important;
  padding: 28px !important;
  border-radius: 20px !important;
  background: var(--auth-card) !important;
  box-shadow: 0 18px 45px rgba(var(--shadow-rgb),.08) !important;
}

.customer-login-card h2 {
  display: none !important;
}

.customer-login-card .auth-tabs {
  margin-bottom: 16px !important;
}

.customer-login-card > label {
  display: grid !important;
  gap: 8px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: var(--auth-text) !important;
}

.customer-login-card > label input {
  min-height: 44px !important;
  padding: 11px 14px !important;
  border: 1px solid var(--auth-border) !important;
  border-radius: 10px !important;
  background: var(--auth-input-bg) !important;
  color: var(--auth-text) !important;
}

.customer-login-card .btn.primary,
.auth-card .btn.primary {
  border: 0 !important;
  min-height: 44px !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 70%, #000)) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(var(--accent-rgb), .28) !important;
  width: 100% !important;
  justify-content: center !important;
}

.customer-login-card > a.btn {
  display: none !important;
}

@media(max-width:520px) {
  .auth-social-grid {
    grid-template-columns: 1fr;
  }
  .customer-login-card {
    padding: 20px !important;
  }
}

/* Footer da página */
.auth-footer {
  font-size: 13px;
  color: var(--auth-muted);
  text-align: center;
  margin-top: 4px;
}
.auth-footer a {
  color: var(--auth-accent);
  text-decoration: none;
  font-weight: 600;
}
.auth-footer a:hover { text-decoration: underline; }

/* Flash de erro dentro do card */
.auth-error {
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(239, 68, 68, .08);
  border: 1px solid rgba(239, 68, 68, .25);
  color: #b91c1c;
  font-size: 13.5px;
  margin-bottom: 16px;
}

/* Success card */
.auth-success { text-align: center; padding: 14px 0; }
.auth-success-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(59,130,246,.12), rgba(236,72,153,.12));
  color: var(--auth-accent);
}
.auth-success h2 { margin: 0 0 8px; font-size: 22px; color: var(--auth-text); }
.auth-success p { margin: 0 0 22px; color: var(--auth-muted); }

/* Detalhes avançados (endereço) */
.auth-advanced {
  border-top: 1px solid var(--auth-border);
  padding-top: 14px;
  margin-top: 4px;
}
.auth-advanced summary {
  cursor: pointer;
  font-weight: 700;
  font-size: 14px;
  color: var(--auth-text);
  user-select: none;
  padding: 4px 0;
  list-style: none;
}
.auth-advanced summary::-webkit-details-marker { display: none; }
.auth-advanced summary::before {
  content: '+ ';
  color: var(--auth-accent);
  font-weight: 800;
}
.auth-advanced[open] summary::before { content: '− '; }
.auth-advanced-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.auth-advanced-grid label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--auth-text);
}
.auth-advanced-grid label.full { grid-column: 1 / -1; }
.auth-advanced-grid input {
  padding: 9px 12px !important;
  background: var(--auth-input-bg) !important;
  border: 1px solid var(--auth-border) !important;
  border-radius: 8px !important;
  font-size: 13.5px;
  font-weight: 400;
}
.auth-advanced-grid .inline-field {
  display: flex;
  gap: 6px;
}
.auth-advanced-grid .inline-field input { flex: 1; min-width: 0; }

/* alpha.219 — campo CEP com caption separado do input+botao.
   O botao "Buscar" antes ficava DENTRO do <label> junto com o input, o que
   no touch (iOS/Android) fazia o tap ser desviado e o teclado nao abrir.
   Agora o .auth-field espelha o layout do label do grid. */
.auth-advanced-grid .auth-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.auth-advanced-grid .auth-field > label {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--auth-text);
}
.auth-advanced-grid .auth-field .inline-field input {
  touch-action: manipulation;
}

/* ── Modal system ────────────────────────────────────────── */
.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(var(--shadow-rgb), .55);
  backdrop-filter: blur(2px);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
  animation: modal-fade .18s ease-out;
}
.modal-overlay.is-open { display: flex; }
@keyframes modal-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}
.modal-card {
  width: 100%;
  max-width: 480px;
  background: var(--auth-card);
  border-radius: 18px;
  padding: 28px;
  box-shadow: 0 20px 40px rgba(var(--shadow-rgb), .25);
  animation: modal-pop .22s ease-out;
}
@keyframes modal-pop {
  from { opacity: 0; transform: scale(.96) translateY(8px); }
  to   { opacity: 1; transform: scale(1)   translateY(0); }
}
.modal-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.modal-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--auth-accent) 14%, var(--panel)); /* alpha.1019 — era #f3e8ff hardcoded (disco lilás claro isolado no tema escuro) */
  color: var(--auth-accent);
  flex-shrink: 0;
}
.modal-header h2 { margin: 0; font-size: 18px; color: var(--auth-text); }
.modal-body {
  color: var(--auth-muted);
  font-size: 14px;
  line-height: 1.55;
  margin-bottom: 20px;
}
.modal-body p { margin: 0 0 12px; }
.modal-body p:last-child { margin-bottom: 0; }
.modal-pdf-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--auth-accent);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  margin: 4px 0 14px;
}
.modal-pdf-link:hover { text-decoration: underline; }
.modal-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: var(--auth-text);
  line-height: 1.45;
  margin-top: 8px;
  cursor: pointer;
}
.modal-checkbox input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 1px 0 0 0;
  flex-shrink: 0;
  accent-color: var(--auth-accent);
  cursor: pointer;
}
.modal-checkbox a {
  color: var(--auth-accent);
  text-decoration: none;
  font-weight: 600;
}
.modal-checkbox a:hover { text-decoration: underline; }
.modal-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}
.modal-actions > button { min-width: 100px; }
body.has-modal-open { overflow: hidden; }

/* ── Tema preset "expo3d" para a topbar ──────────────────── */
html[data-color="expo3d"] {
  --accent: #a855f7;
  --accent-rgb: 168, 85, 247;
  --accent-dark: #7e22ce;
  --accent-light: #e9d5ff;
}
html[data-color="expo3d"] .btn.primary,
html[data-color="expo3d"] .git-sync-btn,
html[data-color="expo3d"] button[type="submit"].btn.primary {
  background: var(--gradient-primary) !important;
  border: none !important;
  color: #fff !important;
}
.color-dot.color-dot-expo3d { background: var(--gradient-primary); }

/* Responsivo */
@media (max-width: 540px) {
  .auth-card { padding: 22px; border-radius: 16px; }
  .auth-card-wide { max-width: 100%; }
  .auth-tabs { font-size: 13px; }
  .modal-card { padding: 22px; border-radius: 16px; }
  .modal-actions { flex-direction: column-reverse; }
  .modal-actions > button { width: 100%; }
  .auth-advanced-grid { grid-template-columns: 1fr; }
}

/* alpha.48 - login do portal alinhado ao cadastro publico */
body:has(.auth-page-wrap) .main,
body:has(.auth-page-wrap) .pub-main {
  padding-top: 36px;
}

.auth-page-wrap {
  max-width: 560px;
}

.auth-tabs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
}

.customer-login-card {
  width: 100% !important;
  max-width: 560px !important;
  padding: 28px !important;
  border-radius: 20px !important;
  background: var(--auth-card) !important;
  box-shadow:
    0 1px 3px rgba(0, 0, 0, .04),
    0 0 0 1px rgba(0, 0, 0, .03) !important;
}

.customer-login-card .auth-tabs {
  margin-bottom: 24px !important;
}

.customer-login-card .btn-gradient,
.auth-card .btn-gradient {
  width: 100%;
}

@media(max-width:560px) {
  body:has(.auth-page-wrap) .main,
  body:has(.auth-page-wrap) .pub-main {
    padding: 24px 14px;
  }

  .auth-page-wrap {
    gap: 18px;
  }

  .customer-login-card,
  .auth-card {
    padding: 22px !important;
  }
}

/* alpha.49 - UI Architect global e tema claro/escuro simples */
.ui-architect {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 9999;
  font-size: 13px;
}

.ui-architect-fab {
  width: 46px;
  height: 46px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--line));
  background: color-mix(in srgb, var(--panel) 90%, var(--accent));
  color: var(--accent);
  box-shadow: 0 18px 45px rgba(var(--shadow-rgb),.18);
  display: grid;
  place-items: center;
  cursor: pointer;
}

/* ═══════════════════════════════════════════════════════════
   Arquiteto UI v2 (alpha.62) — Painel flutuante com abas
   ═══════════════════════════════════════════════════════════ */

/* Painel principal */
.ui-architect-panel[hidden],
.ua-tab-panel[hidden] { display: none !important; }

.ui-architect-panel {
  position: fixed;
  right: 16px;
  bottom: 70px;
  width: min(340px, calc(100vw - 32px));
  max-height: calc(100vh - 100px);
  display: flex;
  flex-direction: column;
  border: 1px solid color-mix(in srgb, var(--line) 80%, var(--accent));
  border-radius: 18px;
  background: color-mix(in srgb, var(--panel) 97%, transparent);
  backdrop-filter: blur(20px) saturate(150%);
  box-shadow: 0 28px 80px rgba(var(--shadow-rgb),.24), 0 0 0 1px rgba(255,255,255,.06) inset;
  overflow: hidden;
}

/* Cabeçalho */
.ua-header {
  flex-shrink: 0;
  padding: 12px 14px 0;
  border-bottom: 1px solid var(--line);
}
.ua-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.ua-title-row strong { font-size: 14px; font-weight: 700; color: var(--text); }
.ua-close-btn { opacity: .55; font-size: 18px; line-height: 1; }
.ua-close-btn:hover { opacity: 1; }

/* Abas */
.ua-tabs {
  display: flex;
  gap: 2px;
}
.ua-tab {
  flex: 1;
  padding: 7px 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  border-radius: 6px 6px 0 0;
  transition: color .14s, border-color .14s, background .14s;
}
.ua-tab:hover { color: var(--text); background: rgba(var(--accent-rgb),.06); }
.ua-tab.active { color: var(--accent); border-bottom-color: var(--accent); }

/* Painéis de aba — scrollable */
.ua-tab-panel {
  flex: 1;
  overflow-y: auto;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.ua-tab-panel::-webkit-scrollbar { width: 4px; }
.ua-tab-panel::-webkit-scrollbar-thumb { background: var(--line); border-radius: 4px; }

/* Botão selecionar */
.ua-pick-btn {
  display: flex;
  align-items: center;
  gap: 7px;
  justify-content: center;
  width: 100%;
  margin-bottom: 10px;
}
.ua-pick-btn.is-active {
  background: color-mix(in srgb, var(--accent) 15%, var(--panel));
  color: var(--accent);
  border-color: var(--accent);
}

/* Info do elemento selecionado */
.ui-picked {
  min-height: 48px;
  border: 1px dashed color-mix(in srgb, var(--accent) 35%, var(--line));
  border-radius: 10px;
  padding: 8px 10px;
  color: var(--muted);
  font-size: 12px;
  background: color-mix(in srgb, var(--accent) 5%, var(--panel));
  margin-bottom: 10px;
}
.ui-picked strong { display: block; font-size: 12px; color: var(--text); font-family: ui-monospace, Consolas, monospace; }
.ui-picked span   { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.ui-picked small  { display: block; font-size: 11px; color: var(--muted); }

/* Seções dentro dos painéis */
.ua-section {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 8px;
}
.ua-section-title {
  display: block;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--muted);
  margin-bottom: 8px;
}

/* Linha de propriedade */
.ua-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 7px;
}
.ua-row:last-child { margin-bottom: 0; }
.ua-label {
  font-size: 12px;
  font-weight: 500;
  color: var(--text);
  flex-shrink: 0;
  width: 68px;
}
.ua-ctrl {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  min-width: 0;
}

/* Inputs */
.ua-slider {
  flex: 1;
  accent-color: var(--accent);
  cursor: pointer;
}
.ua-num {
  width: 44px;
  padding: 3px 5px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 12px;
  background: var(--panel-2);
  color: var(--text);
  text-align: center;
}
.ua-unit {
  font-size: 11px;
  color: var(--muted);
  flex-shrink: 0;
}
.ua-color {
  width: 36px;
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 2px;
  background: var(--panel-2);
  cursor: pointer;
}
.ua-select {
  flex: 1;
  padding: 4px 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 12px;
  background: var(--panel-2);
  color: var(--text);
}
.ua-textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 12px;
  font-family: ui-monospace, Consolas, monospace;
  background: var(--panel-2);
  color: var(--text);
  resize: vertical;
}

/* 4 lados (padding) */
.ua-4side {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
}
.ua-4side label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  color: var(--muted);
}
.ua-4side .ua-num { width: 100%; }

/* Aba Global */
.ua-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 4px;
}
.ua-var-label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.ua-var-label input[type="color"] {
  width: 100%;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 2px;
  background: var(--panel-2);
  cursor: pointer;
}
.ua-var-label input[type="range"] { width: 100%; accent-color: var(--accent); }

/* Aba Log */
.ua-log-list {
  max-height: 200px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 6px;
  margin-bottom: 8px;
  background: var(--panel-2);
}
.ua-empty { font-size: 12px; color: var(--muted); padding: 6px; text-align: center; }
.ua-log-entry {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 5px 6px;
  border-radius: 7px;
  font-size: 11px;
  border-bottom: 1px solid var(--line);
}
.ua-log-entry:last-child { border-bottom: none; }
/* alpha.1040 — log persistente: cabeçalho de grupo + entrada já salva */
.ua-log-head { margin: 8px 0 3px; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--muted, #888); }
.ua-log-head:first-child { margin-top: 0; }
.ua-log-saved { opacity: .72; }
.ua-log-saved small { color: var(--accent); }
/* alpha.1041 — editor de HTML ao vivo + IA no painel */
.ua-code { font-family: ui-monospace, Consolas, monospace; font-size: 11px; line-height: 1.45; white-space: pre; tab-size: 2; }
.ua-ai-section { border-top: 1px dashed var(--line); padding-top: 9px; margin-top: 4px; }
.ua-ai-note { margin: 7px 0 0; font-size: 11px; color: var(--muted, #888); line-height: 1.4; }
.ua-log-entry code { font-family: ui-monospace, Consolas, monospace; font-size: 10px; background: rgba(var(--accent-rgb),.1); padding: 1px 4px; border-radius: 4px; color: var(--accent); }
.ua-log-prop { font-weight: 700; color: var(--text); }
.ua-log-before { color: var(--muted); text-decoration: line-through; font-size: 10px; }
.ua-log-after { color: var(--accent); font-weight: 700; font-size: 11px; }
.ua-log-entry small { margin-left: auto; color: var(--muted); font-size: 10px; }

/* Rodapé de ações */
.ua-footer {
  flex-shrink: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
  padding: 10px 14px;
  border-top: 1px solid var(--line);
}
.ua-footer .btn { padding-inline: 6px; font-size: 11px; width: 100%; }
.ua-status {
  flex-shrink: 0;
  display: block;
  font-size: 11px;
  color: var(--muted);
  padding: 4px 14px 10px;
  text-align: center;
}

/* Pick mode */
.ui-picking * { cursor: crosshair !important; }
.ui-picking .ui-architect,
.ui-picking .ui-architect * { cursor: default !important; }

/* Highlight overlay (injetado via JS) — apenas borda, sem spotlight escuro */
#uaHighlightOverlay {
  position: fixed;
  pointer-events: none;
  border: 2px solid var(--accent);
  border-radius: 4px;
  z-index: 99999;
  background: rgba(var(--accent-rgb), .08);
  transition: top .06s, left .06s, width .06s, height .06s;
}

.nav-group[data-menu-key="sistema"] .dropdown-panel {
  min-width: 292px;
  padding: 12px;
  border-radius: 18px;
  background: color-mix(in srgb, var(--panel) 98%, transparent);
}

.nav-group[data-menu-key="sistema"] .dropdown-panel a {
  min-height: 48px;
  border-radius: 12px;
}

.nav-group[data-menu-key="sistema"] .dropdown-panel a.current {
  background: color-mix(in srgb, var(--accent) 14%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line));
}

@media(max-width:560px) {
  .ui-architect { right: 12px; bottom: 12px; }
  .ui-architect-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* alpha.50 - base commerce */
.commerce-head h1 { letter-spacing: 0; }
.commerce-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  gap: 14px;
  align-items: stretch;
}
.commerce-panel {
  display: grid;
  align-content: start;
  gap: 12px;
}
.commerce-panel h2 { margin: 0; font-size: 18px; }
.commerce-flow {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.commerce-flow span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--line));
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 8%, var(--panel));
  font-weight: 850;
  font-size: 12px;
}
.commerce-flow.vertical {
  display: grid;
  grid-template-columns: 1fr;
}
.commerce-sync-list {
  display: grid;
  gap: 8px;
}
.commerce-sync-list > div {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-2);
}
.block { display: block; }
.row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
@media(max-width:900px) {
  .commerce-grid { grid-template-columns: 1fr; }
  .commerce-sync-list > div { grid-template-columns: 1fr; }
}

/* alpha.51 - public storefront */
.storefront-public {
  min-height: 100vh;
  background:
    radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 30%),
    linear-gradient(180deg, var(--bg), color-mix(in srgb, var(--panel-2) 82%, var(--bg)));
  color: var(--text);
}

.store-topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 200;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 18px;
  align-items: center;
  min-height: 66px;
  padding: 10px clamp(16px, 4vw, 44px);
  border-bottom: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
  background: color-mix(in srgb, var(--panel) 94%, transparent);
  backdrop-filter: blur(18px) saturate(130%);
}

.store-brand,
.store-nav,
.store-cart-link,
.store-hero-actions {
  display: flex;
  align-items: center;
}

.store-brand {
  gap: 10px;
  color: var(--text);
  text-decoration: none;
}

.store-brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #111827, #3a3322);
  color: var(--accent);
  font-weight: 950;
  box-shadow: 0 14px 28px rgba(var(--shadow-rgb),.16);
}

.store-brand strong,
.store-brand small {
  display: block;
  line-height: 1;
}

.store-brand small {
  margin-top: 4px;
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--muted);
}

.store-nav {
  justify-content: center;
  gap: 6px;
}

.store-nav a,
.store-cart-link {
  min-height: 38px;
  padding: 9px 12px;
  border-radius: 12px;
  color: var(--text);
  text-decoration: none;
  font-weight: 850;
  font-size: 13px;
}

.store-nav a:hover,
.store-cart-link:hover {
  background: color-mix(in srgb, var(--accent) 10%, var(--panel));
}

.store-cart-link {
  gap: 8px;
  border: 1px solid var(--line);
  background: var(--panel-2);
}

.store-cart-link span {
  min-width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 16%, var(--panel));
  color: var(--accent);
  font-size: 12px;
}

.store-main {
  width: min(1180px, calc(100vw - 28px));
  margin: 0 auto;
  padding: clamp(24px, 5vw, 58px) 0 64px;
  padding-top: calc(66px + clamp(24px, 5vw, 58px));
}

.store-hero {
  display: grid;
  grid-template-columns: 1fr; /* alpha.1010 — era 2 col c/ faixa de 280-360px reservada p/ um .store-hero-visual que NUNCA é renderizado → buraco vazio à direita em 861-1180px+. O texto já tem max-width próprio. */
  gap: 24px;
  align-items: end;
  padding: clamp(26px, 5vw, 58px) 0 34px;
}

.store-kicker {
  display: inline-flex;
  margin-bottom: 14px;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--accent);
}

.store-hero h1,
.store-product-detail h1,
.store-section-head h1,
.store-checkout-form h1,
.store-checkout-success h1 {
  margin: 0;
  max-width: 820px;
  font-size: clamp(36px, 5vw, 64px);
  line-height: .96;
  letter-spacing: 0;
}

.store-hero p {
  max-width: 680px;
  margin: 18px 0 0;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.55;
  font-weight: 700;
}

.store-hero-actions { gap: 10px; margin-top: 24px; flex-wrap: wrap; }

.store-hero-card {
  display: grid;
  gap: 10px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: color-mix(in srgb, var(--panel) 88%, transparent);
  box-shadow: 0 22px 60px rgba(var(--shadow-rgb),.12);
}

.store-hero-card strong { font-size: 15px; }
.store-hero-card span {
  display: flex;
  min-height: 42px;
  align-items: center;
  padding: 0 13px;
  border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--line));
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 7%, var(--panel));
  font-weight: 900;
}

.store-section {
  display: grid;
  gap: 18px;
  margin-top: 10px;
}

.store-section-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: end;
}

.store-section-head h2 {
  margin: 0;
  font-size: 28px;
}

.store-section-head p {
  margin: 4px 0 0;
  color: var(--muted);
  font-weight: 700;
}

.store-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.store-product-card,
.store-cart-row,
.store-checkout-form,
.store-order-summary,
.store-checkout-success {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  box-shadow: 0 18px 44px rgba(var(--shadow-rgb),.08);
}

.store-product-card {
  overflow: hidden;
  display: grid;
}

.store-product-media,
.store-product-detail-media,
.store-cart-thumb {
  display: grid;
  place-items: center;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, var(--panel-2)), var(--panel));
  overflow: hidden;
}

.store-product-media { aspect-ratio: 1.35; }
.store-product-media img,
.store-product-detail-media img,
.store-cart-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.store-product-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: color-mix(in srgb, var(--accent) 58%, var(--text));
}

.store-product-placeholder span {
  width: 74px;
  height: 74px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--line));
  border-radius: 22px;
  background: color-mix(in srgb, var(--accent) 9%, var(--panel));
  font-size: 32px;
  font-weight: 950;
}

.store-product-body {
  display: grid;
  gap: 8px;
  padding: 16px;
}

.store-product-body small,
.store-product-detail-body small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.store-product-body h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
}

.store-product-body h3 a,
.store-back-link {
  color: var(--text);
  text-decoration: none;
}

.store-product-body p {
  min-height: 42px;
  margin: 0;
  color: var(--muted);
  font-weight: 650;
  line-height: 1.45;
}

.store-product-foot {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  margin-top: 4px;
}

.store-product-foot strong { font-size: 18px; }

.store-product-detail {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr);
  gap: 28px;
  align-items: stretch;
}

.store-product-detail-media {
  min-height: 480px;
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: 0 22px 60px rgba(var(--shadow-rgb),.12);
}

.store-product-detail-body {
  display: grid;
  align-content: center;
  gap: 16px;
}

.store-product-detail-body p {
  color: var(--muted);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.55;
}

.store-detail-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.store-detail-meta span {
  display: grid;
  gap: 3px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel-2);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.store-detail-meta strong { color: var(--text); font-size: 14px; }

.store-buy-box {
  /* alpha.496 — empilhado e alinhado (era flex-wrap + align:end → controles e botões desproporcionais) */
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  margin-top: 8px;
}
.store-buy-box button[type="submit"]{width:100%;padding:14px 20px;font-size:15px;font-weight:800;border-radius:var(--r-sm);margin-top:6px}
/* alpha.500 — seletores de filamento + build plate (loja consome a matriz 3D) */
.store-filaments,.store-plates{border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;margin-bottom:12px}
.store-filaments legend,.store-plates legend{font-weight:800;font-size:13px;padding:0 6px}
.store-fil-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.store-fil{position:relative;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:var(--r-sm);padding:6px 11px 6px 6px;cursor:pointer;font-weight:700;font-size:12px;transition:.13s ease}
.store-fil input{position:absolute;opacity:0;width:0;height:0}
.store-fil:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 30%,transparent)}
.store-fil-sw{width:24px;height:24px;border-radius:var(--r-2xs);border:1px solid rgba(0,0,0,.12);flex:0 0 auto}
.store-fil-ph{width:28px;height:28px;border-radius:var(--r-2xs);object-fit:cover;flex:0 0 auto}
.store-fil-nm{display:flex;flex-direction:column;line-height:1.15}.store-fil-nm small{color:var(--muted);font-weight:600;font-size:10px;text-transform:uppercase;letter-spacing:.04em}
.store-plate-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin-top:8px}
.store-plate{position:relative;display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:var(--r-sm);padding:8px;cursor:pointer;text-align:center;transition:.13s ease}
.store-plate input{position:absolute;opacity:0;width:0;height:0}
.store-plate:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 30%,transparent)}
.store-plate-ph{width:100%;height:72px;object-fit:cover;border-radius:var(--r-xs);display:flex;align-items:center;justify-content:center;font-size:28px;background:color-mix(in srgb,var(--line) 40%,transparent)}
.store-plate-nm{font-size:12px;font-weight:750;line-height:1.2}.store-plate-nm small{display:block;color:var(--muted);font-weight:600;margin-top:2px}

.store-buy-box label,
.store-checkout-form label,
.store-cart-row label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.store-buy-box input, .store-buy-box select { width: 100%; box-sizing: border-box; } /* alpha.496 — antes 110px fixo cortava o texto (ex.: "Ana & Jo") */
.store-buy-box input[name="quantity"] { width: 130px; }

.store-cart-section { margin-top: 0; }
/* alpha.593 — Etapa C: selos de confiança no checkout */
.co-trust{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:10px;font-size:12px;font-weight:700;color:var(--muted)}
.co-trust span{display:inline-flex;align-items:center;gap:5px}
.store-cart-form { display: grid; gap: 14px; }
.store-cart-list { display: grid; gap: 10px; }

.store-cart-row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) 92px auto;
  gap: 14px;
  align-items: center;
  padding: 12px;
}

.store-cart-thumb {
  width: 72px;
  height: 72px;
  border-radius: 14px;
}

.store-cart-row small { display: block; color: var(--muted); margin-top: 3px; }
.store-cart-row input { min-height: 40px; padding: 8px; }

.store-summary {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel);
}

.store-summary span { color: var(--muted); font-weight: 900; }
.store-summary strong { font-size: 24px; margin-right: auto; }

.store-checkout-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 16px;
}

.store-checkout-form,
.store-order-summary,
.store-checkout-success {
  padding: 18px;
}

.store-checkout-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.store-checkout-form h1,
.store-checkout-form p,
.store-checkout-form .full,
.store-checkout-form button {
  grid-column: 1 / -1;
}

.store-order-summary {
  display: grid;
  align-content: start;
  gap: 10px;
}

.store-order-summary h2 { margin: 0; }
.store-order-summary > div,
.store-order-summary footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.store-order-summary footer {
  border: 0;
  margin-top: 6px;
  font-size: 18px;
}

.store-checkout-success {
  max-width: 720px;
  margin: 0 auto;
  display: grid;
  gap: 14px;
  text-align: center;
}

.store-success-icon {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  margin: 0 auto;
  border-radius: 18px;
  background: #dcfce7;
  color: #15803d;
  font-size: 28px;
  font-weight: 950;
}

.store-pix-box {
  display: grid;
  gap: 7px;
  padding: 14px;
  border: 1px dashed color-mix(in srgb, var(--accent) 34%, var(--line));
  border-radius: 16px;
  background: color-mix(in srgb, var(--accent) 6%, var(--panel));
  text-align: left;
}
/* alpha.510 — Pix dinâmico: QR + copia e cola na tela de sucesso */
.store-pix-qr{align-self:center;width:180px;height:180px;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:8px}
.store-pix-qr svg{width:100%;height:100%;display:block}
.store-pix-cc-label{font-weight:700;font-size:13px;margin-top:4px}
.store-pix-cc{width:100%;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;line-height:1.35;word-break:break-all;border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 10px;background:var(--panel);color:var(--text);resize:vertical}

.store-empty {
  padding: 28px;
  border: 1px dashed var(--line);
  border-radius: 18px;
  background: var(--panel);
  color: var(--muted);
  font-weight: 800;
}

@media(max-width:900px) {
  .store-topbar { grid-template-columns: 1fr auto; }
  .store-nav { grid-column: 1 / -1; justify-content: flex-start; overflow-x: auto; }
  .store-hero,
  .store-product-detail,
  .store-checkout-grid { grid-template-columns: 1fr; }
  .store-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .store-product-detail-media { min-height: 340px; }
}

@media(max-width:620px) {
  .store-main { width: min(100% - 20px, 1180px); padding-top: 20px; }
  .store-topbar { padding-inline: 12px; gap: 10px; }
  .store-brand small { display: none; }
  .store-product-grid,
  .store-detail-meta,
  .store-checkout-form { grid-template-columns: 1fr; }
  .store-cart-row { grid-template-columns: 58px minmax(0, 1fr); }
  .store-cart-row label,
  .store-cart-row > strong { grid-column: 2; }
  .store-summary { display: grid; grid-template-columns: 1fr; justify-items: stretch; }
  .store-summary strong { margin-right: 0; }
  .store-hero h1,
  .store-product-detail h1,
  .store-section-head h1,
  .store-checkout-form h1,
  .store-checkout-success h1 { font-size: 34px; line-height: 1.02; }
}

/* alpha.54 + alpha.56 fix — dashboard SaaS: segue sistema de temas */

/* ── Breakeven card: usa var(--accent) do tema ── */
.dash-breakeven-card {
  border: 0;
  border-radius: 20px;
  padding: 24px 28px;
  margin: 0 0 20px;
  color: #fff;
  /* Gradiente baseado no accent — muda automaticamente com o tema */
  background: linear-gradient(
    135deg,
    var(--accent)                                         0%,
    color-mix(in srgb, var(--accent) 78%, #000)          55%,
    color-mix(in srgb, var(--accent) 62%, #000)         100%
  );
  box-shadow:
    0 22px 44px rgba(var(--accent-rgb), .28),
    0 1px 0 rgba(255,255,255,.14) inset;
}
.dash-breakeven-head,
.dash-breakeven-scale,
.dash-breakeven-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.dash-breakeven-title { display: flex; align-items: center; gap: 12px; }
.dash-breakeven-title strong,
.dash-breakeven-value strong {
  display: block;
  font-size: clamp(20px, 2.1vw, 28px);
  line-height: 1;
  color: #fff;
}
.dash-breakeven-title small,
.dash-breakeven-value small,
.dash-breakeven-foot span,
.dash-breakeven-scale small {
  display: block;
  color: rgba(255,255,255,.80);
  font-weight: 700;
}
.dash-icon-target {
  width: 40px; height: 40px;
  border-radius: 14px;
  display: grid; place-items: center;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.28);
  flex-shrink: 0;
}
.dash-progress {
  height: 14px;
  margin: 20px 0 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.28);
}
.dash-progress span {
  display: block;
  height: 100%;
  min-width: 4px;
  border-radius: inherit;
  background: #fff;
  box-shadow: 0 0 18px rgba(255,255,255,.52);
  transition: width .6s ease;
}
.dash-breakeven-scale {
  font-weight: 800;
  font-size: 13px;
  color: rgba(255,255,255,.88);
}
.dash-breakeven-foot {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.20);
}
.dash-breakeven-foot div { min-width: 0; flex: 1; }
.dash-breakeven-foot strong { display: block; margin-top: 4px; font-size: 20px; color: #fff; }

/* ── KPI cards: usam variáveis do tema ── */
/* ════ alpha.466 — Dashboard unificado (grid único) + configurador por elemento ════ */
/* alpha.506 — "modo Organizar" universal: controles dentro do Arquiteto de UI + engine genérico */
.ua-organize{margin:0 0 10px;padding:10px 12px;border:1px dashed var(--accent);border-radius:var(--r-sm);background:color-mix(in srgb,var(--accent) 8%,transparent)}
.ua-organize-hint{font-size:12px;color:var(--text);font-weight:600;margin:0 0 8px}
.ua-organize-actions{display:flex;gap:8px;flex-wrap:wrap}
#uiOrganizeLayout.is-active{border-color:var(--accent);color:var(--accent);font-weight:800}
/* alpha.580 — engine "Organizar" RECURSIVO (cada elemento) nas 3 superfícies (ERP/Saúde/Catálogo).
   Fora da edição: só esconde os elementos marcados como ocultos. */
.uiorg-off{display:none !important}
/* modo edição (admin): contorno fraco em todo elemento organizável; o alvo sob o cursor ganha contorno forte */
.uiorg-edit .uiorg-elem{outline:1px dashed color-mix(in srgb,var(--accent) 22%,transparent);outline-offset:-1px}
.uiorg-edit .uiorg-elem.uiorg-target{outline:2px solid var(--accent);outline-offset:-2px;cursor:grab}
.uiorg-edit .uiorg-elem.uiorg-dragging{opacity:.45}
/* na edição, os ocultos reaparecem esmaecidos p/ poder re-exibir */
.uiorg-edit .uiorg-off{display:revert !important;opacity:.4;outline-style:dotted !important}
/* overlay flutuante (grip ⠿ + olho 👁) que segue o elemento sob o cursor; não bloqueia o arrasto do elemento */
.uiorg-overlay{position:absolute;z-index:99998;display:flex;gap:3px;align-items:flex-end;transform:translateY(-100%);pointer-events:none}
.uiorg-overlay .uiorg-grip{display:inline-flex;align-items:center;justify-content:center;height:22px;padding:0 7px;border-radius:7px 7px 0 0;background:var(--accent);color:#fff;font-size:12px;line-height:1;cursor:grab;pointer-events:none}
.uiorg-overlay .uiorg-eye{pointer-events:auto;display:inline-flex;align-items:center;justify-content:center;width:24px;height:22px;border:0;border-radius:7px 7px 0 0;background:var(--accent);color:#fff;cursor:pointer;font-size:13px;line-height:1;padding:0}
.uiorg-overlay .uiorg-eye::before{content:"👁"}
.uiorg-overlay.is-off .uiorg-eye::before{content:"🚫"}
/* alpha.503 — aviso slim (uma linha) de estoque baixo */
.dash-slim-alert{display:flex;align-items:center;gap:8px;padding:7px 12px;margin:0 0 10px;border:1px solid color-mix(in srgb,var(--red) 30%,transparent);background:color-mix(in srgb,var(--red) 7%,transparent);border-radius:var(--r-sm);font-size:12.5px;line-height:1.3}
.dash-slim-alert .dsa-ic{flex:0 0 auto}
.dash-slim-alert .dsa-txt{flex:1;min-width:0;color:var(--text)}
.dash-slim-alert strong{color:var(--red);font-weight:800}
.dash-slim-alert .dsa-link{margin-left:auto;white-space:nowrap;font-weight:700;color:var(--accent);text-decoration:none;font-size:12px;padding:3px 11px;border:1px solid var(--line);border-radius:var(--r-2xs);transition:border-color .13s}
.dash-slim-alert .dsa-link:hover{border-color:var(--accent)}
/* alpha.504 — Sistema de pagamentos (gateways) */
.pay-gw{border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;margin:0 0 4px}
.pay-gw legend{font-weight:800;font-size:13px;padding:0 6px;display:flex;align-items:center;gap:8px}
.pay-badge{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:2px 8px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--muted) 18%,transparent);color:var(--muted)}
.pay-badge.on{background:color-mix(in srgb,var(--green) 18%,transparent);color:var(--green)}
.pay-badge.bad{background:color-mix(in srgb,var(--red) 16%,transparent);color:var(--red)} /* alpha.960 — estornado/recusado no extrato MP */
/* alpha.952 — pagamentos reorganizados: escolha (routing) + grid-seletor + painéis isolados */
.pay-routing{border:1px solid var(--line);border-radius:var(--r-sm);padding:14px;background:var(--panel-2);margin:0 0 4px}
.pay-step{font-weight:800;font-size:14px;margin:0}
.pay-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:0 0 6px}
.pay-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;border:1px solid var(--line);border-radius:var(--r-sm);padding:12px;background:var(--panel);cursor:pointer;transition:var(--transition);position:relative}
.pay-card:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.pay-card.sel{border-color:var(--accent);background:var(--hover-tint);box-shadow:0 0 0 1px var(--accent) inset}
.pay-card-ic{font-size:22px;line-height:1}
.pay-card-nm{font-weight:800;font-size:13px;color:var(--text);display:flex;flex-direction:column;line-height:1.2}
.pay-card-nm small{font-weight:500;font-size:11px;color:var(--muted)}
.pay-card-st{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:2px 7px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--muted) 16%,transparent);color:var(--muted)}
.pay-card-st.cfg{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}
.pay-card-st.on{background:color-mix(in srgb,var(--green) 18%,transparent);color:var(--green)}
.pay-card-use{position:absolute;top:8px;right:8px;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:2px 6px;border-radius:var(--r-pill);background:var(--accent);color:var(--accent-text,#fff)}
.pay-panel{border:1px solid var(--accent);border-radius:var(--r-sm);padding:14px;margin:8px 0 4px;background:var(--panel-2)}
.pay-panel-tests{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
.pay-tests-lbl{font-size:12px;font-weight:800;color:var(--muted)}
/* alpha.954 — área de teste de cobrança + validação de certificado por gateway */
.pay-test{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
.pay-test-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0}
.pay-test-res{margin-top:8px;padding:10px 12px;border-radius:var(--r-sm);border:1px solid var(--line);font-size:12px;overflow-wrap:anywhere}
.pay-test-res.ok{border-color:color-mix(in srgb,var(--green) 50%,var(--line));background:color-mix(in srgb,var(--green) 8%,transparent)}
.pay-test-res.bad{border-color:color-mix(in srgb,var(--red) 50%,var(--line));background:color-mix(in srgb,var(--red) 8%,transparent)}
.pay-test-res code{font-size:11px}
.pay-test-env{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:2px 7px;border-radius:var(--r-pill)}
.pay-test-env.homolog{background:color-mix(in srgb,var(--green) 18%,transparent);color:var(--green)}
.pay-test-env.prod{background:color-mix(in srgb,var(--red) 16%,transparent);color:var(--red)}
/* alpha.514 — linha do tempo do pedido (order_status_history) */
.zk-timeline{list-style:none;margin:0;padding:0;border-left:2px solid var(--line);margin-left:6px}
.zk-tl-item{position:relative;display:flex;gap:10px;padding:0 0 14px 16px}
.zk-tl-item:last-child{padding-bottom:0}
.zk-tl-dot{position:absolute;left:-7px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--accent);border:2px solid var(--panel)}
.dash-root{display:flex;flex-direction:column;gap:14px;margin-bottom:14px}
/* alpha.466 — só o gap do flex controla o ritmo vertical (zera margens herdadas de .card/.dash-breakeven-card) */
.dash-root>.dash-breakeven-card,.dash-root>.dash-cards,.dash-root>.card{margin:0}
.dash-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px}
.dash-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel);box-shadow:var(--shadow-soft);color:var(--text);text-decoration:none;transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease}
a.dash-card:hover{transform:translateY(-2px);border-color:rgba(var(--accent-rgb),.4);box-shadow:var(--shadow)}
.dash-card-ic{width:34px;height:34px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;background:rgba(var(--accent-rgb),.12);color:var(--accent)}
.dash-card-label{font-size:12px;font-weight:800;color:var(--muted)}
.dash-card-val{font-size:26px;font-weight:950;letter-spacing:-.02em;line-height:1.05;color:var(--text)}
.dash-card-sub{font-size:11px;font-weight:700;color:var(--muted)}
/* alpha.653 — KPIs do dashboard color-coded por significado (chips de ícone). Financeiros/neutros (ticket, etiqueta, produtos) seguem o accent do tema; estoque baixo continua vermelho (regra .dash-card--alert). */
.dash-card[data-dash-key="sales"] .dash-card-ic,
.dash-card[data-dash-key="ready"] .dash-card-ic,
.dash-card[data-dash-key="delivered"] .dash-card-ic{background:rgba(22,163,74,.13);color:var(--green,#16a34a)}
.dash-card[data-dash-key="budgets"] .dash-card-ic,
.dash-card[data-dash-key="customers"] .dash-card-ic{background:rgba(37,99,235,.12);color:var(--blue,#2563eb)}
.dash-card[data-dash-key="conversion"] .dash-card-ic,
.dash-card[data-dash-key="printing"] .dash-card-ic{background:rgba(124,58,237,.13);color:var(--purple,#7c3aed)}
.dash-card[data-dash-key="open"] .dash-card-ic{background:rgba(249,115,22,.13);color:var(--orange,#f97316)}
/* alpha.468 — "Modelos mais pedidos" como ranking com barras proporcionais (tema) */
.dash-rank{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.dash-rank-item{display:flex;align-items:center;gap:12px}
.dash-rank-pos{flex:0 0 auto;width:26px;height:26px;border-radius:var(--r-xs);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:950;color:var(--muted);background:var(--panel-2);border:1px solid var(--line)}
.dash-rank-item.top1 .dash-rank-pos{background:var(--accent);color:#fff;border-color:var(--accent)}
.dash-rank-item.top2 .dash-rank-pos{background:color-mix(in srgb,var(--accent) 45%,var(--panel-2));color:var(--text);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.dash-rank-item.top3 .dash-rank-pos{background:color-mix(in srgb,var(--accent) 22%,var(--panel-2));color:var(--text)}
.dash-rank-main{flex:1;min-width:0}
.dash-rank-line{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:4px}
.dash-rank-name{font-size:13.5px;font-weight:800;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-rank-count{flex:0 0 auto;font-size:13px;font-weight:950;color:var(--accent);font-variant-numeric:tabular-nums}
.dash-rank-bar{height:7px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--accent) 10%,var(--panel-2));overflow:hidden}
.dash-rank-bar>span{display:block;height:100%;border-radius:var(--r-pill);background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 65%,#fff),var(--accent));transition:width .5s cubic-bezier(.4,0,.2,1)}
/* alpha.469 — painéis minimizáveis (collapse) com estado por usuário */
.dash-collapsible-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dash-collapse-btn{flex:0 0 auto;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--r-xs);background:var(--panel-2);color:var(--muted);cursor:pointer;padding:0;transition:.15s ease}
.dash-collapse-btn:hover{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.dash-collapse-btn svg{transition:transform .2s ease}
.dash-collapsible.is-collapsed .dash-collapse-btn svg{transform:rotate(-90deg)}
.dash-collapsible.is-collapsed .dash-collapsible-body{display:none}
.dash-collapsible.is-collapsed .section-head.dash-collapsible-head{margin-bottom:0}
.dash-root.is-editing .dash-collapse-btn{display:none} /* no modo Personalizar o controle é o olho, não o chevron */
/* a regra global @media(max-width:900px) .section-head{flex-direction:column} jogaria o chevron p/ baixo do título — força linha */
@media(max-width:900px){.section-head.dash-collapsible-head{flex-direction:row;align-items:center}}
.dash-card--alert{border-color:rgba(220,38,38,.35);background:color-mix(in srgb,#dc2626 6%,var(--panel))}
.dash-card--alert .dash-card-ic{background:rgba(220,38,38,.14);color:var(--red,#dc2626)}
.dash-card--alert .dash-card-val{color:var(--red,#dc2626)}
/* posiciona o olho; .dash-el é a marcação de "elemento configurável" */
.dash-el{position:relative}
/* fora do modo edição: olho/grip escondidos e ocultos não aparecem */
.dash-el-eye,.dash-card-grip{display:none}
.dash-el--off{display:none!important}
/* modo edição (admin) */
.dash-root.is-editing .dash-el{outline:1.5px dashed color-mix(in srgb,var(--accent) 45%,var(--line));outline-offset:3px}
.dash-root.is-editing .dash-card.dash-el--off{display:flex!important;opacity:.4}
.dash-root.is-editing .dash-breakeven-card.dash-el--off,
.dash-root.is-editing .dash-brands-card.dash-el--off,
.dash-root.is-editing .dash-budgets-card.dash-el--off{display:block!important;opacity:.4}
.dash-root.is-editing .dash-cards .dash-card{cursor:grab;padding-top:42px}
.dash-root.is-editing .dash-card.dash-dragging{opacity:.5;cursor:grabbing}
.dash-root.is-editing .dash-el-eye{display:flex;position:absolute;top:8px;right:8px;z-index:4;width:28px;height:28px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--r-xs);background:var(--panel);cursor:pointer;font-size:14px;line-height:1;padding:0}
.dash-root.is-editing .dash-el-eye::before{content:'👁'}
.dash-root.is-editing .dash-el--off .dash-el-eye::before{content:'🚫'}
.dash-root.is-editing .dash-card-grip{display:block;position:absolute;top:8px;left:8px;color:var(--muted);font-size:13px;line-height:1}
@media(max-width:560px){.dash-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

.dashboard-metrics.dash-kpi-grid {
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  gap: 14px !important;
}
.metric.dash-kpi {
  min-height: 112px !important;
  padding: 18px 20px !important;
  display: grid !important;
  grid-template-columns: 44px 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 14px !important;
  border-radius: 16px !important;
  /* usa variáveis do tema — funciona no light E dark */
  background: var(--panel) !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 1px 2px rgba(var(--shadow-rgb),.05), 0 12px 28px rgba(var(--shadow-rgb),.06) !important;
  transition: transform .14s ease, box-shadow .14s ease !important;
}
.metric.dash-kpi:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 6px rgba(var(--shadow-rgb),.06), 0 18px 36px rgba(var(--shadow-rgb),.10) !important;
}
.dash-kpi-icon {
  grid-row: 1 / 3;
  width: 42px; height: 42px;
  display: grid; place-items: center;
  border-radius: 13px;
  font-weight: 900;
  font-size: 15px;
  flex-shrink: 0;
}
/* Cores semânticas dos ícones — representam status, não o accent */
.dash-kpi-icon.green  { background: #dcfce7; color: #15803d; }
.dash-kpi-icon.blue   { background: #dbeafe; color: #1d4ed8; }
.dash-kpi-icon.violet { background: #f3e8ff; color: #7c3aed; }
.dash-kpi-icon.amber  { background: #fef3c7; color: #b45309; }
/* Variante accent — usa a cor do tema atual */
.dash-kpi-icon.accent {
  background: rgba(var(--accent-rgb), .12);
  color: var(--accent);
}
.metric.dash-kpi > span:not(.dash-kpi-icon) {
  color: var(--muted) !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.2;
}
.metric.dash-kpi strong {
  color: var(--text) !important;
  font-size: clamp(22px, 2vw, 30px) !important;
  font-weight: 950 !important;
  line-height: 1;
}

/* ── Modal de cliente: usa variáveis do tema ── */
.dash-customer-modal-card {
  max-width: 720px !important;
  max-height: min(860px, calc(100vh - 44px));
  padding: 0 !important;
  overflow: hidden;
  border-radius: 20px !important;
  background: var(--panel) !important;
  border: 1px solid var(--line) !important;
}
.dash-modal-title {
  position: sticky; top: 0; z-index: 2;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 20px 24px;
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}
.dash-modal-title h2 { margin: 0; font-size: 20px; letter-spacing: -.02em; color: var(--text); }
.dash-customer-modal-card .customer-form {
  max-height: calc(100vh - 136px);
  overflow: auto;
  padding: 20px 24px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.dash-customer-modal-card .customer-form h3 {
  margin: 4px 0 -2px; padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
  color: var(--text); font-size: 15px;
}
.dash-customer-modal-card label { color: var(--muted) !important; font-weight: 750 !important; }
.dash-customer-modal-card input,
.dash-customer-modal-card textarea {
  background: var(--panel-2) !important;
  border-color: var(--line) !important;
  border-radius: 12px !important;
  color: var(--text) !important;
}
.dash-modal-actions {
  display: flex; justify-content: flex-end; gap: 12px;
  padding: 16px 24px;
  border-top: 1px solid var(--line);
  background: var(--panel-2);
}

/* ── Responsivo ── */
@media (max-width: 900px) {
  .dashboard-metrics.dash-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .dash-breakeven-head,
  .dash-breakeven-scale,
  .dash-breakeven-foot { align-items: flex-start; flex-direction: column; gap: 10px; }
}
@media (max-width: 640px) {
  .dashboard-metrics.dash-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .dash-customer-modal-card .customer-form { grid-template-columns: 1fr; }
  .dash-breakeven-card { padding: 18px 20px; }
  .dash-customer-modal-card { max-height: 100vh; border-radius: 0 !important; }
}

/* ═══════════════════════════════════════════════════════════════
   alpha.52 — storefront redesign premium
   Novas classes somente — não redefine o que já existe em alpha.51
   ═══════════════════════════════════════════════════════════════ */

/* ── Botões da vitrine ── */
.btn-store-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  padding: 0 24px;
  border-radius: 12px;
  background: linear-gradient(135deg, #111827 0%, #2d2412 100%);
  color: #fff;
  font-weight: 900;
  font-size: 14px;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(var(--shadow-rgb),.22);
  transition: transform .14s ease, box-shadow .14s ease;
  white-space: nowrap;
  border: none;
  cursor: pointer;
}
.btn-store-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(var(--shadow-rgb),.30);
}
.btn-store-cta.large { height: 52px; padding: 0 30px; font-size: 15px; }
.btn-store-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  padding: 0 22px;
  border-radius: 12px;
  border: 1.5px solid #e2e8f0;
  background: transparent;
  color: #0f172a;
  font-weight: 850;
  font-size: 14px;
  text-decoration: none;
  transition: background .14s ease, border-color .14s ease;
}
.btn-store-ghost:hover {
  background: #f8fafc;
  border-color: rgba(var(--accent-rgb),.35);
}
.btn-store-ghost.large { height: 52px; padding: 0 28px; font-size: 15px; }

/* ── Topbar melhorada ── */
.store-topbar-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
.store-brand-logo { flex-shrink: 0; }
.store-nav-portal {
  padding: 8px 14px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
}
/* Override do cart link para versão icon */
.store-cart-link {
  position: relative;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  border: 1.5px solid #e2e8f0;
  background: #f8fafc;
  color: #0f172a;
  text-decoration: none;
  transition: background .14s ease;
}
.store-cart-link:hover { background: #f1f5f9; border-color: rgba(var(--accent-rgb),.35); }
.store-cart-badge {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  display: grid;
  place-items: center;
}

/* ── Hero v2 (override + extensão) ── */
.store-hero-content { display: grid; align-content: start; }
.store-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(var(--accent-rgb),.10);
  border: 1px solid rgba(var(--accent-rgb),.22);
  color: var(--accent);
  font-weight: 900;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .10em;
  margin-bottom: 20px;
  width: fit-content;
}
/* Trust badges */
.store-trust-badges {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-top: 22px;
}
.store-trust-badge {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 800;
  color: var(--muted);
}
.store-trust-badge svg { color: #16a34a; flex-shrink: 0; }

/* Hero visual card */
.store-hero-visual {
  display: flex;
  align-items: center;
  justify-content: center;
}
.store-hero-card-v2 {
  width: 100%;
  max-width: 380px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--panel);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}
.store-hero-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
  font-weight: 900;
  font-size: 14px;
  color: var(--text);
}
.store-hero-card-head svg { color: var(--muted); }
.store-status-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--muted); margin-left: auto; flex-shrink: 0;
}
.store-status-dot.active {
  background: #16a34a;
  box-shadow: 0 0 0 3px rgba(22,163,74,.22);
  animation: sf-pulse 2s infinite;
}
@keyframes sf-pulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(22,163,74,.22); }
  50%       { box-shadow: 0 0 0 6px rgba(22,163,74,.08); }
}
.store-flow-steps { display: grid; padding: 6px 0; }
.store-flow-step {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 20px;
  border-bottom: 1px solid var(--line);
  opacity: .46;
}
.store-flow-step:last-child { border-bottom: 0; }
.store-flow-step.done,
.store-flow-step.active { opacity: 1; }
.store-flow-step.active { background: rgba(var(--accent-rgb),.06); }
.store-flow-num {
  width: 26px; height: 26px;
  border-radius: 8px;
  display: grid; place-items: center;
  font-size: 11px; font-weight: 900;
  background: var(--panel-2); border: 1px solid var(--line); color: var(--muted);
  flex-shrink: 0;
}
.store-flow-step.done .store-flow-num  { background: #dcfce7; border-color: #bbf7d0; color: #15803d; }
.store-flow-step.active .store-flow-num { background: rgba(var(--accent-rgb),.14); border-color: rgba(var(--accent-rgb),.30); color: var(--accent); }
.store-flow-step strong { display: block; font-size: 13px; font-weight: 900; color: var(--text); line-height: 1.2; }
.store-flow-step small  { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.store-hero-card-foot {
  padding: 12px 20px;
  border-top: 1px solid var(--line);
  background: var(--panel-2);
  font-size: 11px; font-weight: 800; color: var(--muted);
  text-align: center; text-transform: uppercase; letter-spacing: .08em;
}

/* ── Cabeçalhos de seção compartilhados ── */
.store-section-header { text-align: center; margin-bottom: clamp(32px, 5vw, 52px); }
.store-section-eyebrow {
  display: inline-block; margin: 0 0 12px;
  font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .14em;
  color: var(--accent);
}
.store-section-header h2 {
  margin: 0;
  font-size: clamp(26px, 3.2vw, 38px);
  font-weight: 950; letter-spacing: -.03em; color: var(--text);
  max-width: 600px; margin-inline: auto; line-height: 1.15;
}

/* ── Features ── */
.store-features-section {
  padding: clamp(56px, 8vw, 100px) 0;
  border-top: 1px solid var(--line);
}
.store-features-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.store-feature-card {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
  box-shadow: var(--shadow-soft);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.store-feature-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  border-color: rgba(var(--accent-rgb),.28);
}
.store-feature-icon {
  width: 46px; height: 46px;
  border-radius: 14px;
  display: grid; place-items: center;
  background: rgba(var(--accent-rgb),.10);
  border: 1px solid rgba(var(--accent-rgb),.18);
  color: var(--accent);
  margin-bottom: 16px;
}
.store-feature-card h3 { margin: 0 0 8px; font-size: 16px; font-weight: 900; color: var(--text); }
.store-feature-card p  { margin: 0; font-size: 14px; font-weight: 650; color: var(--muted); line-height: 1.55; }

/* ── Steps ── */
.store-steps-section {
  padding: clamp(56px, 8vw, 100px) clamp(24px, 4vw, 48px);
  background: linear-gradient(180deg, var(--panel-2), var(--panel));
  border-radius: 28px;
  margin: 0 -12px;
  border: 1px solid var(--line);
}
.store-steps-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  position: relative;
}
.store-steps-grid::before {
  content: '';
  position: absolute;
  top: 24px;
  left: calc(12.5% + 20px);
  right: calc(12.5% + 20px);
  height: 1px;
  background: rgba(var(--accent-rgb),.30);
  pointer-events: none;
}
.store-step { display: grid; gap: 16px; align-content: start; }
.store-step-num {
  width: 48px; height: 48px;
  border-radius: 14px; display: grid; place-items: center;
  background: var(--panel);
  border: 2px solid rgba(var(--accent-rgb),.22);
  font-size: 16px; font-weight: 950; color: var(--accent); letter-spacing: -.02em;
  position: relative; z-index: 1;
  box-shadow: var(--shadow-soft);
}
.store-step-body h3 { margin: 0 0 8px; font-size: 15px; font-weight: 900; color: var(--text); }
.store-step-body p  { margin: 0; font-size: 13.5px; font-weight: 650; color: var(--muted); line-height: 1.55; }

/* ── Catalog section ── */
.store-catalog-section {
  padding-top: clamp(56px, 8vw, 100px);
  border-top: 1px solid var(--line);
  margin-top: clamp(40px, 6vw, 72px);
}
/* alpha.495 — vitrine robusta: busca + categorias + ordenação + paginação */
.store-filterbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 18px}
.store-search{flex:1 1 260px;min-width:200px;display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:0 12px}
.store-search svg{flex:0 0 auto;color:var(--muted)}
.store-search input{flex:1;border:0;background:transparent;color:var(--text);font:inherit;padding:11px 0;outline:none}
.store-sort{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font:inherit;padding:10px 12px;cursor:pointer}
.store-search-btn{white-space:nowrap}
.store-cats{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.store-cat{display:inline-flex;align-items:center;padding:7px 14px;border-radius:var(--r-pill);border:1px solid var(--line);background:var(--panel);color:var(--muted);font-weight:700;font-size:13px;text-decoration:none;transition:.14s ease}
.store-cat:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));color:var(--text)}
.store-cat.on{background:var(--accent);border-color:var(--accent);color:var(--accent-text,#1a1207)}
.store-pagination{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:clamp(28px,5vw,48px)}
.store-page{display:inline-flex;align-items:center;padding:9px 16px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel);color:var(--text);font-weight:750;text-decoration:none;transition:.14s ease}
.store-page:hover{border-color:var(--accent)}
.store-page.is-off{opacity:.4;pointer-events:none}
.store-page-info{color:var(--muted);font-weight:700;font-size:14px}
.store-empty {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 48px 24px; color: var(--muted); font-weight: 800; text-align: center;
}

/* ── CTA final — intencionalmente escuro (design independente do tema) ── */
.store-cta-section {
  margin-top: clamp(48px, 8vw, 96px);
  padding: clamp(40px, 6vw, 70px) clamp(24px, 5vw, 60px);
  border-radius: 28px;
  background: linear-gradient(135deg, #111827 0%, #1e1408 100%);
  text-align: center;
  color: #fff;
}
.store-cta-inner { max-width: 580px; margin: 0 auto; }
.store-cta-section h2 {
  margin: 0 0 14px; font-size: clamp(26px, 3vw, 36px); font-weight: 950;
  letter-spacing: -.03em; color: #fff;
}
.store-cta-section p { margin: 0 0 24px; font-size: 16px; color: rgba(255,255,255,.70); font-weight: 650; line-height: 1.55; }
.store-cta-section .btn-store-cta { background: var(--accent); color: #111827; }
.store-cta-section .btn-store-ghost { border-color: rgba(255,255,255,.28); color: rgba(255,255,255,.85); }
.store-cta-section .btn-store-ghost:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.50); }

/* ── Footer ── */
.store-footer {
  margin-top: clamp(40px, 6vw, 72px);
  border-top: 1px solid var(--line);
  background: var(--panel-2);
}
.store-footer-inner {
  width: min(1180px, calc(100vw - 28px)); margin: 0 auto;
  padding: clamp(28px, 4vw, 44px) 0;
  display: grid; grid-template-columns: auto 1fr auto;
  align-items: center; gap: 24px;
}
.store-footer-brand { display: flex; align-items: center; gap: 10px; }
.store-footer-brand strong { display: block; font-weight: 900; font-size: 14px; color: var(--text); }
.store-footer-brand small  { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.store-footer-nav {
  display: flex; align-items: center; justify-content: center;
  gap: 6px; flex-wrap: wrap;
}
.store-footer-nav a {
  padding: 6px 10px; border-radius: 8px; color: var(--muted);
  font-size: 13px; font-weight: 800; text-decoration: none;
  transition: color .12s, background .12s;
}
.store-footer-nav a:hover { color: var(--text); background: var(--panel); }
.store-footer-copy { margin: 0; font-size: 12px; color: var(--muted); font-weight: 700; white-space: nowrap; }

/* ── Responsivo alpha.52 ── */
@media(max-width:1024px) {
  .store-features-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .store-steps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .store-steps-grid::before { display: none; }
}
@media(max-width:860px) {
  .store-hero { grid-template-columns: 1fr; }
  .store-hero-visual { display: none; }
  .store-footer-inner { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .store-footer-copy { white-space: normal; }
}
@media(max-width:640px) {
  .store-features-grid { grid-template-columns: 1fr; }
  .store-steps-grid    { grid-template-columns: 1fr; }
  .store-nav           { display: none; }
  .store-steps-section { border-radius: 16px; margin: 0 -4px; padding-inline: 16px; }
  .store-cta-section .store-hero-actions { flex-direction: column; align-items: stretch; }
  .store-cta-section .btn-store-cta,
  .store-cta-section .btn-store-ghost { justify-content: center; }
}


/* ═══════════════════════════════════════════════════════════
   alpha.58 — SIDEBAR VERTICAL (navigation rail)
   ═══════════════════════════════════════════════════════════ */

:root {
  --sidenav-w: 232px;
  --sidenav-rail: 64px;
  --flyout-w: 228px;
}

.topbar { display: none !important; }

.app-layout {
  display: grid;
  grid-template-columns: var(--sidenav-w) 1fr;
  min-height: 100vh;
  position: relative;
}

.app-body {
  grid-column: 2;
  min-width: 0;
  overflow-x: hidden;
}

.app-mobile-bar {
  display: none;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  backdrop-filter: blur(16px);
  position: sticky;
  top: 0;
  z-index: 40;
}
.app-mobile-bar .mobile-nav-toggle {
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}
.app-mobile-bar .mobile-nav-toggle span {
  display: block;
  width: 18px;
  height: 2px;
  background: var(--text);
  border-radius: 2px;
  transition: .2s;
}
.sidenav-brand-mobile {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--text);
}
.sidenav-brand-mobile small {
  font-size: 11px;
  font-weight: 400;
  color: var(--muted);
  margin-left: 4px;
}

.sidenav {
  grid-column: 1;
  grid-row: 1;
  width: var(--sidenav-w);
  height: 100vh;
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  background: var(--panel);
  border-right: 1px solid var(--line);
  box-shadow: 4px 0 24px rgba(var(--shadow-rgb),.04);
  overflow: visible; /* alpha.64: visible evita 100% qualquer clipping dos flyouts position:fixed */
  transition: width .22s cubic-bezier(.4,0,.2,1);
  z-index: 50;
}

.sidenav-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 12px 12px;
  border-bottom: 1px solid var(--line);
  flex-shrink: 0;
}
.sidenav-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
  overflow: hidden;
}
.sidenav-brand .brand-logo-svg {
  width: 120px;
  height: 32px;
  flex-shrink: 0;
  color: var(--text);
  transition: opacity .2s, width .22s;
}
.sidenav-collapse-btn {
  flex-shrink: 0;
  opacity: .45;
  transition: opacity .15s;
}
.sidenav-collapse-btn:hover { opacity: 1; }

.sidenav-nav {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px;
  padding: 10px 8px;
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1;
  scrollbar-width: thin;
  scrollbar-color: var(--line) transparent;
}

.sidenav-group {
  position: static !important;
  flex: 0 0 auto;
}

.sidenav-trigger {
  display: flex !important;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  min-height: 42px !important;
  text-align: left;
  color: var(--muted);
  font-weight: 600;
  font-size: 13.5px;
  white-space: nowrap;
  overflow: hidden;
  transition: background .14s, color .14s;
  border: 1px solid transparent !important;
  box-shadow: none !important;
}
.sidenav-trigger:hover,
.sidenav-group.active .sidenav-trigger,
.sidenav-group.is-open .sidenav-trigger {
  background: rgba(var(--accent-rgb), .10) !important;
  color: var(--text) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.sidenav-group.active .sidenav-trigger { color: var(--accent) !important; }

.sidenav-icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  flex-shrink: 0;
  background: transparent;
  transition: background .14s;
}
.sidenav-group.active .sidenav-icon {
  background: rgba(var(--accent-rgb), .14);
  color: var(--accent);
}
.sidenav-group.is-open .sidenav-icon { background: rgba(var(--accent-rgb), .10); }

.sidenav-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: opacity .18s;
}

.sidenav-caret {
  flex-shrink: 0;
  opacity: .45;
  transition: transform .18s, opacity .18s;
  display: flex;
  align-items: center;
}
.sidenav-group.is-open .sidenav-caret { transform: rotate(90deg); opacity: .8; }

/* Flyout panel */
.sidenav-flyout {
  position: fixed !important;
  left: var(--sidenav-w) !important;
  top: 0 !important;
  width: var(--flyout-w) !important;
  height: 100vh !important;
  min-width: 0 !important;
  max-height: none !important;
  border-radius: 0 !important;
  border: none !important;
  border-right: 1px solid var(--line) !important;
  background: color-mix(in srgb, var(--panel) 98%, var(--bg)) !important;
  box-shadow: 6px 0 32px rgba(var(--shadow-rgb),.10), 1px 0 0 var(--line) !important;
  padding: 0 !important;
  overflow-y: auto;
  display: flex !important;
  flex-direction: column;
  gap: 0 !important;
  opacity: 0 !important;
  transform: translateX(-10px) !important;
  pointer-events: none !important;
  transition: opacity .18s cubic-bezier(.4,0,.2,1), transform .18s cubic-bezier(.4,0,.2,1) !important;
  z-index: 200 !important;
}
.sidenav-group.is-open .sidenav-flyout {
  opacity: 1 !important;
  transform: translateX(0) !important;
  pointer-events: auto !important;
}

.sidenav-flyout-head {
  padding: 20px 16px 12px !important;
  border-bottom: 1px solid var(--line) !important;
  flex-shrink: 0;
}
.sidenav-flyout-head strong {
  display: block;
  font-size: 15px;
  font-weight: 800;
  color: var(--text);
  letter-spacing: -.02em;
}
.sidenav-flyout-head small {
  display: block;
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 2px;
}

.sidenav-flyout a {
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 9px 12px !important;
  margin: 2px 8px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
  min-height: 44px;
  transition: background .12s, color .12s !important;
}
.sidenav-flyout a:hover {
  background: rgba(var(--accent-rgb), .08) !important;
  color: var(--text) !important;
}
.sidenav-flyout a.current {
  background: rgba(var(--accent-rgb), .14) !important;
  color: var(--accent) !important;
}

.sidenav-item-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  flex-shrink: 0;
  background: rgba(var(--accent-rgb), .07);
  color: var(--muted);
  transition: background .12s, color .12s;
}
.sidenav-flyout a:hover .sidenav-item-icon {
  background: rgba(var(--accent-rgb), .12);
  color: var(--text);
}
.sidenav-flyout a.current .sidenav-item-icon {
  background: rgba(var(--accent-rgb), .18);
  color: var(--accent);
}

.menu-item-text strong { font-size: 13px; font-weight: 700; display: block; }
.menu-item-text small  { font-size: 11px; color: var(--muted); display: block; margin-top: 1px; }

/* Rodape sidebar */
.sidenav-foot {
  flex-shrink: 0;
  border-top: 1px solid var(--line);
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sidenav-prefs {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 4px 2px;
  flex-wrap: wrap;
}
.sidenav-theme-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 10px;
  border-radius: 10px;
  background: transparent;
  border: 1px solid transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .13s, color .13s;
  text-align: left;
  font-family: inherit;
}
.sidenav-theme-btn:hover {
  background: rgba(var(--accent-rgb), .09);
  color: var(--text);
}
.sidenav-theme-btn .color-picker-caret { margin-left: auto; flex-shrink: 0; }

.sidenav-color-panel {
  position: fixed !important;
  left: var(--sidenav-w) !important;
  bottom: 70px !important;
  top: auto !important;
  right: auto !important;
  min-width: 210px !important;
  max-height: 380px;
  overflow-y: auto;
  border-radius: 14px !important;
  box-shadow: 0 24px 60px rgba(var(--shadow-rgb),.18), 0 0 0 1px var(--line) !important;
  z-index: 300 !important;
  opacity: 0;
  transform: translateX(-4px) translateY(4px);
  pointer-events: none;
  transition: opacity .15s, transform .15s;
}
.sidenav-color-panel.is-open {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

.sidenav-user-menu > summary {
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  cursor: pointer;
  list-style: none;
  transition: background .13s;
  overflow: hidden;
}
.sidenav-user-menu > summary:hover { background: rgba(var(--accent-rgb), .08); }
.sidenav-user-menu > summary::-webkit-details-marker { display: none; }
.sidenav-user-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidenav-user-panel {
  position: fixed !important;
  left: var(--sidenav-w) !important;
  bottom: 120px !important;
  top: auto !important;
  right: auto !important;
  min-width: 200px !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 60px rgba(var(--shadow-rgb),.18), 0 0 0 1px var(--line) !important;
  z-index: 300 !important;
}

.sidenav-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 190;
  background: transparent;
}
.sidenav-backdrop.active { display: block; }

/* Collapsed (rail) */
body.sidenav-collapsed { --sidenav-w: var(--sidenav-rail); }
body.sidenav-collapsed .sidenav-label,
body.sidenav-collapsed .build-pill { opacity: 0; max-width: 0; overflow: hidden; }
body.sidenav-collapsed .brand-logo-svg { width: 0 !important; opacity: 0; overflow: hidden; }
body.sidenav-collapsed .sidenav-caret { opacity: 0; max-width: 0; overflow: hidden; }
body.sidenav-collapsed .sidenav-collapse-btn svg { transform: scaleX(-1); }
body.sidenav-collapsed .sidenav-trigger { justify-content: center; padding: 8px !important; }
body.sidenav-collapsed .sidenav-icon { width: 40px; height: 40px; border-radius: 10px; }
body.sidenav-collapsed .sidenav-user-menu > summary { justify-content: center; padding: 8px; }
body.sidenav-collapsed .sidenav-theme-btn { justify-content: center; padding: 8px; }
body.sidenav-collapsed .sidenav-prefs { justify-content: center; }
body.sidenav-collapsed .color-picker-caret { display: none; }

/* Main content */
.main {
  padding: 28px 30px;
  max-width: none;
  margin: 0;
}
.main-login { padding: 0; }
.nav-mobile-head { display: none; }

/* Responsive: mobile */
@media (max-width: 900px) {
  .app-layout {
    display: flex;
    flex-direction: column;
  }
  .sidenav {
    position: fixed;
    left: -100%;
    top: 0;
    height: 100vh;
    width: min(280px, 82vw);
    z-index: 200;
    transition: left .24s cubic-bezier(.4,0,.2,1);
    overflow-y: auto;
    overflow-x: hidden;
  }
  body.nav-drawer-open .sidenav { left: 0; }
  body.nav-drawer-open .sidenav-backdrop { display: block; background: rgba(0,0,0,.38); }
  .app-mobile-bar { display: flex !important; }
  .app-body { flex: 1; min-width: 0; }
  .nav-mobile-head {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
  }
  .sidenav-flyout {
    position: static !important;
    left: auto !important;
    top: auto !important;
    width: auto !important;
    height: auto !important;
    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: none !important;
    border: none !important;
    box-shadow: none !important;
    background: rgba(var(--accent-rgb), .04) !important;
    border-radius: 0 !important;
    transition: max-height .22s ease !important;
  }
  .sidenav-group.is-open .sidenav-flyout {
    max-height: 800px !important;
    pointer-events: auto !important;
  }
  .sidenav-flyout a { margin: 1px 4px !important; }
  .main { padding: 14px 16px; }
}

@media print {
  .sidenav, .app-mobile-bar, .sidenav-backdrop { display: none !important; }
  .app-layout { display: block; }
  .app-body { display: block; }
  .main { padding: 0; }
}


/* ═══════════════════════════════════════════════════════════
   alpha.59 — Sidebar polish: active indicator, tooltip rail,
   icones mais visiveis, limpeza de referencias internas
   ═══════════════════════════════════════════════════════════ */

/* Indicador ativo: barra colorida à esquerda do grupo */
.sidenav-group.active .sidenav-trigger::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 20px;
  border-radius: 0 3px 3px 0;
  background: var(--accent);
}
.sidenav-trigger { position: relative; }

/* Tooltip no modo rail (collapsed) */
body.sidenav-collapsed .sidenav-group { position: relative; }
body.sidenav-collapsed .sidenav-trigger::after {
  content: attr(title);
  position: fixed;
  left: calc(var(--sidenav-rail) + 10px);
  top: auto;
  background: var(--text);
  color: var(--bg);
  font-size: 12px;
  font-weight: 600;
  padding: 5px 10px;
  border-radius: 8px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s .1s;
  z-index: 9999;
  box-shadow: 0 4px 16px rgba(0,0,0,.18);
}
body.sidenav-collapsed .sidenav-trigger:hover::after { opacity: 1; }

/* Ícones SVG: garantir visibilidade e tamanho certo */
.sidenav-icon svg {
  display: block;
  flex-shrink: 0;
}

/* Ícone do grupo ativo: fundo accent tint */
.sidenav-group.active > .sidenav-trigger .sidenav-icon {
  background: rgba(var(--accent-rgb), .16);
  color: var(--accent);
}
.sidenav-group.is-open > .sidenav-trigger .sidenav-icon {
  background: rgba(var(--accent-rgb), .12);
  color: color-mix(in srgb, var(--accent) 80%, var(--text));
}

/* Item ativo no flyout: fundo accent + ícone colorido */
.sidenav-flyout a.current {
  font-weight: 700 !important;
}
.sidenav-flyout a.current .sidenav-item-icon {
  background: rgba(var(--accent-rgb), .18) !important;
  color: var(--accent) !important;
}

/* Flyout: padding inicial com padding top para afastar do topo */
.sidenav-flyout > *:first-child { margin-top: 0; }

/* Separador visual leve entre grupos no flyout */
.sidenav-flyout a + a { border-top: none; }

/* Dark mode: sidebar um pouco mais escuro que o fundo */
[data-theme="dark"] .sidenav {
  background: color-mix(in srgb, var(--panel) 85%, #000);
  border-right-color: var(--line);
}
[data-theme="dark"] .sidenav-flyout {
  background: color-mix(in srgb, var(--panel) 90%, #000) !important;
}

/* Renomear im- para dash- já feito em CSS — garantir dash- classes ativas */
.dash-breakeven-card,
.dash-kpi,
.dash-kpi-icon { /* sem sobrescrita, apenas confirma existência */ }

/* Scrollbar da sidebar */
.sidenav-nav::-webkit-scrollbar { width: 4px; }
.sidenav-nav::-webkit-scrollbar-track { background: transparent; }
.sidenav-nav::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 4px; }

/* Flyout scrollbar */
.sidenav-flyout::-webkit-scrollbar { width: 4px; }
.sidenav-flyout::-webkit-scrollbar-track { background: transparent; }
.sidenav-flyout::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 4px; }


/* ═══════════════════════════════════════════════════════════
   alpha.60 — Sidebar: controles no topo, rodapé com versão,
   fix backdrop (não cobre sidebar), color-panel abre p/ baixo
   ═══════════════════════════════════════════════════════════ */

/* ── sidenav-top-tools: controles logo abaixo do logo ── */
.sidenav-top-tools {
  flex-shrink: 0;
  border-bottom: 1px solid var(--line);
  padding: 8px 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Linha de botões de controle */
.sidenav-top-tools .sidenav-prefs {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 2px 2px 4px;
  flex-wrap: wrap;
}

/* Color picker abre para BAIXO no topo */
.sidenav-top-tools .sidenav-color-panel {
  bottom: auto !important;
  top: calc(100% + 6px) !important;
}

/* User panel abre para BAIXO no topo */
.sidenav-top-tools .sidenav-user-panel {
  bottom: auto !important;
  top: calc(100% + 6px) !important;
}

/* ── Rodapé simplificado: só build label ── */
.sidenav-foot {
  flex-shrink: 0;
  border-top: 1px solid var(--line);
  padding: 10px 14px;
  display: flex;
  align-items: center;
}

.sidenav-build-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  opacity: .7;
  letter-spacing: .02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Fix backdrop: não cobre a sidebar ── */
.sidenav-backdrop {
  left: var(--sidenav-w) !important; /* começa DEPOIS da sidebar */
}

/* ─────────────────────────────────────────────────────────────
   alpha.61 — App Topbar: controles fora da sidebar
   ───────────────────────────────────────────────────────────── */

.app-body {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1;
}

.app-topbar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  height: 44px;
  flex-shrink: 0;
  background: var(--panel);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 40;
}

.topbar-spacer { flex: 1; }

.topbar-prefs {
  display: flex;
  align-items: center;
  gap: 2px;
}

/* Color picker dentro do topbar */
.topbar-color-picker { position: relative; }

.topbar-theme-btn {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 10px 5px 8px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  cursor: pointer;
  font-size: 13px;
  color: var(--text);
  transition: background .13s, border-color .13s;
  white-space: nowrap;
}
.topbar-theme-btn:hover { background: rgba(var(--accent-rgb),.08); border-color: rgba(var(--accent-rgb),.3); }

.topbar-label {
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
}

.topbar-color-panel {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 200px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(var(--shadow-rgb),.16);
  padding: 6px;
  z-index: 500;
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
  transition: opacity .15s, transform .15s;
}
.topbar-color-panel.is-open {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

/* User menu dentro do topbar */
.topbar-user-menu { position: relative; }

.topbar-user-menu > summary {
  display: flex !important;
  align-items: center;
  gap: 8px;
  padding: 5px 10px 5px 8px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  cursor: pointer;
  list-style: none;
  transition: background .13s, border-color .13s;
}
.topbar-user-menu > summary:hover { background: rgba(var(--accent-rgb),.08); border-color: rgba(var(--accent-rgb),.3); }
.topbar-user-menu > summary::-webkit-details-marker { display: none; }

.topbar-user-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
}

.topbar-user-panel {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 200px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(var(--shadow-rgb),.16);
  padding: 6px;
  z-index: 500;
}
.topbar-user-panel small {
  display: block;
  padding: 6px 10px 4px;
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.topbar-user-panel a,
.topbar-user-panel .git-sync-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 13px;
  color: var(--text);
  text-decoration: none;
  transition: background .12s;
  cursor: pointer;
  width: 100%;
  background: none;
  border: none;
  text-align: left;
}
.topbar-user-panel a:hover,
.topbar-user-panel .git-sync-btn:hover { background: rgba(var(--accent-rgb),.08); }

/* mobile: esconde topbar-label do user no topbar */
@media (max-width: 680px) {
  .topbar-user-name { display: none; }
  .topbar-label.color-picker-label { display: none; }
  .topbar-theme-btn { padding: 5px 8px; }
  .topbar-user-menu > summary { padding: 5px 8px; }
}

/* alpha.65 - status dropdown custom + sidebar interaction polish */
.quick-status-form {
  position: relative;
  display: inline-flex;
  margin: 0;
  min-width: 176px;
}

.status-menu {
  position: relative;
  width: 100%;
  --status-rgb: 100, 116, 139;
  --status-color: #475569;
}
.status-menu[data-status="fila"] { --status-rgb: 220, 38, 38; --status-color: #dc2626; }
.status-menu[data-status="producao"] { --status-rgb: 249, 115, 22; --status-color: #c2410c; }
.status-menu[data-status="pausado"] { --status-rgb: 217, 119, 6; --status-color: #b45309; }
.status-menu[data-status="finalizado"] { --status-rgb: 234, 179, 8; --status-color: #9a6700; }
.status-menu[data-status="etiqueta"] { --status-rgb: 22, 163, 74; --status-color: #15803d; }
.status-menu[data-status="entregue"] { --status-rgb: 37, 99, 235; --status-color: #2563eb; }
.status-menu[data-status="cancelado"] { --status-rgb: 100, 116, 139; --status-color: #64748b; }
.status-menu[data-status="garantia"] { --status-rgb: 201, 163, 74; --status-color: var(--accent); }

.status-menu-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(var(--status-rgb), .28);
  background: color-mix(in srgb, rgb(var(--status-rgb)) 13%, var(--panel));
  color: var(--status-color);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.1;
  white-space: nowrap;
  transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}
.status-menu-trigger:hover,
.status-menu.is-open .status-menu-trigger {
  border-color: rgba(var(--status-rgb), .45);
  box-shadow: 0 10px 24px rgba(var(--status-rgb), .12), inset 0 1px 0 rgba(255,255,255,.65);
}
.status-dot {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: rgb(var(--status-rgb));
  flex: 0 0 auto;
  box-shadow: 0 0 0 3px rgba(var(--status-rgb), .12);
}
.status-caret {
  flex: 0 0 auto;
  opacity: .72;
  transition: transform .14s ease;
}
.status-menu.is-open .status-caret { transform: rotate(180deg); }

.status-menu-panel {
  position: absolute;
  min-width: 210px;
  max-width: min(260px, calc(100vw - 24px));
  padding: 6px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--panel) 98%, var(--bg));
  box-shadow: 0 22px 55px rgba(var(--shadow-rgb),.18), 0 0 0 1px rgba(255,255,255,.35) inset;
  backdrop-filter: blur(16px);
  z-index: 900;
}

.status-menu-option {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 9px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 760;
  text-align: left;
}
.status-menu-option[data-status="fila"] { --status-rgb: 220, 38, 38; }
.status-menu-option[data-status="producao"] { --status-rgb: 249, 115, 22; }
.status-menu-option[data-status="pausado"] { --status-rgb: 217, 119, 6; }
.status-menu-option[data-status="finalizado"] { --status-rgb: 234, 179, 8; }
.status-menu-option[data-status="etiqueta"] { --status-rgb: 22, 163, 74; }
.status-menu-option[data-status="entregue"] { --status-rgb: 37, 99, 235; }
.status-menu-option[data-status="cancelado"] { --status-rgb: 100, 116, 139; }
.status-menu-option[data-status="garantia"] { --status-rgb: 201, 163, 74; }
.status-menu-option:hover,
.status-menu-option[aria-selected="true"] {
  background: rgba(var(--status-rgb), .10);
  color: var(--text);
}

.sidenav-group:hover .sidenav-flyout,
.sidenav-group:focus-within .sidenav-flyout {
  opacity: 1 !important;
  transform: translateX(0) !important;
  pointer-events: auto !important;
}

body.nav-menu-open .app-topbar {
  z-index: 35;
}

body.nav-menu-open::before {
  content: none !important;
  display: none !important;
}

.orders-table tbody tr:hover {
  filter: none !important;
  background: color-mix(in srgb, var(--accent) 4%, transparent);
}

/* alpha.67 - z-index real da sidebar: backdrop nao pode capturar cliques do flyout */
.sidenav {
  z-index: 700 !important;
}

.sidenav-flyout {
  z-index: 720 !important;
}

.sidenav-backdrop {
  z-index: 650 !important;
}

.sidenav-group.is-open .sidenav-flyout,
.sidenav-group:hover .sidenav-flyout,
.sidenav-group:focus-within .sidenav-flyout {
  pointer-events: auto !important;
}

/* alpha.68 - Configuracoes no topo, sidebar compacta e God mode navegacao */
:root {
  --sidenav-w: 184px;
  --sidenav-rail: 52px;
  --flyout-w: 188px;
  --nav-item-h: 36px;
  --nav-item-radius: 10px;
}

.settings-system-layout {
  display: block !important;
}

.settings-side-nav {
  position: sticky !important;
  top: 48px !important;
  z-index: 42 !important;
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px !important;
  margin: 0 0 14px !important;
  padding: 8px !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--panel) 94%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--line) 88%, transparent) !important;
  box-shadow: 0 10px 28px rgba(var(--shadow-rgb),.045) !important;
  backdrop-filter: blur(14px);
}

.settings-side-nav a {
  flex: 0 0 auto;
  min-height: 30px !important;
  padding: 7px 10px !important;
  border-radius: 9px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  white-space: nowrap;
}

.sidenav {
  width: var(--sidenav-w) !important;
}

.app-layout {
  grid-template-columns: var(--sidenav-w) minmax(0, 1fr) !important;
}

.sidenav-head {
  padding: 12px 8px 10px !important;
  gap: 6px !important;
}

.sidenav-brand .brand-logo-svg {
  width: 104px !important;
  height: 28px !important;
}

.sidenav-nav {
  padding: 8px 6px !important;
  gap: 1px !important;
}

.sidenav-trigger {
  min-height: var(--nav-item-h) !important;
  padding: 6px 8px !important;
  border-radius: var(--nav-item-radius) !important;
  gap: 8px !important;
  font-size: 13px !important;
}

.sidenav-icon {
  width: 30px !important;
  height: 30px !important;
  border-radius: calc(var(--nav-item-radius) - 2px) !important;
}

.sidenav-icon svg {
  width: 17px !important;
  height: 17px !important;
}

.sidenav-flyout {
  width: var(--flyout-w) !important;
}

.sidenav-flyout-head {
  padding: 16px 14px 10px !important;
}

.sidenav-flyout-head strong {
  font-size: 13px !important;
}

.sidenav-flyout-head small {
  font-size: 10.5px !important;
}

.sidenav-flyout a {
  min-height: 38px !important;
  padding: 7px 10px !important;
  margin: 1px 6px !important;
  border-radius: 9px !important;
  gap: 8px !important;
  font-size: 12px !important;
}

.sidenav-item-icon {
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
}

.sidenav-item-icon svg {
  width: 16px !important;
  height: 16px !important;
}

.menu-item-text strong {
  font-size: 12.5px !important;
}

.menu-item-text small {
  font-size: 10.5px !important;
}

.sidenav-foot {
  padding: 8px 6px !important;
}

.sidenav-theme-btn,
.sidenav-user-menu > summary {
  min-height: 34px !important;
  padding: 6px 8px !important;
  border-radius: var(--nav-item-radius) !important;
}

body.sidenav-collapsed .sidenav-icon {
  width: 36px !important;
  height: 36px !important;
}

body.sidenav-collapsed .sidenav-trigger {
  min-height: 40px !important;
  padding: 5px !important;
}

@media (max-width: 900px) {
  :root {
    --sidenav-w: min(280px, 82vw);
    --sidenav-rail: 52px;
    --flyout-w: min(260px, 78vw);
  }

  .settings-side-nav {
    top: 54px !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .settings-side-nav::-webkit-scrollbar {
    display: none;
  }
}

/* alpha.70 - Arquiteto UI God mode + bridge de temas */
:root {
  --surface-alpha: 94%;
}

.ua-god-section {
  border-color: color-mix(in srgb, var(--accent) 24%, var(--line));
  background: color-mix(in srgb, var(--accent) 4%, var(--panel));
}

.ua-text-label {
  margin-bottom: 8px;
  text-transform: none;
  letter-spacing: 0;
}

.ua-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.ua-action-grid-2 {
  grid-template-columns: 1fr 1fr;
}

.ua-action-grid .btn,
.ua-menu-builder .btn {
  width: 100%;
  justify-content: center;
}

.ua-menu-builder {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

.ua-input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-2);
  color: var(--text);
  padding: 8px 9px;
  font-size: 12px;
}

.ua-help {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.ua-switch-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
}

.ua-switch-row input {
  accent-color: var(--accent);
}

.ua-pick-btn.is-active,
#uaMoveMode.is-active {
  background: color-mix(in srgb, var(--accent) 16%, var(--panel));
  color: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 46%, var(--line));
}

body.ui-moving,
body.ui-moving * {
  cursor: grab !important;
}

body.ui-moving .ui-architect,
body.ui-moving .ui-architect * {
  cursor: default !important;
}

.ua-drag-target {
  outline: 2px dashed var(--accent) !important;
  outline-offset: 3px !important;
}

.ua-drag-target.is-ua-dragging {
  cursor: grabbing !important;
  filter: drop-shadow(0 18px 28px rgba(var(--shadow-rgb), .18));
}

.ua-prototype-menu-item {
  border: 1px dashed color-mix(in srgb, var(--accent) 45%, var(--line)) !important;
  background: color-mix(in srgb, var(--accent) 8%, var(--panel)) !important;
  color: var(--accent) !important;
}

.ua-prototype-clone {
  outline: 1px dashed color-mix(in srgb, var(--accent) 55%, var(--line));
}

body:not(.ui-no-transparency) .card,
body:not(.ui-no-transparency) .metric,
body:not(.ui-no-transparency) .tool-card,
body:not(.ui-no-transparency) .dropdown-panel,
body:not(.ui-no-transparency) .user-menu-panel,
body:not(.ui-no-transparency) .ui-architect-panel,
body:not(.ui-no-transparency) .settings-shell,
body:not(.ui-no-transparency) .settings-panel {
  background: color-mix(in srgb, var(--panel) var(--surface-alpha), transparent) !important;
}

body.ui-no-transparency .card,
body.ui-no-transparency .metric,
body.ui-no-transparency .tool-card,
body.ui-no-transparency .dropdown-panel,
body.ui-no-transparency .user-menu-panel,
body.ui-no-transparency .ui-architect-panel,
body.ui-no-transparency .settings-shell,
body.ui-no-transparency .settings-panel {
  background: var(--panel) !important;
  backdrop-filter: none !important;
}

/* ═══════════════════════════════════════════════════════════
   alpha.71 — Storefront: pain points, social proof,
   testimonials, trust badges + topbar "Novo:" badge
   ═══════════════════════════════════════════════════════════ */

/* ─── Hero: micro-benefícios abaixo do CTA ─── */
.store-hero-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin-top: 16px;
}
.store-hero-trust span {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  font-weight: 650;
  color: #64748b;
}
.store-hero-trust span svg {
  color: #22c55e;
  flex-shrink: 0;
}

/* ─── Pain points ─── */
.store-pain-section {
  padding: clamp(48px, 7vw, 80px) clamp(16px, 5vw, 80px);
  background: #fff8f0;
  border-radius: 20px;
  margin: 0 clamp(8px, 3vw, 24px) 32px;
  text-align: center;
}
.store-pain-section .store-section-header { margin-bottom: 36px; }
.store-pain-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  max-width: 860px;
  margin: 0 auto 32px;
}
.store-pain-card {
  background: #fff;
  border: 1px solid #fee2cc;
  border-radius: 14px;
  padding: 24px 20px;
  text-align: left;
}
.store-pain-icon {
  font-size: 28px;
  margin-bottom: 12px;
  line-height: 1;
}
.store-pain-card h3 {
  margin: 0 0 8px;
  font-size: 14.5px;
  font-weight: 800;
  color: #1e293b;
}
.store-pain-card p {
  margin: 0;
  font-size: 13px;
  color: #64748b;
  line-height: 1.55;
  font-weight: 600;
}
.store-pain-answer {
  font-size: 15px;
  font-weight: 750;
  color: #c9692a;
  margin: 0;
}

/* ─── Social proof ─── */
.store-social-proof {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0;
  padding: clamp(32px, 5vw, 52px) clamp(16px, 5vw, 80px);
  border-top: 1px solid var(--line, #e2e8f0);
  border-bottom: 1px solid var(--line, #e2e8f0);
  margin-bottom: 0;
}
.store-proof-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 0 clamp(24px, 4vw, 52px);
  border-right: 1px solid var(--line, #e2e8f0);
}
.store-proof-stat:last-child { border-right: none; }
.store-proof-stat strong {
  font-size: clamp(26px, 4vw, 36px);
  font-weight: 900;
  color: var(--accent, #c9a34a);
  line-height: 1;
  letter-spacing: -0.03em;
}
.store-proof-stat span {
  font-size: 12.5px;
  font-weight: 650;
  color: #64748b;
  text-align: center;
}

/* ─── Testimonials ─── */
.store-testimonials-section {
  padding: clamp(48px, 7vw, 80px) clamp(16px, 5vw, 80px);
}
.store-testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  max-width: 1000px;
  margin: 0 auto;
}
.store-testimonial {
  background: var(--panel, #fff);
  border: 1px solid var(--line, #e2e8f0);
  border-radius: 14px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.store-testimonial-stars {
  color: #f59e0b;
  font-size: 14px;
  letter-spacing: 2px;
}
.store-testimonial p {
  margin: 0;
  font-size: 13.5px;
  color: var(--text, #1e293b);
  line-height: 1.6;
  font-weight: 600;
  font-style: italic;
  flex: 1;
}
.store-testimonial footer {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-top: 12px;
  border-top: 1px solid var(--line, #e2e8f0);
}
.store-testimonial footer strong {
  font-size: 13px;
  font-weight: 750;
  color: var(--text, #1e293b);
}
.store-testimonial footer span {
  font-size: 12px;
  color: #64748b;
  font-weight: 600;
}

/* ─── Trust lock no CTA final ─── */
.store-trust-lock {
  margin: 16px 0 0;
  font-size: 12.5px;
  color: rgba(255,255,255,.55);
  font-weight: 600;
}

/* ─── Topbar: badge "Novo:" ─── */
.topbar-new-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px 3px 6px;
  background: rgba(var(--accent-rgb, 201,163,74), .12);
  border: 1px solid rgba(var(--accent-rgb, 201,163,74), .25);
  border-radius: 20px;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--accent, #c9a34a);
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s;
  flex-shrink: 0;
}
.topbar-new-badge:hover {
  background: rgba(var(--accent-rgb, 201,163,74), .2);
}
.topbar-new-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--accent, #c9a34a);
  animation: topbar-pulse 2s infinite;
  flex-shrink: 0;
}
@keyframes topbar-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: .5; transform: scale(1.3); }
}

/* ─── Responsivo ─── */
@media (max-width: 768px) {
  .store-pain-grid { grid-template-columns: 1fr; }
  .store-testimonials-grid { grid-template-columns: 1fr; }
  .store-proof-stat { padding: 0 20px; }
  .store-pain-section { margin: 0 0 24px; border-radius: 12px; }
  .topbar-new-badge { font-size: 11px; padding: 2px 8px 2px 5px; }
}
@media (max-width: 560px) {
  .store-social-proof { gap: 20px; flex-direction: column; align-items: center; }
  .store-proof-stat { border-right: none; border-bottom: 1px solid var(--line, #e2e8f0); padding: 0 0 16px; width: 100%; text-align: center; }
  .store-proof-stat:last-child { border-bottom: none; padding-bottom: 0; }
}

/* ═══════════════════════════════════════════════════════════
   alpha.73 — KPI cards: ícone+label no topo, valor no centro inferior
   ═══════════════════════════════════════════════════════════ */
.metric.dash-kpi {
  grid-template-columns: 1fr !important;
  grid-template-rows: auto 1fr !important;
  align-items: stretch !important;
  column-gap: 0 !important;
  row-gap: 0 !important;
  padding: 16px 18px 18px !important;
}
.dash-kpi-top {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dash-kpi-icon {
  grid-row: unset !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  flex-shrink: 0;
}
.dash-kpi-top span:not(.dash-kpi-icon) {
  color: var(--muted) !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.2;
}
/* remove regra antiga que selecionava span direto */
.metric.dash-kpi > span:not(.dash-kpi-icon) { display: none !important; }
.metric.dash-kpi strong {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding-top: 10px !important;
  font-size: clamp(22px, 2vw, 28px) !important;
}

/* ═══════════════════════════════════════════════════════════
   alpha.74 — Store: logo unificada com ERP + seletor de tema
   ═══════════════════════════════════════════════════════════ */

/* Logo ERP na storefront */
.store-brand-logo-erp {
  height: 44px;
  width: auto;
  color: var(--accent, #c9a34a);
  flex-shrink: 0;
}

/* Seletor de tema na store topbar */
.store-theme-picker { position: relative; }
.store-theme-btn {
  display: flex; align-items: center; gap: 5px;
  padding: 5px 8px;
  background: var(--panel-2, #f1f5f9);
  border: 1px solid var(--line, #e2e8f0);
  border-radius: 8px;
  cursor: pointer;
  transition: background .15s;
}
.store-theme-btn:hover { background: var(--line, #e2e8f0); }
.store-theme-dot {
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--accent, #c9a34a);
  flex-shrink: 0;
  transition: background .2s;
}
.store-theme-panel {
  position: absolute; top: calc(100% + 6px); right: 0;
  background: var(--panel, #fff);
  border: 1px solid var(--line, #e2e8f0);
  border-radius: 10px;
  padding: 6px;
  min-width: 180px;
  box-shadow: 0 8px 24px rgba(0,0,0,.10);
  z-index: 200;
  display: flex; flex-direction: column; gap: 2px;
}
.store-theme-panel[hidden] { display: none !important; }
.st-color-opt {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 10px;
  border-radius: 7px;
  font-size: 13px; font-weight: 650;
  color: var(--text, #1e293b);
  cursor: pointer;
  background: transparent;
  border: none;
  text-align: left;
  transition: background .12s;
}
.st-color-opt:hover { background: var(--panel-2, #f1f5f9); }
.st-color-opt span {
  width: 14px; height: 14px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════
   Zoukei Ecosystem v4.82 — Barra universal + Calculadora PHP
   ═══════════════════════════════════════════════════════════════ */

/* ── Layout base de páginas públicas ── */
.pub-layout{display:flex;flex-direction:column;min-height:100vh}

/* ── Barra superior universal ── */
.pub-topbar{position:sticky;top:0;z-index:40;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:10px 20px;background:color-mix(in srgb,var(--panel) 90%,transparent);border-bottom:1px solid var(--line);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 1px 0 rgba(255,255,255,.04)}
.pub-brand{display:flex;align-items:center;gap:10px;color:var(--text);font-weight:950;font-size:18px;letter-spacing:-.03em;white-space:nowrap;text-decoration:none}
.pub-brand .brand-mark{width:34px;height:34px;border-radius:var(--r-sm);background:linear-gradient(135deg,#111827,#3f3f46);color:#f8d36a;display:inline-flex;align-items:center;justify-content:center;font-weight:950;font-size:16px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 6px 16px rgba(0,0,0,.18)}
.pub-brand .brand-wordmark{display:flex;flex-direction:column;line-height:1;gap:1px}
.pub-brand .brand-name{font-size:15px;font-weight:950;letter-spacing:-.02em;color:var(--text)}
.pub-brand .brand-sub{font-size:10px;font-weight:600;letter-spacing:.18em;color:var(--muted);text-transform:uppercase}
.pub-nav{display:flex;align-items:center;gap:3px;overflow:auto;scrollbar-width:none;padding:2px;justify-content:center}
.pub-nav::-webkit-scrollbar{display:none}
.pub-nav a{white-space:nowrap;padding:8px 14px;border-radius:var(--r-pill);color:var(--muted);font-weight:850;border:1px solid transparent;transition:.14s ease;text-decoration:none;font-size:14px}
.pub-nav a:hover{background:rgba(var(--accent-rgb),.10);color:var(--text);border-color:rgba(var(--accent-rgb),.22)}
.pub-nav a.pub-active{background:rgba(var(--accent-rgb),.14);color:var(--accent);border-color:rgba(var(--accent-rgb),.28);font-weight:950}
.pub-actions{display:flex;align-items:center;gap:6px;justify-self:end}
.pub-btn-primary{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:var(--r-sm);background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 70%,#000));border:1px solid color-mix(in srgb,var(--accent) 80%,#000);color:#fff;font:inherit;font-weight:900;font-size:13px;cursor:pointer;text-decoration:none;white-space:nowrap;transition:.14s ease}
.pub-btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(var(--accent-rgb),.30)}
.pub-mobile-nav-btn{display:none}
/* alpha.793 — carrinho na topbar pública */
.pub-cart-btn{position:relative;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--muted);text-decoration:none;transition:color .14s,border-color .14s;flex-shrink:0}
.pub-cart-btn:hover,.pub-cart-btn.has-items{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
.pub-cart-badge{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;background:var(--accent);color:var(--accent-text,#fff);border-radius:9px;font-size:9px;font-weight:900;display:flex;align-items:center;justify-content:center;line-height:1;pointer-events:none;box-shadow:0 0 0 2px var(--panel)}
/* Rodapé universal público */
.pub-global-footer{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 12px;padding:14px 20px;border-top:1px solid var(--line);background:var(--panel-2);font-size:12px;color:var(--muted)}
.pub-global-footer a{color:var(--muted);text-decoration:none;transition:color .15s;display:inline-flex;align-items:center;min-height:40px;padding:8px 6px;margin:-8px 0}/* alpha.1019 — alvo de toque (era ~17px; margin negativa preserva a altura visual) */
.pub-global-footer a:hover{color:var(--accent)}
.pub-footer-sep{opacity:.35}
.pub-visitors{display:inline-flex;align-items:center;gap:4px;opacity:.92;font-variant-numeric:tabular-nums}
.pub-visitors svg{opacity:.7}
@media(max-width:700px){.pub-topbar{grid-template-columns:auto auto;gap:8px;padding:9px 14px}.pub-nav{display:none}.pub-btn-primary span{display:none}.pub-mobile-nav-btn{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);cursor:pointer;color:var(--text)}}
@media(max-width:700px){.pub-nav.pub-nav-open{display:flex;flex-direction:column;align-items:stretch;position:fixed;inset:56px 0 0;background:var(--panel);border-top:1px solid var(--line);padding:16px 14px;z-index:50;overflow:auto;gap:6px}.pub-nav.pub-nav-open a{padding:13px 16px;border-radius:var(--r-sm);border-color:var(--line);background:var(--panel-2)}}

/* ── Área principal pública ── */
.pub-main{flex:1;padding:24px 20px;max-width:1320px;margin:0 auto;width:100%}
@media(max-width:700px){.pub-main{padding:16px 12px}}
/* alpha.1008 — a dock fixa (.calc-qdock, logado) cobria o rodapé do conteúdo: reserva folga só quando ela existe.
   !important p/ vencer o `.pub-main{padding:...!important}` do @media(max-width:700px) (linha ~11098). */
body:has(.calc-qdock) .pub-main{padding-bottom:84px!important}
/* alpha.1010 — .pub-main é GRID; filho com min-width:auto cresce até o min-content e estoura em QUALQUER
   largura (visto no comparador da wiki em ~745px). O fix do alpha.754 (10407) só valia no @media mobile — aqui
   fica INCONDICIONAL p/ as superfícies do cliente alinharem em toda resolução. No desktop é no-op (conteúdo cabe). */
.pub-main > *{min-width:0}

/* ── Abas da Calculadora ── */
/* alpha.409 — cabeçalho: título × subtítulo numa linha de base harmônica (flex) */
.calc-page-header{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:2px 20px;margin-bottom:22px}
.calc-page-header h1{margin:0;font-size:clamp(24px,4vw,38px);letter-spacing:-.05em;font-weight:950}
.calc-page-header p{margin:0;color:var(--muted);font-weight:700;max-width:60ch}
/* alpha.415 — menu de abas que se auto-alinha à resolução: linha única, rola quando não
   cabe, com FADE nas bordas (nunca corta uma aba "seca") e aba ativa sempre visível. */
.calc-tabs-bar{display:flex;flex-wrap:nowrap;align-items:center;gap:5px;margin-bottom:24px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-behavior:smooth}
.calc-tabs-bar::-webkit-scrollbar{display:none}
/* máscaras de fade controladas via JS (fade-left / fade-right) */
.calc-tabs-bar.fade-right{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 30px),transparent 100%);mask-image:linear-gradient(to right,#000 calc(100% - 30px),transparent 100%)}
.calc-tabs-bar.fade-left{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 30px);mask-image:linear-gradient(to right,transparent 0,#000 30px)}
.calc-tabs-bar.fade-both{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 30px,#000 calc(100% - 30px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 30px,#000 calc(100% - 30px),transparent 100%)}
/* alpha.424 — DESKTOP: o menu de abas QUEBRA em 2+ linhas e se ajusta à largura do monitor
   (em vez de rolar/cortar). No mobile continua linha única com rolagem + fade. */
@media (min-width:860px){
  .calc-tabs-bar{flex-wrap:wrap;overflow:visible;row-gap:7px}
  .calc-tabs-bar.fade-left,.calc-tabs-bar.fade-right,.calc-tabs-bar.fade-both{-webkit-mask-image:none;mask-image:none}
}
/* alpha.1005 — "arraste p/ ver mais": chevron animado clicável na borda direita da barra de abas, só quando há item à direita (mobile). Reusa o updateFade (has-more). */
.calc-tabs-wrap{position:relative}
.calc-tabs-cue{position:absolute;right:0;top:0;z-index:6;display:none;align-items:center;justify-content:flex-end;width:50px;padding-right:5px;border:0;background:linear-gradient(to right,transparent,var(--bg,#f4f6fb) 58%);color:var(--accent);cursor:pointer}
.calc-tabs-wrap.has-more .calc-tabs-cue{display:inline-flex;animation:zkTabsCue 1.5s ease-in-out infinite}
@keyframes zkTabsCue{0%,100%{transform:translateX(0);opacity:.68}50%{transform:translateX(4px);opacity:1}}
@media (min-width:860px){.calc-tabs-cue{display:none!important}}
@media (prefers-reduced-motion:reduce){.calc-tabs-wrap.has-more .calc-tabs-cue{animation:none;opacity:.9}}
/* alpha.429 — IA1: barra de GRUPOS (nível 1) da calculadora */
.calc-group-bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
/* alpha.480 — menu da Saúde (grupos + sub-abas) PERSISTENTE ao rolar. Escopo por ID p/ NÃO
   afetar o .calc-group-bar reusado no menu superior do ERP. --cgbh (altura do group-bar) vem do JS. */
#calcGroupBar{position:sticky;top:var(--topbar-h,56px);z-index:26;background:color-mix(in srgb,var(--bg) 92%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding-top:8px}
#calcTabsBar{position:sticky;top:calc(var(--topbar-h,56px) + var(--cgbh,56px));z-index:25;background:color-mix(in srgb,var(--bg) 92%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.calc-group-btn{display:inline-flex;align-items:center;gap:7px;padding:10px 16px;min-height:44px;box-sizing:border-box;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);color:var(--muted);font:inherit;font-weight:850;font-size:14px;cursor:pointer;transition:.13s ease}
.calc-group-btn:hover{color:var(--text);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.calc-group-btn.on{color:var(--accent-text,#1a1207);background:var(--accent);border-color:var(--accent);box-shadow:0 4px 14px color-mix(in srgb,var(--accent) 32%,transparent)} /* D4 (auditoria) — contraste melhor no tema gold */
.calc-group-btn svg{flex:0 0 auto}
@media(max-width:600px){.calc-group-btn{font-size:13px;padding:10px 12px;gap:6px}}

/* alpha.434 — Dock de Ações Rápidas: fixa, discreta, em todas as abas */
.calc-qdock{position:fixed;left:50%;transform:translateX(-50%);bottom:14px;z-index:1100;display:flex;gap:2px;padding:6px;border-radius:var(--r-md);background:color-mix(in srgb,var(--panel) 90%,transparent);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border:1px solid var(--line);box-shadow:0 8px 26px rgba(0,0,0,.16);max-width:calc(100vw - 100px);overflow-x:auto;scrollbar-width:none}
.calc-qdock::-webkit-scrollbar{display:none}
.calc-qa{display:inline-flex;flex-direction:column;align-items:center;gap:2px;padding:7px 11px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--muted);font:inherit;font-size:10.5px;font-weight:700;cursor:pointer;white-space:nowrap;transition:.12s ease}
.calc-qa svg{width:19px;height:19px;flex:0 0 auto}
.calc-qa:hover{color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
/* alpha.465 — o dock é filho direto de .main/.pub-main e herdava o cap de layout
   width:min(1280px,100%) (linhas ~14684/15877), ficando largo com os ícones
   encostados à esquerda. Força largura pelo conteúdo e centraliza (!important
   p/ vencer a regra body.has-universal-topbar .main > *). */
.calc-qdock{width:max-content!important;max-width:calc(100vw - 24px)!important;margin-left:0!important;margin-right:0!important;justify-content:center}
@media(max-width:600px){.calc-qdock{bottom:10px;padding:5px}.calc-qa{padding:6px 9px;font-size:9.5px}.calc-qa svg{width:18px;height:18px}}

/* alpha.411 — empty state elegante para métricas sem dado */
.calc-empty{font-style:italic;color:var(--muted);opacity:.6;font-weight:600;font-size:.78em;letter-spacing:.01em}
/* alpha.418 — popup de senha de PDF (exames protegidos), theme-safe */
.zk-pwd-overlay{position:fixed;inset:0;z-index:9999;background:rgba(8,15,30,.55);display:flex;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(2px)}
.zk-pwd-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius,16px);box-shadow:var(--shadow,0 18px 45px rgba(0,0,0,.25));padding:22px;width:100%;max-width:380px}
.zk-pwd-title{font-weight:900;font-size:16px;color:var(--text);margin-bottom:6px}
.zk-pwd-sub{font-size:13px;color:var(--muted);margin:0 0 14px;line-height:1.45}
.zk-pwd-input{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);color:var(--text);font-size:15px;outline:none;box-sizing:border-box}
.zk-pwd-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15)}
.zk-pwd-acts{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}

/* alpha.424 — Análise inteligente de medicamentos: chips de entrada + cards de resultado */
.med-ai-chips{display:flex;flex-wrap:wrap;gap:8px}
.med-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--accent) 12%,var(--panel-2));border:1px solid color-mix(in srgb,var(--accent) 26%,var(--line));font-size:13px;color:var(--text);font-weight:800} /* alpha.938 — peso 600→800 (alinha aos demais controles) */
.med-chip-x{border:0;background:transparent;color:var(--muted);font-size:16px;line-height:1;cursor:pointer;padding:0 2px;border-radius:var(--r-2xs)}
.med-chip-x:hover{color:var(--red)}
.med-ai-empty{color:var(--muted);font-size:13px;font-style:italic;margin:6px 0 0}
.med-ai-addrow{display:flex;gap:8px;margin-top:10px}
.med-ai-addrow input{flex:1;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);color:var(--text);font:inherit;font-size:14px}
.med-ai-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.medc-card{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:14px 16px;box-shadow:var(--shadow-sm)}
.medc-card.medc-wide{grid-column:1/-1}
.medc-summary{background:color-mix(in srgb,var(--accent) 7%,var(--panel-2));border-color:color-mix(in srgb,var(--accent) 24%,var(--line))}
.medc-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px;border-bottom:1px solid var(--line);padding-bottom:8px}
.medc-head strong{font-size:15px;font-weight:900;color:var(--text)}
.medc-class{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.medc-sec{margin-top:9px}
.medc-sec-l{display:block;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--accent);margin-bottom:2px}
.medc-sec p,.medc-p{margin:0;font-size:13px;line-height:1.5;color:var(--text)}
.medc-p{margin-top:2px}

/* alpha.424 — Arquiteto UI › aba Acesso */
.ua-access-hint{font-size:11.5px;color:var(--muted);margin:0 0 8px;line-height:1.4}
.ua-access-list{display:flex;flex-direction:column;gap:6px}
.ua-access-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;font-weight:600;color:var(--text)}
.ua-access-row .ua-select{width:auto;min-width:118px}
.ua-access-status{margin-top:8px;font-size:11px;min-height:14px}

/* alpha.427 — Aviso BETA (vermelho) + botão flutuante de reportar bug/sugestão + modal */
.zk-beta-banner{position:fixed;left:0;right:0;top:0;z-index:1200;display:flex;align-items:flex-start;gap:10px;padding:10px 16px;background:linear-gradient(90deg,#b91c1c,#dc2626);color:#fff;font-size:13px;line-height:1.45;box-shadow:0 2px 12px rgba(0,0,0,.2)}
.zk-beta-ic{font-size:16px;flex:0 0 auto;line-height:1.4}
.zk-beta-txt{flex:1;min-width:0}
.zk-beta-txt strong{font-weight:800}
.zk-beta-x{flex:0 0 auto;background:rgba(255,255,255,.18);border:0;color:#fff;width:26px;height:26px;border-radius:var(--r-xs);font-size:18px;line-height:1;cursor:pointer}
.zk-beta-x:hover{background:rgba(255,255,255,.34)}
@media(max-width:640px){.zk-beta-banner{font-size:12px;padding:9px 12px}}

.zk-bug-fab{position:fixed;right:18px;bottom:18px;z-index:1150;display:inline-flex;align-items:center;gap:7px;padding:11px 15px;border:0;border-radius:var(--r-pill);background:var(--accent);color:#fff;font:inherit;font-weight:800;font-size:13px;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.22);transition:transform .14s ease,box-shadow .14s ease}
.zk-bug-fab:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 10px 26px rgba(0,0,0,.28)}
.zk-bug-fab svg{flex:0 0 auto}
@media(max-width:640px){.zk-bug-fab span{display:none}.zk-bug-fab{padding:13px;right:14px;bottom:14px}}

.zk-beta-banner[hidden],.zk-bug-overlay[hidden]{display:none !important} /* alpha.432 — fix: hidden vencia o display:flex (modal/banner ficavam sempre abertos) */
.zk-bug-overlay{position:fixed;inset:0;z-index:1300;background:rgba(8,12,20,.55);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:16px}
.zk-bug-card{width:100%;max-width:440px;max-height:92vh;overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow);padding:18px 18px 14px}
.zk-bug-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.zk-bug-head strong{font-size:17px;font-weight:900;color:var(--text)}
.zk-bug-x{background:transparent;border:0;color:var(--muted);font-size:22px;line-height:1;cursor:pointer}
.zk-bug-tabs{display:flex;gap:8px;margin-bottom:12px}
.zk-bug-tab{flex:1;padding:9px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);color:var(--muted);font:inherit;font-weight:700;font-size:13px;cursor:pointer}
.zk-bug-tab.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--panel))}
.zk-bug-lbl{display:block;font-weight:700;font-size:13px;margin-bottom:6px;color:var(--text)}
.zk-bug-text{width:100%;box-sizing:border-box;padding:11px 13px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);color:var(--text);font:inherit;font-size:14px;resize:vertical}
.zk-bug-shotrow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;flex-wrap:wrap}
.zk-bug-check{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--text)}
.zk-bug-tool{font-size:11px;color:var(--muted);max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zk-bug-preview{margin-top:10px;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;max-height:200px}
.zk-bug-preview img{display:block;width:100%;height:auto}
.zk-bug-msgbox{margin-top:10px;font-size:13px;color:var(--accent);font-weight:600}
.zk-bug-acts{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}
.zk-bug-note{margin:10px 0 0;font-size:11px;color:var(--muted)}

.calc-tab-btn{padding:11px 16px;min-height:44px;box-sizing:border-box;border:none;background:transparent;color:var(--muted);font:inherit;font-weight:800;cursor:pointer;white-space:nowrap;transition:.13s ease;display:inline-flex;align-items:center;gap:8px;font-size:14px;border-radius:var(--r-sm);flex:0 0 auto}
.calc-tab-btn:hover{color:var(--text);background:color-mix(in srgb,var(--panel-2) 70%,transparent)}
.calc-tab-btn.active{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--panel));font-weight:800}
.calc-tab-btn .tab-lock{opacity:.5;font-size:12px}
.calc-tab-btn .tab-admin-only{opacity:.6;font-size:11px;filter:grayscale(.4)}
.calc-tab-panel{display:none}.calc-tab-panel.active{display:block}

/* ── CTA de login para abas protegidas ── */
.calc-lock-cta{display:grid;place-items:center;text-align:center;padding:56px 20px;gap:16px;color:var(--muted)}
.calc-lock-cta .lock-icon{width:56px;height:56px;border-radius:var(--r-lg);background:var(--panel-2);border:1px solid var(--line);display:grid;place-items:center;margin:0 auto;opacity:.6}
.calc-lock-cta h3{margin:0;font-size:22px;color:var(--text);font-weight:950}
.calc-lock-cta p{margin:0;max-width:380px;line-height:1.55;font-size:14px}

/* ── Grid da Calculadora de Dose ── */
.calc-dose-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:22px;align-items:start}
.calc-panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.calc-section{margin-bottom:24px}
.calc-section:last-child{margin-bottom:0}
.calc-section-hd{margin:0 0 10px}
.calc-section-hd h3{margin:0;font-size:16px;font-weight:950;color:var(--text)}
.calc-section-hd p{margin:3px 0 0;font-size:12px;color:var(--muted);font-weight:650}
.calc-preset-search{width:100%;min-height:38px;padding:8px 11px;border-radius:var(--r-sm);font-size:13px;margin-bottom:10px}
.calc-preset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px;margin-bottom:4px;max-height:300px;overflow-y:auto;scrollbar-width:thin;padding:2px}
/* alpha.902 — cards da calc com a MESMA estética dos cards da calc reversa (hover-lift + anel no ativo) */
.calc-preset-btn{position:relative;overflow:hidden;padding:14px 14px 13px;border:1px solid var(--line);border-radius:var(--r-md);background:linear-gradient(180deg,color-mix(in srgb,var(--cat-acc,var(--accent)) 5%,var(--panel-2)),var(--panel-2));cursor:pointer;text-align:left;font:inherit;color:var(--text);transition:all .2s ease;font-size:12px;line-height:1.3;box-shadow:0 2px 9px rgba(var(--shadow-rgb),.05)}
/* 0.2.0-alpha.18 — barra-accent no topo (cor da categoria via --cat-acc; produtos = accent do tema) */
.calc-preset-btn::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--cat-acc,var(--accent));opacity:.55;transition:.2s ease}
.calc-preset-btn:hover::before{opacity:1;height:4px}
.calc-preset-btn:hover{border-color:color-mix(in srgb,var(--cat-acc,var(--accent)) 45%,var(--line));background:linear-gradient(180deg,color-mix(in srgb,var(--cat-acc,var(--accent)) 10%,var(--panel-2)),var(--panel-2));transform:translateY(-3px) scale(1.02);box-shadow:0 14px 30px color-mix(in srgb,var(--cat-acc,var(--accent)) 22%,transparent)}
.calc-preset-btn:active{transform:scale(.97)}
.calc-preset-btn.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--panel));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent),0 6px 16px rgba(var(--accent-rgb),.12);font-weight:950}
.calc-preset-btn strong{display:block;font-size:13px;font-weight:950;margin-bottom:2px}
.calc-preset-btn small{color:var(--muted);font-size:11px}
/* alpha.1002 — cards de REFERÊNCIA (compostos do guia/wiki): dose de referência, sem frasco/mL. Marca sutil (🧬 + borda tracejada) p/ diferenciar dos produtos prontos. */
.calc-preset-ref{border-style:dashed}
.calc-preset-ref small{color:var(--accent);font-weight:800}
.calc-preset-ref strong::after{content:"·ref";font-size:9px;font-weight:800;color:var(--accent);opacity:.7;margin-left:5px;vertical-align:2px}
.calc-cat-ref strong::before{content:"🧬 "}
/* alpha.902 — card de CATEGORIA (abre as marcas: NNF) + voltar p/ categorias */
/* 0.2.0-alpha.18 — categoria com a SUA cor (tint + barra + contagem) → picker colorido/vibrante */
.calc-cat-card{background:linear-gradient(180deg,color-mix(in srgb,var(--cat-acc,var(--accent)) 11%,var(--panel)),var(--panel))}
.calc-cat-card::before{opacity:.9;height:4px}
.calc-cat-card strong{color:var(--text)}
.calc-cat-card small{color:var(--cat-acc,var(--accent));font-weight:850}
.calc-cat-back{background:transparent;border-style:dashed}
.calc-cat-back::before{display:none}
.calc-cat-back:hover{transform:none;box-shadow:none}
.calc-cat-back strong{color:var(--accent)}
/* alpha.902 — botão "Próximo" do passo Produto (alinhado à direita); pulsa de leve quando há marca pronta */
.calc-step0-row{display:none;justify-content:flex-end;margin-top:10px} /* só no wizard mobile (igual .calc-next-btn) */
.calc-step0-next.is-ready{animation:calcS0Pulse 1.3s ease-in-out 2}
@keyframes calcS0Pulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}50%{box-shadow:0 0 0 5px rgba(220,38,38,.16)}}
.calc-chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.calc-chip-lbl{cursor:pointer;display:inline-block}
.calc-chip-lbl input{display:none}
.calc-chip{display:inline-flex;align-items:center;padding:7px 14px;border:1px solid var(--line);border-radius:var(--r-pill);font-size:13px;font-weight:850;color:var(--muted);background:var(--panel-2);cursor:pointer;transition:.12s ease;white-space:nowrap}
.calc-chip-lbl input:checked+.calc-chip{background:var(--accent);border-color:var(--accent);color:var(--accent-text,#1a1207)}
.calc-chip:hover{border-color:rgba(var(--accent-rgb),.5);color:var(--text)}
.calc-custom-row{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.calc-custom-row input{max-width:150px;min-height:38px;padding:8px 11px;border-radius:var(--r-sm);font-size:13px}
.calc-custom-row .unit{color:var(--muted);font-weight:850;font-size:13px;white-space:nowrap}
/* alpha.900 — toggle mg/mcg (e afins) estilo SWITCH deslizante: um "thumb" desliza p/ a opção ativa.
   Genérico p/ 2 OU 3 botões via :has() — cobre .calc-dose-unit + .zk-seg. Substitui o segmentado de pílulas. */
.calc-dose-unit,.zk-seg{position:relative;display:inline-flex;align-items:stretch;padding:3px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);flex:0 0 auto;isolation:isolate} /* alpha.901 — raio igual aos chips (12px), menos arredondado que pílula */
.calc-dose-unit button,.zk-seg button{position:relative;z-index:1;flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--muted);font:inherit;font-weight:800;font-size:13px;min-height:32px;padding:0 16px;cursor:pointer;border-radius:var(--r-xs);white-space:nowrap;transition:color .18s ease}
.calc-dose-unit button:hover,.zk-seg button:hover{color:var(--text)}
.calc-dose-unit button.active,.zk-seg button.active{color:var(--accent)}
.calc-dose-unit::before,.zk-seg::before{content:'';position:absolute;z-index:0;top:3px;bottom:3px;left:3px;width:calc((100% - 6px)/2);border-radius:var(--r-xs);background:color-mix(in srgb,var(--accent) 18%,var(--panel));box-shadow:0 1px 2px rgba(0,0,0,.14),inset 0 0 0 1px color-mix(in srgb,var(--accent) 32%,transparent);transition:transform .22s cubic-bezier(.4,0,.2,1)}
.calc-dose-unit:has(button:nth-child(3))::before,.zk-seg:has(button:nth-child(3))::before{width:calc((100% - 6px)/3)} /* 3 botões → thumb 1/3 */
.calc-dose-unit:has(button:nth-child(2).active)::before,.zk-seg:has(button:nth-child(2).active)::before{transform:translateX(100%)}
.calc-dose-unit:has(button:nth-child(3).active)::before,.zk-seg:has(button:nth-child(3).active)::before{transform:translateX(200%)}
/* alpha.863 — card colapsável "Dicas de reconstituição" (themado, padrão dos cards da calc) */
.calc-recon-tips{margin:10px 0 4px;border:1px solid var(--line);border-radius:var(--r-lg);background:color-mix(in srgb,var(--panel-2) 55%,var(--panel));overflow:hidden}
.calc-recon-tips>summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;padding:12px 14px;font-weight:850;font-size:14px;color:var(--text)}
.calc-recon-tips>summary::-webkit-details-marker{display:none}
/* alpha.867 — Chrome novo usa ::marker (não só -webkit-details-marker); mata o triângulo default nos 3 cards */
.calc-recon-tips>summary::marker,.calc-blend>summary::marker,.calc-accum>summary::marker{content:"";font-size:0}
.calc-recon-tips>summary::after{content:"";width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin-left:auto;margin-right:4px;transition:transform .18s ease}
.calc-recon-tips[open]>summary::after{transform:rotate(225deg)}
.calc-recon-tips>summary .cr-ico{font-size:16px}
.calc-recon-tips ul{margin:0;padding:2px 16px 14px 34px;display:grid;gap:7px}
.calc-recon-tips li{color:var(--muted);font-size:13px;line-height:1.45}
.calc-recon-tips li::marker{color:var(--accent)}
/* alpha.864 — card Blend (mistura de 2-3 peptídeos no mesmo frasco) */
.calc-blend{margin:8px 0 4px;border:1px solid var(--line);border-radius:var(--r-lg);background:color-mix(in srgb,var(--panel-2) 55%,var(--panel));overflow:hidden}
.calc-blend>summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;padding:12px 14px;font-weight:850;font-size:14px;color:var(--text)}
.calc-blend>summary::-webkit-details-marker{display:none}
.calc-blend>summary::after{content:"";width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin-left:auto;margin-right:4px;transition:transform .18s ease}
.calc-blend[open]>summary::after{transform:rotate(225deg)}
.calc-blend>summary .cb-ico{font-size:16px}
.cb-body{padding:2px 14px 14px;display:grid;gap:12px}
.cb-hint{margin:0;color:var(--muted);font-size:12.5px;line-height:1.45}
.cb-shared{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.cb-field{display:grid;gap:4px;font-size:12px;font-weight:800;color:var(--muted)}
.cb-field input,.cb-field select{min-height:38px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:14px;font-weight:700}
.cb-peps{display:grid;gap:8px}
.cb-pep{display:grid;grid-template-columns:minmax(0,1fr) clamp(76px,22vw,110px) auto;gap:8px;align-items:center}/* alpha.1010 — campo mg escala com a largura (era 110px fixo / 90px <560); minmax(0,...) deixa o nome encolher sem estourar */
.cb-pep input{min-height:38px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:14px}
.cb-del{width:34px;height:34px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--muted);font-size:18px;line-height:1;cursor:pointer;transition:.12s}
.cb-del:hover{color:var(--danger,#e5484d);border-color:var(--danger,#e5484d)}
.cb-add{justify-self:start;border:1px dashed var(--line);border-radius:var(--r-pill);background:transparent;color:var(--accent);font-weight:850;font-size:13px;padding:7px 14px;cursor:pointer;transition:.12s}
.cb-add:hover{border-color:var(--accent);background:rgba(var(--accent-rgb),.08)}
.cb-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:2px}
.cb-table th{text-align:left;color:var(--muted);font-weight:800;font-size:11.5px;text-transform:uppercase;letter-spacing:.3px;padding:6px 8px;border-bottom:1px solid var(--line)}
.cb-table td{padding:7px 8px;border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent);color:var(--text)}
.cb-table td:nth-child(3){font-weight:850;color:var(--accent)}
.cb-sum{margin-top:8px;font-size:13px;color:var(--muted)}
.cb-sum b{color:var(--text)}
.cb-warn{color:var(--danger,#e5484d);font-weight:800}
/* alpha.1010 — .cb-pep virou fluido (clamp no campo mg); @media 560 removido */
/* alpha.1007 — autocomplete TEMÁTICO do Blend (substitui o <datalist> nativo, que o browser desenha no estilo do sistema e ignora o tema). Anexado ao body → herda os tokens do :root (tema atual). */
.cb-pac{z-index:400;max-height:min(300px,50vh);overflow-y:auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md,12px);box-shadow:0 16px 40px rgba(0,0,0,.22);padding:5px;scrollbar-width:thin}
.cb-pac[hidden]{display:none}
.cb-pac-item{display:block;width:100%;text-align:left;padding:9px 12px;border:0;border-radius:var(--r-sm,10px);background:transparent;color:var(--text);font:inherit;font-size:14px;font-weight:650;cursor:pointer;transition:background .1s ease,color .1s ease}
.cb-pac-item:hover,.cb-pac-item.on{background:color-mix(in srgb,var(--accent) 13%,var(--panel));color:var(--accent)}
/* alpha.891 — análise por IA do blend + alerta de incompatibilidade */
.cb-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.cb-act-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 15px;border:1px solid var(--accent);border-radius:var(--r-pill);background:color-mix(in srgb,var(--accent) 8%,var(--panel));color:var(--accent);font:inherit;font-weight:850;font-size:13px;cursor:pointer;transition:.13s ease}
.cb-act-btn:hover{background:var(--accent);color:#fff}
.cb-act-btn:disabled{opacity:.6;cursor:default}
.cb-ai[hidden]{display:none}
.cb-ai{margin-top:12px;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--r-md);background:var(--panel-2);padding:13px 15px}
.cb-ai.compat-bad{border-left-color:var(--danger,#e5484d)}
.cb-ai.compat-warn{border-left-color:var(--orange,#f97316)}
.cb-ai.compat-ok{border-left-color:var(--green,#16a34a)}
.cb-ai-loading,.cb-ai-note{font-size:13px;color:var(--muted)}
.cb-ai-note.err{color:var(--danger,#e5484d)}
.cb-ai-alert{display:flex;gap:8px;align-items:flex-start;margin:-2px -3px 11px;padding:11px 13px;border-radius:var(--r-sm);background:color-mix(in srgb,var(--danger,#e5484d) 13%,var(--panel));color:var(--danger,#e5484d);font-weight:850;font-size:13px;line-height:1.4;border:1px solid color-mix(in srgb,var(--danger,#e5484d) 35%,transparent)}
.cb-ai-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;flex-wrap:wrap}
.cb-ai-head strong{font-size:14px;font-weight:900;color:var(--text)}
.cb-ai-badge{font-size:11px;font-weight:850;padding:3px 9px;border-radius:var(--r-pill);white-space:nowrap}
.cb-ai-badge.ok{background:color-mix(in srgb,var(--green,#16a34a) 16%,transparent);color:var(--green,#16a34a)}
.cb-ai-badge.warn{background:color-mix(in srgb,var(--orange,#f97316) 18%,transparent);color:var(--orange,#f97316)}
.cb-ai-badge.bad{background:color-mix(in srgb,var(--danger,#e5484d) 16%,transparent);color:var(--danger,#e5484d)}
.cb-ai p{margin:0 0 8px;font-size:13px;line-height:1.5;color:var(--text)}
.cb-ai-note2{color:var(--muted)!important;font-weight:600}
.cb-ai-cau{margin:0 0 8px}
.cb-ai-cau-t{display:block;font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-bottom:3px}
.cb-ai-cau ul{margin:0;padding-left:18px}
.cb-ai-cau li{font-size:12.5px;line-height:1.5;color:var(--text);margin-bottom:2px}
.cb-ai-cav{font-style:italic;color:var(--muted)!important;font-size:12px!important}
.cb-ai-disc{margin:8px 0 0!important;font-size:11px!important;color:var(--muted)!important;opacity:.85}
/* alpha.865 — card Acúmulo/meia-vida */
.calc-accum{margin:8px 0 4px;border:1px solid var(--line);border-radius:var(--r-lg);background:color-mix(in srgb,var(--panel-2) 55%,var(--panel));overflow:hidden}
.calc-accum>summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;padding:12px 14px;font-weight:850;font-size:14px;color:var(--text)}
.calc-accum>summary::-webkit-details-marker{display:none}
.calc-accum>summary::after{content:"";width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin-left:auto;margin-right:4px;transition:transform .18s ease}
.calc-accum[open]>summary::after{transform:rotate(225deg)}
.calc-accum>summary .ac-ico{font-size:16px}
.ac-body{padding:2px 14px 14px;display:grid;gap:12px}
.ac-hint{margin:0;color:var(--muted);font-size:12.5px;line-height:1.45}
/* alpha.887 — botão + popup de seleção de peptídeo (preenche meia-vida) */
.ac-pickrow{margin:-4px 0 0}
.ac-pick-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid var(--accent);border-radius:var(--r-pill,999px);background:color-mix(in srgb,var(--accent) 8%,var(--panel));color:var(--accent);font:inherit;font-weight:850;font-size:12.5px;cursor:pointer;transition:.13s ease}
.ac-pick-btn:hover{background:var(--accent);color:#fff}
.ac-pick-pop{position:fixed;inset:0;z-index:120000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.42)}
.ac-pick-pop[hidden]{display:none}
.ac-pick-modal{width:100%;max-width:440px;max-height:80dvh;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg,16px);box-shadow:0 24px 64px rgba(0,0,0,.34);overflow:hidden}
.ac-pick-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;border-bottom:1px solid var(--line)}
.ac-pick-head strong{font-size:15px;font-weight:900;color:var(--text)}
.ac-pick-x{background:transparent;border:0;color:var(--muted);font-size:18px;line-height:1;cursor:pointer;padding:4px 6px;border-radius:8px}
.ac-pick-x:hover{background:var(--panel-2);color:var(--text)}
.ac-pick-srch{display:block;padding:11px 14px 6px}
.ac-pick-srch input{width:100%;box-sizing:border-box;padding:10px 13px;border:1px solid var(--line);border-radius:var(--r-sm,10px);background:var(--panel-2);color:var(--text);font:inherit;font-size:14px}
.ac-pick-list{overflow-y:auto;padding:6px 10px 12px;display:grid;gap:6px}
.ac-pick-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:11px 12px;border:1px solid var(--line);border-radius:var(--r-sm,10px);background:var(--panel-2);color:var(--text);font:inherit;cursor:pointer;transition:.12s ease}
.ac-pick-item:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel-2))}
.ac-pick-dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.ac-pick-n{font-weight:850;font-size:14px;flex:1 1 auto}
.ac-pick-hl{font-size:12px;font-weight:750;color:var(--muted);white-space:nowrap}
.ac-pick-empty{margin:14px 6px;color:var(--muted);font-size:13px;text-align:center}
.ac-inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.ac-field{display:grid;gap:4px;font-size:12px;font-weight:800;color:var(--muted)}
.ac-uni{display:flex;gap:7px;align-items:stretch}
.ac-uni input{flex:1 1 auto;min-width:0;min-height:38px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:14px;font-weight:700}
/* alpha.879 — segmented pill themado (substitui <select> nativo que não pegava o tema; seleção azul do SO destoava) */
/* alpha.900 — base do .zk-seg migrada p/ o switch deslizante unificado (junto de .calc-dose-unit, acima).
   Aqui ficam só os ajustes por contexto (largura/padding); o padding vertical saiu (o switch centra via min-height). */
.cb-field .zk-seg{width:100%}
.cb-field .zk-seg button{padding:0 6px}
.ac-uni .zk-seg button{padding:0 11px}
.ac-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.ac-stat{display:grid;gap:2px;padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel)}
.ac-k{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}
.ac-k .ac-tip{margin-left:auto} /* alpha.890 — ⓘ no canto do rótulo */
.ac-v{font-size:17px;font-weight:850;color:var(--accent)}
.ac-chart{position:relative;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel);padding:8px 8px 4px 42px} /* alpha.890 — espaço à esquerda p/ o eixo Y */
.ac-svg{width:100%;height:120px;display:block}
.ac-line{fill:none;stroke:var(--accent);stroke-width:2;vector-effect:non-scaling-stroke}
.ac-plateau{stroke:var(--muted);stroke-width:1;stroke-dasharray:4 4;opacity:.5;vector-effect:non-scaling-stroke}
.ac-cap{display:block;text-align:left;font-size:11px;margin-top:4px;line-height:1.4}
/* alpha.890 — eixo Y (mg) + rótulo do platô + bloco "Como funciona" */
.ac-yaxis{position:absolute;left:6px;top:8px;height:120px;width:34px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;font-size:10px;font-weight:800;color:var(--muted);pointer-events:none}
.ac-plat-lbl{position:absolute;top:9px;right:10px;font-size:10px;font-weight:850;color:var(--muted);background:color-mix(in srgb,var(--panel) 78%,transparent);padding:1px 5px;border-radius:6px;pointer-events:none}
.ac-how{margin-top:2px;border:1px solid var(--line);border-radius:var(--r-md);background:color-mix(in srgb,var(--accent) 4%,var(--panel))}
.ac-how>summary{display:flex;align-items:center;gap:7px;cursor:pointer;list-style:none;padding:10px 12px;font-weight:850;font-size:13px;color:var(--text)}
.ac-how>summary::-webkit-details-marker{display:none}
.ac-how>summary::after{content:"";width:6px;height:6px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin-left:auto;transition:transform .18s ease}
.ac-how[open]>summary::after{transform:rotate(225deg)}
.ac-how-ico{color:var(--accent);font-size:15px;line-height:1}
.ac-how-body{padding:0 13px 12px}
.ac-how-body p{margin:0 0 8px;font-size:12.5px;line-height:1.5;color:var(--muted)}
.ac-how-body p:last-child{margin-bottom:0}
.ac-how-body b{color:var(--text)}
/* alpha.877 — card % gordura por 7 dobras (Jackson-Pollock) */
.calc-bf7{margin:10px 0 4px;border:1px solid var(--line);border-radius:var(--r-lg);background:color-mix(in srgb,var(--panel-2) 55%,var(--panel));overflow:hidden}
.calc-bf7>summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;padding:12px 14px;font-weight:850;font-size:14px;color:var(--text)}
.calc-bf7>summary::-webkit-details-marker{display:none}
.calc-bf7>summary::marker{content:"";font-size:0}
.calc-bf7>summary::after{content:"";width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin-left:auto;margin-right:4px;transition:transform .18s ease}
.calc-bf7[open]>summary::after{transform:rotate(225deg)}
.calc-bf7>summary .bf7-ico{font-size:16px}
.bf7-body{padding:2px 14px 14px;display:grid;gap:12px}
.bf7-hint{margin:0;color:var(--muted);font-size:12.5px;line-height:1.45}
.bf7-top{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:10px}
.bf7-field{display:grid;gap:4px;font-size:12px;font-weight:800;color:var(--muted)}
.bf7-field input{min-height:38px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:14px;font-weight:700}
.bf7-sex{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-pill);overflow:hidden;background:var(--panel-2)}
.bf7-sex button{border:0;background:transparent;color:var(--muted);font:inherit;font-weight:850;font-size:13px;padding:8px 12px;min-height:38px;cursor:pointer;flex:1}
.bf7-sex button.active{background:var(--accent);color:var(--accent-text,#1a1207)}
.bf7-folds{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:9px}
.bf7-fold{display:grid;gap:4px;font-size:11.5px;font-weight:800;color:var(--muted)}
.bf7-inp{display:flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);overflow:hidden}
.bf7-inp input{flex:1;min-width:0;border:0;background:transparent;color:var(--text);font-size:14px;font-weight:700;padding:8px 4px 8px 10px;outline:none}
.bf7-inp i{font-style:normal;color:var(--muted);font-size:11px;padding:0 9px 0 2px}
.bf7-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(108px,1fr));gap:8px}
.bf7-stat{display:grid;gap:2px;padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel)}
.bf7-k{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}
.bf7-v{font-size:16px;font-weight:850;color:var(--text)}
.bf7-v b{color:var(--accent);font-size:18px}
.bf7-class{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-radius:var(--r-md);font-size:13px;font-weight:850}
.bf7-class span{color:inherit;opacity:.8;font-weight:800;text-transform:uppercase;font-size:11px;letter-spacing:.3px}
.bf7-class strong{font-size:15px}
.bf7-athlete{background:rgba(34,197,94,.13);color:#16a34a}
.bf7-fit{background:rgba(59,130,246,.13);color:#2563eb}
.bf7-acc{background:rgba(234,179,8,.16);color:#b45309}
.bf7-high{background:rgba(239,68,68,.13);color:#dc2626}
@media(max-width:560px){.bf7-top{grid-template-columns:1fr 1fr}.bf7-field:first-child{grid-column:1/-1}}
/* alpha.458 — botão "Próximo" ao lado do campo de valor personalizado.
   Substitui o auto-avanço do wizard: o usuário escolhe o valor (chip ou
   digitado) e toca aqui. Só aparece no wizard mobile (escondido no desktop,
   onde todos os passos já ficam visíveis). Pulsa de leve no passo ativo. */
.calc-next-btn{display:none;align-items:center;gap:6px;margin-left:auto;padding:9px 15px;border-radius:var(--r-pill);border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));background:var(--panel-2);color:var(--text);font-size:14px;font-weight:900;line-height:1;cursor:pointer;white-space:nowrap;transition:transform .12s ease,box-shadow .2s ease,border-color .2s ease;-webkit-tap-highlight-color:transparent}
.calc-next-btn svg{color:var(--red,#dc2626);flex-shrink:0}
.calc-next-btn:hover{border-color:var(--accent)}
.calc-next-btn:active{transform:scale(.96)}
@keyframes calcNextPulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}50%{box-shadow:0 0 0 4px rgba(220,38,38,.13)}}
@keyframes calcNextArrow{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}
/* Resultado */
.calc-result-panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);position:sticky;top:70px;max-height:calc(100vh - 84px);overflow-y:auto} /* alpha.1065 — sticky mais alto que a viewport cortava o rodapé (Registrar/Crie conta) no desktop; limita a altura + scroll interno */
.calc-result-big{font-size:54px;font-weight:950;letter-spacing:-.05em;line-height:1;color:var(--accent);text-align:center;margin:8px 0 4px}
.calc-result-caption{text-align:center;color:var(--muted);font-weight:700;font-size:13px;line-height:1.5;margin:0 0 16px}
.calc-result-alert{border-radius:var(--r-sm);padding:10px 14px;background:rgba(220,38,38,.1);color:var(--red);font-weight:850;font-size:13px;margin-bottom:14px;display:none}
.calc-result-alert.visible{display:block}
/* Duração do frasco — alpha.119 */
.calc-duration{display:flex;align-items:center;justify-content:center;gap:12px;padding:10px 14px;margin:10px 0 14px;border-radius:var(--r-sm);background:color-mix(in srgb,var(--accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--accent) 22%,transparent)}
.calc-dur-item{display:flex;flex-direction:column;align-items:center;gap:1px}
.calc-dur-item strong{font-size:22px;font-weight:850;color:var(--accent);line-height:1}
.calc-dur-item span{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
.calc-dur-dot{color:var(--muted);font-size:16px;opacity:.4}
/* Frequência de uso — alpha.119 */
.calc-freq-group{margin:14px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.calc-freq-label{font-size:10.5px;font-weight:850;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-bottom:8px}
.calc-freq-chips{display:flex;flex-wrap:wrap;gap:6px}
/* ════════════════════════════════════════════════════════════════
   alpha.201 — Seringa visual (substitui a barra de progresso)
   ════════════════════════════════════════════════════════════════ */
.calc-syringe-wrap{margin:18px 0 14px;padding:0 6px}
.calc-syringe{
  position:relative;
  display:flex;
  align-items:center;
  height:46px;
  margin:0 0 6px;
}

/* Êmbolo (haste + apoio do dedo) à esquerda */
.cs-plunger{
  position:relative;
  width:14px;height:14px;
  flex-shrink:0;
  background:var(--muted);
  border-radius:3px 0 0 3px;
  opacity:.55;
}
.cs-plunger .cs-thumb{
  position:absolute;left:-7px;top:50%;transform:translateY(-50%);
  width:7px;height:22px;border-radius:3px;
  background:var(--muted);opacity:.7;
}
.cs-plunger::after{
  content:'';position:absolute;right:-6px;top:50%;transform:translateY(-50%);
  width:6px;height:8px;background:var(--muted);opacity:.55;
}

/* Corpo (barril) da seringa */
.cs-barrel{
  position:relative;
  flex:1;
  height:30px;
  background:var(--panel-2);
  border:1.5px solid var(--line-strong, var(--line));
  border-radius:5px 3px 3px 5px;
  overflow:hidden;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.06);
}

/* Líquido dentro do barril (centralizado verticalmente) */
/* alpha.259 — Liquido animado dentro da seringa.
   Cor segue o tema (--cs-color = --accent); GHK-Cu vira azul. */
.calc-syringe{ --cs-color: var(--accent); }
.calc-syringe.cs-ghkcu{ --cs-color: #2563eb; }
.cs-liquid{
  position:absolute;
  left:0;top:50%;transform:translateY(-50%);
  height:100%;
  width:0%;
  overflow:hidden;
  border-right:2px solid color-mix(in srgb,var(--cs-color) 60%,#000);
  transition:width .3s cubic-bezier(.4,0,.2,1);
  /* gradiente com brilho que escorre (simula liquido em movimento) */
  background:linear-gradient(90deg,
    color-mix(in srgb,var(--cs-color) 72%, #fff) 0%,
    var(--cs-color) 30%,
    color-mix(in srgb,var(--cs-color) 85%, #fff) 50%,
    var(--cs-color) 70%,
    color-mix(in srgb,var(--cs-color) 72%, #fff) 100%);
  background-size:220% 100%;
  animation:cs-flow 3s linear infinite;
}
/* Brilho superior (menisco/reflexo do liquido) */
.cs-liquid::before{
  content:'';position:absolute;left:0;right:0;top:0;height:38%;
  background:linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0));
  pointer-events:none;
}
/* Bolhinhas subindo continuamente dentro do liquido.
   O ::after e' duas vezes mais alto que o liquido (height:200%) e sobe
   em loop: ao deslizar 50% pra cima, o padrao se repete sem emenda. */
.cs-liquid::after{
  content:'';position:absolute;left:0;right:0;top:0;
  height:200%;pointer-events:none;
  background-image:
    radial-gradient(circle 2.5px at 15% 90%, rgba(255,255,255,.6), transparent 60%),
    radial-gradient(circle 1.8px at 38% 78%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(circle 2.2px at 62% 84%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(circle 1.5px at 80% 72%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(circle 2px at 92% 88%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(circle 2px at 24% 40%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(circle 1.6px at 50% 33%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(circle 2.4px at 72% 44%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(circle 1.4px at 88% 30%, rgba(255,255,255,.5), transparent 60%);
  background-repeat:no-repeat;
  will-change:transform;
  animation:cs-bubbles 3.2s linear infinite;
}
@keyframes cs-flow{
  0%{background-position:0% 0}
  100%{background-position:220% 0}
}
/* Sobe metade da propria altura (= 100% do liquido) e reinicia: loop perfeito */
@keyframes cs-bubbles{
  0%{transform:translateY(0)}
  100%{transform:translateY(-50%)}
}
/* alpha.435 — a animação do líquido da seringa é mantida mesmo com "reduzir movimento"
   (micro-interação-assinatura do produto, decisão do dono). Demais animações seguem respeitando a preferência. */

/* Escala (ticks) sobre o barril */
.cs-ticks{position:absolute;inset:0;pointer-events:none}
.cs-tick{position:absolute;top:0;transform:translateX(-50%)}
.cs-tick-major{height:100%;width:1.5px;background:color-mix(in srgb,var(--text) 35%,transparent)}
.cs-tick-major i{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-size:9px;font-weight:800;font-style:normal;color:var(--text);
  background:color-mix(in srgb,var(--panel-2) 88%,transparent);
  padding:0 2px;border-radius:2px;line-height:1.3;
}
.cs-tick-minor{height:38%;top:0;width:1px;background:color-mix(in srgb,var(--text) 18%,transparent)}
/* alpha.1008 — rótulos das pontas da régua ancoram p/ dentro (o de 100% cortava na borda direita) */
.cs-tick-major.cs-edge-l i{transform:translate(0,-50%)}
.cs-tick-major.cs-edge-r i{transform:translate(-100%,-50%)}

/* Bico + agulha à direita */
.cs-tip{
  width:0;height:0;flex-shrink:0;
  border-top:7px solid transparent;
  border-bottom:7px solid transparent;
  border-left:8px solid var(--line-strong, var(--muted));
}
.cs-needle{
  width:26px;height:2px;flex-shrink:0;
  background:var(--muted);opacity:.6;border-radius:0 2px 2px 0;
}

/* Leitura abaixo da seringa */
.calc-syringe-readout{
  display:flex;align-items:baseline;justify-content:center;gap:6px;
  font-size:12px;color:var(--muted);font-weight:700;
}
.cs-readout-pct{font-size:15px;font-weight:900;color:var(--accent)}
.cs-readout-cap strong{color:var(--text);font-weight:800}

/* Estado de overflow (dose maior que a seringa) */
.calc-overflow .cs-liquid{
  background:linear-gradient(90deg, var(--red), color-mix(in srgb,var(--red) 70%,#000)) !important;
  border-right-color:var(--red);
}
.calc-overflow .cs-readout-pct{color:var(--red)}

/* Mantém compat com o label antigo, se algum resquício existir */
.calc-meter-label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);font-weight:750;margin-top:4px}
.calc-details{display:grid;gap:5px;margin-top:14px;font-size:13px}
.calc-detail-row{display:flex;justify-content:space-between;align-items:center;padding:8px 11px;background:var(--panel-2);border-radius:var(--r-sm)}
.calc-detail-row span{color:var(--muted);font-weight:750}
.calc-detail-row strong{font-weight:950;font-size:14px}
.calc-result-actions{display:grid;gap:8px;margin-top:16px}
.calc-result-actions .btn{justify-content:center}
/* Histórico no painel de dose */
.calc-history-block{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.calc-history-block h4{margin:0 0 10px;font-size:13px;color:var(--muted);font-weight:850;text-transform:uppercase;letter-spacing:.05em}
.calc-hist-row{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;background:var(--panel-2);border-radius:var(--r-sm);margin-bottom:6px;font-size:12px;cursor:pointer;transition:.12s ease;border:1px solid transparent}
.calc-hist-row:hover{border-color:rgba(var(--accent-rgb),.3);background:color-mix(in srgb,var(--accent) 6%,transparent)}
.calc-hist-row strong{font-weight:900;font-size:13px}
.calc-hist-row span{color:var(--muted)}
.calc-hist-result{font-weight:950;color:var(--accent);white-space:nowrap}
/* Módulo Corpo */
.body-module-grid{display:grid;grid-template-columns:1fr;gap:22px;align-items:start}/* alpha.387 — form virou modal; histórico ocupa largura total */
.body-form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.body-results-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}
.body-result-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);padding:16px;text-align:center;box-shadow:var(--shadow-soft)}
.body-result-card strong{display:block;font-size:30px;font-weight:950;letter-spacing:-.045em;color:var(--accent);line-height:1.1}
.body-result-card em{display:block;font-style:normal;font-size:11px;color:var(--muted);font-weight:750;margin-top:4px;text-transform:uppercase;letter-spacing:.05em}
.body-hist-table{width:100%;border-collapse:collapse;font-size:13px}
.body-hist-table th{text-align:left;padding:8px 10px;color:var(--muted);font-weight:750;font-size:11px;text-transform:uppercase;border-bottom:1px solid var(--line)}
.body-hist-table td{padding:9px 10px;border-bottom:1px solid var(--line)}
.body-hist-table tr:last-child td{border-bottom:0}
/* Módulo Exames — alpha.631: .exam-module e .exam-ai-box consolidados nas defs canônicas mais abaixo (eram duplicados conflitantes; a 2ª vencia por cascata) */
.exam-hist-list{display:grid;gap:10px;margin-top:14px}
.exam-hist-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:14px;cursor:pointer;transition:.12s ease}
.exam-hist-card:hover{border-color:rgba(var(--accent-rgb),.35)}
.exam-hist-card strong{display:block;font-size:14px;font-weight:900}
.exam-hist-card small{color:var(--muted);font-size:12px}
/* Módulo Medicamentos */
.med-module{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
.med-list{display:grid;gap:10px}
.med-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);padding:16px;box-shadow:var(--shadow-soft)}
.med-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:8px}
.med-card-head h4{margin:0;font-size:15px;font-weight:950}
.med-card-head small{color:var(--muted);font-size:12px;white-space:nowrap}
.med-card-meta{font-size:12px;color:var(--muted);margin-bottom:12px}
.med-log-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--r-pill);background:var(--accent);color:var(--accent-text,#1a1207);border:none;font:inherit;font-weight:850;cursor:pointer;font-size:12px;transition:.12s ease}
.med-log-btn:hover{filter:brightness(1.1)}
.med-badge{display:inline-flex;align-items:center;padding:3px 9px;border-radius:var(--r-pill);font-size:11px;font-weight:850}
.med-badge.ativo{background:rgba(22,163,74,.12);color:var(--green)}
.med-badge.pausado{background:rgba(245,158,11,.12);color:#b45309}
.med-badge.encerrado{background:rgba(100,116,139,.12);color:var(--muted)}
/* Dose log recente */
.dose-log-list{display:grid;gap:7px;margin-top:10px}
.dose-log-item{display:flex;justify-content:space-between;align-items:center;padding:8px 11px;background:var(--panel-2);border-radius:var(--r-sm);font-size:12px}
.dose-log-item strong{font-weight:900}
.dose-log-item span{color:var(--muted)}
@media(max-width:900px){.calc-dose-grid{grid-template-columns:1fr}.calc-result-panel{position:static}.body-module-grid{grid-template-columns:1fr}.body-form-grid{grid-template-columns:1fr 1fr}.body-results-row{grid-template-columns:1fr 1fr}.med-module{grid-template-columns:1fr}}
@media(max-width:600px){.body-form-grid{grid-template-columns:1fr}.body-results-row{grid-template-columns:1fr 1fr}.calc-preset-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}.calc-tab-btn{padding:12px 14px;min-height:46px;font-size:13px}}

/* ── User chip (topbar pública — logado) ── */
.pub-user-chip{display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;border-radius:var(--r-pill);background:rgba(var(--accent-rgb),.09);border:1px solid rgba(var(--accent-rgb),.18);color:var(--text);text-decoration:none;font-size:13px;font-weight:700;transition:.14s ease;white-space:nowrap}
.pub-user-chip:hover{background:rgba(var(--accent-rgb),.15);border-color:rgba(var(--accent-rgb),.3)}
.pub-user-avatar{width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;flex-shrink:0}
.pub-user-name{max-width:80px;overflow:hidden;text-overflow:ellipsis}
@media(max-width:600px){.pub-user-name{display:none}}

/* ════════════════════════════════════════════════════════════
   Calculadora — Wizard mobile + auto-advance (alpha.85)
   ════════════════════════════════════════════════════════════ */

/* Step headers */
.calc-step-hd{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.calc-step-num{width:28px;height:28px;border-radius:50%;background:rgba(var(--accent-rgb),.12);color:var(--accent);font-size:13px;font-weight:900;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.2s ease}
.calc-step-num svg{display:none}
.calc-step-hd h3{margin:0 0 2px;font-size:15px;font-weight:950}
.calc-step-hd p{margin:0;font-size:12px;color:var(--muted);line-height:1.45}

/* Categoria label nos presets */
.calc-cat-label{grid-column:1/-1;font-size:11px;color:var(--muted);font-weight:850;text-transform:uppercase;letter-spacing:.06em;margin-top:8px;margin-bottom:2px}

/* Barra de progresso wizard — oculta em desktop */
.calc-wizard-progress{display:none}

/* ── MOBILE: wizard step-a-step ── */
@media(max-width:768px){
  /* A grade de dose passa a ser coluna única */
  .calc-dose-grid{grid-template-columns:1fr!important;gap:0!important}
  .calc-result-panel{position:static!important;border-radius:0 0 var(--radius) var(--radius);margin-top:0}

  /* Wizard: painel sem padding interno extra */
  .calc-wizard{padding:0!important;background:none!important;box-shadow:none!important;border:none!important;gap:0!important}

  /* Steps */
  .calc-step{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);margin:0 0 8px;padding:16px;transition:border-color .2s,box-shadow .2s;overflow:hidden}

  /* Step inativo — colapsa o conteúdo, mostra só o header */
  .calc-step.wiz-locked .calc-chips,
  .calc-step.wiz-locked .calc-custom-row,
  .calc-step.wiz-locked .calc-preset-grid,
  .calc-step.wiz-locked .calc-preset-search{display:none}
  .calc-step.wiz-locked .calc-step-num{background:rgba(var(--accent-rgb),.06);color:var(--muted)}
  .calc-step.wiz-locked .calc-step-hd{opacity:.55;cursor:default;margin-bottom:0}

  /* Step concluído — mostra apenas o header com checkmark */
  .calc-step.wiz-done .calc-chips,
  .calc-step.wiz-done .calc-custom-row,
  .calc-step.wiz-done .calc-preset-grid,
  .calc-step.wiz-done .calc-preset-search{display:none}
  .calc-step.wiz-done .calc-step-hd{margin-bottom:0}
  .calc-step.wiz-done .calc-step-num{background:rgba(22,163,74,.12);color:var(--green,#16a34a)}
  .calc-step.wiz-done .calc-step-num::after{content:'✓';font-size:13px;font-weight:900}

  /* Step ativo */
  .calc-step.wiz-active{border-color:rgba(var(--accent-rgb),.4);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.08)}
  .calc-step.wiz-active .calc-step-num{background:var(--accent);color:#fff;font-weight:900}

  /* Chips maiores em mobile */
  .calc-chip{min-width:56px;padding:10px 14px;font-size:15px;font-weight:800}
  .calc-chips{gap:8px;flex-wrap:wrap}

  /* Preset buttons maiores */
  .calc-preset-btn{padding:12px 14px}
  .calc-preset-btn strong{font-size:14px}

  /* Campo custom maior — flexível pra o botão "Próximo" caber AO LADO mesmo
     em telas estreitas (~320px), sem quebrar para a linha de baixo. */
  .calc-custom-row input{font-size:16px;padding:10px 12px;flex:1 1 90px;max-width:none}

  /* alpha.458 — botão "Próximo" visível no wizard; pulso leve e discreto
     só no passo ATIVO, para guiar quem usa valores personalizados. */
  .calc-next-btn{display:inline-flex}
  .calc-step0-row{display:flex} /* alpha.902 — Próximo do passo Produto só no wizard mobile */
  .calc-step.wiz-active .calc-next-btn{animation:calcNextPulse 1.8s ease-in-out infinite}
  .calc-step.wiz-active .calc-next-btn svg{animation:calcNextArrow 1.8s ease-in-out infinite}

  /* Barra de progresso wizard */
  .calc-wizard-progress{display:block;padding:4px 0 8px}
  .calc-wiz-bar{height:4px;border-radius:var(--r-pill);background:rgba(var(--accent-rgb),.12);margin-bottom:10px;overflow:hidden}
  .calc-wiz-fill{height:100%;border-radius:var(--r-pill);background:var(--accent);transition:width .3s ease}
  .calc-wiz-steps{display:flex;gap:8px;justify-content:center}
  .wiz-dot{width:8px;height:8px;border-radius:50%;border:none;padding:0;background:rgba(var(--accent-rgb),.18);cursor:pointer;transition:.2s ease;flex-shrink:0}
  .wiz-dot.active{background:var(--accent);transform:scale(1.35)}
  .wiz-dot.done{background:rgba(var(--accent-rgb),.5)}

  /* Resultado — full width após os steps */
  .calc-result-panel{border-radius:var(--radius)!important;margin-top:8px}

  /* Tabs da calculadora — scroll horizontal */
  .calc-tabs-bar{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:4px;padding-bottom:2px}
  .calc-tabs-bar::-webkit-scrollbar{display:none}
  .calc-tab-btn{white-space:nowrap;flex-shrink:0;padding:10px 14px;font-size:13px}

  /* Header da calc menor em mobile */
  .calc-page-header{padding:16px 0 8px}
  .calc-page-header h1{font-size:22px}

  /* Lock CTAs mais compactos */
  .calc-lock-cta{padding:32px 20px}
}

/* ════════════════════════════════════════════════════════════
   Calculadora — Anel dourado + tela vermelha (alpha.86)
   ════════════════════════════════════════════════════════════ */

/* ── Anel dourado em torno do resultado ── */
.calc-result-ring{
  display:flex;align-items:center;justify-content:center;
  width:160px;height:160px;border-radius:50%;
  margin:0 auto 16px;
  background:conic-gradient(var(--accent) 0deg, rgba(var(--accent-rgb),.15) 360deg);
  padding:6px;
  box-shadow:0 0 0 1px rgba(var(--accent-rgb),.25), 0 0 28px rgba(var(--accent-rgb),.18);
  transition:background .4s ease, box-shadow .4s ease;
  position:relative;
}
.calc-result-ring::before{
  content:'';position:absolute;inset:6px;border-radius:50%;
  background:var(--panel);z-index:0;
  transition:background .4s ease;
}
.calc-result-big{
  position:relative;z-index:1;
  font-size:42px;font-weight:950;letter-spacing:-.05em;line-height:1;
  color:var(--accent);text-align:center;margin:0;
  transition:color .3s ease;
}

/* Estado vazio — anel tracejado sutil */
.calc-result-ring:not(.calc-ring-active){
  background:none;
  border:2.5px dashed rgba(var(--accent-rgb),.22);
  box-shadow:none;
  padding:0;
}
.calc-result-ring:not(.calc-ring-active) .calc-result-big{color:var(--muted);font-size:36px}

/* Estado com valor — anel animado */
.calc-result-ring.calc-ring-active{
  animation:ringPulse 2.4s ease-in-out infinite;
}
@keyframes ringPulse{
  0%,100%{box-shadow:0 0 0 2px rgba(var(--accent-rgb),.3), 0 0 28px rgba(var(--accent-rgb),.18)}
  50%{box-shadow:0 0 0 5px rgba(var(--accent-rgb),.15), 0 0 44px rgba(var(--accent-rgb),.28)}
}

/* ── Estado de overflow: TELA VERMELHA ── */
/* Overlay vermelho sobre o tab inteiro */
.calc-tab-overflow{
  position:relative;
}
.calc-tab-overflow::after{
  content:'';
  position:fixed;inset:0;
  background:rgba(220,38,38,.08);
  pointer-events:none;z-index:10;
  animation:redFlash .5s ease;
}
@keyframes redFlash{
  0%{background:rgba(220,38,38,.28)}
  100%{background:rgba(220,38,38,.08)}
}

/* Painel de resultado em overflow */
.calc-result-panel.calc-overflow{
  border-color:rgba(220,38,38,.5);
  box-shadow:0 0 0 3px rgba(220,38,38,.12), 0 0 32px rgba(220,38,38,.15);
  animation:overflowPanelPulse 1.6s ease-in-out infinite;
}
@keyframes overflowPanelPulse{
  0%,100%{box-shadow:0 0 0 3px rgba(220,38,38,.12), 0 0 32px rgba(220,38,38,.15)}
  50%{box-shadow:0 0 0 5px rgba(220,38,38,.2), 0 0 48px rgba(220,38,38,.25)}
}

/* Anel vermelho em overflow */
.calc-result-ring.calc-ring-overflow{
  background:conic-gradient(#dc2626 0deg, rgba(220,38,38,.15) 360deg);
  box-shadow:0 0 0 2px rgba(220,38,38,.4), 0 0 36px rgba(220,38,38,.25);
  animation:ringOverflowPulse 1.4s ease-in-out infinite;
}
.calc-result-ring.calc-ring-overflow .calc-result-big{color:#dc2626}
@keyframes ringOverflowPulse{
  0%,100%{box-shadow:0 0 0 2px rgba(220,38,38,.4), 0 0 36px rgba(220,38,38,.25)}
  50%{box-shadow:0 0 0 6px rgba(220,38,38,.2), 0 0 56px rgba(220,38,38,.35)}
}

/* ════════════════════════════════════════════════════════════
   Topbar universal no ERP (alpha.88) — layout integrado
   ════════════════════════════════════════════════════════════ */

/* Quando o ERP usa a topbar universal, empurra o app-layout para baixo */
body.has-universal-topbar .app-layout{
  padding-top:0;          /* a pub-topbar já é fixed, body tem padding */
  margin-top:0;
}
body.has-universal-topbar{
  padding-top:var(--topbar-h, 52px);
}
/* Sidebar começa abaixo da topbar */
body.has-universal-topbar .sidenav{
  top:var(--topbar-h, 52px);
  height:calc(100vh - var(--topbar-h, 52px));
}
/* app-body também respeita a topbar */
body.has-universal-topbar .app-body{
  padding-top:0;
}
/* app-topbar ERP antigo — ocultar se ainda existir */
body.has-universal-topbar .app-topbar{
  display:none!important;
}
/* Mobile bar do ERP fica abaixo da topbar universal */
body.has-universal-topbar .app-mobile-bar{
  top:var(--topbar-h, 52px);
}

/* ════ alpha.467 — Variante "MENU SUPERIOR" do ERP (conceito da barra de grupos da calc) ════
   Aditivo: o menu lateral continua o padrão. No modo topo, zera --sidenav-w (a coluna da
   sidebar colapsa e todos os offsets left:var(--sidenav-w) viram 0) e esconde a sidebar. */
.erp-topnav{display:none}
body.erp-nav-top{--sidenav-w:0px!important}
body.erp-nav-top .sidenav,
body.erp-nav-top .sidenav-backdrop,
body.erp-nav-top .app-mobile-bar,
body.erp-nav-top .pub-mobile-nav-btn{display:none!important} /* hambúrguer da topbar é inútil no modo topo (sidenav escondida); o menu superior já é sempre visível */
/* alpha.480 — .app-body tinha overflow-x:hidden, que QUEBRA o position:sticky do menu superior
   (cria contexto de rolagem). overflow:clip clipa o horizontal SEM virar scroll container,
   então o menu volta a ficar fixo (sticky) no topo ao rolar a página. */
body.erp-nav-top .app-body{overflow-x:clip}
body.erp-nav-top .erp-topnav{
  display:block;position:sticky;top:var(--topbar-h,52px);z-index:30;
  background:color-mix(in srgb,var(--panel) 94%,transparent);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  padding:8px clamp(12px,3vw,28px) 0;
}
/* alpha.470 — MESMO visual da calculadora: pills (.calc-group-bar/.calc-group-btn) p/ grupos
   + sub-abas (.calc-tab-btn) num painel arredondado; e o dock inferior reusa .calc-qdock/.calc-qa */
.erp-topnav .calc-group-bar{margin-bottom:10px;overflow-x:auto;scrollbar-width:none}
.erp-topnav .calc-group-bar::-webkit-scrollbar{display:none}
.erp-topnav-items{display:flex;gap:4px;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:6px;margin-bottom:2px}
.erp-topnav-items[hidden]{display:none}
.calc-qa.on{color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
/* o conteúdo não fica escondido atrás do dock fixo — especificidade extra (+.has-universal-topbar)
   p/ vencer o `padding` shorthand do mobile que zerava o padding-bottom (alpha.470 review) */
body.erp-nav-top.has-universal-topbar .main{padding-bottom:96px}
@media(max-width:480px){body.erp-nav-top.has-universal-topbar .main{padding-bottom:84px!important}}
/* FAB de bug sobe acima do dock no mobile (senão o dock cobre o botão) */
@media(max-width:700px){body.erp-nav-top .zk-bug-fab{bottom:84px}}
@media(max-width:700px){
  /* alpha.754 — CORREÇÃO mobile: o menu superior do ERP VOLTA a quebrar linha. Antes (nowrap+overflow-x:auto)
     virava um scroll horizontal que cortava os itens no meio (ex.: "Vendas & Pagam…") = aparência quebrada. */
  .erp-topnav-items{flex-wrap:wrap;overflow-x:visible}
  /* alpha.754 — RAIZ do "quebrado/desalinhado" no mobile: .main é display:grid e .main>* tem min-width:auto,
     então a trilha do grid cresce até o min-content do filho mais largo (a .page-head com o seletor de modo +
     botões, que não quebravam) — estourava a viewport (430px) e era CLIPADO por overflow-x:clip. min-width:0
     deixa o item encolher; e a barra de ações da página passa a quebrar linha em vez de empurrar a largura. */
  .main > *, .pub-main > *{min-width:0}
  .page-head{flex-wrap:wrap}
  .page-head-actions{flex-wrap:wrap}
  .pn-viewtoggle{flex-wrap:wrap}
}
/* configurador do menu (Configurações → Interface) */
.cfg-navmode-seg{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.cfg-navmode-opt{display:flex;align-items:center;gap:11px;padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);cursor:pointer;transition:.12s ease}
.cfg-navmode-opt:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.cfg-navmode-opt:has(input:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel))}
.cfg-navmode-opt input{position:absolute;opacity:0;width:0;height:0}
.cfg-navmode-ic{flex:0 0 auto;color:var(--accent)}
.cfg-navmode-txt{display:flex;flex-direction:column;gap:2px}
.cfg-navmode-txt strong{font-size:14px;font-weight:850;color:var(--text)}
.cfg-navmode-txt small{font-size:11.5px;color:var(--muted)}
@media(max-width:560px){.cfg-navmode-seg{grid-template-columns:1fr}}

/* ════════════════════════════════════════════════════════════
   alpha.89 — Centralização + mobile ERP
   ════════════════════════════════════════════════════════════ */

/* ── Conteúdo sempre centralizado ── */
.pub-main > *,
.main > * { max-width: 1280px; margin-left: auto; margin-right: auto; }
.pub-main  { padding: 28px max(16px, 4vw); }

/* ── ERP mobile: sidenav vira drawer lateral ── */
@media (max-width: 860px) {
  /* Topbar universal: compacta em mobile */
  .pub-topbar { padding: 0 12px; height: 48px; }
  .pub-brand svg { height: 24px; }
  body.has-universal-topbar { padding-top: 48px; }
  body.has-universal-topbar .sidenav { top: 48px; height: calc(100vh - 48px); }

  /* App layout vira coluna única */
  body.has-universal-topbar .app-layout {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto;
  }

  /* Sidenav vira drawer: escondida por padrão, desliza da esquerda.
     alpha.310 — left:0 !important neutraliza a regra concorrente
     '@media(max-width:900px) .sidenav{left:-100%}', que deslocava o menu
     aberto para fora da tela (texto cortado). O drawer abre/fecha SO pelo
     transform; o left fica fixo em 0. */
  body.has-universal-topbar .sidenav {
    position: fixed;
    left: 0 !important;
    right: auto;
    width: min(280px, 80vw) !important;
    transform: translateX(-100%);
    transition: transform .25s cubic-bezier(.4,0,.2,1), box-shadow .25s;
    z-index: 1200;
    box-shadow: none;
  }
  body.has-universal-topbar .sidenav.mob-open {
    left: 0 !important;
    transform: translateX(0) !important;
    box-shadow: 4px 0 32px rgba(var(--shadow-rgb),.18);
  }
  /* alpha.311 — A .sidenav-nav tambem tem a classe .topnav-dropdown, que num
     @media(max-width:900px) vira position:fixed; inset:10px (um 3o sistema de
     menu/modal). Dentro do drawer do ERP isso jogava a nav para fora (width
     370px, left -71px, texto cortado). Aqui forcamos a nav a voltar ao fluxo
     normal dentro da sidenav. */
  body.has-universal-topbar .sidenav .topnav-dropdown,
  body.has-universal-topbar .sidenav.sidenav-nav,
  body.has-universal-topbar .sidenav #topnav {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: 8px 8px 16px !important;
    z-index: auto !important;
  }
  /* Backdrop quando drawer aberto */
  body.has-universal-topbar .sidenav-backdrop {
    display: block;
    position: fixed; inset: 0;
    background: rgba(var(--shadow-rgb),.35);
    z-index: 1190;
    opacity: 0; pointer-events: none;
    transition: opacity .25s;
  }
  body.has-universal-topbar .sidenav-backdrop.mob-open {
    opacity: 1; pointer-events: auto;
  }

  /* App-body ocupa tela toda */
  body.has-universal-topbar .app-body { margin-left: 0 !important; }

  /* Hamburguer do ERP integrado na pub-topbar (injetado via JS) */
  .erp-mob-toggle {
    width: 36px; height: 36px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: var(--panel);
    color: var(--text);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; flex-shrink: 0;
    order: -1; /* aparece antes do logo */
  }
  .erp-mob-toggle svg { display: block; }

  /* Conteúdo do ERP: padding menor */
  body.has-universal-topbar .main { padding: 14px 12px; }

  /* Mobile bar antiga do ERP: ocultar */
  body.has-universal-topbar .app-mobile-bar { display: none !important; }

  /* Sidenav collapse btn: esconder em mobile */
  .sidenav-collapse-btn { display: none !important; }

  /* Flyout do sidenav: posição absoluta dentro do drawer */
  body.has-universal-topbar .sidenav-flyout {
    position: static !important;
    box-shadow: none !important;
    border: none !important;
    padding: 4px 0 0 24px;
    background: transparent;
    display: none;
  }
  body.has-universal-topbar .sidenav-group.is-open .sidenav-flyout {
    display: block;
  }

  /* Tabelas no ERP mobile: scroll horizontal */
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .table-wrap table { min-width: 560px; }

  /* Cards grid: coluna única em mobile */
  .cards-grid { grid-template-columns: 1fr !important; }

  /* Page head: empilha */
  .page-head { flex-direction: column; align-items: stretch; gap: 10px; }
  .page-head .page-actions { justify-content: flex-start; }

  /* Filtros: coluna única */
  .filters-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 520px) {
  .pub-nav { gap: 2px; }
  .pub-nav a { padding: 6px 10px; font-size: 13px; }
  .pub-actions .topbar-label { display: none; }
}

/* ── alpha.90: logo topbar com acento + versão build ── */
.pub-brand { display:flex; align-items:center; text-decoration:none; flex-shrink:0; }
.pub-brand-inner { display:flex; flex-direction:column; align-items:flex-start; gap:0; line-height:1; }
.pub-brand-build { font-size:10px; font-weight:500; letter-spacing:.5px; color:var(--text-muted,var(--accent)); opacity:.7; margin-top:1px; padding-left:1px; }

/* Botão recolher sidebar — nova linha no topo do nav */
.sidenav-collapse-row { display:flex; justify-content:flex-end; padding:6px 8px 4px; border-bottom:1px solid var(--line); margin-bottom:4px; }
@media(max-width:860px) { .sidenav-collapse-row { display:none; } }

/* Remove espaço antigo do sidenav-head */
.sidenav-head { display:none !important; }

/* ── alpha.91: fix strip + collapse btn ── */

/* ERP: topbar precisa ser fixed (body já tem padding-top) */
body.has-universal-topbar .pub-topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 900;
}

/* Botão de colapso: pequena aba na borda direita da sidenav */
body.has-universal-topbar .sidenav { overflow: visible; }
body.has-universal-topbar .sidenav > .sidenav-collapse-btn {
  position: absolute;
  right: -14px;
  top: 50%;
  transform: translateY(-50%);
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--panel);
  border: 1px solid var(--line);
  box-shadow: 2px 0 8px rgba(var(--shadow-rgb),.10);
  opacity: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 60;
  cursor: pointer;
  transition: box-shadow .15s, background .15s;
}
body.has-universal-topbar .sidenav > .sidenav-collapse-btn:hover {
  background: var(--panel-2, var(--panel));
  box-shadow: 3px 0 12px rgba(var(--shadow-rgb),.18);
}
body.sidenav-collapsed .sidenav > .sidenav-collapse-btn svg { transform: scaleX(-1); }

/* Remover collapse-row anterior */
.sidenav-collapse-row { display: none !important; }

/* Altura uniforme da topbar */
body.has-universal-topbar { --topbar-h: 56px; padding-top: 56px; }
body.has-universal-topbar .sidenav { top: 56px; height: calc(100vh - 56px); }
@media (max-width: 860px) {
  body.has-universal-topbar { --topbar-h: 52px; padding-top: 52px; }
  body.has-universal-topbar .sidenav { top: 52px; height: calc(100vh - 52px); }
  body.has-universal-topbar .sidenav > .sidenav-collapse-btn { display: none !important; }
}

/* ════ alpha.92 ════ */

/* Hamburguer ERP: esconder em desktop, mostrar em mobile */
body.has-universal-topbar .erp-mob-toggle { display: none !important; }
@media (max-width: 860px) {
  body.has-universal-topbar .erp-mob-toggle { display: flex !important; }
}

/* Sidenav recolhida — centralizar ícones corretamente */
body.sidenav-collapsed .sidenav-nav { padding: 8px 4px !important; align-items: stretch; }
body.sidenav-collapsed .sidenav-trigger {
  justify-content: center !important;
  padding: 10px 0 !important;
  width: 100%;
}
body.sidenav-collapsed .sidenav-group { width: 100%; }

/* Topbar sempre fixa — elimina tremida na troca de página */
.pub-topbar { position: fixed !important; top: 0; left: 0; right: 0; z-index: 900; }
/* Páginas públicas: empurra o conteúdo para baixo da topbar fixa */
.pub-layout { padding-top: 56px; }

/* SPA fade — suaviza troca de conteúdo */
#pubMainContent { transition: opacity .12s ease; }
#pubMainContent.spa-loading { opacity: 0; pointer-events: none; }

/* Arquiteto UI — aba Inserir */
.ua-insert-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 8px 0; }
.ua-insert-preset { background: var(--panel-2, var(--panel)); border: 1px solid var(--line); border-radius: 8px; padding: 8px 6px; font-size: 12px; cursor: pointer; text-align: center; transition: background .15s, border-color .15s; color: var(--text); }
.ua-insert-preset:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--panel)); }
.ua-insert-preset strong { display: block; font-size: 11px; margin-top: 2px; }
.ua-insert-row { display: flex; gap: 6px; margin-top: 6px; }
.ua-insert-row .btn { flex: 1; font-size: 12px; }
.ua-removed-list { font-size: 11px; color: var(--muted); max-height: 80px; overflow-y: auto; }
.ua-removed-item { display: flex; justify-content: space-between; align-items: center; padding: 2px 0; border-bottom: 1px solid var(--line); gap: 4px; }
.ua-removed-item code { font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ua-removed-item button { flex-shrink: 0; font-size: 10px; padding: 1px 6px; cursor: pointer; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); color: var(--text); }

/* ════ alpha.95 — Calculadora: layout unificado + resultado destaque ════ */

/* Grid de produtos: flexbox para evitar último-row esticado */
.calc-preset-grid {
  max-height: none !important;
  overflow: visible !important;
  display: flex !important;
  flex-wrap: wrap;
  gap: 12px; /* alpha.928 — cards de marca estavam grudados (era 6px) */
  margin-bottom: 8px;
  align-items: stretch;
}
.calc-preset-btn {
  flex: 1 1 140px;
  max-width: 200px;
  box-sizing: border-box;
}

/* Painel esquerdo: sem padding interno excessivo nos steps */
.calc-panel.calc-wizard {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}

/* Cada step vira um card limpo */
.calc-step {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 18px 20px;
  margin-bottom: 10px;
  transition: border-color .2s;
}
.calc-step:last-of-type { margin-bottom: 0; }

/* Step ativo em desktop: borda accent sutil */
@media (min-width: 769px) {
  .calc-step { opacity: 1 !important; transform: none !important; pointer-events: all !important; }
}

/* Resultado: painel fixo flutuante à direita */
.calc-result-panel {
  position: sticky;
  top: calc(var(--topbar-h, 56px) + 20px);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 24px 20px;
  box-shadow: var(--shadow);
}

/* Grid principal: esquerda mais larga, resultado fixo */
.calc-dose-grid {
  grid-template-columns: 1fr 340px;
  gap: 24px;
  align-items: start;
}

/* Label de categoria de produto */
.calc-cat-label {
  grid-column: 1 / -1;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
  padding: 10px 4px 4px;
  margin-top: 4px;
}
.calc-cat-label:first-child { padding-top: 0; margin-top: 0; }

/* Confete canvas */
#calcConfettiCanvas {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 9990;
}

@media (max-width: 900px) {
  .calc-dose-grid { grid-template-columns: 1fr; }
  .calc-result-panel { position: static; }
}

/* ── alpha.96 — resultado flutuante (sticky no filho direto do grid) ── */
.calc-dose-grid {
  align-items: start !important;
}
/* Sticky no wrapper direto do grid (2ª coluna) */
.calc-result-col {
  position: sticky;
  top: calc(var(--topbar-h, 56px) + 16px);
  align-self: start;
}
/* Remove sticky do panel interno (já está no wrapper) */
.calc-result-panel {
  position: relative !important;
  top: auto !important;
}
@media (max-width: 900px) {
  .calc-result-col { position: static; }
}

/* ── alpha.940 — PARIDADE desktop↔mobile (Fase 5): o desktop passa a usar o MESMO wizard do
   mobile (1 passo por vez + botão "Próximo" + animações). Antes (alpha.98) o desktop era "flat"
   (todos os passos visíveis, inativos apagados). O dono pediu "as duas interfaces o mais próximo
   possível, sem diferenças". O JS (wizardGo / handler do .calc-next-btn) já roda em qualquer
   largura — só a CSS precisava deixar o desktop RESPEITAR os passos. ── */
@media (min-width: 769px) {
  /* passo ativo destacado (mesma borda/halo do mobile) */
  .calc-step.wiz-active{ border-color:var(--accent)!important; box-shadow:0 0 0 3px rgba(var(--accent-rgb),.10)!important; }
  /* esconde o conteúdo dos passos travados/concluídos — fica só o header (igual mobile).
     Especificidade (0,3,0)+!important vence o `.calc-step .calc-chips{display:flex!important}` da alpha.930. */
  .calc-step.wiz-locked .calc-chips,.calc-step.wiz-locked .calc-custom-row,.calc-step.wiz-locked .calc-preset-grid,.calc-step.wiz-locked .calc-preset-search,
  .calc-step.wiz-done .calc-chips,.calc-step.wiz-done .calc-custom-row,.calc-step.wiz-done .calc-preset-grid,.calc-step.wiz-done .calc-preset-search{ display:none!important; }
  .calc-step.wiz-locked .calc-step-num{ background:rgba(var(--accent-rgb),.06);color:var(--muted); }
  .calc-step.wiz-locked .calc-step-hd{ opacity:.55;cursor:default;margin-bottom:0; }
  .calc-step.wiz-done .calc-step-hd{ margin-bottom:0; }
  .calc-step.wiz-done .calc-step-num{ background:rgba(22,163,74,.12);color:var(--green,#16a34a); }
  .calc-step.wiz-done .calc-step-num::after{ content:'✓';font-size:13px;font-weight:900; }
  .calc-step.wiz-active .calc-step-num{ background:var(--accent);color:#fff;font-weight:900; }
  /* controles do wizard agora também no desktop */
  .calc-next-btn{ display:inline-flex; }
  .calc-step0-row{ display:flex; }
  .calc-step.wiz-active .calc-next-btn{ animation:calcNextPulse 1.8s ease-in-out infinite; }
  .calc-step.wiz-active .calc-next-btn svg{ animation:calcNextArrow 1.8s ease-in-out infinite; }
  /* alpha.1001 — a barra de progresso do wizard NÃO aparece mais no desktop (dono: "bug aqui"): é redundante (os headers numerados dos passos já mostram o progresso); segue só no mobile. */
}

/* ════ alpha.100 — sincronização final: topbar height consistente ════ */

/* Unificar altura da topbar em mobile para 52px em todos os contextos */
@media (max-width: 860px) {
  /* Topbar: mesma altura no ERP e em páginas públicas */
  .pub-topbar { height: 52px !important; padding: 0 14px !important; }
  /* Páginas públicas: offset correto */
  .pub-layout { padding-top: 52px !important; }
  /* ERP: garantir offset correto (alpha.91 já define 52px via --topbar-h) */
  body.has-universal-topbar .sidenav { top: 52px !important; height: calc(100vh - 52px) !important; }
}

/* Desktop: pub-layout com padding exato da topbar */
@media (min-width: 861px) {
  .pub-layout { padding-top: 56px; }
}

/* alpha.102 - calculadora corporal: historico, grafico e cartoes extras */
.body-results-row {
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)) !important;
}
.body-result-card.body-result-wide {
  grid-column: span 2;
}
.body-chart-card {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: color-mix(in srgb, var(--panel) 92%, var(--accent) 8%);
  padding: 14px;
  margin-bottom: 14px;
}
.body-chart-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.body-chart-head strong,
.body-chart-head small {
  display: block;
}
.body-chart-head small {
  color: var(--muted);
  font-size: 11px;
  margin-top: 2px;
}
.body-chart-head select {
  width: auto;
  min-width: 132px;
}
.body-trend-wrap {
  min-height: 180px;
  display: grid;
  align-items: center;
}
.body-trend-chart {
  width: 100%;
  min-height: 180px;
  overflow: visible;
}
.body-trend-chart line {
  stroke: var(--line);
  stroke-width: 2;
}
.body-trend-chart path {
  fill: none;
  stroke: var(--accent);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.body-trend-chart circle {
  fill: var(--panel);
  stroke: var(--accent);
  stroke-width: 3;
}
.body-trend-chart text {
  fill: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.body-hist-table .body-delete-btn {
  min-height: 30px;
  padding: 6px 10px;
}
@media (max-width: 640px) {
  .body-result-card.body-result-wide {
    grid-column: 1 / -1;
  }
  .body-chart-head {
    align-items: stretch;
    flex-direction: column;
  }
  .body-chart-head select {
    width: 100%;
  }
}

/* ════ alpha.103 — auth: tema global, dark mode, encoding fix ════ */

/* Auth-page-wrap não tem fundo próprio — herda do pub-main/main */
.auth-page-wrap {
  background: transparent;
}

/* Card da auth: usa --panel (muda com dark/light automaticamente) */
.auth-card,
.auth-card-wide {
  background: var(--panel) !important;
  border: 1px solid var(--line) !important;
  color: var(--text) !important;
}

/* Inputs dentro da auth seguem o tema */
.auth-form input,
.auth-form select,
.auth-form textarea,
.icon-input input {
  background: var(--panel-2) !important;
  border-color: var(--line) !important;
  color: var(--text) !important;
}
.auth-form input::placeholder,
.icon-input input::placeholder { color: var(--muted) !important; }
.auth-form input:focus,
.icon-input input:focus {
  border-color: color-mix(in srgb, var(--accent) 55%, transparent) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent) !important;
}

/* Ícone lateral do icon-input */
.icon-input-icon { color: var(--muted) !important; }

/* Tabs Entrar/Cadastrar */
.auth-tabs {
  background: var(--panel-2) !important;
  border-color: var(--line) !important;
}
.auth-tab {
  color: var(--muted) !important;
}
.auth-tab.is-active {
  background: var(--panel) !important;
  color: var(--text) !important;
}

/* Marca (logo + nome) na auth */
.auth-brand-name { color: var(--text) !important; }
.auth-subtitle    { color: var(--muted) !important; }

/* Divisor "OU CONTINUE COM" */
.auth-divider span {
  background: var(--panel) !important;
  color: var(--muted) !important;
}
.auth-divider::before,
.auth-divider::after { border-color: var(--line) !important; }

/* Checkbox e links */
.auth-checkbox     { color: var(--text) !important; }
.auth-checkbox a   { color: var(--accent) !important; }
.auth-forgot a     { color: var(--accent) !important; }

/* Rodapé de termos */
.auth-footer       { color: var(--muted) !important; }
.auth-footer a     { color: var(--accent) !important; }

/* Botões sociais seguem tema */
.btn-social {
  background: var(--panel-2) !important;
  border-color: var(--line) !important;
  color: var(--text) !important;
}
.btn-social:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--accent) 40%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 8%, var(--panel-2)) !important;
}

/* Detalhes de endereço (summary) */
.auth-advanced summary { color: var(--accent) !important; }
.auth-advanced-grid label { color: var(--muted) !important; }

/* Erro */
.auth-error {
  background: color-mix(in srgb, var(--red) 10%, transparent) !important;
  color: var(--red) !important;
  border-color: color-mix(in srgb, var(--red) 25%, transparent) !important;
}

/* alpha.107 - QA mobile: topbar, menu publico e auth */
@media (max-width: 700px) {
  .pub-topbar {
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 52px;
    padding: 7px 12px;
    gap: 8px;
    overflow: visible;
  }

  .pub-brand {
    min-width: 0;
    overflow: hidden;
  }

  .pub-brand svg {
    max-width: 76px;
    height: 26px !important;
  }

  .pub-brand-build {
    font-size: 10px;
    margin-left: 2px;
  }

  .pub-actions {
    gap: 5px;
    min-width: 0;
  }

  /* alpha.197 — Botao Entrar VISIVEL no mobile (estava escondido sem alternativa no menu) */
  .pub-actions > .btn.small[href*="page=login"] {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 14px !important;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
    border-radius: 12px !important;
    width: auto !important;
    min-width: 0 !important;
  }

  .pub-actions .icon-btn,
  .pub-mobile-nav-btn,
  .color-picker-btn,
  .pub-btn-primary {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    padding: 0 !important;
    border-radius: 12px !important;
  }

  .pub-actions .topbar-label,
  .pub-btn-primary span,
  .color-picker-label,
  .color-picker-caret {
    display: none !important;
  }

  .topbar-color-panel,
  .color-picker-panel {
    position: fixed !important;
    top: 58px !important;
    right: 12px !important;
    left: 12px !important;
    min-width: 0 !important;
    width: auto !important;
    z-index: 10020 !important;
    border-radius: 18px !important;
    box-shadow: 0 24px 70px rgba(var(--shadow-rgb), .22) !important;
  }

  .pub-nav.pub-nav-open {
    display: grid !important;
    position: fixed !important;
    top: 58px !important;
    left: 12px !important;
    right: 12px !important;
    bottom: auto !important;
    z-index: 10010 !important;
    grid-template-columns: 1fr;
    align-items: stretch !important;
    justify-content: stretch !important;
    gap: 8px !important;
    padding: 12px !important;
    background: color-mix(in srgb, var(--panel) 96%, transparent) !important;
    border: 1px solid var(--line) !important;
    border-radius: 20px !important;
    box-shadow: 0 24px 70px rgba(var(--shadow-rgb), .22) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }

  .pub-nav.pub-nav-open a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 14px !important;
    color: var(--text) !important;
    background: var(--panel-2) !important;
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
    font-size: 14px !important;
    font-weight: 900 !important;
  }

  .pub-nav.pub-nav-open a.pub-active {
    color: var(--accent) !important;
    background: color-mix(in srgb, var(--accent) 12%, var(--panel)) !important;
    border-color: color-mix(in srgb, var(--accent) 34%, var(--line)) !important;
  }

  .pub-main {
    padding: 12px 10px 22px !important;
  }

  .auth-page-wrap {
    max-width: 100%;
    gap: 14px;
    padding: 0;
  }

  .auth-brand-logo {
    width: 42px;
    height: 42px;
  }

  .auth-brand-name {
    max-width: min(280px, 82vw);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: .18em;
  }

  .auth-subtitle {
    font-size: 15px;
  }

  .auth-card,
  .auth-card-wide,
  .customer-login-card {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px !important;
    border-radius: 18px !important;
  }

  .auth-tabs {
    margin-bottom: 18px !important;
    gap: 3px !important;
  }

  .auth-tab {
    min-height: 44px; /* alpha.1019 — alvo de toque (era 38px) */
    padding: 8px 10px !important;
    font-size: 13.5px !important;
  }

  .auth-form {
    gap: 14px !important;
  }

  .icon-input input,
  .auth-form input,
  .auth-form select,
  .auth-form textarea {
    min-height: 44px;
    font-size: 16px !important;
  }

  .auth-advanced-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .auth-advanced-grid .inline-field {
    align-items: stretch;
  }

  .auth-advanced-grid .inline-field .btn {
    min-height: 44px;
    white-space: nowrap;
  }

  .auth-checkbox {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: start !important;
    gap: 10px !important;
    line-height: 1.35;
    font-size: 13px;
  }

  .auth-checkbox input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    margin-top: 1px;
  }

  .auth-card .btn.primary {
    min-height: 46px;
    width: 100%;
  }

  .auth-social-grid { /* alpha.1019 — era .auth-social-row (seletor morto: o markup usa auth-social-grid) */
    grid-template-columns: 1fr !important;
  }

  .auth-footer {
    padding: 0 8px 12px;
    font-size: 12.5px;
    line-height: 1.35;
  }
}


/* ═══════════════════════════════════════════════════════════
   alpha.110 — Mobile ERP: revisão profunda
   ═══════════════════════════════════════════════════════════ */

/* ── 1. prefers-color-scheme: auto mode via CSS ──────────── */
/* (JS em layout.php já lida com isso; este bloco cobre o
   instante antes do JS rodar evitando flash no Safari) */
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    --bg:         #0b0f18;
    --panel:      #111827;
    --panel-2:    #1e2534;
    --text:       #f1f5f9;
    --muted:      #94a3b8;
    --line:       rgba(255,255,255,.08);
    --line-strong:rgba(255,255,255,.14);
  }
}

/* ── 2. erp-mob-toggle: esconde no desktop ───────────────── */
/* Botão hamburguer injetado pelo JS sempre que há pub-topbar:
   deve aparecer APENAS em mobile (≤860px) */
.erp-mob-toggle {
  display: none !important;
}
@media (max-width: 860px) {
  .erp-mob-toggle {
    display: flex !important;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--text);
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    order: -1;
    transition: background .12s;
  }
  .erp-mob-toggle:hover { background: var(--panel-2, rgba(255,255,255,.08)); }
  .erp-mob-toggle svg   { display: block; }
}

/* ── 3. Conflict resolver: System A flyout (900px) vs System B (860px) ── */
/* Entre 861-900px, System A aplicava accordion no flyout mas
   a sidebar não era drawer. Resolvemos mantendo flyout fixo
   (comportamento desktop) nesse intervalo. */
@media (min-width: 861px) and (max-width: 900px) {
  body.has-universal-topbar .sidenav-flyout {
    position: fixed !important;
    left: var(--sidenav-w) !important;
    top: 56px !important;
    width: var(--flyout-w) !important;
    height: calc(100vh - 56px) !important;
    max-height: none !important;
    display: flex !important;
    flex-direction: column;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateX(-8px) !important;
    transition: opacity .16s, transform .16s !important;
  }
  body.has-universal-topbar .sidenav-group.is-open .sidenav-flyout {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
  }
}

/* ── 4. Settings: side nav → pill horizontal em mobile ──── */
@media (max-width: 860px) {
  .settings-system-layout {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  .settings-side-nav {
    position: static !important;
    top: auto !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    gap: 4px !important;
    padding: 8px 0 12px !important;
    scrollbar-width: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    border-bottom: 1px solid var(--line) !important;
    margin-bottom: 16px !important;
  }
  .settings-side-nav::-webkit-scrollbar { display: none; }
  .settings-side-nav a {
    white-space: nowrap !important;
    min-height: 32px !important;
    padding: 6px 14px !important;
    border-radius: 999px !important;
    border: 1px solid var(--line) !important;
    font-size: 13px !important;
    flex-shrink: 0 !important;
  }
  .settings-side-nav a:hover,
  .settings-side-nav a:focus-visible {
    border-color: var(--accent) !important;
  }
}

/* ── 5. Kanban mobile: scroll horizontal entre colunas ───── */
@media (max-width: 860px) {
  .kanban {
    display: flex !important;
    flex-direction: row !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    gap: 12px !important;
    padding-bottom: 16px !important;
    scroll-snap-type: x mandatory;
  }
  .kanban-col {
    flex: 0 0 min(85vw, 300px) !important;
    scroll-snap-align: start;
    min-height: 200px !important;
  }
}

/* ── 6. btn { width:100% } no 560px: exceções importantes ── */
@media (max-width: 560px) {
  /* Botões dentro de toolbars, page-actions, inline forms:
     não devem esticar. A regra base @560px seta width:100%
     para todos os .btn, mas muitos contextos precisam de auto */
  .topbar .btn,
  .page-actions .btn,
  .toolbar-actions .btn,
  .table-toolbar .btn,
  .inline-form .btn,
  .form-grid .btn,
  .form-stack .btn,
  .filters .btn,
  .card-actions .btn,
  .top-actions .btn,
  .sm-inline .btn,
  td .btn,
  th .btn,
  .modal-actions .btn {
    width: auto !important;
  }
  /* Botões de auth continuam 100% */
  .auth-card .btn { width: 100% !important; }
}

/* ── 7. Color picker panel: não sai do viewport mobile ───── */
@media (max-width: 600px) {
  .color-picker-panel,
  .topbar-color-panel {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    min-width: min(320px, 92vw) !important;
    max-width: 92vw !important;
  }
  .color-picker-panel.is-open,
  .topbar-color-panel.is-open {
    transform: translateX(-50%) !important;
  }
}

/* ── 8. Dashboard: cards KPI em mobile ───────────────────── */
@media (max-width: 860px) {
  .dash-kpi-grid,
  .kpi-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 480px) {
  .dash-kpi-grid,
  .kpi-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ── 9. Orders: form de novo pedido ─────────────────────── */
@media (max-width: 860px) {
  .order-form-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ── 10. Topbar pub-actions: esconde labels em mobile ───── */
@media (max-width: 860px) {
  body.has-universal-topbar .pub-topbar .topbar-label,
  body.has-universal-topbar .pub-topbar .color-picker-label,
  body.has-universal-topbar .pub-topbar .pub-user-name {
    display: none !important;
  }
  body.has-universal-topbar .pub-topbar .interface-stepper {
    display: none !important;
  }
}

/* ── 11. Sidenav flyout em mobile: botões com área touch ok ─ */
@media (max-width: 860px) {
  body.has-universal-topbar .sidenav-flyout a {
    min-height: 44px !important;
    padding: 10px 12px !important;
  }
  body.has-universal-topbar .sidenav-trigger {
    min-height: 48px !important;
  }
}

/* ── 12. Page padding mínimo mobile ─────────────────────── */
@media (max-width: 480px) {
  body.has-universal-topbar .main {
    padding: 12px 10px !important;
  }
  .page-head h1 {
    font-size: clamp(22px, 6vw, 32px) !important;
  }
}

/* ── 13. Table wrap: min-width menor em telas muito pequenas */
@media (max-width: 480px) {
  .table-wrap table { min-width: 420px !important; }
}

/* ── 14. user-menu-panel: não sai do viewport ─────────────*/
.user-menu-panel,
.topbar-user-panel {
  max-width: min(240px, 92vw);
}
@media (max-width: 600px) {
  .user-menu-panel,
  .topbar-user-panel {
    right: 4px !important;
    left: auto !important;
  }
}

/* ── 15. Flyout sidenav em desktop: z-index acima de qualquer overlay */
.sidenav-flyout { z-index: 1300 !important; }

/* ═══════════════════════════════════════════════════════════
   alpha.111 — Mobile ERP: drawer unificado + lista corrigida
   ═══════════════════════════════════════════════════════════ */

/* ── 1. app-mobile-bar: sempre oculto quando há pub-topbar ──
   (antes estava apenas no @media ≤860px, o que deixava
   a barra visível entre 860-900px criando toolbar dupla)      */
body.has-universal-topbar .app-mobile-bar { display: none !important; }

/* ── 2. Drawer unificado via body.nav-drawer-open ───────────
   System A (app.js): abre com body.nav-drawer-open
   System B (layout.php JS): agora usa a mesma classe
   Resultado: botão ×, backdrop e nav link todos fecham ok    */
@media (max-width: 860px) {
  /* Sidenav: escondida via transform (não left) para transição suave */
  body.has-universal-topbar .sidenav {
    left: 0 !important;
    transform: translateX(-100%) !important;
    transition: transform .26s cubic-bezier(.4,0,.2,1), box-shadow .26s !important;
    box-shadow: none !important;
  }
  /* Drawer aberto — alpha.314: aceita .mob-open (classe usada pelo app.js
     unificado) E o legado body.nav-drawer-open. Este bloco vinha depois no
     arquivo e tinha !important, entao vencia a regra anterior de .mob-open —
     por isso a classe era adicionada mas o transform nao mudava. */
  body.has-universal-topbar .sidenav.mob-open,
  body.has-universal-topbar.nav-drawer-open .sidenav {
    transform: translateX(0) !important;
    box-shadow: 6px 0 36px rgba(var(--shadow-rgb),.24) !important;
  }
  /* Backdrop: opacity controlada pela classe .mob-open / nav-drawer-open */
  body.has-universal-topbar .sidenav-backdrop {
    display: block !important;
    background: rgba(var(--shadow-rgb),.48) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity .26s !important;
  }
  body.has-universal-topbar .sidenav-backdrop.mob-open,
  body.has-universal-topbar.nav-drawer-open .sidenav-backdrop {
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  /* resetMenu escondido em mobile (espaço limitado) */
  body.has-universal-topbar #resetMenu { display: none !important; }
  /* Caret de abertura do flyout: garantir visível */
  body.has-universal-topbar .sidenav-caret { opacity: .6 !important; max-width: none !important; }
}

/* ── 3. Lista de pedidos: forçar cards em mobile estreito ───
   A tabela com min-width: 1180px fica ilegível em 390px.
   Abaixo de 600px, mostramos sempre o painel Cards.          */
@media (max-width: 600px) {
  /* Esconde painel Lista; mostra painel Cards independente
     do estado do JS (usa !important para superar is-hidden,
     [hidden] e style="display:none")                         */
  [data-order-view-panel="list"] { display: none !important; }
  [data-order-view-panel="cards"] { display: block !important; }
  /* Botão Lista some; botão Cards fica destacado              */
  [data-order-view-button="list"] { display: none !important; }
  [data-order-view-button="cards"] {
    background: var(--text) !important;
    color: var(--panel) !important;
    border-color: var(--text) !important;
  }
}

/* ── 4. Card-view: zera min-width de tabelas em modo bloco ──
   Sem isso, td::before cards ficam 1180px de largura         */
@media (max-width: 560px) {
  .table-wrap table:not(.no-card-view) {
    min-width: 0 !important;
    width: 100% !important;
  }
}

/* ── 5. Flyout dentro do drawer: abrir com accordion ────────
   Em mobile o flyout vira accordion (position:static).
   Garantir que o clique no trigger abre/fecha visualmente.   */
@media (max-width: 860px) {
  body.has-universal-topbar .sidenav-flyout {
    overflow: hidden !important;
    transition: max-height .22s ease !important;
  }
  body.has-universal-topbar .sidenav-group.is-open > .sidenav-trigger {
    background: rgba(var(--accent-rgb), .12) !important;
    color: var(--text) !important;
  }
}

/* ── 6. Topbar mobile: pub-actions sem overflow ─────────────*/
@media (max-width: 400px) {
  .pub-actions {
    gap: 4px !important;
  }
  .pub-actions .icon-btn {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important; /* alpha.1019 — sem isto o min-width:36px !important (11036) anulava o width:34px (min-width vence width) e a topbar deslogada estourava em 320-400px */
  }
}
/* alpha.1019 — topbar deslogada estourava em ≤480px: o seletor de idioma vira só o globo (compacto 36×36) */
@media (max-width: 480px) {
  .pub-lang-cur, .pub-lang-caret { display: none; }
  .pub-lang-btn { padding: 6px 8px; min-width: 36px; min-height: 36px; justify-content: center; }
  .pub-lang .pub-lang-globe { display: inline; }
}

/* ==========================================================================
   alpha.112 - Mobile ERP drawer hardening
   ========================================================================== */

@media (max-width: 860px) {
  body.has-universal-topbar .sidenav {
    top: var(--topbar-h, 52px) !important;
    left: 0 !important;
    width: min(84vw, 300px) !important;
    max-width: 300px !important;
    min-width: min(84vw, 300px) !important;
    height: calc(100dvh - var(--topbar-h, 52px)) !important;
    max-height: calc(100dvh - var(--topbar-h, 52px)) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    transform: translateX(-104%) !important;
  }

  body.has-universal-topbar.nav-drawer-open .sidenav {
    transform: translateX(0) !important;
  }

  body.has-universal-topbar.sidenav-collapsed {
    --sidenav-w: min(84vw, 300px) !important;
  }

  body.has-universal-topbar.sidenav-collapsed .sidenav-label,
  body.has-universal-topbar.sidenav-collapsed .build-pill,
  body.has-universal-topbar.sidenav-collapsed .sidenav-build-label,
  body.has-universal-topbar.sidenav-collapsed .sidenav-caret {
    opacity: 1 !important;
    max-width: none !important;
    overflow: visible !important;
  }

  body.has-universal-topbar.sidenav-collapsed .brand-logo-svg {
    width: auto !important;
    opacity: 1 !important;
  }

  body.has-universal-topbar.sidenav-collapsed .sidenav-trigger {
    justify-content: flex-start !important;
    padding: 10px 12px !important;
  }

  body.has-universal-topbar.sidenav-collapsed .sidenav-icon {
    width: 36px !important;
    height: 36px !important;
  }

  body.has-universal-topbar .sidenav-flyout {
    position: static !important;
    inset: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    max-height: 0 !important;
    margin: 0 8px 0 46px !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    overflow: hidden !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: none !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: color-mix(in srgb, var(--accent) 7%, transparent) !important;
    box-shadow: none !important;
    transition: max-height .22s ease, margin .22s ease, padding .22s ease !important;
  }

  body.has-universal-topbar .sidenav-group.is-open > .sidenav-flyout,
  body.has-universal-topbar .sidenav-group.mobile-expanded > .sidenav-flyout {
    max-height: 760px !important;
    margin-top: 4px !important;
    margin-bottom: 10px !important;
    padding: 6px !important;
    pointer-events: auto !important;
  }

  body.has-universal-topbar .sidenav-flyout-head {
    display: none !important;
  }

  body.has-universal-topbar .sidenav-flyout a {
    min-height: 42px !important;
    padding: 9px 10px !important;
    margin: 0 !important;
    border-radius: 10px !important;
    white-space: normal !important;
  }

  body.has-universal-topbar .sidenav-flyout a .menu-item-text {
    min-width: 0 !important;
  }

  body.has-universal-topbar .sidenav-flyout a .menu-item-text strong,
  body.has-universal-topbar .sidenav-flyout a .menu-item-text small {
    overflow-wrap: anywhere !important;
  }
}

@media (max-width: 360px) {
  body.has-universal-topbar {
    --topbar-h: 48px;
  }

  body.has-universal-topbar .pub-topbar {
    min-width: 0 !important;
    padding-inline: 6px !important;
    gap: 4px !important;
  }

  body.has-universal-topbar .pub-brand {
    min-width: 0 !important;
    max-width: 88px !important;
    overflow: hidden !important;
    flex: 1 1 auto !important;
  }

  body.has-universal-topbar .pub-brand-inner {
    min-width: 0 !important;
  }

  body.has-universal-topbar .pub-brand svg {
    max-width: 72px !important;
  }

  body.has-universal-topbar .pub-brand-build {
    display: none !important;
  }

  body.has-universal-topbar .pub-actions {
    gap: 3px !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
  }

  body.has-universal-topbar .erp-mob-toggle,
  body.has-universal-topbar .pub-actions .icon-btn,
  body.has-universal-topbar .topbar-theme-btn,
  body.has-universal-topbar .pub-user-chip {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    justify-content: center !important;
  }

  body.has-universal-topbar .pub-user-avatar {
    width: 22px !important;
    height: 22px !important;
  }
}

@media (max-width: 760px) {
  body.has-universal-topbar .page-head {
    align-items: stretch !important;
  }

  body.has-universal-topbar .page-head h1 {
    overflow-wrap: anywhere !important;
  }

  body.has-universal-topbar .page-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }

  body.has-universal-topbar .page-actions .btn {
    width: 100% !important;
    justify-content: center !important;
  }

  body.has-universal-topbar .card > .form-grid,
  body.has-universal-topbar .details-form .form-grid,
  body.has-universal-topbar .cost-form,
  body.has-universal-topbar .compact-form {
    grid-template-columns: 1fr !important;
  }

  body.has-universal-topbar .card > .form-grid > *,
  body.has-universal-topbar .details-form .form-grid > *,
  body.has-universal-topbar .cost-form > *,
  body.has-universal-topbar .compact-form > * {
    grid-column: 1 / -1 !important;
    min-width: 0 !important;
  }

  body.has-universal-topbar .copy-link-input,
  body.has-universal-topbar .form-grid input,
  body.has-universal-topbar .form-grid select,
  body.has-universal-topbar .form-grid textarea {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.has-universal-topbar .helper-box {
    overflow-wrap: anywhere !important;
  }
}

/* ==========================================================================
   alpha.113 - Calculadora corporal mobile polish
   ========================================================================== */

@media (max-width: 760px) {
  .body-module-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .body-module-grid .calc-panel {
    border-radius: 20px !important;
    padding: 14px !important;
    overflow: hidden !important;
  }

  .body-module-grid .form-stack,
  .body-module-grid .form-grid {
    gap: 10px !important;
  }

  .body-module-grid .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .body-module-grid label,
  .body-module-grid .full {
    min-width: 0 !important;
  }

  .body-module-grid input,
  .body-module-grid select,
  .body-module-grid textarea {
    min-width: 0 !important;
    width: 100% !important;
    min-height: 46px !important;
    font-size: 16px !important;
  }

  .body-results-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-top: 12px !important;
  }

  .body-result-card {
    border-radius: 14px !important;
    padding: 11px 9px !important;
    min-width: 0 !important;
  }

  .body-result-card strong {
    font-size: 20px !important;
    line-height: 1.08 !important;
    overflow-wrap: anywhere !important;
  }

  .body-result-card em {
    font-size: 9.5px !important;
    letter-spacing: .035em !important;
  }

  .body-result-card.body-result-wide {
    grid-column: 1 / -1 !important;
  }

  .body-chart-card {
    border-radius: 16px !important;
    padding: 12px !important;
  }

  .body-chart-head {
    align-items: stretch !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  .body-chart-head select {
    width: 100% !important;
    min-height: 42px !important;
    font-size: 14px !important;
  }

  .body-trend-wrap,
  .body-trend-chart {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .body-hist-table,
  .body-hist-table tbody,
  .body-hist-table tr,
  .body-hist-table td {
    display: block !important;
    width: 100% !important;
  }

  .body-hist-table thead {
    display: none !important;
  }

  .body-hist-table tr {
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
    padding: 10px !important;
    margin-bottom: 8px !important;
    background: var(--panel) !important;
  }

  .body-hist-table td {
    border-bottom: 0 !important;
    padding: 5px 0 !important;
    overflow-wrap: anywhere !important;
  }

  .body-hist-table td::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 2px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
  }
}

@media (max-width: 420px) {
  .body-module-grid .form-grid {
    grid-template-columns: 1fr !important;
  }

  .body-results-row {
    grid-template-columns: 1fr !important;
  }
}

/* ═══════════════════════════════════════
   PROTOCOLO — Aba de sugestões e planejamento
   ═══════════════════════════════════════ */
.proto-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  padding: 20px;
  max-width: 1100px;
  margin: 0 auto;
}

.proto-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.proto-card-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.proto-card-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.proto-card-head > div > h3 {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 950;
}
.proto-card-head > div > p {
  margin: 0;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
}

.proto-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.proto-field label {
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--muted);
}
.proto-field select,
.proto-field input[type="number"],
.proto-field input[type="text"] {
  width: 100%;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1.5px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  font-size: 14px;
  font-family: inherit;
  font-weight: 600;
  outline: none;
  transition: border-color .15s;
  appearance: none;
  -webkit-appearance: none;
}
.proto-field select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 36px; }
.proto-field select:focus,
.proto-field input:focus { border-color: var(--accent); }

/* Resultado da sugestão de protocolo */
.proto-result {
  display: none;
  flex-direction: column;
  gap: 0;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--line);
}
.proto-result.visible { display: flex; }

.proto-phase-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  background: var(--panel-2);
  font-size: 13px;
}
.proto-phase-row:last-child { border-bottom: none; }
.proto-phase-row.proto-total {
  background: color-mix(in srgb, var(--accent) 8%, transparent);
  font-weight: 800;
  font-size: 14px;
  border-top: 2px solid color-mix(in srgb, var(--accent) 20%, transparent);
}
.proto-phase-label { font-weight: 700; color: var(--text); }
.proto-phase-detail { font-size: 11px; color: var(--muted); margin-top: 2px; }
.proto-phase-badge {
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  color: var(--accent);
  border-radius: 8px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
.proto-phase-vials {
  font-size: 12px;
  color: var(--muted);
  text-align: right;
  white-space: nowrap;
}

/* Resultado do planejamento de frascos */
.proto-vials-result {
  display: none;
  flex-direction: column;
  gap: 12px;
}
.proto-vials-result.visible { display: flex; }

.proto-vials-big {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  border-radius: 14px;
  padding: 20px;
  gap: 4px;
}
.proto-vials-big .proto-vials-number {
  font-size: 52px;
  font-weight: 950;
  color: var(--accent);
  line-height: 1;
}
.proto-vials-big .proto-vials-unit {
  font-size: 13px;
  color: var(--muted);
  font-weight: 700;
}
.proto-vials-breakdown {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-radius: 10px;
  border: 1px solid var(--line);
  overflow: hidden;
}
.proto-vials-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  font-size: 13px;
  border-bottom: 1px solid var(--line);
  background: var(--panel-2);
}
.proto-vials-row:last-child { border-bottom: none; }
.proto-vials-row strong { font-weight: 800; flex-shrink: 0; }
.proto-vials-row span { color: var(--muted); font-size: 12px; }

.proto-tip {
  font-size: 11px;
  color: var(--muted);
  text-align: center;
  padding: 8px 0;
}

.proto-weeks-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.proto-weeks-row input {
  width: 80px;
  flex-shrink: 0;
}
.proto-weeks-row .proto-field-unit {
  font-size: 13px;
  color: var(--muted);
  font-weight: 700;
}

/* ── Mobile: protocolo ── */
@media (max-width: 820px) {
  .proto-grid {
    grid-template-columns: 1fr;
    padding: 12px;
    gap: 12px;
  }
  .proto-card {
    padding: 16px;
    gap: 12px;
    border-radius: 16px;
  }
  .proto-card-head > div > h3 { font-size: 14px; }
  .proto-card-icon { width: 34px; height: 34px; border-radius: 10px; }

  /* Fase em mobile: label full-width, badges embaixo */
  .proto-phase-row {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 4px 6px;
    padding: 8px 12px;
    font-size: 12px;
  }
  .proto-phase-row > div { grid-column: 1 / -1; }
  .proto-phase-detail { display: none; } /* esconde detalhe em mobile — já está no label */

  .proto-vials-big { padding: 16px; }
  .proto-vials-big .proto-vials-number { font-size: 40px; }

  .proto-vials-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    padding: 8px 12px;
  }
  .proto-vials-row strong { font-size: 13px; }
  .proto-vials-row span { font-size: 11px; }
}

/* ═══════════════════════════════════════
   PROTOCOLO — Wizard unificado (alpha.142)
   ═══════════════════════════════════════ */

/* Container */
.proto-wizard {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 20px;
  /* alpha.662 — sem cap de largura (era max-width:860px, deixava ~300px vazios à direita
     no widescreen): o wizard preenche o painel e o grid de produtos adensa p/ mais colunas. */
  max-width: none;
  margin: 0;
}

/* Cada passo */
.pw-step {
  padding: 24px 0 28px;
  border-bottom: 1px solid var(--line);
}
.pw-step:last-child { border-bottom: none; }

/* Cabeçalho do passo */
.pw-step-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 18px;
}
.pw-step-head strong {
  display: block;
  font-size: 16px;
  font-weight: 950;
  letter-spacing: -.02em;
  line-height: 1.2;
}
.pw-step-head small {
  display: block;
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}

/* Label de seção dentro do passo */
.pw-section-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--muted);
  font-weight: 950;
  margin-bottom: 10px;
}

/* Label acima do builder personalizado */
.pw-custom-label {
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 14px;
  padding: 10px 14px;
  background: var(--panel-2);
  border-radius: 10px;
  border-left: 3px solid var(--accent);
}

/* ── Cards de protocolo ── */
.pw-proto-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}

.pw-proto-card {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1.5px solid var(--line);
  background: var(--panel);
  color: var(--text);
  text-align: left;
  font-family: inherit;
  cursor: pointer;
  transition: .15s ease;
}
.pw-proto-card strong {
  font-size: 15px;
  font-weight: 950;
  letter-spacing: -.02em;
  line-height: 1.2;
}
.pw-proto-subtitle {
  font-size: 12px;
  color: var(--accent);
  font-weight: 800;
  display: block;
}
.pw-proto-phases {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.55;
  margin-top: 4px;
}
.pw-proto-card:hover {
  border-color: rgba(var(--accent-rgb),.55);
  background: rgba(var(--accent-rgb),.05);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(0,0,0,.07);
}
.pw-proto-card.active {
  border-color: var(--accent);
  background: rgba(var(--accent-rgb),.10);
}
.pw-proto-card.active strong { color: var(--accent); }
.pw-proto-card.active .pw-proto-subtitle { color: color-mix(in srgb, var(--accent) 70%, var(--muted)); }

/* Card "Personalizado" — destaque diferente */
.pw-proto-custom {
  border-style: dashed;
  border-color: var(--line-strong);
  background: var(--panel-2);
}
.pw-proto-custom:hover {
  border-style: solid;
  border-color: var(--accent);
  background: rgba(var(--accent-rgb),.07);
}
.pw-proto-custom.active {
  border-style: solid;
  border-color: var(--accent);
  background: rgba(var(--accent-rgb),.10);
}

/* ── Resultado ── */
.pw-result-title {
  font-size: 13px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--muted);
  margin-bottom: 10px;
}
.pw-vials-box { margin-top: 20px; }

/* ── Frascos necessários inline ── */
.pw-vials-inline {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 18px;
  border-radius: 16px;
  background: color-mix(in srgb, var(--accent) 8%, var(--panel));
  border: 1.5px solid color-mix(in srgb, var(--accent) 25%, transparent);
  margin: 12px 0 8px;
}
.pw-vials-inline .pw-vials-big {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.pw-vials-inline .proto-vials-number {
  font-size: 42px;
  font-weight: 900;
  color: var(--accent);
  line-height: 1;
  letter-spacing: -2px;
}
.pw-vials-inline .proto-vials-unit {
  font-size: 13px;
  color: var(--muted);
  font-weight: 600;
}

/* ── Salvar protocolo ── */
.pw-save-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent) 6%, var(--panel));
  border: 1.5px dashed color-mix(in srgb, var(--accent) 35%, transparent);
}
.pw-proto-name-input {
  flex: 1;
  min-width: 180px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1.5px solid var(--line);
  background: var(--panel);
  color: var(--text);
  font-size: 14px;
}
.pw-proto-name-input:focus {
  outline: none;
  border-color: var(--accent);
}
.pw-save-status {
  font-size: 13px;
  color: var(--accent);
  font-weight: 600;
}

/* ── Protocolos salvos ── */
.pw-saved-section {
  border-bottom: none;
  padding-bottom: 0;
}
.pw-saved-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pw-saved-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--panel-2);
  border: 1.5px solid var(--line);
}
.pw-saved-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pw-saved-info strong { font-size: 14px; }
.pw-saved-product { font-size: 12px; color: var(--accent); font-weight: 600; }
.pw-saved-summary { font-size: 12px; color: var(--muted); }
.pw-saved-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}

/* ── Responsive ── */
@media (max-width: 600px) {
  .proto-wizard { padding: 12px; }
  .pw-step { padding: 18px 0 22px; }
  .pw-proto-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .pw-proto-card { padding: 11px 12px; border-radius: 14px; }
  .pw-proto-card strong { font-size: 13px; }
  .pw-proto-phases { display: none; }
  .pw-save-wrap { flex-direction: column; align-items: stretch; }
  .pw-saved-card { flex-direction: column; }
  .pw-saved-actions { justify-content: flex-end; }
}

/* ── Meu Perfil (social users) ──────────────────────────────────────── */
.my-profile-wrap{
  /* alpha.759 — empilha em COLUNA: avisos (sorteio/cadastro incompleto) no topo, card embaixo.
     Antes era display:flex (linha) → os avisos viravam irmãos do card na MESMA linha e o
     align-items:stretch os esticava até a altura do card (≈ a tela toda) = "pílulas" gigantes vazias. */
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  padding:32px 16px 60px;
  min-height:calc(100vh - 80px);
}
/* avisos e card com a MESMA largura legível, centralizados e empilhados */
.my-profile-wrap > *{ width:100%; max-width:520px; }
.my-profile-card{
  width:100%;
  max-width:520px;
  padding:0;
  overflow:hidden;
}
.my-profile-hero{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:32px 24px 24px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 12%,transparent),color-mix(in srgb,var(--panel-2) 90%,transparent));
  border-bottom:1px solid color-mix(in srgb,var(--border) 50%,transparent);
  gap:6px;
}
.my-profile-provider-badge{
  display:flex;
  align-items:center;
  gap:5px;
  font-size:11px;
  font-weight:700;
  color:var(--muted);
  background:color-mix(in srgb,var(--panel) 80%,transparent);
  padding:3px 10px;
  border-radius:var(--r-pill);
  border:1px solid color-mix(in srgb,var(--border) 50%,transparent);
  margin-bottom:6px;
}
.my-profile-avatar{
  width:64px; height:64px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 70%,#000));
  color:#fff;
  font-size:26px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 16px color-mix(in srgb,var(--accent) 30%,transparent);
}
.my-profile-name{
  font-size:18px;
  font-weight:700;
  margin-top:4px;
}
.my-profile-email{
  font-size:12px;
  color:var(--muted);
}
.my-profile-links{
  display:flex;
  gap:8px;
  margin-top:10px;
  flex-wrap:wrap;
  justify-content:center;
}
.my-profile-flash{
  margin:12px 20px 0;
  border-radius:var(--r-sm);
}
.my-profile-section{
  padding:20px 24px;
  border-bottom:1px solid color-mix(in srgb,var(--border) 40%,transparent);
}
.my-profile-section:last-child{ border-bottom:none; }
.my-profile-section h3{
  font-size:13px;
  font-weight:700;
  margin:0 0 14px;
  color:var(--text);
}
.my-profile-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.my-profile-form label{
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:12px;
  font-weight:600;
  color:var(--muted);
}
/* alpha.709 — inputs do perfil seguem o controle PADRÃO do tema (mesmos tokens dos demais
   campos do app): fundo --control-bg, borda --shell-border, foco com --accent. Antes usava
   --panel-2/--border (tint creme do tema dourado) e não cobria select/textarea → destoava. */
.my-profile-form input,
.my-profile-form select,
.my-profile-form textarea{
  width:100%;
  background:var(--control-bg);
  border:1px solid var(--shell-border);
  border-radius:var(--r-sm);
  padding:9px 12px;
  font-size:14px;
  color:var(--text);
  box-shadow:0 1px 0 rgba(255,255,255,.42) inset;
  transition:border-color .15s, box-shadow .15s;
}
.my-profile-form input:hover,
.my-profile-form select:hover,
.my-profile-form textarea:hover{
  border-color:color-mix(in srgb,var(--accent) 22%,var(--line));
}
.my-profile-form input:focus,
.my-profile-form select:focus,
.my-profile-form textarea:focus{
  outline:none;
  border-color:rgba(var(--accent-rgb),.7);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.16);
}
.my-profile-form input:disabled{
  opacity:.55;
  cursor:not-allowed;
}
/* alpha.709 — fieldset de Endereço sem o "box" cinza padrão do browser (não seguia o tema) */
.my-profile-fieldset{
  border:0;
  margin:0;
  padding:0;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.my-profile-fieldset > legend{ padding:0; font-size:12px; font-weight:600; color:var(--muted); }

/* alpha.710 — painel admin do Sorteio: KPIs compactos + engajamento + participantes */
.rflad-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin-bottom:14px}
.rflad-kpi{background:var(--panel-2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;text-align:center}
.rflad-kpi b{display:block;font-size:20px;font-weight:800;line-height:1.15;color:var(--text);font-variant-numeric:tabular-nums}
.rflad-kpi span{font-size:11px;color:var(--muted)}
.rflad-eng{margin-bottom:14px}
.rflad-eng-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.rflad-funnel-title{font-size:11px;font-weight:700;color:var(--muted);margin-bottom:8px;text-transform:uppercase;letter-spacing:.4px}
.rflad-funnel-row{display:flex;justify-content:space-between;align-items:center;font-size:14px;margin-bottom:4px;color:var(--text)}
.rflad-funnel-bar{height:8px;border-radius:99px;background:var(--panel-2);overflow:hidden;margin:8px 0 4px;border:1px solid var(--line)}
.rflad-funnel-bar i{display:block;height:100%;background:#2e9e6b}
.rflad-reason{display:grid;grid-template-columns:1fr 84px 28px;align-items:center;gap:8px;margin-bottom:6px;font-size:13px}
.rflad-reason-lbl{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rflad-reason-bar{height:7px;border-radius:99px;background:var(--panel-2);overflow:hidden;border:1px solid var(--line)}
.rflad-reason-bar i{display:block;height:100%;background:var(--accent)}
.rflad-reason strong{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.rflad-top-list{list-style:none;margin:0;padding:0;counter-reset:t}
.rflad-top-list li{counter-increment:t;display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent);font-size:13px}
.rflad-top-list li:last-child{border-bottom:0}
.rflad-top-list li::before{content:counter(t)"º";color:var(--muted);font-weight:700;margin-right:6px}
.rflad-top-list li span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rflad-acts{display:flex;gap:6px;flex-wrap:wrap}
.rflad-parts td{vertical-align:middle}
.rflad-parts tr.rflad-excluded{opacity:.62}
.rflad-parts tr.rflad-banned{opacity:.5}
.badge.red{color:#c0392b;background:color-mix(in srgb,#c0392b 12%,transparent);border:1px solid color-mix(in srgb,#c0392b 30%,transparent)}

/* alpha.712 — sugestão de tipo de exercício autodetectado pelos sensores (tela de salvar GPS) */
.act-auto-suggest{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0 4px;padding:8px 12px;border-radius:10px;background:color-mix(in srgb,var(--accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));font-size:13px;color:var(--text)}
.act-auto-suggest b{color:var(--accent-text,var(--accent))}
.act-auto-suggest .btn{margin-left:auto}

/* alpha.713 (Fase 4a) — catálogo de tipos de exercício (admin) */
.extype-list{display:flex;flex-direction:column;gap:8px}
.extype-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel-2)}
.extype-row.extype-off{opacity:.6}
.extype-row.extype-new{background:color-mix(in srgb,var(--accent) 6%,var(--panel-2))}
.extype-emoji{width:48px;text-align:center;font-size:18px}
.extype-name{flex:1;min-width:140px}
.extype-f{display:flex;flex-direction:column;font-size:11px;font-weight:600;color:var(--muted);gap:2px}
.extype-f input,.extype-f select{font-weight:400;font-size:13px}
.extype-f input[type=number]{width:72px}
.extype-chk{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);align-self:center}
@media(max-width:640px){.extype-name{min-width:100px}.extype-row{padding:10px}}

/* alpha.713 (Fase 4a) — card de metas semanais de exercício (cliente) */
.exg-card{margin-bottom:14px}
.exg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.exg-metric{text-align:center}
.exg-metric .exg-vals{font-size:13px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.exg-metric .exg-lbl{font-size:11px;color:var(--muted);display:block;margin-bottom:6px}
.exg-bar{height:8px;border-radius:99px;background:var(--panel-2);overflow:hidden;border:1px solid var(--line);margin-top:6px}
.exg-bar i{display:block;height:100%;background:var(--accent);transition:width .3s ease}
.exg-bar.exg-done i{background:#2e9e6b}
.exg-edit{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.exg-edit label{display:flex;flex-direction:column;font-size:11px;font-weight:600;color:var(--muted);gap:3px}
.exg-edit input{width:80px}
@media(max-width:560px){.exg-grid{grid-template-columns:1fr}}
.my-profile-field-note{
  font-size:10.5px;
  color:var(--muted);
  font-weight:400;
  line-height:1.4;
}
.my-profile-form .btn.primary{
  align-self:flex-start;
  margin-top:4px;
}

/* ── Custom Protocol Builder (cpb-*) — alpha.134 ─────────────────────────── */
.proto-card-full{grid-column:1/-1}
.cpb-steps{display:grid;gap:18px}
.cpb-step{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:18px;transition:.2s ease}
.cpb-step[data-active="false"]{opacity:.55;pointer-events:none}
.cpb-step-label{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.cpb-step-num{width:28px;height:28px;border-radius:50%;background:var(--accent);color:#111;font-weight:950;font-size:13px;display:grid;place-items:center;flex-shrink:0}
.cpb-step-label strong{font-size:15px;letter-spacing:-.02em}
.cpb-step-label small{color:var(--muted);font-size:12px;margin-left:auto}

/* product chips */
.cpb-chips{display:flex;flex-direction:column;gap:14px}
.cpb-cat-label{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:950;margin-bottom:6px;display:block}
/* 0.2.0-alpha.10 — busca do picker do protocolo (marcas + compostos da wiki) + rótulo da categoria wiki */
.cpb-prod-search-wrap{margin:0 0 12px}
.cpb-prod-search{box-sizing:border-box;width:100%;min-height:42px;padding:10px 13px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:14px}
.cpb-prod-search:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
.cpb-cat-wiki .cpb-cat-label{color:color-mix(in srgb,var(--accent) 78%,var(--text))}
/* alpha.661 — grid de produtos do Protocolo: flex (cap 200px, vão à direita) → grid
   auto-fill que alinha as colunas entre as categorias e adensa no widescreen (mais cards/linha, menos rolagem). */
.cpb-chips-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,155px),1fr));gap:8px;align-items:stretch}
.cpb-chips-row .cpb-chip{box-sizing:border-box;max-width:none}
.cpb-chip{
  display:flex;flex-direction:column;gap:3px;
  padding:11px 13px;border-radius:var(--r-sm);
  border:1.5px solid var(--line);
  background:var(--panel);
  color:var(--text);cursor:pointer;
  text-align:left;font-family:inherit;
  transition:.15s ease;
}
.cpb-chip strong{font-size:13px;font-weight:850;line-height:1.2}
.cpb-chip small{font-size:11px;color:var(--muted);font-weight:700;line-height:1}
.cpb-chip:hover{border-color:rgba(var(--accent-rgb),.55);background:rgba(var(--accent-rgb),.06);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.06)}
.cpb-chip.active,.cpb-chip.selected{border-color:var(--accent);background:rgba(var(--accent-rgb),.12);color:var(--accent)}
.cpb-chip.active strong,.cpb-chip.selected strong{color:var(--accent)}
.cpb-chip.active small,.cpb-chip.selected small{color:color-mix(in srgb,var(--accent) 70%,var(--muted))}

/* alpha.993 — seção colapsável "Peptídeos da wiki" no seletor do Protocolo (sync com o ecossistema) */
.cpb-wiki{border:1px solid var(--line);border-radius:var(--r-sm);background:color-mix(in srgb,var(--panel-2) 60%,var(--panel));overflow:hidden}
.cpb-wiki-sum{display:flex;align-items:center;gap:8px;flex-wrap:wrap;cursor:pointer;list-style:none;padding:11px 13px;font-weight:850;color:var(--text)}
.cpb-wiki-sum::-webkit-details-marker{display:none}
.cpb-wiki-sum::marker{content:"";font-size:0}
.cpb-wiki-ttl{font-size:13px;font-weight:950}
.cpb-wiki-sum small{color:var(--muted);font-size:11px;font-weight:700}
.cpb-wiki-sum::after{content:"";width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin-left:auto;margin-right:4px;transition:transform .18s ease}
.cpb-wiki[open]>.cpb-wiki-sum::after{transform:rotate(225deg)}
.cpb-wiki-search{box-sizing:border-box;width:calc(100% - 22px);min-height:36px;padding:8px 11px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:13px;margin:0 11px 8px}
.cpb-wiki-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,155px),1fr));gap:8px;max-height:280px;overflow-y:auto;scrollbar-width:thin;margin:0 11px 11px}
.cpb-chip-wiki small{color:var(--accent);font-weight:800}
/* alpha.995 — blend no protocolo: reusa .cb-* (do Blend da calc); só o chip + espaçamento do form */
.cpb-chip-blend strong{color:var(--accent)}
.pw-blend-form .cb-shared{margin-bottom:10px}
.pw-blend-form .cb-peps{display:grid;gap:8px}
.pw-blend-form .cb-out{margin:10px 0}

/* option buttons (dose / freq / duration) */
.cpb-opt-row{display:flex;flex-wrap:wrap;gap:8px}
.cpb-opt-btn{padding:7px 13px;border-radius:var(--r-sm);border:1.5px solid var(--line);background:var(--panel-2);color:var(--text);font-weight:850;font-size:13px;cursor:pointer;transition:.15s ease}
.cpb-opt-btn:hover{border-color:rgba(var(--accent-rgb),.55)}
.cpb-opt-btn.sel,.cpb-opt-btn.active{border-color:var(--accent);background:rgba(var(--accent-rgb),.15);color:var(--accent)}
.cpb-opt-open{font-style:italic;color:var(--muted)}
/* 0.2.0-alpha.7 — duração CUSTOM do protocolo: label-botão com input numérico embutido (digitar semanas) */
.cpb-opt-custom{display:inline-flex;align-items:center;gap:2px;padding:5px 10px}
.cpb-opt-custom input{width:48px;min-height:0;height:auto;border:none;background:transparent;color:inherit;font:inherit;font-weight:850;text-align:center;padding:0;outline:none;-moz-appearance:textfield;appearance:textfield}
/* 0.2.0-alpha.15 — a chip-custom acompanha a altura das chips normais (input não força min-height:44px do input global) */
.cpb-opt-custom{min-height:0;align-self:stretch}
.cpb-opt-custom input::-webkit-outer-spin-button,.cpb-opt-custom input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cpb-opt-custom input::placeholder{color:var(--muted);font-weight:750}
.cpb-opt-custom:focus-within{border-color:var(--accent);background:rgba(var(--accent-rgb),.10)}
.cpb-opt-open.sel,.cpb-opt-open.active{color:var(--accent);font-style:normal}

/* phase cards */
.cpb-phases{display:grid;gap:12px;margin-bottom:14px}
.cpb-phase-card{border:1px solid var(--line-strong);border-radius:var(--r-sm);padding:14px;background:var(--panel-2)}
.cpb-phase-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.cpb-phase-num{padding:3px 12px;border-radius:var(--r-lg);background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent);font-weight:900;font-size:11.5px;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;flex-shrink:0}
.cpb-phase-header strong{font-size:14px;flex:1}
.cpb-phase-remove{background:none;border:none;color:var(--muted);cursor:pointer;font-size:16px;padding:4px;line-height:1;border-radius:var(--r-xs);transition:.12s}
.cpb-phase-remove:hover{color:var(--red);background:rgba(220,38,38,.1)}
.cpb-phase-section{margin-bottom:10px}
.cpb-phase-section:last-child{margin-bottom:0}
.cpb-phase-section-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:950;margin-bottom:7px}
.cpb-add-phase-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:var(--r-sm);border:1.5px dashed var(--line-strong);background:transparent;color:var(--muted);font-weight:850;font-size:13px;cursor:pointer;transition:.15s ease;width:100%;justify-content:center}
.cpb-add-phase-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(var(--accent-rgb),.07)}
/* 0.2.0-alpha.9 — ASSOCIAÇÃO (meds concomitantes por fase) */
.cpb-phase-assoc-sec{border-top:1px dashed var(--line);padding-top:11px;margin-top:4px}
.cpb-assoc-row{border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 10px;margin-bottom:8px;background:color-mix(in srgb,var(--accent) 4%,var(--panel-2,var(--panel)))}
.cpb-assoc-top{display:flex;align-items:center;gap:8px}
.cpb-assoc-med{flex:1 1 auto;min-width:0}
.cpb-assoc-remove{flex:0 0 auto;width:30px;height:30px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel);color:var(--muted);cursor:pointer;font-size:13px;line-height:1}
.cpb-assoc-remove:hover{border-color:var(--red);color:var(--red)}
.cpb-assoc-ctl{display:flex;flex-wrap:wrap;gap:10px 14px;margin-top:9px}
.cpb-assoc-field{display:flex;flex-direction:column;gap:6px;min-width:0}
/* 0.2.0-alpha.13 — preço do associado (Frasco|Caixa + frascos/caixa), mesma estrutura da fase primária */
.cpb-assoc-price{display:flex;flex-direction:column;gap:6px;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
.cpb-assoc-mini-label{font-size:11px;font-weight:850;color:var(--muted)}
.cpb-assoc-add{display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border:1.5px dashed rgba(var(--accent-rgb),.5);border-radius:var(--r-sm);background:transparent;color:var(--accent);font-weight:850;font-size:13px;cursor:pointer;transition:.15s ease}
.cpb-assoc-add:hover{background:rgba(var(--accent-rgb),.08);border-style:solid}
.proto-phase-assoc{padding-left:12px;border-left:2px solid rgba(var(--accent-rgb),.4)}
.proto-phase-assoc .proto-phase-label{color:var(--accent);font-weight:800}

/* result */
.cpb-result{background:linear-gradient(135deg,rgba(var(--accent-rgb),.10),rgba(var(--accent-rgb),.04));border:1px solid rgba(var(--accent-rgb),.28);border-radius:var(--r-sm);padding:16px;display:grid;gap:10px}
.cpb-result-title{font-weight:950;font-size:15px;color:var(--accent)}
.cpb-result-phase{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}
.cpb-result-phase:last-of-type{border-bottom:0}
.cpb-result-phase span{color:var(--muted)}
.cpb-result-total{display:flex;justify-content:space-between;font-weight:950;font-size:14px;padding-top:8px;border-top:1px solid var(--line-strong);margin-top:4px}

/* ── Calculator step icons & body result icons — alpha.135 ───────────────── */
.calc-step-icon-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;height:36px;
  border-radius:var(--r-sm);
  background:rgba(var(--accent-rgb),.10);
  border:1px solid rgba(var(--accent-rgb),.18);
  color:var(--accent);
  flex-shrink:0;
}
.calc-step-icon-wrap svg{display:block}
.calc-step-hd{display:flex;align-items:center;gap:12px}
.calc-step-hd > div:last-child{flex:1}
.calc-step-hd > div:last-child h3{margin:0 0 2px;font-size:16px;font-weight:950}
.calc-step-hd > div:last-child p{margin:0;font-size:12px;color:var(--muted)}

/* body result card icons */
.body-result-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:32px;height:32px;
  border-radius:var(--r-sm);
  background:rgba(var(--accent-rgb),.10);
  border:1px solid rgba(var(--accent-rgb),.18);
  color:var(--accent);
  margin:0 auto 6px;
  flex-shrink:0;
}
.body-result-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px}

/* ── OAuth provider inline diagnostic ─────────────────────────────────────── */
.spc-diag-result { display: none; margin-top: 10px; }
.spc-diag-inline { border: 1px solid var(--line); border-radius: 12px; padding: 12px; background: var(--panel-2); font-size: 12px; }
.spc-diag-summary { font-weight: 850; margin-bottom: 8px; }
.spc-diag-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.spc-diag-checks li { display: flex; align-items: baseline; gap: 6px; padding: 3px 0; }
.chk-ok .chk-dot { color: var(--green); }
.chk-fail .chk-dot { color: var(--red); }
.chk-label { flex: 1; }
.chk-detail { color: var(--red); font-size: 11px; }
.chk-lat { color: var(--muted); font-size: 11px; margin-left: auto; }
.spc-diag-hint { color: var(--muted); display: block; margin-top: 8px; }
.spc-saved-hint { color: var(--muted); font-size: 11px; display: block; margin-top: 4px; }

/* ── GitHub social button ──────────────────────────────────────────────────── */
.btn-social.social-btn-github, .btn-social.btn-social-github { background: #24292e; color: #fff; border-color: #24292e; }
.btn-social.social-btn-github:hover, .btn-social.btn-social-github:hover { background: #1a1e22; }

/* ── Instagram social button ───────────────────────────────────────────────── */
.btn-social.btn-social-instagram { background: linear-gradient(135deg,#f9ce34,#ee2a7b,#6228d7); color: #fff; border-color: transparent; }
.btn-social.btn-social-instagram:hover { opacity: .88; }

/* ── Register form extras — alpha.137 ───────────────────────────────────── */
.auth-section-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:950;margin:14px 0 6px}
.reg-row-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:560px){.reg-row-2{grid-template-columns:1fr}}

/* ── Selector de sexo no cadastro ── */
.reg-sex-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:4px}
.reg-sex-card{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:16px 12px;border-radius:var(--r-sm);
  border:2px solid var(--line);background:var(--panel);
  color:var(--muted);font-family:inherit;cursor:pointer;
  transition:.15s ease;
}
.reg-sex-card strong{font-size:14px;font-weight:850;line-height:1}
.reg-sex-card:hover{border-color:rgba(var(--accent-rgb),.55);color:var(--text);transform:translateY(-1px)}
.reg-sex-card.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--panel));color:var(--accent)}
.reg-sex-card.active strong{color:var(--accent)}

/* password strength */
.pwd-strength-wrap{display:flex;align-items:center;gap:10px;margin:-6px 0 6px}
.pwd-strength-bar{flex:1;height:4px;background:var(--line);border-radius:var(--r-2xs);overflow:hidden}
.pwd-strength-fill{height:100%;border-radius:var(--r-2xs);transition:width .25s ease,background .25s ease;width:0}
.pwd-strength-label{font-size:11px;font-weight:850;white-space:nowrap;min-width:48px}

/* password match */
.pwd-match-hint{font-size:12px;font-weight:850;margin:-6px 0 4px}
.match-ok{color:var(--green)}
.match-fail{color:var(--red)}

/* auth-social on top of register */
.auth-social{margin-bottom:4px}
.auth-social + .auth-form .auth-section-label:first-child{border-top:1px solid var(--line);padding-top:16px;margin-top:8px}

/* alpha.139 fix — auth pages: fundo sólido, sem gradiente nas laterais */
/* O pub-main tem max-width:1320px centralizado; nas laterais aparecia o gradiente do body */
body:has(.auth-page-wrap) .pub-main {
  max-width: none !important;
  margin: 0 !important;
}
body:has(.auth-page-wrap),
body:has(.auth-page-wrap) .pub-layout {
  background: var(--bg) !important;
}

/* ══════════════════════════════════════════════════════════════════════
   alpha.147 — Sistema de Rastreio (Correios, Jadlog, Loggi)
   ══════════════════════════════════════════════════════════════════════ */

/* ── Badges de status ───────────────────────────────────────────────── */
.track-badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:var(--r-lg);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}
.track-badge-delivered{background:rgba(22,163,74,.14);color:#15803d}
.track-badge-transit{background:rgba(37,99,235,.12);color:#1d4ed8}
.track-badge-out{background:rgba(249,115,22,.14);color:#c2410c}
.track-badge-posted{background:rgba(107,114,128,.12);color:#4b5563}
.track-badge-waiting{background:rgba(234,179,8,.14);color:#92400e}
.track-badge-unknown{background:rgba(156,163,175,.12);color:#6b7280}
/* alpha.1019 — no tema escuro os textos hardcoded acima ficavam ~2:1 de contraste (ilegíveis) */
html[data-theme="dark"] .track-badge-delivered{color:#4ade80}
html[data-theme="dark"] .track-badge-transit{color:#60a5fa}
html[data-theme="dark"] .track-badge-out{color:#fb923c}
html[data-theme="dark"] .track-badge-posted{color:#94a3b8}
html[data-theme="dark"] .track-badge-waiting{color:#fbbf24}
html[data-theme="dark"] .track-badge-unknown{color:#9ca3af}
@media (prefers-color-scheme: dark){
  html[data-theme="auto"] .track-badge-delivered{color:#4ade80}
  html[data-theme="auto"] .track-badge-transit{color:#60a5fa}
  html[data-theme="auto"] .track-badge-out{color:#fb923c}
  html[data-theme="auto"] .track-badge-posted{color:#94a3b8}
  html[data-theme="auto"] .track-badge-waiting{color:#fbbf24}
  html[data-theme="auto"] .track-badge-unknown{color:#9ca3af}
}

/* ── Timeline de eventos ─────────────────────────────────────────────── */
.track-timeline{display:flex;flex-direction:column;gap:0}
.track-event{display:grid;grid-template-columns:28px 1fr;gap:0 12px;position:relative}
.track-event:not(:last-child) .track-event-dot::after{
  content:'';position:absolute;left:13px;top:28px;bottom:0;width:2px;
  background:var(--line);z-index:0;
}
.track-event{padding-bottom:18px}
.track-event:last-child{padding-bottom:0}
.track-event-dot{
  width:26px;height:26px;border-radius:50%;
  border:2px solid var(--line-strong);
  background:var(--panel);
  display:grid;place-items:center;
  font-size:11px;font-weight:950;
  color:var(--muted);
  position:relative;z-index:1;flex-shrink:0;
  margin-top:2px;
}
.track-event-latest .track-event-dot{border-color:var(--accent);background:rgba(var(--accent-rgb),.15);color:var(--accent)}
.track-event-dot-delivered{border-color:#16a34a!important;background:rgba(22,163,74,.15)!important;color:#15803d!important}
.track-event-body{display:flex;flex-direction:column;gap:3px;min-width:0}
.track-event-date{font-size:11px;color:var(--muted);font-weight:750}
.track-event-status{font-size:14px;font-weight:900;color:var(--text);line-height:1.3}
.track-event-latest .track-event-status{color:var(--accent)}
.track-event-loc{font-size:12px;color:var(--muted);font-weight:700}
.track-event-desc{font-size:12px;color:var(--muted);margin:2px 0 0;line-height:1.4}

/* ── Admin: tabela de rastreios ─────────────────────────────────────── */
.tracks-table td{vertical-align:middle}
.track-code{font-family:monospace;font-size:13px;font-weight:800;background:var(--panel-2);padding:2px 7px;border-radius:var(--r-xs);border:1px solid var(--line)}
.track-pub-link{margin-left:6px;font-size:13px;color:var(--muted);text-decoration:none;opacity:.6}
.track-pub-link:hover{opacity:1;color:var(--accent)}
.btn-icon{background:none;border:none;cursor:pointer;font-size:16px;padding:4px 6px;border-radius:var(--r-xs);line-height:1;transition:.12s}
.btn-icon:hover{background:var(--line)}

/* ── Admin: card de rastreio no pedido público ──────────────────────── */
.track-order-box{border-left:3px solid var(--accent)}
.track-order-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;flex-wrap:wrap}
.track-last-event{font-size:13px;margin:6px 0 0;color:var(--muted)}
.btn-xs{padding:4px 10px;font-size:12px;border-radius:var(--r-xs)}

/* ── Página pública de rastreio ─────────────────────────────────────── */
.track-pub-card{background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:32px;box-shadow:var(--shadow-soft)}
.track-pub-header{text-align:center;margin-bottom:28px}
.track-pub-title{font-size:28px;font-weight:950;letter-spacing:-.04em;margin:0 0 6px}
.track-pub-subtitle{color:var(--muted);font-size:15px;margin:0}
.track-pub-form{display:flex;flex-direction:column;gap:10px}
.track-pub-inputs{display:grid;grid-template-columns:1fr auto;gap:10px}
.track-pub-input{padding:14px 16px;border:1.5px solid var(--line);border-radius:var(--r-md);font:inherit;font-size:16px;background:var(--panel-2);color:var(--text);width:100%;box-sizing:border-box}/* alpha.1019 — 16px evita auto-zoom do iOS (a classe vencia o guard genérico por especificidade) */
.track-pub-input:focus{outline:none;border-color:var(--accent)}
.track-pub-select{padding:14px 14px;border:1.5px solid var(--line);border-radius:var(--r-md);font:inherit;font-size:16px;background:var(--panel-2);color:var(--text);min-width:180px}/* alpha.1019 — idem: anti-zoom iOS */
.track-pub-select:focus{outline:none;border-color:var(--accent)}
.track-pub-hint{font-size:12px;color:var(--accent);font-weight:800;min-height:18px}
/* alpha.833 — bloco de compartilhamento do rastreio (WhatsApp / E-mail / Copiar link) */
.track-share{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:14px 0 4px;padding:12px 14px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-md)}
.track-share-label{font-weight:900;font-size:13px;color:var(--muted);margin-right:2px}
.track-share-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 15px;border-radius:var(--r-pill);border:1.5px solid var(--line);background:var(--panel);color:var(--text);font:inherit;font-size:13px;font-weight:800;cursor:pointer;text-decoration:none;transition:.15s ease}
.track-share-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-soft)}
.track-share-btn.is-wa{background:#25d366;border-color:#1faa4f;color:#fff}
.track-share-btn.is-wa:hover{background:#20bd5a}
.track-share-btn.is-em{background:rgba(var(--accent-rgb),.12);border-color:rgba(var(--accent-rgb),.40);color:var(--accent)}
.track-share-btn.is-cp:hover{border-color:rgba(var(--accent-rgb),.55)}
/* alpha.831 — botões do rastreio público: mais corpo + cantos arredondados (--r-md) p/ casar com o card (24px). Cor/gradiente herdam do .btn.primary oficial (accent). */
.track-pub-btn{padding:15px 18px;width:100%;font-size:15.5px;font-weight:900;letter-spacing:.3px;border-radius:var(--r-md)}
.track-pub-result-head{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.track-pub-carrier{font-size:14px;font-weight:900;color:var(--muted)}
.track-pub-code{font-family:monospace;font-size:16px;font-weight:900;letter-spacing:.04em;background:var(--panel-2);padding:4px 10px;border-radius:var(--r-sm);border:1px solid var(--line);overflow-wrap:anywhere}/* alpha.1019 — código de 24 chars (Loggi) clipava em 320px */
.track-pub-timeline-wrap{border-top:1px solid var(--line);padding-top:20px;margin-top:4px}
.track-pub-updated{font-size:11px;color:var(--muted);margin-top:16px;text-align:right}
.track-pub-error{color:var(--red);background:rgba(220,38,38,.07);border-radius:var(--r-sm);padding:14px;font-weight:800}
.track-pub-loading{display:flex;align-items:center;gap:10px;color:var(--muted);font-weight:700}
.spinner-ring{width:20px;height:20px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:600px){
  .track-pub-inputs{grid-template-columns:1fr}
  .track-pub-card{padding:20px}
  .track-pub-title{font-size:22px}
}

/* ── Configurações de transportadoras ────────────────────────────────── */
.settings-cron-info{margin-top:16px;padding:14px;background:var(--panel-2);border-radius:var(--r-sm);border:1px solid var(--line);font-size:13px}
.track-cron-url{display:block;margin-top:8px;font-family:monospace;font-size:11px;word-break:break-all;background:var(--bg);padding:8px 10px;border-radius:var(--r-xs);border:1px solid var(--line)}
.settings-save-row{display:flex;align-items:center;gap:12px}
.track-settings-status{font-size:13px;font-weight:800}

/* ── Seletor de fonte de rastreio ────────────────────────────────────── */
.track-source-pref-box{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-md);padding:18px 20px;margin-bottom:18px}
.track-source-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:4px}
.track-source-option{
  display:flex;align-items:flex-start;gap:12px;
  padding:14px 16px;border-radius:var(--r-sm);
  border:2px solid var(--line);background:var(--panel);
  cursor:pointer;transition:.15s ease;
  position:relative;
}
.track-source-option input[type=radio]{position:absolute;opacity:0;width:0;height:0}
.track-source-option.active{border-color:var(--accent);background:rgba(var(--accent-rgb),.06)}
.track-source-option:hover:not(.track-source-disabled){border-color:rgba(var(--accent-rgb),.45)}
.track-source-option.track-source-disabled{opacity:.5;cursor:not-allowed}
.track-source-icon{font-size:24px;flex-shrink:0;margin-top:1px}
.track-source-label{flex:1}
.track-source-label strong{display:block;font-size:14px;font-weight:900;margin-bottom:3px}
.track-source-label small{font-size:12px;color:var(--muted);font-weight:700;line-height:1.3}
@media(max-width:600px){.track-source-options{grid-template-columns:1fr}}

/* ── alpha.163 — calculadora: card Personalizado + alinhamento mobile ── */

/* Card Personalizado: destaque visual, sempre full-width */
.calc-preset-custom {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  border-style: dashed !important;
  border-color: rgba(var(--accent-rgb),.45) !important;
  background: rgba(var(--accent-rgb),.05) !important;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px !important;
  position: relative;
}
.calc-preset-custom strong {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 14px !important;
  color: var(--accent);
}
.calc-preset-custom small {
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.4;
  display: block;
  margin-top: 2px;
}
.calc-preset-custom.active {
  border-style: solid !important;
  border-color: var(--accent) !important;
  background: rgba(var(--accent-rgb),.12) !important;
}

/* Mobile: grid de 2 colunas exatas para os cards de produto */
@media (max-width: 600px) {
  .calc-preset-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important; /* alpha.928 — mais respiro entre os cards de marca no mobile (era 6px) */
  }
  .calc-preset-btn {
    flex: unset !important;
    max-width: unset !important;
    width: 100%;
    box-sizing: border-box;
  }
  .calc-preset-custom {
    grid-column: 1 / -1;    /* full width no grid */
  }
  .calc-cat-label {
    grid-column: 1 / -1;
  }
}

/* ════════════════════════════════════════════════════════════════
   alpha.184 — Settings flat nav (com icones, sempre visivel)
   Mesmo padrao do sidenav principal do ERP
   ════════════════════════════════════════════════════════════════ */

/* alpha.186 — cfg-layout sem aside (nav esta no sidebar principal) */
.cfg-layout{
  display:block;
  min-height:calc(100vh - 120px);
  margin:0;
}

/* Quicknav no topo (mostra o painel atual) */
.cfg-section-quicknav{
  display:flex;
  align-items:baseline;
  gap:12px;
  padding:14px 28px;
  border-bottom:1px solid var(--line);
  background:var(--panel-2, var(--bg));
  position:sticky;
  top:0;
  z-index:10;
}
.cfg-section-quicknav strong{
  font-size:13px;
  font-weight:800;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.08em;
}
.cfg-section-quicknav strong::after{ content:' › '; color:var(--line-strong); }
.cfg-quicknav-current{
  font-size:15px;
  font-weight:700;
  color:var(--text);
}

/* Sidebar */
.cfg-nav.cfg-flat-nav{
  position:sticky;
  top:72px;
  padding:18px 0 18px 0;
  display:flex;
  flex-direction:column;
  gap:0;
  border-right:1px solid var(--line);
  background:transparent;
  min-height:calc(100vh - 120px);
}

.cfg-nav-brand{
  font-size:11px;
  font-weight:800;
  color:var(--muted);
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:0 16px 16px;
  margin-bottom:0;
}

/* ── Grupo flat ───────────────────────────────────────────── */
.cfg-flat-group{
  display:flex;
  flex-direction:column;
  gap:0;
  margin-bottom:14px;
}

/* Header de seção (UPPERCASE pequeno) */
.cfg-flat-label{
  font-size:11px;
  font-weight:800;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.09em;
  padding:6px 16px;
  margin-bottom:2px;
}

/* Item flat (icone + texto) */
.cfg-flat-item{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  padding:7px 16px;
  font:inherit;
  font-size:14px;
  font-weight:500;
  color:var(--text);
  background:transparent;
  border:none;
  cursor:pointer;
  text-align:left;
  text-decoration:none;
  transition:color .12s ease, background .12s ease;
  line-height:1.4;
}
.cfg-flat-item:hover{
  background:color-mix(in srgb, var(--accent) 5%, transparent);
}

/* Icone */
.cfg-flat-icon{
  flex-shrink:0;
  opacity:.6;
  color:currentColor;
  transition:opacity .12s ease, color .12s ease;
}
.cfg-flat-item:hover .cfg-flat-icon{ opacity:.85; }

/* Item ativo: barra lateral accent + texto accent + icone accent */
.cfg-flat-item.active{
  color:var(--accent);
  font-weight:700;
  background:color-mix(in srgb, var(--accent) 6%, transparent);
}
.cfg-flat-item.active::before{
  content:'';
  position:absolute;
  left:0;
  top:6px;
  bottom:6px;
  width:3px;
  background:var(--accent);
  border-radius:0 2px 2px 0;
}
.cfg-flat-item.active .cfg-flat-icon{
  color:var(--accent);
  opacity:1;
}

/* ── Painéis de conteúdo (inalterado do alpha.175) ────────── */
.cfg-panels{
  padding:20px 28px;
  display:flex;
  flex-direction:column;
  gap:0;
}
.cfg-panel{
  padding:24px 0;
  margin-bottom:0;
  border-radius:0;
  border-left:none;
  border-right:none;
  border-top:none;
  background:transparent;
  box-shadow:none;
}
.cfg-panel + .cfg-panel{ border-top:1px solid var(--line); }
.cfg-panel:first-child{ padding-top:8px; }
.cfg-panel-head{ margin-bottom:18px; padding-bottom:0; border-bottom:none; }
.cfg-panel-head h2{ margin:0 0 4px; font-size:18px; font-weight:800; letter-spacing:-.01em; }
.cfg-panel-head p{ margin:0; color:var(--muted); font-size:13px; font-weight:500; line-height:1.5; }

/* Mobile: tree continua funcionando, layout em coluna única */
@media(max-width:760px){
  .cfg-layout{ grid-template-columns:1fr; min-height:auto; }
  .cfg-nav.cfg-tree-nav{
    position:static;
    border-right:none;
    border-bottom:1px solid var(--line);
    min-height:auto;
    padding:12px 8px;
  }
  .cfg-panels{ padding:14px 12px; }
  .cfg-panel{ padding:18px 0; }
  .cfg-tree-group.is-open .cfg-tree-children{ max-height:500px; }
}

/* ── alpha.165 — SMTP alias field (no extra CSS needed) ── */

/* ── alpha.183 — Google credentials.json import (2 botoes + console) ── */
.google-json-upload-area{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px dashed var(--line-strong);border-radius:var(--r-sm);background:var(--panel-2);margin-bottom:10px;transition:.14s ease}
.google-json-upload-area.google-json-drag{border-color:rgba(var(--accent-rgb),.65);background:color-mix(in srgb,var(--accent) 6%,transparent)}
.google-json-upload-area.gji-loaded{border-style:solid;border-color:rgba(var(--accent-rgb),.45)}
.google-json-upload-area.google-json-imported{border-color:rgba(22,163,74,.55);background:rgba(22,163,74,.06)}
.google-json-hint{font-size:11.5px;color:var(--muted);line-height:1.45}

/* Linha de acoes (escolher / aplicar / limpar) */
.gji-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.gji-btn{margin:0;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.gji-btn-apply:disabled{opacity:.45;cursor:not-allowed}
.gji-btn-clear{margin-left:auto;font-size:11px;padding:4px 10px}

/* Nome do arquivo selecionado */
.gji-filename{
  flex:1;min-width:0;
  font-size:12px;font-weight:600;color:var(--muted);
  font-family:ui-monospace,'SF Mono',Menlo,monospace;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  padding:4px 10px;border:1px solid var(--line);border-radius:var(--r-2xs);
  background:var(--bg);
  transition:all .2s ease;
}
.gji-loaded .gji-filename{
  color:var(--text);
  border-color:rgba(34,197,94,.45);
  background:rgba(34,197,94,.06);
  padding-left:24px;
  position:relative;
}
.gji-loaded .gji-filename::before{
  content:'✓';
  position:absolute;
  left:7px; top:50%; transform:translateY(-50%);
  color:#22c55e;
  font-weight:900;
  font-size:13px;
}

/* alpha.188 — Botao Aplicar pulsa quando habilitado para chamar atencao */
.gji-btn-apply:not(:disabled){
  animation:gji-pulse-apply 1.8s ease-in-out 0s 2;
}
@keyframes gji-pulse-apply{
  0%, 100% { box-shadow:0 0 0 0 rgba(var(--accent-rgb), .5); }
  50%      { box-shadow:0 0 0 6px rgba(var(--accent-rgb), 0); }
}

/* Console */
.gji-console{
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:#0d1117;
  color:#c9d1d9;
  font-family:ui-monospace,'SF Mono',Menlo,monospace;
  font-size:12px;
  overflow:hidden;
  display:flex;flex-direction:column;
}
[data-theme="light"] .gji-console{
  background:#1a1d23;
  color:#e1e4e8;
}
.gji-console-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:6px 12px;
  background:rgba(255,255,255,.04);
  border-bottom:1px solid rgba(255,255,255,.06);
  font-size:11px;font-weight:700;
}
.gji-console-title{
  color:#8b949e;text-transform:uppercase;letter-spacing:.08em;
}
.gji-console-title::before{
  content:'●';color:#22c55e;margin-right:6px;font-size:9px;vertical-align:middle;
  animation:gji-pulse 2s ease-in-out infinite;
}
@keyframes gji-pulse{
  0%,100%{opacity:.7}
  50%{opacity:1}
}
.gji-console-status{
  color:#8b949e;font-weight:600;font-size:11px;
}
.gji-console-status.is-ready{color:#58a6ff}
.gji-console-status.is-ok{color:#22c55e}
.gji-console-status.is-error{color:#f85149}

.gji-console-body{
  padding:8px 12px;
  max-height:220px;
  overflow-y:auto;
  line-height:1.6;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.15) transparent;
}
.gji-console-body::-webkit-scrollbar{width:6px}
.gji-console-body::-webkit-scrollbar-track{background:transparent}
.gji-console-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:3px}

.gji-log{display:flex;gap:10px;padding:1px 0;align-items:flex-start}
.gji-log-time{
  color:#6e7681;flex-shrink:0;font-size:11px;
  font-variant-numeric:tabular-nums;
}
.gji-log-text{flex:1;word-break:break-word}
.gji-log code{
  background:rgba(110,118,129,.2);
  padding:1px 5px;border-radius:3px;
  font-size:11px;color:#79c0ff;
}
.gji-log strong{color:#e6edf3;font-weight:700}
.gji-log-muted .gji-log-text{color:#6e7681}
.gji-log-info  .gji-log-text{color:#c9d1d9}
.gji-log-ok    .gji-log-text{color:#3fb950}
.gji-log-ok    strong{color:#56d364}
.gji-log-warn  .gji-log-text{color:#d29922}
.gji-log-warn  strong{color:#e3b341}
.gji-log-error .gji-log-text{color:#f85149}
.gji-log-error strong{color:#ff7b72}

/* ── alpha.164 — exames: modo texto/PDF, drop zone, spinner, resultado IA ── */

/* Alternador de modo (Colar texto / Enviar PDF) */
.exam-mode-tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);padding-bottom:10px}
.exam-mode-tab{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--r-sm);border:1px solid transparent;background:transparent;font:inherit;font-size:13px;font-weight:900;color:var(--muted);cursor:pointer;transition:.14s ease}
.exam-mode-tab:hover{background:color-mix(in srgb,var(--accent) 7%,transparent);color:var(--text)}
.exam-mode-tab.active{background:color-mix(in srgb,var(--accent) 14%,transparent);border-color:rgba(var(--accent-rgb),.35);color:var(--accent)}

/* Zona de drop do PDF */
.exam-drop-zone{position:relative;border:2px dashed var(--line-strong);border-radius:var(--r-md);padding:28px 20px;text-align:center;background:var(--panel-2);cursor:pointer;transition:.14s ease;min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.exam-drop-zone:hover,.exam-drop-zone.exam-drop-hover,.exam-drop-zone:focus-within{border-color:rgba(var(--accent-rgb),.65);background:color-mix(in srgb,var(--accent) 6%,transparent)} /* alpha.635 — :focus-within = a zona de upload reage ao foco por teclado (a11y) */
.exam-drop-label{margin:0;font-size:13px;font-weight:850;color:var(--text)}

/* Caixa de resultado da análise IA */
.exam-ai-box{border:1px solid var(--line);border-radius:var(--r-sm);padding:16px;background:var(--panel-2);font-size:14px;line-height:1.65;white-space:pre-wrap;min-height:80px;max-height:420px;overflow-y:auto;scrollbar-width:thin;color:var(--text)}

/* Spinner (círculo animado, full-size) */
.spinner{width:32px;height:32px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}

/* Spinner inline (menor, para dentro de botões/texto) */
.spinner-inline{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;vertical-align:middle;margin-right:4px}

@keyframes spin{to{transform:rotate(360deg)}}

/* Módulo de exames: layout duas colunas no desktop */
.exam-module{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media(max-width:800px){.exam-module{grid-template-columns:1fr}}

/* ── alpha.170 — Social onboarding: bouncing arrows + red field hints ── */
.onboard-banner{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:var(--r-sm);background:color-mix(in srgb,var(--accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);color:var(--accent);font-size:13.5px;font-weight:800;line-height:1.4;margin-bottom:6px}
.onboard-banner svg{flex-shrink:0;opacity:.8}

/* Label container for required onboarding field */
.onboard-required{position:relative}

/* Bouncing horizontal arrow to the left of the input */
.onboard-arrow{position:absolute;left:-32px;top:50%;transform:translateY(-50%);font-size:20px;font-weight:900;color:var(--red, #dc2626);line-height:1;animation:onboard-bounce .55s ease-in-out infinite alternate;pointer-events:none;user-select:none}
@keyframes onboard-bounce{
  from{transform:translateY(-50%) translateX(0)}
  to  {transform:translateY(-50%) translateX(7px)}
}

/* Red border on the input inside a required label */
.onboard-required .onboard-field{border-color:rgba(220,38,38,.6)!important;box-shadow:0 0 0 2px rgba(220,38,38,.12)!important}
.onboard-required .onboard-field::placeholder{color:rgba(220,38,38,.55)!important}

/* Red message below the input */
.onboard-msg{display:block;color:var(--red, #dc2626);font-size:12px;font-weight:800;margin-top:5px;line-height:1.35}

/* Skip link */
.onboard-skip-link{display:block;text-align:center;margin-top:6px;font-size:12.5px;color:var(--muted);text-decoration:none;font-weight:700;opacity:.75}
.onboard-skip-link:hover{opacity:1;color:var(--accent)}

/* On mobile: arrow hidden (no space) — show inline indicator instead */
@media(max-width:600px){
  .onboard-arrow{display:none}
  .my-profile-form.onboard-active label{padding-left:0}
}

/* ══════════════════════════════════════════════════════════════
   alpha.181 — REVERT alpha.173 accordion
   Voltamos ao padrao flyout original (clique no grupo abre painel
   fixo ao lado do sidebar). O accordion estava abrindo todos os
   grupos simultaneamente e cortando os itens. Padrao antigo
   ja funcionava e e mais confiavel.
   ══════════════════════════════════════════════════════════════ */

/* Mobile: botao de collapse nao faz sentido (usamos drawer) */
@media (max-width: 860px) {
  #sidenavCollapse { display:none !important; }
}

/* ── Mobile (< 901px): accordion como já estava ───────────── */
@media(max-width:900px){
  .sidenav-backdrop { display:none !important; }
}

/* ════════════════════════════════════════════════════════════════
   alpha.174 — Modo Construção (catálogo público "em breve")
   ════════════════════════════════════════════════════════════════ */
.construction-wrap{
  position:relative; min-height:calc(100vh - 80px);
  display:flex; align-items:center; justify-content:center;
  padding:60px 24px; overflow:hidden;
  background:linear-gradient(135deg, var(--bg) 0%, color-mix(in srgb, var(--accent) 4%, var(--bg)) 100%);
}

/* alpha.232 — Quando o pub-main hospeda um wrapper full-bleed (construction,
   auth, hero etc.), o max-width:1320px e o padding do pub-main criam
   "degraus" visiveis nas laterais por causa do bg gradiente do body. Aqui
   neutralizamos esse container so para essas paginas, sem afetar o catalogo
   normal. */
.pub-main:has(>.construction-wrap),
.pub-main:has(>.auth-page-wrap){
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}
/* alpha.398 — FIX da "linha/seam" no Modo Construção. O cap genérico de `.pub-main > *`
   (width:min(1280px,100%) + margin:auto, usado p/ centralizar o catálogo) também limitava
   o .construction-wrap a 1280px CENTRALIZADO. Como o wrap tem fundo próprio (gradiente) +
   blobs decorativos nos cantos, sobrava a faixa do body nas laterais → seam vertical visível
   (~x=313 e x=1593 num viewport 1920), reforçada pelo clip (overflow:hidden) dos blobs nessas
   bordas. Forçando o wrap a full-bleed: o gradiente cobre 100% da largura (sem seam) e os blobs
   passam a ser recortados na borda do viewport (invisível). */
.pub-main > .construction-wrap{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}
.construction-card{
  position:relative; z-index:2;
  max-width:640px; width:100%;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:24px;
  padding:48px 40px;
  text-align:center;
  box-shadow:0 30px 80px rgba(0,0,0,.08), 0 6px 16px rgba(0,0,0,.04);
  backdrop-filter:blur(10px);
}
.construction-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 14px; border-radius:var(--r-pill);
  background:rgba(var(--accent-rgb), .12);
  color:var(--accent);
  font-size:12px; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:24px;
}
.construction-eyebrow svg{ animation:construction-spin 8s linear infinite; }
@keyframes construction-spin{ from{transform:rotate(0)} to{transform:rotate(360deg)} }
.construction-title{
  font-size:clamp(28px, 4.5vw, 44px);
  line-height:1.15; font-weight:900;
  margin:0 0 20px;
  color:var(--text);
  letter-spacing:-.02em;
}
.construction-message{
  font-size:17px; line-height:1.65;
  color:var(--muted);
  max-width:520px; margin:0 auto 32px;
}
.construction-progress{
  height:4px; width:100%; max-width:280px;
  margin:0 auto 24px;
  background:rgba(var(--accent-rgb), .12);
  border-radius:var(--r-pill); overflow:hidden;
}
.construction-progress-fill{
  height:100%; width:45%;
  background:linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 60%, transparent));
  border-radius:var(--r-pill);
  animation:construction-progress 2.4s ease-in-out infinite;
}
@keyframes construction-progress{
  0%   { transform:translateX(-100%); width:45%; }
  50%  { transform:translateX(50%);   width:80%; }
  100% { transform:translateX(220%);  width:45%; }
}
.construction-foot small{ color:var(--muted); font-size:13px; }

/* Fundo decorativo: bolhas sutis */
.construction-bg{ position:absolute; inset:0; z-index:1; pointer-events:none; }
.construction-bg span{
  position:absolute; border-radius:50%;
  background:radial-gradient(circle, rgba(var(--accent-rgb), .14), transparent 70%);
  filter:blur(40px);
  animation:construction-float 14s ease-in-out infinite;
}
.construction-bg span:nth-child(1){ top:-100px; left:-80px;  width:320px; height:320px; animation-delay:0s; }
.construction-bg span:nth-child(2){ bottom:-120px; right:-60px; width:380px; height:380px; animation-delay:-4s; }
.construction-bg span:nth-child(3){ top:40%; left:50%; width:240px; height:240px; animation-delay:-9s; }
@keyframes construction-float{
  0%,100% { transform:translate(0,0) scale(1); opacity:.7; }
  50%     { transform:translate(30px,-40px) scale(1.1); opacity:1; }
}

/* ════════════════════════════════════════════════════════════════
   alpha.174 — Timeline robusta de rastreio com mapa
   ════════════════════════════════════════════════════════════════ */
.track-map-wrap{
  position:relative; width:100%;
  height:300px; margin:16px 0 20px;
  border:1px solid var(--line);
  border-radius:var(--r-sm); overflow:hidden;
  background:#f0f0f0;
}
.track-map-wrap .leaflet-container{ border-radius:var(--r-sm); }
.track-map-info{
  position:absolute; bottom:10px; left:10px; z-index:500;
  background:var(--panel); padding:6px 12px;
  border-radius:var(--r-xs); font-size:12px;
  border:1px solid var(--line);
  box-shadow:0 2px 8px rgba(0,0,0,.08);
}
.track-marker{
  display:flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:50%;
  background:var(--accent); color:#fff;
  font-weight:900; font-size:13px;
  box-shadow:0 2px 8px rgba(0,0,0,.25);
  border:2px solid #fff;
}
.track-marker.delivered{ background:var(--green); }
.track-marker.first{ background:#3b82f6; }

/* alpha.781 — animação das etapas no mapa de rastreio */
.track-marker-anim{ transform:scale(0); opacity:0; transform-origin:center; }
.track-marker-anim.is-on{ animation:trkMarkerPop .5s cubic-bezier(.34,1.56,.64,1) forwards; }
@keyframes trkMarkerPop{ 0%{transform:scale(0);opacity:0} 60%{transform:scale(1.18);opacity:1} 100%{transform:scale(1);opacity:1} }
.track-pkg{
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%;
  background:var(--card,#fff); font-size:19px; line-height:1;
  box-shadow:0 4px 14px rgba(0,0,0,.32);
  border:2px solid var(--accent); position:relative;
}
.track-pkg::after{
  content:''; position:absolute; inset:-6px; border-radius:50%;
  border:2px solid var(--accent); opacity:.55;
  animation:trkPkgPulse 1.4s ease-out infinite;
}
@keyframes trkPkgPulse{ 0%{transform:scale(.7);opacity:.6} 100%{transform:scale(1.5);opacity:0} }
.track-pkg.is-final{ border-color:var(--green,#16a34a); }
.track-pkg.is-final::after{ display:none; }
@media (prefers-reduced-motion: reduce){
  .track-marker-anim{ transform:none; opacity:1; }
  .track-pkg::after{ animation:none; }
}
/* alpha.782 — o seletor de camadas (Mapa/Satélite) do Leaflet herdava o estilo GRANDE de radio do
   site (chips). Normaliza só dentro do mapa de rastreio: radios nativos pequenos + rótulos compactos. */
.track-map-wrap .leaflet-control-layers{ border-radius:10px; box-shadow:0 2px 10px rgba(0,0,0,.18); border:1px solid rgba(0,0,0,.08); }
.track-map-wrap .leaflet-control-layers-toggle{ width:34px; height:34px; background-size:20px 20px; }
.track-map-wrap .leaflet-control-layers-expanded{ padding:8px 12px 8px 10px; font-size:13px; color:#333; }
.track-map-wrap .leaflet-control-layers-list label{ display:flex; align-items:center; gap:7px; margin:3px 0; font-weight:600; cursor:pointer; }
.track-map-wrap .leaflet-control-layers-list .leaflet-control-layers-selector{
  -webkit-appearance:radio; appearance:radio;
  width:15px; height:15px; min-width:15px; min-height:15px; max-width:15px; max-height:15px;
  margin:0; padding:0; border:0; background:none; box-shadow:none; accent-color:var(--accent); flex:0 0 auto;
}
.track-map-wrap .leaflet-control-layers-separator{ margin:6px 0; }

/* alpha.783 — botão do comprovante de entrega no rastreador público */
.track-pod-btn{
  display:flex; align-items:center; justify-content:center; gap:8px;
  margin:14px 0 4px; padding:13px 16px; width:100%;
  border-radius:var(--r-sm,10px); font-weight:800; font-size:14px;
  background:linear-gradient(135deg, color-mix(in srgb, var(--green,#16a34a) 14%, var(--card,#fff)), var(--card,#fff));
  color:var(--green,#16a34a); border:1.5px solid color-mix(in srgb, var(--green,#16a34a) 45%, transparent);
  text-decoration:none; transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.track-pod-btn:hover{ transform:translateY(-1px); box-shadow:0 6px 18px color-mix(in srgb, var(--green,#16a34a) 22%, transparent); text-decoration:none; }

/* Timeline robusta — exibe TODOS os eventos com mais info */
.track-timeline-pro{
  position:relative; padding:8px 0;
}
.track-timeline-pro::before{
  content:''; position:absolute;
  left:14px; top:8px; bottom:8px;
  width:2px; background:linear-gradient(180deg, var(--accent) 0%, var(--line) 100%);
  border-radius:1px;
}
.track-event-pro{
  position:relative; padding:8px 8px 18px 44px;
  transition:.2s;
}
.track-event-pro:hover{ background:rgba(var(--accent-rgb), .04); border-radius:var(--r-xs); }
.track-event-pro-marker{
  position:absolute; left:6px; top:14px;
  width:18px; height:18px; border-radius:50%;
  background:var(--panel);
  border:3px solid var(--line);
  z-index:1;
}
.track-event-pro.is-latest .track-event-pro-marker{
  border-color:var(--accent);
  background:var(--accent);
  box-shadow:0 0 0 4px rgba(var(--accent-rgb), .2);
  animation:track-pulse 2s ease-in-out infinite;
}
.track-event-pro.is-delivered .track-event-pro-marker{
  border-color:var(--green); background:var(--green);
  box-shadow:0 0 0 4px rgba(34,197,94,.2);
}
@keyframes track-pulse{
  0%,100% { box-shadow:0 0 0 4px rgba(var(--accent-rgb), .2); }
  50%     { box-shadow:0 0 0 8px rgba(var(--accent-rgb), .35); }
}
.track-event-pro-date{
  display:block; font-size:12px; font-weight:700;
  color:var(--muted); margin-bottom:4px;
  text-transform:uppercase; letter-spacing:.04em;
}
.track-event-pro-title{
  display:block; font-size:15px; font-weight:800;
  color:var(--text); margin-bottom:4px;
}
.track-event-pro-loc{
  display:inline-flex; align-items:center; gap:4px;
  font-size:13px; color:var(--muted);
  margin-right:8px;
}
.track-event-pro-loc::before{ content:'📍'; font-size:12px; }
.track-event-pro-desc{
  font-size:13px; color:var(--muted);
  margin:6px 0 0; line-height:1.5;
}
.track-event-pro.is-latest .track-event-pro-title{ color:var(--accent); }
.track-event-pro.is-delivered .track-event-pro-title{ color:var(--green); }

.track-summary-card{
  background:linear-gradient(135deg, rgba(var(--accent-rgb),.08), rgba(var(--accent-rgb),.02));
  border:1px solid rgba(var(--accent-rgb),.2);
  border-radius:var(--r-sm);
  padding:18px 20px;
  margin-bottom:18px;
  display:grid; grid-template-columns:1fr auto; gap:12px;
  align-items:center;
}
.track-summary-card.is-delivered{
  background:linear-gradient(135deg, rgba(34,197,94,.08), rgba(34,197,94,.02));
  border-color:rgba(34,197,94,.3);
}
.track-summary-stat{ font-size:12px; color:var(--muted); font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.track-summary-value{ font-size:18px; font-weight:900; color:var(--text); margin-top:2px; }
.track-summary-eta{ text-align:right; font-size:13px; color:var(--muted); }
.track-summary-eta strong{ display:block; font-size:16px; color:var(--text); margin-top:2px; }
/* alpha.1019 — no mobile o card 1fr+auto não tinha stack: o pill do ETA (min-content largo) cortava no overflow-x:hidden */
@media(max-width:480px){ .track-summary-card{ grid-template-columns:1fr } .track-summary-eta{ text-align:left } }
/* alpha.797 — ETA estimado (calculado, não confirmado pela transportadora) */
.track-summary-eta.is-estimate strong{ color:var(--muted); text-decoration:underline; text-decoration-style:dashed; text-underline-offset:3px; }

/* ════════════════════════════════════════════════════════════════
   alpha.207 — Sidenav ÁRVORE EXPANSÍVEL: clica na categoria -> abre itens
   ════════════════════════════════════════════════════════════════ */

/* Esconde resquícios do sistema antigo de flyout */
.sidenav-tree-group .sidenav-trigger,
.sidenav-tree-group .sidenav-flyout,
.sidenav-tree-group .sidenav-flyout-head { display:none !important; }

.sidenav-nav{ gap:0 !important; padding:8px 8px 16px !important; }

/* Grupo (categoria) */
/* alpha.264 — o grupo tambem tem .nav-group (display:flex;align-items:center,
   horizontal, do dropdown antigo). Forcamos coluna + stretch p/ os filhos
   ocuparem 100% da largura e os rotulos alinharem na mesma coluna. */
.sidenav-tree-group{ display:flex !important; flex-direction:column !important; align-items:stretch !important; width:100% !important; margin-bottom:2px; }
.sidenav-tree-group > .sidenav-tree-trigger,
.sidenav-tree-group > .sidenav-tree-items{ width:100% !important; }

/* Cabeçalho clicável da categoria — GRID p/ alinhamento perfeito:
   [icone 20px] [label 1fr] [caret 16px] */
.sidenav-tree-trigger{
  display:grid !important;
  grid-template-columns:20px 1fr 16px !important;
  align-items:center; gap:10px;
  width:100%; padding:9px 12px;
  font:inherit; font-size:13.5px; font-weight:800;
  color:var(--text); background:transparent; border:none;
  cursor:pointer; text-align:left; border-radius:var(--r-xs);
  box-sizing:border-box;
  transition:background .12s ease, color .12s ease;
}
.sidenav-tree-trigger:hover{ background:color-mix(in srgb, var(--accent) 7%, transparent); }
.sidenav-tree-group.active > .sidenav-tree-trigger{ color:var(--accent); }

/* Ícone da categoria — grid cell com centralização perfeita */
.sidenav-tree-icon{
  grid-column:1;
  width:20px; height:18px;
  display:grid; place-items:center;
  opacity:.75; color:currentColor;
  overflow:hidden;
}
.sidenav-tree-icon svg{ width:17px !important; height:17px !important; display:block; }
.sidenav-tree-group.active > .sidenav-tree-trigger .sidenav-tree-icon{ opacity:1; }

.sidenav-tree-cat{ grid-column:2; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Seta (gira ao abrir) — fica na 3ª coluna, sempre alinhada à direita */
.sidenav-tree-caret{
  grid-column:3;
  display:inline-flex; align-items:center; justify-content:center;
  width:16px; color:var(--muted);
  transition:transform .22s ease, color .12s ease;
}
.sidenav-tree-group.is-open > .sidenav-tree-trigger .sidenav-tree-caret{
  transform:rotate(90deg); color:var(--accent);
}

/* Container dos itens — colapsado por padrão, expande quando is-open */
.sidenav-tree-items{
  display:flex; flex-direction:column;
  max-height:0; overflow:hidden;
  transition:max-height .26s cubic-bezier(.4,0,.2,1);
  margin-left:9px;
  border-left:1.5px solid var(--line);
  padding-left:2px;
}
.sidenav-tree-group.is-open > .sidenav-tree-items{
  max-height:900px;
  margin-bottom:6px;
}

/* Item (subcategoria) */
.sidenav-tree-item{
  position:relative; display:flex; align-items:center; gap:9px;
  padding:7px 12px 7px 14px;
  font-size:13px; font-weight:500; color:var(--muted);
  text-decoration:none; line-height:1.35;
  transition:color .12s ease, background .12s ease;
}
.sidenav-tree-item:hover{ color:var(--text); background:color-mix(in srgb, var(--accent) 5%, transparent); }
.sidenav-tree-item-icon{
  flex-shrink:0; width:13px; height:13px;
  display:inline-flex; align-items:center; justify-content:center;
  opacity:.6; color:currentColor;
}
.sidenav-tree-item-icon svg{ width:13px; height:13px; }
.sidenav-tree-item-label{ flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Item ativo */
.sidenav-tree-item.current{
  color:var(--accent); font-weight:700;
  background:color-mix(in srgb, var(--accent) 8%, transparent);
}
.sidenav-tree-item.current::before{
  content:''; position:absolute; left:-3.5px; top:6px; bottom:6px;
  width:2px; background:var(--accent); border-radius:2px;
}
.sidenav-tree-item.current .sidenav-tree-item-icon{ color:var(--accent); opacity:1; }

/* Sub-itens (3º nível, ex: Configurações -> Interface/Menu/...) */
.sidenav-tree-children{ display:flex; flex-direction:column; margin:1px 0 3px 22px; border-left:1px solid var(--line); }
.sidenav-tree-subitem{
  position:relative; display:block; padding:5px 10px 5px 12px;
  font-size:12px; font-weight:500; color:var(--muted);
  text-decoration:none; line-height:1.35;
  transition:color .12s ease, background .12s ease;
}
.sidenav-tree-subitem:hover{ color:var(--text); background:color-mix(in srgb, var(--accent) 4%, transparent); }
.sidenav-tree-subitem.current{ color:var(--accent); font-weight:700; background:color-mix(in srgb, var(--accent) 6%, transparent); }
.sidenav-tree-subitem.current::before{
  content:''; position:absolute; left:-1px; top:4px; bottom:4px; width:2px; background:var(--accent); border-radius:2px;
}

/* ── Modo rail (collapsed, desktop): só ícones das categorias ── */
@media (min-width: 861px) {
  body.sidenav-collapsed .sidenav-tree-cat,
  body.sidenav-collapsed .sidenav-tree-caret,
  body.sidenav-collapsed .sidenav-tree-items{ display:none !important; }
  body.sidenav-collapsed .sidenav-tree-trigger{ justify-content:center; padding:10px 0; }
  body.sidenav-collapsed .sidenav-tree-icon{ width:20px; height:20px; }
  body.sidenav-collapsed .sidenav-tree-icon svg{ width:19px; height:19px; }
}

/* ── Mobile: toque maior ── */
@media (max-width: 860px) {
  .sidenav-tree-trigger{ padding:12px 16px; font-size:15px; }
  .sidenav-tree-item{ padding:10px 16px; font-size:14px; }
  .sidenav-tree-subitem{ padding:8px 16px; font-size:13px; }
}


/* alpha.196 — Campo travado (valor vem do perfil) */
.locked-profile-field{background:color-mix(in srgb,var(--muted) 8%,transparent)!important;cursor:not-allowed;color:var(--muted)}
.field-lock-note{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.field-lock-note a{color:var(--accent);font-weight:700;text-decoration:none}
.field-lock-note a:hover{text-decoration:underline}

/* alpha.202 — Foto de progresso cifrada (calculadora corporal) */
.body-photo-block{border:1px dashed var(--line-strong,var(--line));border-radius:var(--r-sm);padding:14px;background:var(--panel-2);margin:4px 0}
.body-photo-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.body-photo-title{font-size:14px;font-weight:850;color:var(--text)}
.body-photo-opt{font-weight:600;color:var(--muted);font-size:12px}
.body-photo-drive{font-size:11px;font-weight:800;padding:3px 9px;border-radius:var(--r-pill)}
.body-photo-drive.on{color:var(--green,#16a34a);background:rgba(22,163,74,.12)}
.body-photo-drive.off{color:var(--muted);background:color-mix(in srgb,var(--muted) 14%,transparent)}
.body-photo-input{display:block;width:100%;font-size:13px;margin:4px 0}
.body-photo-note{display:block;font-size:11.5px;color:var(--muted);line-height:1.5;margin-top:4px}
.body-photo-thumb{font-size:15px;text-decoration:none;cursor:pointer}
.body-photo-thumb:hover{opacity:.7}

/* alpha.205 — CTA de login no resultado da calculadora (nao logado) */
.calc-login-cta{
  margin-top:18px;padding:16px;border-radius:var(--r-sm);text-align:center;
  border:1px solid var(--line);background:var(--panel-2);
  transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.calc-login-cta.is-active{
  border-color:rgba(var(--accent-rgb),.45);
  background:color-mix(in srgb,var(--accent) 7%,var(--panel-2));
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.10);
  animation:calcCtaPop .35s ease;
}
@keyframes calcCtaPop{0%{transform:scale(.98)}60%{transform:scale(1.015)}100%{transform:scale(1)}}
.calc-login-cta-icon{
  width:42px;height:42px;margin:0 auto 8px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(var(--accent-rgb),.12);color:var(--accent);
}
.calc-login-cta-title{display:block;font-size:15px;font-weight:900;color:var(--text);margin-bottom:5px}
.calc-login-cta-text{font-size:12.5px;line-height:1.55;color:var(--muted);margin:0 0 12px}
.calc-login-cta-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}

/* alpha.216 — badge de tema interno no editor de temas */
.theme-badge-builtin{
  display:inline-block;font-size:10px;font-weight:800;text-transform:uppercase;
  letter-spacing:.05em;padding:2px 7px;border-radius:var(--r-pill);vertical-align:middle;
  background:color-mix(in srgb,var(--muted) 16%,transparent);color:var(--muted);
  margin-left:4px;
}

/* ════════════════════════════════════════════════════════════════════
   alpha.222 — Aba "Acompanhamento" (hidratação, atividade, semana,
   metas, lembretes). Usa tokens do tema atual (--accent, --panel, etc.)
   ═══════════════════════════════════════════════════════════════════ */
/* alpha.241 — Grid de Acompanhamento corrigido: usa 2 colunas em desktop,
   1 em mobile, e respeita altura natural de cada card (align-items:start).
   Antes estava com auto-fit/minmax que esticava cards demais em telas
   largas e quebrava o alinhamento dos 5 painéis. */
.track-grid{
  display:grid;gap:14px;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  align-items:start;
}
.track-grid>.track-card{min-width:0}
.track-card-week{grid-row:span 1}
@media (min-width:1100px){
  .track-grid{grid-template-columns:repeat(3, minmax(0, 1fr))}
}
@media (max-width:680px){
  .track-grid{grid-template-columns:1fr}
}
.track-card{display:flex;flex-direction:column;gap:12px}
.track-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.track-card-head h3{margin:0;font-size:16px;font-weight:900;color:var(--text)}
.track-card-head small,.track-week-range{font-size:11.5px;color:var(--muted);font-weight:700}

/* --- Metas (Meu plano) --- */
.track-goal-row{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;border-bottom:1px dashed color-mix(in srgb,var(--line) 60%,transparent)}
.track-goal-row:last-child{border-bottom:0}
.track-goal-lbl{font-size:13px;color:var(--muted);font-weight:600}
.track-goal-row strong{font-size:14.5px;color:var(--text);font-weight:900}
.track-goals-form{display:flex;flex-direction:column;gap:10px}
.track-goals-form label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);font-weight:700}
.track-goals-form input,.track-goals-form select{
  padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-xs);
  background:var(--panel-2);color:var(--text);font-size:14px;
}
.track-form-actions{display:flex;gap:8px;margin-top:4px}

/* --- Resumo semanal --- */
.track-card-week{background:linear-gradient(135deg, color-mix(in srgb,var(--accent) 6%,var(--panel)), var(--panel))}
.track-score-wrap{text-align:center;padding:4px 0 2px}
.track-score-num{font-size:36px;font-weight:950;color:var(--accent);line-height:1;letter-spacing:-.02em}
.track-score-label{font-size:13px;color:var(--muted);font-weight:700;margin-top:4px}
.track-score-bar{height:6px;background:color-mix(in srgb,var(--line) 70%,transparent);border-radius:var(--r-pill);overflow:hidden;margin-top:10px}
.track-score-bar>span{display:block;height:100%;background:var(--accent);transition:width .4s ease;border-radius:var(--r-pill)}
.track-week-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}
.track-week-stats>div{
  display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:8px 4px;background:var(--panel-2);border:1px solid var(--line);
  border-radius:var(--r-sm);text-align:center;
}
.track-week-stats span{font-size:16px;line-height:1}
.track-week-stats strong{font-size:14px;font-weight:900;color:var(--text)}
.track-week-stats small{font-size:10px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.04em}

/* --- Hidratação. alpha.243 — copo redesenhado como glass de verdade,
   mais largo, com base arredondada e marcas de 25/50/75/100% sutis. --- */
/* alpha.357 — Hidratação como GARRAFA d'água: água mexendo (2 ondas em loop) + bolhas subindo.
   O nível é controlado pelo JS via a variável --twl (0–100) no .track-water-gauge. */
.track-water-gauge{ position:relative; width:96px; height:150px; margin:0 auto 6px; background:transparent; border:0; overflow:visible; }
.track-water-gauge .twb-svg{ width:100%; height:100%; display:block; overflow:visible; }
.twb-glass{ fill:color-mix(in srgb,#60a5fa 9%, var(--panel-2)); }
.twb-outline{ fill:none; stroke:color-mix(in srgb,#2563eb 40%, var(--line-strong)); stroke-width:2.4; stroke-linejoin:round; }
.twb-cap{ fill:color-mix(in srgb,#1d4ed8 55%, var(--line-strong)); }
/* nível da água — sobe/desce conforme --twl (transição suave ao registrar água) */
.twb-level{ transform:translateY(calc((100 - var(--twl,0)) * 1.46px)); transition:transform .6s cubic-bezier(.34,1.3,.5,1); }
/* superfície que "mexe": duas ondas deslizando em loop (path tem 184 = 2× a largura) */
.twb-wave.w1{ fill:url(#twbWater); animation:twb-slosh 2.6s linear infinite; }
.twb-wave.w2{ fill:#93c5fd; opacity:.5; animation:twb-slosh2 3.6s linear infinite; }
@keyframes twb-slosh{ from{transform:translateX(0)} to{transform:translateX(-92px)} }
@keyframes twb-slosh2{ from{transform:translateX(-92px)} to{transform:translateX(0)} }
/* bolhas subindo */
.twb-bub{ fill:rgba(255,255,255,.9); opacity:0; animation:twb-bub var(--bd,5s) ease-in infinite; }
@keyframes twb-bub{ 0%{transform:translateY(0);opacity:0} 14%{opacity:.85} 80%{opacity:.45} 100%{transform:translateY(-122px);opacity:0} }
/* alpha.436 — respingos (splash) quando a água sobe */
.twb-drop{ fill:#bae6fd; opacity:0; animation:twb-drop .68s cubic-bezier(.2,.7,.3,1) forwards; }
@keyframes twb-drop{ 0%{transform:translate(0,0);opacity:0} 12%{opacity:1} 100%{transform:translate(var(--dx,0),var(--dy,-20px));opacity:0} }
/* alpha.436 — fogos de artifício ao desbloquear conquista */
.zk-fw{position:fixed;inset:0;z-index:4000;pointer-events:none;overflow:hidden}
.zk-fw-p{position:absolute;width:7px;height:7px;margin:-3px 0 0 -3px;border-radius:50%;will-change:transform,opacity;animation:zk-fw-burst 1.15s ease-out forwards}
@keyframes zk-fw-burst{0%{transform:translate(0,0) scale(1);opacity:1}70%{opacity:1}100%{transform:translate(var(--fx,0),var(--fy,60px)) scale(.35);opacity:0}}
/* alpha.435 — ondas/bolhas da garrafa mantidas mesmo com "reduzir movimento" (assinatura do produto). */

/* alpha.358 — Histórico de MEDIDAS em cards completos (todas as circunferências) */
.bmh-list{display:flex;flex-direction:column;gap:10px}
.bmh-card{border:1px solid var(--line,#e8eaef);border-radius:var(--r-sm);padding:12px 14px;background:var(--panel,var(--panel,#fff))}
.bmh-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}
.bmh-date{display:inline-flex;align-items:center;gap:6px;font-weight:850;font-size:13.5px;color:var(--text)}
.bmh-date svg{color:var(--muted);flex:0 0 auto}
.bmh-actions{display:inline-flex;align-items:center;gap:6px}
.bmh-photo{text-decoration:none;font-size:14px;line-height:1}
.bmh-iconbtn{border:0;background:transparent;color:var(--muted);cursor:pointer;width:28px;height:28px;border-radius:var(--r-xs);display:inline-flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.bmh-iconbtn:hover{background:color-mix(in srgb,#dc2626 12%,transparent);color:#dc2626}
.bmh-chips{display:flex;flex-wrap:wrap;gap:7px}
.bmh-chip{font-size:12px;color:var(--muted);background:color-mix(in srgb,var(--accent,#2563eb) 8%,var(--panel-2,#f4f5f8));border:1px solid color-mix(in srgb,var(--accent,#2563eb) 14%,transparent);padding:4px 9px;border-radius:var(--r-xs);white-space:nowrap}
.bmh-chip b{color:var(--text);font-weight:800}
.bmh-chip.bmh-empty{background:transparent;border-style:dashed;color:var(--muted)}
.bmh-d{font-weight:800;font-size:11px}
.bmh-d.down{color:#16a34a}
.bmh-d.up{color:#dc2626}
/* alpha.627 — ícone de tendência (↗/↘) ao lado dos deltas; herda a cor do .up/.down */
.zk-dico{display:inline-block;width:11px;height:11px;vertical-align:-1px;margin-right:2px;flex:0 0 auto}

/* alpha.362 — Módulo de Doses: resumo + custo do tratamento + histórico + evolução */
.dose-mod{display:flex;flex-direction:column;gap:14px;margin-top:16px}
.dm-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.dms-card{background:var(--panel,var(--panel,#fff));border:1px solid var(--line,#e8eaef);border-radius:var(--r-sm);padding:12px 8px;text-align:center;display:flex;flex-direction:column;gap:1px}
.dms-card em{font-size:10.5px;font-weight:700;color:var(--muted);font-style:normal}
.dms-card span{font-size:22px;font-weight:950;line-height:1.1;color:var(--text)}
.dms-card span.green{color:#16a34a}
.dms-card small{font-size:10px;color:var(--muted)}
@media(max-width:560px){.dm-summary{grid-template-columns:repeat(2,1fr)}}
.dmc-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.dmc-head strong{font-size:15px;font-weight:850}
.dmc-head small{color:var(--muted);font-size:12px}
.dm-chart{width:100%}
.dm-chart-svg{width:100%;height:auto;display:block}
.dm-chart-legend{text-align:center;margin-top:6px;font-size:12px;color:#4f46e5;font-weight:700}
.dcost-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
@media(max-width:560px){.dcost-grid{grid-template-columns:1fr}}
.dcost-card{background:var(--panel-2,#f4f5f8);border-radius:var(--r-sm);padding:12px;display:flex;flex-direction:column;gap:3px}
.dcost-ic{width:30px;height:30px;border-radius:var(--r-xs);display:flex;align-items:center;justify-content:center;font-size:15px;background:rgba(99,102,241,.12);margin-bottom:3px}
.dcost-card.t2 .dcost-ic{background:rgba(217,119,6,.14)}
.dcost-card.t3 .dcost-ic{background:rgba(16,185,129,.14)}
.dcost-card small{font-size:11px;color:var(--muted)}
.dcost-card b{font-size:16px;font-weight:900}
.dcost-card.t1 b{color:#4f46e5}.dcost-card.t2 b{color:#d97706}.dcost-card.t3 b{color:#059669}
.dcost-total{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,rgba(37,99,235,.10),rgba(37,99,235,.02));border:1px solid rgba(37,99,235,.18);border-radius:var(--r-sm);padding:14px 16px}
.dcost-ic.big{width:40px;height:40px;font-size:18px;background:rgba(37,99,235,.16)}
.dcost-total small{display:block;font-size:12px;color:var(--muted)}
.dcost-total b{font-size:24px;font-weight:950;color:#2563eb}
.dcost-foot{text-align:center;font-size:11.5px;color:var(--muted);margin:10px 0 0}
.dm-hist{display:flex;flex-direction:column;gap:10px}
.dh-card{background:var(--panel-2,#f8fafc);border:1px solid var(--line,#e8eaef);border-radius:var(--r-sm);padding:12px 14px}
.dh-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.dh-top strong{font-size:18px;font-weight:950}
.dh-u{font-size:12px;color:var(--muted);font-weight:700}
.dh-brand{font-size:11px;font-weight:800;background:var(--panel,#fff);border:1px solid var(--line);border-radius:var(--r-2xs);padding:2px 8px;letter-spacing:.3px}
.dh-tag{font-size:11px;font-weight:800;color:#059669;background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.3);border-radius:var(--r-lg);padding:2px 9px}
.dh-sub{font-size:12px;color:var(--muted);margin:4px 0 8px}
.dh-chips{display:flex;flex-wrap:wrap;gap:7px}
.dh-chip{font-size:11.5px;color:var(--muted);background:var(--panel,#fff);border:1px solid var(--line);border-radius:var(--r-lg);padding:3px 10px}
.dh-chip.cost{color:#059669;border-color:rgba(16,185,129,.3)}

/* alpha.358 — modal de aviso "Dose Muito Recente" */
.drw-backdrop{position:fixed;inset:0;z-index:10000;background:rgba(2,6,23,.55);display:none;align-items:center;justify-content:center;padding:18px}
.drw-modal{background:var(--panel,#fff);border-radius:var(--r-md);max-width:380px;width:100%;padding:20px;box-shadow:0 24px 60px rgba(0,0,0,.35);border:2px solid color-mix(in srgb,#dc2626 35%,transparent);animation:drwIn .25s ease}
@keyframes drwIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
.drw-title{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:900;color:#dc2626;margin-bottom:14px}
.drw-ic{flex:0 0 auto;width:34px;height:34px;border-radius:var(--r-sm);background:color-mix(in srgb,#dc2626 14%,transparent);display:flex;align-items:center;justify-content:center;color:#dc2626}
.drw-box{background:color-mix(in srgb,#dc2626 7%,var(--panel-2,#fef2f2));border-radius:var(--r-sm);padding:13px 14px;display:flex;flex-direction:column;gap:9px;margin-bottom:14px}
.drw-row{display:flex;align-items:center;gap:9px;color:#b91c1c}
.drw-row svg{flex:0 0 auto;opacity:.8}
.drw-row small{display:block;font-size:11px;opacity:.85}
.drw-row strong{display:block;font-size:15px;font-weight:850}
.drw-ago{font-size:13px;font-weight:800;color:#dc2626;text-align:center;padding-top:6px;border-top:1px solid color-mix(in srgb,#dc2626 18%,transparent)}
.drw-warn{font-size:12.5px;line-height:1.5;color:var(--text);margin:0 0 16px}
.drw-warn strong{color:#dc2626}
.drw-actions{display:flex;gap:10px}
.drw-actions .btn{flex:1;justify-content:center}
.drw-actions .btn.danger{background:#dc2626;color:#fff;border-color:#dc2626}
.drw-actions .btn.danger:hover{background:#b91c1c}
.track-water-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.track-water-quick .btn{
  font-size:12px;padding:9px 4px;min-height:38px;
  font-weight:700;transition:all .15s ease;
}
.track-water-quick .btn:hover{
  background:color-mix(in srgb,#2563eb 12%,var(--panel));
  border-color:#2563eb;color:#1d4ed8;transform:translateY(-1px);
}
.track-water-quick .btn:active{transform:translateY(0) scale(.96)}
.track-water-quick .btn.is-loading{opacity:.6;cursor:wait}
.track-water-quick .btn.is-success{
  background:#10b981 !important;border-color:#10b981 !important;color:#fff !important;
  animation:water-pulse .8s ease;
}
@keyframes water-pulse{
  0%{transform:scale(1)}
  35%{transform:scale(1.08)}
  100%{transform:scale(1)}
}
.track-water-items{display:flex;flex-direction:column;gap:4px;max-height:140px;overflow:auto;margin-top:4px}
.track-water-item{
  display:grid;grid-template-columns:48px 1fr 26px;align-items:center;gap:8px;
  padding:5px 8px;background:var(--panel-2);border-radius:var(--r-2xs);font-size:12.5px;
}
.track-water-item strong{font-weight:800;color:var(--text)}
.track-water-item>span:first-child{font-family:ui-monospace,monospace;color:var(--muted);font-size:11.5px}
.link-btn{background:transparent;border:0;color:var(--muted);cursor:pointer;font-size:16px;line-height:1;padding:2px 6px;border-radius:var(--r-2xs)}
.link-btn:hover{background:color-mix(in srgb,var(--red,#ef4444) 12%,transparent);color:var(--red,#ef4444)}

/* --- Atividade física --- */
.track-activity-form{display:flex;flex-direction:column;gap:10px;margin-bottom:6px}
.track-activity-form .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.track-activity-form label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);font-weight:700}
.track-activity-form input,.track-activity-form select{
  padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-xs);
  background:var(--panel-2);color:var(--text);font-size:13.5px;
}
.track-activity-list{display:flex;flex-direction:column;gap:6px;max-height:240px;overflow:auto}
.track-act-item{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 10px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-xs);
}
.track-act-item>div{display:flex;flex-direction:column;gap:1px}
.track-act-item>div:last-child{text-align:right}
.track-act-item strong{font-size:13.5px;font-weight:900;color:var(--text)}
.track-act-item small{font-size:11px;color:var(--muted);font-weight:600;text-transform:capitalize}
.track-act-cal{font-size:13px;font-weight:900;color:var(--accent)}

/* --- Push --- */
.track-push-status{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}

@media (max-width:600px){
  .track-week-stats{grid-template-columns:repeat(2,1fr)}
  .track-water-quick{grid-template-columns:repeat(2,1fr)}
  .track-activity-form .form-grid{grid-template-columns:1fr}
}

/* ════════════════════════════════════════════════════════════════════
   alpha.224 — Aba "Corpo" expandida (strip de metricas, tags, medidas
   principais/avancadas, em-breve, dica rotativa, toggle)
   ═══════════════════════════════════════════════════════════════════ */

/* Strip de metricas */
.body-metrics-strip{
  display:grid;gap:10px;margin-bottom:16px;
  grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
}
.body-metric-card{
  position:relative;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:12px 14px;
  display:flex;flex-direction:column;gap:2px;
  box-shadow:0 1px 0 color-mix(in srgb,var(--line) 30%,transparent);
}
.body-metric-card .bm-icon{font-size:18px;opacity:.7;line-height:1;margin-bottom:4px}
.body-metric-card strong{font-size:20px;font-weight:950;color:var(--text);line-height:1.1;letter-spacing:-.02em}
.body-metric-card em{font-style:normal;font-size:11.5px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.body-metric-bmi{padding-bottom:32px}
.bm-badge{
  position:absolute;left:14px;bottom:10px;
  font-size:10.5px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;
  padding:2px 8px;border-radius:var(--r-pill);
}
.bm-badge-success{background:rgba(22,163,74,.14);color:#15803d}
.bm-badge-info{background:rgba(37,99,235,.12);color:#1d4ed8}
.bm-badge-warning{background:rgba(234,179,8,.16);color:#92400e}
.bm-badge-danger{background:rgba(239,68,68,.14);color:#b91c1c}
.bm-badge-muted{background:color-mix(in srgb,var(--muted) 14%,transparent);color:var(--muted)}
/* alpha.651 — pincelada de cor: ícone da métrica vira "chip" tematizado (acompanha o tema).
   Semânticas fixas onde há significado: perdido=verde, IMC=azul. */
.body-metric-card .bm-icon{
  width:34px;height:34px;opacity:1;margin-bottom:7px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:var(--r-xs);
  background:rgba(var(--accent-rgb),.12);color:var(--accent);
}
.body-metric-card.bm-pos .bm-icon{background:rgba(22,163,74,.14);color:var(--green)}
.body-metric-card.bm-pos strong{color:var(--green)}
.body-metric-card.bm-info .bm-icon{background:rgba(37,99,235,.12);color:var(--blue)}
/* painel de resultado da dose ganha identidade accent no topo */
.calc-result-panel{border-top:3px solid var(--accent)}

/* Tags rapidas (chips) */
.body-tags-row{display:flex;flex-direction:column;gap:6px;margin:2px 0}
.body-tags-label{font-size:12.5px;color:var(--muted);font-weight:700}
.body-tags-chips{display:flex;flex-wrap:wrap;gap:6px}
.body-tag-chip{position:relative;cursor:pointer}
.body-tag-chip input{position:absolute;opacity:0;pointer-events:none}
.body-tag-chip span{
  display:inline-flex;align-items:center;gap:5px;
  font-size:12.5px;font-weight:700;
  padding:6px 12px;border-radius:var(--r-pill);
  background:var(--panel-2);border:1px solid var(--line);
  color:var(--muted);transition:all .15s ease;
}
.body-tag-chip:hover span{border-color:var(--accent)}
.body-tag-chip input:checked + span{
  background:color-mix(in srgb,var(--accent) 14%,var(--panel));
  border-color:var(--accent);color:var(--text);
}

/* Secao de medidas */
.body-meas-section{margin:4px 0}
.body-meas-title{
  margin:0 0 10px;font-size:13px;font-weight:900;color:var(--text);
  text-transform:uppercase;letter-spacing:.05em;
  padding-bottom:6px;border-bottom:1px solid var(--line);
}
.body-meas-grid{display:grid;gap:8px;grid-template-columns:1fr 1fr}
.body-meas-grid label{
  display:flex;flex-direction:column;gap:3px;
  font-size:12px;font-weight:700;color:var(--muted);
}
.body-meas-grid input{
  padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-xs);
  background:var(--panel-2);color:var(--text);font-size:14px;
  text-align:right;font-variant-numeric:tabular-nums;
}
.body-meas-grid input::after{content:'cm'}

/* Medidas avancadas (collapsible). alpha.237 — header alinhado com
   .body-meas-title (sem icone destacado). */
.body-meas-advanced{
  background:transparent;
  border:0;
  padding:4px 0 0;
}
.body-meas-advanced summary{
  cursor:pointer;list-style:none;
  display:flex;align-items:center;gap:8px;
  margin:0 0 10px;font-size:13px;font-weight:900;color:var(--text);
  text-transform:uppercase;letter-spacing:.05em;
  padding-bottom:6px;border-bottom:1px solid var(--line);
}
.body-meas-advanced summary:hover{color:var(--accent)}
.body-meas-advanced summary::-webkit-details-marker{display:none}
.body-meas-advanced summary::marker{display:none;content:''}
.bma-caret{margin-left:auto;color:var(--muted);transition:transform .2s;font-weight:400}
.body-meas-advanced[open] .bma-caret{transform:rotate(180deg)}
.body-meas-advanced-grid{margin-top:0}

/* Em breve cards */
.body-soon-grid{
  display:grid;gap:10px;margin-top:14px;
  grid-template-columns:1fr 1fr;
}
.body-soon-card{
  text-align:center;padding:20px 14px;
  background:var(--panel);border:1px dashed var(--line-strong);
  border-radius:var(--r-sm);color:var(--muted);
  display:flex;flex-direction:column;align-items:center;gap:4px;
}
.body-soon-card .bs-icon{font-size:24px;opacity:.6}
.body-soon-card strong{font-size:14px;color:var(--text);font-weight:900}
.body-soon-card small{font-size:11.5px}
.body-soon-card.body-soon-ready{border-style:solid;border-color:var(--accent);background:color-mix(in srgb,var(--accent) 6%,var(--panel));cursor:pointer}
.body-soon-card.body-soon-ready strong{color:var(--accent)}

/* Dica rotativa */
.body-tip-card{
  display:grid;grid-template-columns:32px 1fr auto auto;gap:10px;align-items:center;
  background:color-mix(in srgb,var(--accent) 5%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
  border-radius:var(--r-sm);padding:12px 14px;margin-top:14px;
}
.bt-icon{font-size:18px;line-height:1}
.bt-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.bt-title{font-size:13.5px;font-weight:900;color:var(--text)}
.bt-text{font-size:11.5px;color:var(--muted);font-weight:600;line-height:1.4}
.bt-dots{display:flex;gap:4px}
.bt-dot{width:6px;height:6px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--muted) 30%,transparent)}
.bt-dot.active{background:var(--accent)}
.bt-refresh{
  background:transparent;border:0;cursor:pointer;color:var(--muted);
  width:28px;height:28px;border-radius:var(--r-xs);font-size:14px;font-weight:900;
}
.bt-refresh:hover{background:var(--panel);color:var(--accent)}

/* Toggle Gráfico/Histórico */
.body-view-toggle{
  display:flex;gap:0;margin:14px 0 10px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:3px;
}
.bvt-btn{
  flex:1;background:transparent;border:0;cursor:pointer;
  padding:8px 10px;font-size:13px;font-weight:800;color:var(--muted);
  border-radius:var(--r-2xs);transition:all .15s;
}
.bvt-btn.active{background:var(--panel);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.04)}

@media (max-width:600px){
  .body-metrics-strip{grid-template-columns:repeat(2,1fr)}
  .body-soon-grid{grid-template-columns:1fr}
  .body-meas-grid{grid-template-columns:1fr}
  .body-tip-card{grid-template-columns:24px 1fr auto;row-gap:6px}
  .bt-dots{grid-column:1/-1;justify-content:center}
}

/* ════════════════════════════════════════════════════════════════════
   alpha.225 — Ações Rápidas, Próximas Ações, mini-cards de resumo
   (Hidratação compacta, Atividades, Sintomas, Medidas)
   ═══════════════════════════════════════════════════════════════════ */

/* Ações Rápidas */
.body-quick-actions{margin-bottom:14px}
.bqa-title{margin:0 0 8px;font-size:15px;font-weight:900;color:var(--text)}
.bqa-row{display:grid;gap:8px;grid-template-columns:repeat(5,1fr)}
.bqa-btn{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:12px 6px;cursor:pointer;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);
  color:var(--text);font-size:12.5px;font-weight:700;
  transition:all .15s ease;
}
.bqa-btn:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--accent) 12%,transparent)}
.bqa-icon{
  display:grid;place-items:center;width:38px;height:38px;border-radius:var(--r-sm);flex:0 0 38px;
}
.bqa-icon svg{width:20px;height:20px}

/* Próximas Ações */
.body-next-actions{margin-bottom:14px}
.bna-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.bna-head h3{margin:0;font-size:15px;font-weight:900;color:var(--text)}
.bna-icon{font-size:16px}
.bna-list{display:flex;flex-direction:column;gap:6px}
.bna-item{
  display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:10px;
  padding:10px 12px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);
}
.bna-item[data-bna="weight"]{background:color-mix(in srgb,var(--accent) 5%,var(--panel-2));border-color:color-mix(in srgb,var(--accent) 20%,var(--line))}
.bna-li-icon{font-size:16px;width:32px;height:32px;display:grid;place-items:center;background:var(--panel);border-radius:var(--r-xs)}
.bna-li-body{display:flex;flex-direction:column;gap:1px;min-width:0}
.bna-li-body strong{font-size:13.5px;font-weight:900;color:var(--text)}
.bna-li-when{font-size:11.5px;color:var(--muted);font-weight:600}

/* Mini-cards grid no fim */
.body-mini-grid{
  display:grid;gap:12px;margin-top:14px;
  grid-template-columns:1fr 1fr;
}
.body-mini-card{display:flex;flex-direction:column;gap:10px}
.bmc-head{display:flex;align-items:center;gap:8px}
.bmc-head strong{flex:1;font-size:14px;font-weight:900;color:var(--text)}
.bmc-icon{width:30px;height:30px;border-radius:var(--r-xs);display:grid;place-items:center;font-size:15px}
.bmc-more{
  background:transparent;border:0;cursor:pointer;color:var(--accent);
  font-size:11.5px;font-weight:800;padding:2px 6px;border-radius:var(--r-2xs);text-decoration:none;
}
.bmc-more:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}

/* Hidratação compacta */
.bmc-water{display:grid;grid-template-columns:54px 1fr;gap:10px;align-items:center}
.bmc-cups{
  display:flex;flex-direction:column;align-items:center;gap:1px;
  width:54px;height:54px;border-radius:50%;
  border:2px solid color-mix(in srgb,#0284c7 50%,transparent);
  background:rgba(14,165,233,.06);
}
.bmc-cups strong{font-size:14px;font-weight:900;color:var(--text);margin-top:8px}
.bmc-cups small{font-size:9.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.bmc-water-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.bmc-water-row{display:flex;align-items:baseline;justify-content:space-between;gap:6px;font-size:12px}
.bmc-water-row strong{font-size:17px;font-weight:900;color:var(--text)}
.bmc-water-row .muted{font-size:11.5px;color:var(--muted)}
.bmc-progress{height:6px;background:color-mix(in srgb,var(--line) 70%,transparent);border-radius:var(--r-pill);overflow:hidden}
.bmc-progress>span{display:block;height:100%;background:linear-gradient(90deg,#60a5fa,#2563eb);border-radius:var(--r-pill);transition:width .35s ease}
.bmc-cta{color:#0284c7;font-size:11.5px;font-weight:800;text-decoration:none}
.bmc-cta:hover{text-decoration:underline}
.btn.small.full{width:100%;justify-content:center}

/* Atividades pair */
.bmc-pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bmc-pair>div{
  padding:8px 10px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-xs);
  display:flex;flex-direction:column;gap:1px;
}
.bmc-pair strong{font-size:16px;font-weight:900;color:var(--text)}
.bmc-pair small{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;font-weight:700}

/* Sintomas */
.bmc-sympt-empty,.bmc-meas-empty{
  display:flex;flex-direction:column;align-items:center;gap:3px;
  text-align:center;padding:14px 6px;color:var(--muted);
}
.bmc-sympt-empty strong{color:var(--text);font-size:13px}
.bmc-sympt-empty small{font-size:11.5px}
.bmc-sympt-item{
  display:flex;align-items:center;gap:8px;
  padding:8px 10px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-xs);
}
.bmc-sympt-item>span{width:10px;height:10px;border-radius:var(--r-pill);flex-shrink:0}
.bmc-sympt-item>div{display:flex;flex-direction:column;gap:1px;min-width:0}
.bmc-sympt-item strong{font-size:13px;color:var(--text);font-weight:800}
.bmc-sympt-item small{font-size:11px;color:var(--muted)}
.bmc-sympt-form{display:flex;flex-direction:column;gap:8px}
.bmc-sympt-form label{display:flex;flex-direction:column;gap:3px;font-size:11.5px;color:var(--muted);font-weight:700}
.bmc-sympt-form input,.bmc-sympt-form select{
  padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-xs);
  background:var(--panel-2);color:var(--text);font-size:13px;
}
.bmc-sympt-form .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}

/* Medidas resumo */
.bmc-meas-item{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:8px 10px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-xs);
}
.bmc-meas-item strong{font-size:12.5px;color:var(--text);font-weight:800}
.bmc-meas-item small{font-size:11px;color:var(--muted)}

@media (max-width:600px){
  .bqa-row{grid-template-columns:repeat(3,1fr)}
  .body-mini-grid{grid-template-columns:1fr}
}
@media (max-width:420px){
  .bqa-row{grid-template-columns:repeat(2,1fr)}
}

/* alpha.240 — Barra de acao no topo da aba Dose (so para logados) */
.calc-dose-action-bar{
  display:flex;flex-direction:column;align-items:flex-start;gap:4px;
  padding:12px 14px;margin:0 0 14px;
  background:color-mix(in srgb,var(--accent) 6%,var(--panel));
  border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
  border-radius:var(--r-sm);
}
.calc-dose-register{
  display:inline-flex;align-items:center;gap:8px;
  font-size:14px;font-weight:800;
}
.calc-dose-action-bar small{font-size:11.5px;color:var(--muted)}
@media (max-width:560px){
  .calc-dose-action-bar{align-items:stretch}
  .calc-dose-register{width:100%;justify-content:center}
}

/* ════════════════════════════════════════════════════════════════════
   alpha.226 — Modal "Registrar Dose" (4 passos: marca, dose, local, confirmar)
   ═══════════════════════════════════════════════════════════════════ */
.dose-modal-backdrop{
  position:fixed;inset:0;z-index:10000;
  background:rgba(var(--shadow-rgb),.55);backdrop-filter:blur(4px);
  display:flex;align-items:flex-start;justify-content:center;
  padding:20px 12px;overflow-y:auto;
}
.dose-modal{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);
  width:100%;max-width:560px;
  box-shadow:0 24px 64px rgba(0,0,0,.18);
  display:flex;flex-direction:column;max-height:calc(100vh - 40px);
}
.dm-head{
  display:flex;align-items:center;gap:10px;
  padding:14px 18px;border-bottom:1px solid var(--line);
}
.dm-title{display:flex;align-items:center;gap:8px;flex:1}
.dm-icon{font-size:18px}
.dm-title strong{font-size:16px;font-weight:900;color:var(--text)}
.dm-steps-dots{display:flex;gap:5px}
.dm-dot{width:8px;height:8px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--muted) 30%,transparent)}
.dm-dot.active{background:var(--accent)}
.dm-close{
  background:transparent;border:0;cursor:pointer;color:var(--muted);
  width:32px;height:32px;border-radius:var(--r-xs);font-size:18px;font-weight:900;
}
.dm-close:hover{background:var(--panel-2);color:var(--text)}
.dm-body{padding:18px;overflow-y:auto;flex:1}
.dm-foot{
  padding:14px 18px;border-top:1px solid var(--line);
  display:flex;gap:8px;justify-content:space-between;align-items:center;
}
.dm-foot .btn{min-width:120px}

/* Steps */
.dm-step{display:none}
.dm-step.active{display:block}
.dm-step-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.dm-step-num{
  display:grid;place-items:center;width:28px;height:28px;border-radius:var(--r-pill);
  background:var(--accent);color:#fff;font-size:13px;font-weight:900;
}
.dm-step-head strong{font-size:15px;font-weight:900;color:var(--text)}
.dm-label{display:block;font-size:11.5px;color:var(--muted);font-weight:700;margin:10px 0 6px;text-transform:none}

/* Passo 1: marcas. alpha.240 — agrupadas por categoria */
.dm-brand-grid{
  display:flex;flex-direction:column;gap:10px;
}
.dm-brand-cat-label{
  font-size:10.5px;font-weight:900;color:var(--muted);
  text-transform:uppercase;letter-spacing:.06em;
  padding:6px 0 4px;border-bottom:1px solid var(--line);
  margin-top:4px;
}
.dm-brand-cat-grid{
  display:grid;gap:12px;
  grid-template-columns:repeat(auto-fit,minmax(min(104px,100%),1fr)); /* alpha.1010 — reflui sozinho (2-5 col) em qualquer largura de modal; dispensa a escada de @media do 1008 */
}
.dm-brand-sub{
  display:block;font-size:10.5px;color:var(--muted);font-weight:700;
  margin-top:1px;
}
.dm-brand-card.selected .dm-brand-sub{color:var(--accent)}
.dm-brand-card{
  display:flex;flex-direction:column;align-items:center;gap:4px;
  padding:12px 6px;cursor:pointer;position:relative;
  background:var(--panel-2);border:1.5px solid var(--line);border-radius:var(--r-sm);
  color:var(--text);font-size:12px;font-weight:700;
  transition:all .2s ease;
}
.dm-brand-card:hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));transform:translateY(-2px) scale(1.02);box-shadow:0 8px 18px rgba(var(--accent-rgb),.15)}
.dm-brand-card:active{transform:scale(.97)}
.dm-brand-card.selected{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--panel));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent), 0 6px 16px rgba(var(--accent-rgb),.12)}
.dm-brand-emoji{font-size:22px}
.dm-brand-label{font-size:11.5px;text-align:center;line-height:1.2}
.dm-brand-check{
  position:absolute;top:6px;right:6px;width:16px;height:16px;border-radius:var(--r-pill);
  background:var(--accent);color:#fff;font-size:10px;display:none;
  align-items:center;justify-content:center;font-weight:900;
}
.dm-brand-card.selected .dm-brand-check{display:flex}
/* alpha.830 — botão "Marca personalizada/Manipulada" ganhou destaque (era só texto, passava batido):
   card full-width com borda tracejada accent + "+" em círculo preenchido. */
.dm-brand-custom{
  display:flex;align-items:center;justify-content:center;gap:9px;width:100%;
  background:color-mix(in srgb,var(--accent) 8%,var(--panel));
  border:2px dashed color-mix(in srgb,var(--accent) 55%,var(--line));
  border-radius:var(--r-sm);cursor:pointer;
  color:var(--accent);font-size:14.5px;font-weight:800;letter-spacing:.2px;
  padding:14px 12px;margin-top:12px;
  transition:background .15s,border-color .15s,transform .12s,box-shadow .15s;
}
.dm-brand-custom:hover{
  background:color-mix(in srgb,var(--accent) 15%,var(--panel));
  border-color:var(--accent);transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(var(--accent-rgb),.18);
}
.dm-brand-custom:active{transform:scale(.98)}
.dm-brand-custom span{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:26px;height:26px;border-radius:50%;
  background:var(--accent);color:var(--accent-text,#fff);
  font-size:19px;font-weight:700;line-height:1;
}
.dm-brand-custom-input input{
  width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-xs);
  background:var(--panel-2);color:var(--text);font-size:14px;margin-top:4px;
}

/* alpha.257 — Apresentacao da ampola (valor fixo da marca, editavel) */
.dm-vial-box{display:flex;align-items:center;gap:10px;margin-top:4px}
.dm-vial-box>strong{font-size:16px;font-weight:900;color:var(--accent)}
.dm-vial-box>strong.dm-vial-empty{color:var(--muted);font-size:13px;font-weight:700}
.dm-vial-edit{background:transparent;border:1px solid var(--line);border-radius:var(--r-xs);cursor:pointer;font-size:11.5px;font-weight:700;color:var(--muted);padding:4px 10px}
.dm-vial-edit:hover{border-color:var(--accent);color:var(--accent)}

/* Passo 2: chips */
.dm-chips{display:flex;flex-wrap:wrap;gap:6px}
.dm-chip{
  background:var(--panel-2);border:1.5px solid var(--line);border-radius:var(--r-sm);
  padding:8px 14px;font-size:13.5px;font-weight:700;color:var(--text);cursor:pointer;
  transition:all .12s ease;
}
.dm-chip:hover{border-color:var(--accent)}
.dm-chip.selected{background:var(--accent);color:#fff;border-color:var(--accent)}
.dm-chip-custom{background:transparent;border-color:var(--line);color:var(--accent)}
.dm-chip-custom.selected{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}

/* Card fracionamento */
.dm-frac-card{
  background:color-mix(in srgb,var(--accent) 5%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
  border-radius:var(--r-sm);padding:14px;margin-top:14px;
  display:flex;flex-direction:column;gap:10px;
}
.dm-frac-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.dm-frac-head strong{font-size:14px;font-weight:900;color:var(--text)}
.dm-frac-badge{
  font-size:11.5px;font-weight:800;padding:3px 10px;border-radius:var(--r-pill);
  background:var(--accent);color:#fff;
}
.dm-frac-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dm-frac-cell{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r-xs);padding:10px;
  display:flex;flex-direction:column;gap:3px;
}
.dm-frac-cell small{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.dm-frac-cell strong{font-size:22px;font-weight:950;color:var(--accent);line-height:1}
.dm-frac-row{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding-top:8px;border-top:1px dashed color-mix(in srgb,var(--line) 60%,transparent);
}
.dm-frac-row small{font-size:10.5px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.04em;display:block}
.dm-frac-row strong{display:block;font-size:15px;color:var(--text);font-weight:900;margin-top:2px}
.dm-frac-row em{display:block;font-style:normal;font-size:11px;color:var(--muted);margin-top:3px;line-height:1.4}
.dm-frac-pill{
  background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent);
  padding:6px 12px;border-radius:var(--r-pill);font-size:12.5px;font-weight:900;white-space:nowrap;
}

/* Passo 3: body diagram. alpha.245/246 — silhueta vem do SVG externo
   (body_male.svg ou body_female.svg) e usa currentColor pra herdar
   var(--accent). O SVG controla a propria proporcao via viewBox e
   preserveAspectRatio; o container reserva a area maxima possivel
   pelo aspect-ratio do feminino (mais largo) que tambem cabe o
   masculino centralizado por preserveAspectRatio xMidYMid meet. */
.dm-body-diagram{
  position:relative;width:100%;max-width:260px;margin:0 auto;
  aspect-ratio:351/963;color:var(--accent);
}
.dm-body-diagram>svg{width:100%;height:100%;display:block}
.dm-silhouette{width:100%;height:100%;display:block}
.dm-site-btn{
  position:absolute;width:32px;height:32px;border-radius:var(--r-pill);
  background:#10b981;color:#fff;border:2px solid #fff;cursor:pointer;
  font-size:9px;font-weight:900;display:grid;place-items:center;
  letter-spacing:-.3px;line-height:1;
  box-shadow:0 2px 6px rgba(0,0,0,.15);transition:transform .15s;
  transform:translate(-50%,-50%);
}
.dm-site-btn:hover{transform:translate(-50%,-50%) scale(1.15)}
.dm-site-btn.recovering{background:#f59e0b}
.dm-site-btn.recent{background:#ef4444}
/* alpha.294 — sugerido pelo rodizio: anel DOURADO "pegando fogo" (preserva a cor de status).
   Animacao via box-shadow (o botao usa transform p/ centralizar, nao mexer nele). */
.dm-site-btn.suggested{animation:dm-suggest-fire 1.1s ease-in-out infinite;z-index:16}
@keyframes dm-suggest-fire{
  0%{
    box-shadow:
      0 0 0 0 rgba(245,158,11,.85),
      0 0 6px 2px rgba(245,158,11,.65),
      0 0 12px 4px rgba(234,88,12,.45);
  }
  50%{
    box-shadow:
      0 0 0 7px rgba(245,158,11,0),
      0 0 12px 5px rgba(251,191,36,.85),
      0 0 22px 9px rgba(234,88,12,.55);
  }
  100%{
    box-shadow:
      0 0 0 0 rgba(245,158,11,.85),
      0 0 7px 3px rgba(245,191,36,.7),
      0 0 14px 5px rgba(234,88,12,.5);
  }
}
/* anel de chama girando ao redor do ponto sugerido */
.dm-site-btn.suggested::before{
  content:'';position:absolute;inset:-6px;border-radius:50%;
  background:conic-gradient(from 0deg,#f59e0b,#fbbf24,#ea580c,#f59e0b,#fde68a,#ea580c,#f59e0b);
  z-index:-1;opacity:.9;filter:blur(2px);
  animation:dm-fire-spin 1.4s linear infinite;
}
@keyframes dm-fire-spin{ to{transform:rotate(360deg)} }
@media (prefers-reduced-motion: reduce){
  .dm-site-btn.suggested{animation:none;box-shadow:0 0 0 3px rgba(245,158,11,.9),0 0 10px 3px rgba(234,88,12,.5)}
  .dm-site-btn.suggested::before{animation:none}
}
.dm-site-btn.selected{background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 28%,transparent)}
.dm-site-btn.selected::after{content:'✓';position:absolute;top:-2px;right:-2px;background:#fff;color:var(--accent);width:14px;height:14px;border-radius:var(--r-pill);font-size:10px;display:grid;place-items:center;font-weight:900}
.dm-site-legend{
  display:grid;grid-template-columns:1fr 1fr;gap:4px;font-size:11.5px;color:var(--muted);
  margin-top:12px;padding:10px;background:var(--panel-2);border-radius:var(--r-xs);
}
.dm-site-legend strong{color:var(--text);font-weight:800}
.dm-site-status{
  display:flex;flex-wrap:wrap;gap:10px;font-size:11.5px;color:var(--muted);
  margin-top:10px;justify-content:center;
}
.dm-ss{font-weight:900;font-size:12px}
.dm-ss.available{color:#10b981}
.dm-ss.recovering{color:#f59e0b}
.dm-ss.recent{color:#ef4444}
.dm-ss.suggested{color:#f59e0b;text-shadow:0 0 6px rgba(234,88,12,.6)}
.dm-site-selected{
  text-align:center;margin-top:10px;padding:10px;
  background:color-mix(in srgb,var(--accent) 8%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
  border-radius:var(--r-sm);font-size:14px;font-weight:800;color:var(--accent);
}

/* Passo 4: confirmar */
.dm-confirm-card{
  background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:12px;display:flex;flex-direction:column;gap:6px;
  font-size:13.5px;color:var(--text);
}
.dm-confirm-card strong{font-weight:900}

@media (max-width:520px){
  .dose-modal{max-height:calc(100vh - 24px)}
  .dm-frac-grid{grid-template-columns:1fr}
  .dm-foot .btn{min-width:auto;flex:1}
  .dm-body-diagram{max-width:240px}
}
/* alpha.1010 — .dm-brand-cat-grid virou auto-fit; escada de @media (3col/2col do alpha.1008) removida */

/* ════════════════════════════════════════════════════════════════════
   alpha.229 — Painel de Diagnóstico OAuth (refactor sem inline styles)
   ═══════════════════════════════════════════════════════════════════ */
.oauth-diag{
  margin-bottom:16px;border-radius:var(--r-sm);padding:12px 14px;
  background:var(--panel-2);border:1px solid var(--line);
  /* sem overflow:hidden — deixa o details abrir limpo */
}
.oauth-diag.has-stale{
  background:color-mix(in srgb,#eab308 8%,var(--panel-2));
  border-color:color-mix(in srgb,#eab308 32%,var(--line));
}
.oauth-diag-summary{
  cursor:pointer;list-style:none;
  display:flex;align-items:center;gap:8px;
  font-weight:900;color:var(--text);font-size:13.5px;
  user-select:none;
}
.oauth-diag-summary::-webkit-details-marker{display:none}
.oauth-diag-summary::marker{display:none;content:''}
.oauth-diag-icon{font-size:14px;flex-shrink:0}
.oauth-diag-summary-text{flex:1;min-width:0}
.oauth-diag-summary-text code{
  font-size:11px;background:var(--panel);padding:1px 6px;border-radius:var(--r-2xs);
  word-break:break-all;
}
.oauth-diag[open] .oauth-diag-summary{margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.oauth-diag-body{display:flex;flex-direction:column;gap:10px}
.oauth-diag-help{
  font-size:12px;color:var(--muted);line-height:1.5;
}
.oauth-diag-table-wrap{overflow-x:auto}
.oauth-diag-table{width:100%;border-collapse:collapse;font-size:12px}
.oauth-diag-table thead th{
  text-align:left;padding:6px 8px;
  font-size:10.5px;font-weight:900;color:var(--muted);
  text-transform:uppercase;letter-spacing:.04em;
  border-bottom:1px solid var(--line);
}
.oauth-diag-table tbody td{
  padding:7px 8px;border-bottom:1px solid color-mix(in srgb,var(--line) 50%,transparent);
  vertical-align:middle;
}
.oauth-diag-table tbody tr:last-child td{border-bottom:0}
.oauth-diag-host{font-weight:800;color:var(--text);white-space:nowrap}
.oauth-diag-cid{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  color:var(--text);word-break:break-all;
}
.oauth-diag-cid.is-empty{color:var(--muted)}
.oauth-diag-table tr.is-master{
  background:color-mix(in srgb,var(--accent) 6%,transparent);
}
.oauth-diag-table tr.is-master .oauth-diag-host{color:var(--accent)}
.oauth-diag-alert{
  background:color-mix(in srgb,#eab308 14%,transparent);
  border:1px solid color-mix(in srgb,#eab308 35%,transparent);
  padding:8px 10px;border-radius:var(--r-xs);
  font-size:12px;color:#92400e;font-weight:700;
}
.oauth-diag-form{
  display:flex;flex-direction:column;gap:8px;
  background:var(--panel);padding:12px;border-radius:var(--r-xs);border:1px solid var(--line);
}
.oauth-diag-form strong{font-size:13px;color:var(--text);font-weight:900}
.oauth-diag-form>small{font-size:11.5px;color:var(--muted);line-height:1.5}
.oauth-diag-form input{
  padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-xs);
  background:var(--panel-2);color:var(--text);font-size:13px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.oauth-diag-form input:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent);
}
.oauth-diag-form .btn{align-self:flex-start;width:auto}

@media (max-width:560px){
  .oauth-diag-table thead{display:none}
  .oauth-diag-table tbody td{display:block;padding:4px 0}
  .oauth-diag-table tbody tr{
    display:block;padding:8px 0;border-bottom:1px solid var(--line);
  }
  .oauth-diag-host{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
  .oauth-diag-cid{font-size:12px;padding-bottom:6px !important}
}

/* ════════════════════════════════════════════════════════════════════
   alpha.250 — Comprovantes de Pix (pagamento manual)
   ═══════════════════════════════════════════════════════════════════ */
/* --- Pagina publica de status: bloco de envio --- */
.pix-public-block{margin:24px 0;padding:18px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2)}
.pix-public-block h2{margin:0 0 4px;font-size:18px}
.pix-upload-form{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.pix-form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pix-upload-form label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:700;color:var(--muted)}
.pix-upload-form input[type=text]{padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-xs);background:var(--panel);color:var(--text);font-size:14px}
.pix-file-label input[type=file]{margin-top:4px;font-size:13px}
.pix-upload-form .btn.primary{align-self:flex-start;margin-top:4px}
.pix-sent-list{margin-top:16px;display:flex;flex-direction:column;gap:8px}
.pix-sent-list>strong{font-size:13px;color:var(--text)}
.pix-sent-item{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:8px 10px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-xs)}
.pix-sent-link{font-weight:700;color:var(--accent);text-decoration:none}
.pix-sent-link:hover{text-decoration:underline}
.pix-sent-meta{font-size:12px;color:var(--muted);flex:1}
.pix-st-badge{font-size:11px;font-weight:800;padding:3px 9px;border-radius:var(--r-pill);white-space:nowrap}
.pix-st-pending{background:rgba(234,179,8,.16);color:#92400e}
.pix-st-ok{background:rgba(22,163,74,.15);color:#15803d}
.pix-st-no{background:rgba(239,68,68,.14);color:#b91c1c}
@media(max-width:560px){.pix-form-row{grid-template-columns:1fr}}

/* --- Admin: card de comprovantes --- */
.pix-admin-card .pix-pending-badge{margin-left:8px;font-size:11px;font-weight:800;padding:3px 10px;border-radius:var(--r-pill);background:rgba(234,179,8,.16);color:#92400e;vertical-align:middle}
.pix-admin-list{display:flex;flex-direction:column;gap:12px;margin-top:8px}
.pix-admin-item{display:grid;grid-template-columns:88px 1fr;gap:14px;padding:12px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm)}
.pix-admin-thumb{display:block;width:88px;height:88px;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);background:var(--panel);display:grid;place-items:center}
.pix-admin-thumb img{width:100%;height:100%;object-fit:cover}
.pix-admin-pdf{font-size:13px;font-weight:800;color:var(--muted)}
.pix-admin-info{display:flex;flex-direction:column;gap:4px;min-width:0}
.pix-admin-meta{display:flex;align-items:center;gap:10px}
.pix-admin-meta strong{font-size:15px;color:var(--text)}
.pix-admin-note{color:var(--muted);font-size:12px}
.pix-admin-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}
.pix-admin-actions input[type=text]{flex:1;min-width:140px;padding:6px 9px;border:1px solid var(--line);border-radius:var(--r-xs);background:var(--panel);color:var(--text);font-size:12.5px}
.pix-btn-ok{background:#16a34a !important;border-color:#16a34a !important;color:#fff !important}
.pix-btn-no{background:transparent !important;border-color:var(--red,#ef4444) !important;color:var(--red,#ef4444) !important}
@media(max-width:560px){.pix-admin-item{grid-template-columns:1fr}.pix-admin-thumb{width:100%;height:160px}}

/* ════════════════════════════════════════════════════════════════════
   alpha.253 — Editor visual dos pontos de aplicacao (admin)
   ═══════════════════════════════════════════════════════════════════ */
.dm-edit-bar{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.dm-edit-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 10px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm)}
.dm-edit-sex-tabs{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-xs);overflow:hidden}
.dm-edit-sex{background:var(--panel);border:0;padding:6px 12px;font-size:12.5px;font-weight:700;color:var(--muted);cursor:pointer}
.dm-edit-sex.active{background:var(--accent);color:#fff}
.dm-edit-hint{color:var(--muted);font-size:11.5px;flex:1;min-width:120px}
/* Em modo edicao: pontos viram alvos arrastaveis */
.dm-body-diagram.dm-editing{cursor:crosshair;outline:2px dashed color-mix(in srgb,var(--accent) 45%,transparent);outline-offset:4px;border-radius:var(--r-sm);touch-action:none}
.dm-body-diagram.dm-editing .dm-site-btn{cursor:grab;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.dm-body-diagram.dm-editing .dm-site-btn.dm-dragging{cursor:grabbing;transform:translate(-50%,-50%) scale(1.2);z-index:20}
.dm-svg-slot{display:contents}

/* alpha.255 — Card de sugestao de rodizio + dicas de area */
.dm-rotation-tip{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin-top:10px;padding:9px 12px;border-radius:var(--r-sm);
  background:color-mix(in srgb,#2563eb 8%,var(--panel-2));
  border:1px solid color-mix(in srgb,#2563eb 28%,var(--line));
  font-size:13px;color:var(--text);
}
.dm-rot-icon{font-size:15px}
.dm-rotation-tip small{color:var(--muted);font-size:11.5px}
.dm-rot-use{
  margin-left:auto;background:#2563eb;color:#fff;border:0;cursor:pointer;
  font-size:12px;font-weight:800;padding:6px 12px;border-radius:var(--r-xs);
}
.dm-rot-use:hover{background:#1d4ed8}
.dm-area-tips{margin-top:10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);padding:8px 12px}
.dm-area-tips summary{cursor:pointer;font-weight:800;color:var(--text);font-size:13px;list-style:none}
.dm-area-tips summary::-webkit-details-marker{display:none}
.dm-area-tips-body{display:flex;flex-direction:column;gap:7px;margin-top:10px;font-size:12.5px;color:var(--muted);line-height:1.45}
.dm-area-tips-body strong{color:var(--text)}
.dm-area-rotate-note{padding-top:7px;border-top:1px dashed var(--line);color:var(--text) !important}
@media(max-width:520px){.dm-rot-use{margin-left:0;width:100%}}

/* ── alpha.263 / 270 — Zona de perigo (limpar banco de pedidos) — usa --red do tema ── */
.settings-danger-zone{border:1px solid color-mix(in srgb,var(--red) 45%,transparent);background:color-mix(in srgb,var(--red) 7%,var(--panel))}
.settings-danger-zone .danger-title{color:var(--red);margin-top:0;display:flex;align-items:center;gap:8px}
.settings-danger-zone .danger-form{max-width:440px;margin-top:12px;gap:12px}
/* label numa linha so (o <label> e' display:grid; o span agrupa o texto) */
.settings-danger-zone .danger-label-text{white-space:normal;font-weight:850;color:var(--muted)}
.settings-danger-zone .danger-label-text strong{color:var(--text)}
.btn-danger{background:var(--red) !important;border-color:var(--red) !important;color:#fff !important}
.btn-danger:hover{background:color-mix(in srgb,var(--red) 85%,#000) !important;border-color:color-mix(in srgb,var(--red) 85%,#000) !important}

/* ════════════════════════════════════════════════════════════════
   alpha.265 — Painel executivo do Dashboard (cards coloridos + métricas)
   ════════════════════════════════════════════════════════════════ */
.dash-hero-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:16px}
.dash-hero-card{position:relative;border-radius:var(--r-md);padding:18px 18px 20px;color:#fff;text-decoration:none;display:flex;flex-direction:column;gap:8px;min-height:118px;box-shadow:0 10px 26px rgba(var(--shadow-rgb),.14);overflow:hidden;transition:transform .14s ease,box-shadow .14s ease}
.dash-hero-card:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(var(--shadow-rgb),.2)}
.dash-hero-green{background:linear-gradient(135deg,#16a34a,#059669)}
.dash-hero-blue{background:linear-gradient(135deg,#2563eb,#3b82f6)}
.dash-hero-violet{background:linear-gradient(135deg,#7c3aed,#9333ea)}
.dash-hero-pink{background:linear-gradient(135deg,#db2777,#e11d48)}
.dash-hero-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.dash-hero-ic{width:34px;height:34px;border-radius:var(--r-sm);background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
.dash-hero-trend{font-size:11.5px;font-weight:700;background:rgba(255,255,255,.2);padding:3px 9px;border-radius:var(--r-pill);white-space:nowrap}
.dash-hero-trend.up::before{content:'▲ ';font-size:9px}
.dash-hero-label{font-size:13px;font-weight:600;opacity:.92;margin-top:2px}
.dash-hero-value{font-size:26px;font-weight:900;letter-spacing:-.02em;line-height:1.1}

.dash-stat-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:16px}
.dash-stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:14px 12px;display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;text-decoration:none;color:var(--text);box-shadow:var(--shadow-soft);transition:border-color .14s ease,transform .14s ease}
.dash-stat:hover{border-color:rgba(var(--accent-rgb),.4);transform:translateY(-1px)}
.dash-stat-ic{color:var(--accent);opacity:.9}
.dash-stat-label{font-size:12px;color:var(--muted);font-weight:600}
.dash-stat-value{font-size:22px;font-weight:900;letter-spacing:-.02em}
.dash-stat-alert .dash-stat-value{color:var(--red)}
.dash-stat-alert .dash-stat-ic{color:var(--red)}

.dash-brands-card .dash-brands-row{display:flex;flex-direction:column;gap:0}
.dash-brand-chip{display:flex;align-items:center;justify-content:space-between;padding:12px 4px;border-bottom:1px solid var(--line)}
.dash-brand-chip:last-child{border-bottom:0}
.dash-brand-name{font-weight:600;color:var(--text)}
.dash-brand-count{font-weight:900;color:var(--accent);font-size:15px}

.dash-budgets-table{width:100%;border-collapse:collapse}
.dash-budgets-table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;padding:8px 10px;border-bottom:1px solid var(--line)}
.dash-budgets-table td{padding:11px 10px;border-bottom:1px solid var(--line);font-size:14px}
.dash-budgets-table tr:last-child td{border-bottom:0}
.dash-budget-link{color:var(--accent);font-weight:700;text-decoration:none}
.dash-budget-link:hover{text-decoration:underline}

@media(max-width:1000px){.dash-hero-grid{grid-template-columns:repeat(2,1fr)}.dash-stat-strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.dash-hero-grid{grid-template-columns:1fr 1fr}.dash-stat-strip{grid-template-columns:1fr 1fr}.dash-hero-value{font-size:22px}}

/* ════════════════════════════════════════════════════════════════
   alpha.269 — Remove as manchas lilas/coloridas que vazavam nas bordas
   ────────────────────────────────────────────────────────────────
   O "Pepzen Glass System" pintava body::before com radiais roxas
   (rgba(124,58,237,...)) e verdes/laranjas nos 4 cantos. Com o tema
   "Azul Digital" isso aparecia como borroes lilas vazando nas beiradas
   da area de conteudo. Trocamos por um fundo discreto e UNIFORME,
   so com um leve tom do --accent no topo (sem manchas nos cantos).
   ════════════════════════════════════════════════════════════════ */
/* Fundo do body: era um linear+radial com a cor de destaque que, no tema
   roxo, virava o lilas vazando nas bordas. Agora cor SOLIDA e uniforme. */
body{ background: var(--bg) !important; }
/* O ::before decorativo (manchas de canto) e' totalmente desligado. */
body::before{ display:none !important; background:none !important; content:none !important; }

/* alpha.273 — Configurações alinhadas ao padrão visual do ERP */
.cfg-layout{
  width:min(1180px, calc(100vw - 32px)) !important;
  margin:0 auto 48px !important;
  padding:18px 0 0 !important;
}
.cfg-section-quicknav{
  position:sticky !important;
  top:56px !important;
  z-index:40 !important;
  margin:0 0 16px !important;
  padding:12px 16px !important;
  border:1px solid var(--line) !important;
  border-radius:16px !important;
  background:color-mix(in srgb,var(--panel) 96%,transparent) !important;
  box-shadow:var(--shadow-soft) !important;
  backdrop-filter:blur(14px);
}
.cfg-panels{padding:0 !important;gap:16px !important}
.cfg-panel.card{
  padding:22px !important;
  border:1px solid var(--line) !important;
  border-radius:18px !important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 98%,transparent),var(--panel)) !important;
  box-shadow:var(--shadow-soft) !important;
}
.cfg-panel + .cfg-panel{border-top:0 !important;margin-top:16px !important}
.cfg-panel:first-child{padding-top:22px !important}
.cfg-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding-bottom:16px !important;
  margin-bottom:18px !important;
  border-bottom:1px solid var(--line) !important;
}
.cfg-panel-head h2{font-size:22px !important;font-weight:900 !important;letter-spacing:-.03em !important}
.cfg-panel-head p{font-size:13px !important;font-weight:700 !important;color:var(--muted) !important}
.cfg-build-chip{
  display:inline-flex;
  align-items:center;
  height:28px;
  padding:0 10px;
  border-radius:var(--r-pill);
  border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));
  background:color-mix(in srgb,var(--accent) 10%,var(--panel));
  color:var(--accent);
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}
.cfg-interface-form{gap:18px !important}
.cfg-setting-block{
  border:1px solid var(--line);
  border-radius:var(--r-md);
  background:color-mix(in srgb,var(--panel-2) 70%,var(--panel));
  overflow:hidden;
}
.cfg-setting-block-head{
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 18px;
  border-bottom:1px solid var(--line);
  background:color-mix(in srgb,var(--panel) 84%,transparent);
}
.cfg-setting-icon{
  width:36px;height:36px;border-radius:var(--r-sm);
  display:grid;place-items:center;
  background:color-mix(in srgb,var(--accent) 12%,var(--panel));
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
  color:var(--accent);
  flex-shrink:0;
}
.cfg-setting-block-head h3{margin:0;font-size:15px;font-weight:900;color:var(--text)}
.cfg-setting-block-head p{margin:2px 0 0;font-size:12px;font-weight:700;color:var(--muted);line-height:1.35}
.cfg-setting-card{
  display:flex;
  align-items:center;
  gap:14px;
  padding:15px 18px;
  border-bottom:1px solid color-mix(in srgb,var(--line) 72%,transparent);
}
.cfg-setting-card:last-child{border-bottom:0}
.cfg-setting-card:hover{background:color-mix(in srgb,var(--accent) 4%,transparent)}
.cfg-setting-feature{
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
  border-radius:var(--r-md);
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 8%,var(--panel)),var(--panel));
}
.cfg-setting-card .menu-item-meta strong{font-size:14px !important;font-weight:900;color:var(--text)}
.cfg-setting-card .menu-item-meta small{font-size:12px !important;font-weight:700;color:var(--muted);line-height:1.4;white-space:normal;padding:0}
.cfg-field-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  padding:16px 18px 18px;
}
.cfg-field-grid label{display:grid;gap:6px;margin:0}
.cfg-field-grid label>span{
  font-size:12px;
  font-weight:850;
  color:var(--muted);
}
.cfg-field-grid input,
.cfg-field-grid textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:var(--panel);
  color:var(--text);
  padding:11px 13px;
  font:inherit;
  font-weight:750;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.cfg-field-grid textarea{min-height:92px;resize:vertical;line-height:1.45}
.cfg-tab-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.cfg-tab-card{min-height:74px}
/* alpha.475 — grupos da config de Abas Saúde */
.cfg-tab-group{margin-bottom:14px}
.cfg-tab-group:last-child{margin-bottom:0}
.cfg-tab-group-title{margin:0 0 8px;font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;color:var(--accent)}
.cfg-save-bar{
  display:flex;
  justify-content:flex-end;
  padding-top:2px;
}
.cfg-save-bar .btn{min-width:180px}

@media(max-width:760px){
  .cfg-layout{width:calc(100vw - 20px) !important;padding-top:10px !important}
  .cfg-section-quicknav{top:48px !important;border-radius:14px !important;padding:10px 12px !important}
  .cfg-panel.card{padding:16px !important;border-radius:16px !important}
  .cfg-panel-head{align-items:flex-start;flex-direction:column;gap:8px}
  .cfg-tab-grid{grid-template-columns:1fr}
  .cfg-setting-card{align-items:flex-start;padding:14px}
  .cfg-save-bar .btn{width:100%;min-width:0}
}

/* alpha.274 — submenu de Configurações com ícones + limpeza isolada e segura */
.sidenav-tree-subitem{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  border-radius:9px !important;
  margin:1px 4px 1px 0 !important;
}
.sidenav-tree-subitem-icon{
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  flex:0 0 18px;
  color:currentColor;
  opacity:.74;
}
.sidenav-tree-subitem-icon svg{width:12px;height:12px;display:block}
.sidenav-tree-subitem-label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.sidenav-tree-subitem.current .sidenav-tree-subitem-icon,
.sidenav-tree-subitem:hover .sidenav-tree-subitem-icon{opacity:1}
.cfg-danger-panel{
  border-color:color-mix(in srgb,var(--red) 35%,var(--line)) !important;
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--red) 5%,var(--panel)),var(--panel) 54%),
    var(--panel) !important;
}
.cfg-danger-head h2{color:var(--red) !important}
.cfg-danger-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  height:30px;
  padding:0 11px;
  border-radius:var(--r-pill);
  border:1px solid color-mix(in srgb,var(--red) 28%,var(--line));
  background:color-mix(in srgb,var(--red) 8%,var(--panel));
  color:var(--red);
  font-size:11px;
  font-weight:950;
  white-space:nowrap;
}
.cfg-danger-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:18px;
  align-items:start;
}
.cfg-danger-copy{
  padding:18px;
  border:1px solid color-mix(in srgb,var(--red) 18%,var(--line));
  border-radius:var(--r-md);
  background:color-mix(in srgb,var(--red) 4%,var(--panel-2));
}
.cfg-danger-copy h3{
  margin:0 0 8px;
  font-size:17px;
  font-weight:950;
  color:var(--text);
}
.cfg-danger-copy p{
  margin:0 0 12px;
  color:var(--muted);
  font-weight:700;
  line-height:1.5;
}
.cfg-danger-copy ul{
  margin:0;
  padding-left:18px;
  color:var(--muted);
  font-size:13px;
  font-weight:750;
  line-height:1.55;
}
.cfg-danger-form{
  max-width:none !important;
  margin:0 !important;
  padding:18px;
  border:1px solid color-mix(in srgb,var(--red) 22%,var(--line));
  border-radius:var(--r-md);
  background:var(--panel);
}
.cfg-danger-form label{margin:0}
.cfg-danger-form input[type="password"],
.cfg-danger-form input[type="text"]{
  width:100%;
  min-height:44px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:var(--panel-2);
  color:var(--text);
  padding:11px 13px;
  font:inherit;
  font-weight:850;
}
.cfg-danger-ack{
  display:flex !important;
  align-items:flex-start;
  gap:10px;
  padding:12px;
  border:1px dashed color-mix(in srgb,var(--red) 28%,var(--line));
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--red) 5%,transparent);
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}
.cfg-danger-form .btn.danger{
  background:var(--red) !important;
  border-color:var(--red) !important;
  color:#fff !important;
  box-shadow:0 12px 24px color-mix(in srgb,var(--red) 22%,transparent);
}
@media(max-width:860px){
  .cfg-danger-grid{grid-template-columns:1fr}
}

/* alpha.277 - Arquiteto UI consolidado + overlay de modal sem faixa lateral */
.modal-overlay[data-modal],
.modal-overlay.is-open{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  min-width:100vw !important;
  height:100vh !important;
  min-height:100dvh !important;
  margin:0 !important;
  box-sizing:border-box !important;
  align-items:center !important;
  justify-content:center !important;
  background:color-mix(in srgb,#020617 50%,transparent) !important;
  backdrop-filter:blur(6px) saturate(110%) !important;
  overflow:auto !important;
  overscroll-behavior:contain !important;
}
.modal-overlay[data-modal][hidden]:not(.is-open){
  display:none !important;
}
.modal-overlay[data-modal].is-open{
  display:flex !important;
}
.dash-customer-modal-card{
  box-shadow:0 24px 70px color-mix(in srgb,#020617 28%,transparent) !important;
}
.dash-customer-modal-card .customer-form::-webkit-scrollbar{
  width:10px;
}
.dash-customer-modal-card .customer-form::-webkit-scrollbar-track{
  background:color-mix(in srgb,var(--panel-2) 72%,transparent);
}
.dash-customer-modal-card .customer-form::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--muted) 34%,transparent);
  border-radius:var(--r-pill);
  border:2px solid var(--panel);
}
.ua-audit-tools p{
  margin:0 0 10px;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  line-height:1.45;
}
.ua-audit-pills{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.ua-audit-pills span{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:0 8px;
  border-radius:var(--r-pill);
  border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
  background:color-mix(in srgb,var(--accent) 8%,var(--panel));
  color:var(--accent);
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}
@media(max-width:640px){
  .modal-overlay[data-modal],
  .modal-overlay.is-open{
    padding:0 !important;
    align-items:stretch !important;
  }
  .modal-overlay[data-modal] .modal-card{
    max-width:100vw !important;
  }
}
/* alpha.278 - Calculator architect and unified dose product cards */
.cfg-calculator-architect {
  overflow: hidden;
}
.calc-architect-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
  gap: 16px;
  align-items: start;
  padding: 16px;
}
.calc-architect-list {
  display: grid;
  gap: 10px;
}
.calc-architect-item {
  position: relative;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--line) 82%, var(--accent) 18%);
  border-radius: 16px;
  background: color-mix(in srgb, var(--panel) 94%, var(--accent) 6%);
  box-shadow: var(--shadow-sm, 0 10px 24px rgba(var(--shadow-rgb), .06));
}
.calc-architect-item::before,
.calc-preset-btn.has-icon::before,
.preset-btn.has-icon::before,
.dm-brand-card.has-icon::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: var(--calc-card-icon, var(--dm-brand-icon));
  background-repeat: no-repeat;
  /* alpha.340 — ícone preenche o card INTEIRO, atrás do texto (cover, centralizado). */
  background-size: cover;
  background-position: var(--calc-card-icon-pos, var(--dm-brand-icon-pos, center));
  opacity: var(--calc-card-icon-opacity, var(--dm-brand-icon-opacity, .18));
  filter: saturate(.95);
  z-index: 0;
}
.calc-architect-item > *,
.calc-preset-btn.has-icon > *,
.preset-btn.has-icon > *,
.dm-brand-card.has-icon > * {
  position: relative;
  z-index: 1;
}
.calc-architect-item summary {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 42px 1fr auto;
  gap: 12px;
  align-items: center;
  min-height: 72px;
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
}
.calc-architect-item summary::-webkit-details-marker { display: none; }
.calc-architect-thumb {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
  background: color-mix(in srgb, var(--accent) 12%, var(--panel));
}
.calc-architect-item summary strong,
.calc-architect-new h3 {
  display: block;
  color: var(--text);
  font-size: 15px;
  line-height: 1.15;
}
.calc-architect-item summary small,
.calc-architect-new p {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.calc-architect-item summary em {
  font-style: normal;
  font-size: 11px;
  font-weight: 850;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
  border-radius: 999px;
  padding: 5px 8px;
}
.calc-architect-form {
  position: relative;
  z-index: 1;
  padding: 4px 16px 16px;
}
.calc-architect-delete {
  position: relative;
  z-index: 1;
  padding: 0 16px 16px;
}
.calc-architect-new {
  position: sticky;
  top: calc(var(--topbar-h, 56px) + 14px);
  display: grid;
  gap: 12px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line) 80%, var(--accent) 20%);
  background: color-mix(in srgb, var(--panel) 92%, var(--accent) 8%);
}
.calc-preset-btn.has-icon,
.preset-btn.has-icon,
.dm-brand-card.has-icon {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.dm-brand-card.has-icon .dm-brand-emoji {
  display: none;
}
.ui-architect .ua-calculator-link {
  display: block;
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
  background: color-mix(in srgb, var(--accent) 10%, var(--panel));
  color: var(--text);
  font-weight: 850;
  text-decoration: none;
}
@media (max-width: 920px) {
  .calc-architect-layout { grid-template-columns: 1fr; padding: 12px; }
  .calc-architect-new { position: static; }
}

/* alpha.279 - UI Architect precision picker */
.ua-pick-tools {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: end;
  margin: -2px 0 10px;
}
.ua-pick-tools label {
  display: grid;
  gap: 4px;
  font-size: 10px;
  font-weight: 850;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.ua-layer-actions {
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
}
.ua-layer-actions .btn {
  min-height: 34px;
  padding-inline: 9px;
}
#uaHighlightOverlay {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--panel) 85%, transparent), 0 0 0 9999px rgba(var(--shadow-rgb), .025);
}
body.ui-picking #uaHighlightOverlay {
  border-style: dashed;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}

/* alpha.280 - camada de consistencia visual entre modulos */
:root {
  --ui-module-radius: 18px;
  --ui-module-radius-sm: 12px;
  --ui-module-gap: 16px;
  --ui-module-pad: clamp(14px, 1.25vw, 20px);
  --ui-module-border: color-mix(in srgb, var(--line) 86%, transparent);
  --ui-module-surface: linear-gradient(180deg, color-mix(in srgb, var(--panel) 98%, transparent), var(--panel));
  --ui-module-soft: color-mix(in srgb, var(--panel-2) 78%, var(--panel));
  --ui-module-shadow: 0 1px 0 color-mix(in srgb, #fff 52%, transparent) inset, 0 14px 38px rgba(var(--shadow-rgb), .065);
  --ui-module-shadow-hover: 0 1px 0 color-mix(in srgb, #fff 58%, transparent) inset, 0 18px 48px rgba(var(--shadow-rgb), .09);
}

html[data-theme="dark"] {
  --ui-module-shadow: 0 1px 0 rgba(255,255,255,.035) inset, 0 16px 42px rgba(0, 0, 0, .22);
  --ui-module-shadow-hover: 0 1px 0 rgba(255,255,255,.05) inset, 0 20px 52px rgba(0, 0, 0, .30);
}

body.has-universal-topbar .main,
.pub-main {
  display: grid;
  gap: var(--ui-module-gap);
  align-content: start;   /* não esticar linhas auto quando o container (flex:1/100vh) for mais alto que o conteúdo — evitava inflar a barra de abas de ~44px p/ 126px */
}

.main > *,
.pub-main > * {
  width: min(1280px, 100%);
}

.page-head,
.calc-page-header,
.store-shell > header,
.public-status-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin: 0 auto 2px;
  padding: 4px 0 2px;
}

.page-head h1,
.calc-page-header h1,
.store-shell h1,
.public-status-card h1 {
  margin: 0;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.02;
  letter-spacing: 0;
  font-weight: 950;
}

.page-head p,
.calc-page-header p,
.store-shell header p,
.public-status-card header p {
  max-width: 780px;
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  font-weight: 720;
}

:where(
  .card,
  .metric,
  .tool-card,
  .cfg-panel.card,
  .settings-panel,
  .settings-shell,
  .table-wrap,
  .kanban-col,
  .dashboard-order-card,
  .dashboard-recent-card,
  .dashboard-balance-card,
  .breakeven-card,
  .dash-stat,
  .report-chart-card,
  .calc-panel,
  .calc-result-panel,
  .body-metric-card,
  .body-result-card,
  .body-goal-card,
  .body-chart-card,
  .body-soon-card,
  .body-tip-card,
  .body-mini-card,
  .track-card,
  .commerce-card,
  .public-card,
  .auth-card,
  .customer-login-card,
  .customer-portal-v49,
  .modal-card,
  .dose-modal,
  .update-backup-card,
  .extension-kind,
  .extension-row,
  .theme-card,
  .calc-architect-item,
  .calc-architect-new
) {
  border: 1px solid var(--ui-module-border);
  border-radius: var(--ui-module-radius);
  background: var(--ui-module-surface);
  box-shadow: var(--ui-module-shadow);
}

:where(.card, .tool-card, .kanban-col, .dashboard-order-card, .dash-stat, .commerce-card, .public-card, .theme-card, .extension-row) {
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}

:where(.card, .tool-card, .kanban-col, .dashboard-order-card, .dash-stat, .commerce-card, .public-card, .theme-card, .extension-row):hover {
  border-color: color-mix(in srgb, var(--accent) 24%, var(--line));
  box-shadow: var(--ui-module-shadow-hover);
}

.card,
.cfg-panel.card,
.calc-panel,
.report-chart-card,
.dashboard-recent-card,
.settings-shell,
.commerce-card,
.public-card,
.auth-card,
.customer-login-card {
  padding: var(--ui-module-pad);
}

:where(.card, .calc-panel, .cfg-panel.card, .settings-shell, .commerce-card, .public-card) > h2,
:where(.card, .calc-panel, .cfg-panel.card, .settings-shell, .commerce-card, .public-card) > h3,
.section-head h2,
.cfg-panel-head h2,
.modal-header h2,
.track-card-head h3 {
  margin-top: 0;
  color: var(--text);
  font-weight: 930;
  letter-spacing: 0;
  line-height: 1.14;
}

.section-head,
.cfg-panel-head,
.modal-header,
.track-card-head,
.dashboard-order-card-head,
.report-chart-head,
.calc-step-hd {
  gap: 12px;
}

:where(.section-head, .cfg-panel-head, .modal-header, .track-card-head, .report-chart-head) p,
:where(.section-head, .cfg-panel-head, .modal-header, .track-card-head, .report-chart-head) small {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.4;
}

.page-actions,
.section-head-actions,
.form-actions,
.filters-actions,
.modal-actions,
.track-form-actions,
.calc-result-actions,
.body-actions,
.theme-card-actions,
.ext-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.btn,
.pub-btn-primary,
.git-sync-btn,
.calc-theme-btn,
.topbar-theme-btn,
.status-trigger,
.status-badge-btn,
.calc-chip,
.dm-chip {
  border-radius: var(--ui-module-radius-sm);
  font-weight: 880;
}

.btn.primary,
.pub-btn-primary,
.git-sync-btn {
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 72%, var(--text)));
  border-color: color-mix(in srgb, var(--accent) 72%, var(--line));
  color: #fff;
}

:where(input, select, textarea, .status-trigger, .calc-preset-search, .calc-theme-btn, .topbar-theme-btn) {
  border-radius: var(--ui-module-radius-sm);
  border-color: var(--ui-module-border);
  background: var(--ui-module-soft);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

:where(input, select, textarea, .status-trigger, .calc-preset-search):focus {
  border-color: color-mix(in srgb, var(--accent) 58%, var(--line));
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 14%, transparent);
}

.form-grid,
.filters-grid,
.body-grid,
.body-meas-grid,
.calc-architect-form {
  gap: 12px;
}

.helper-box,
.calc-lock-cta,
.calc-login-cta,
.oauth-diag,
.diagnostic-preview,
.report-empty-chart,
.body-empty {
  border: 1px dashed color-mix(in srgb, var(--accent) 24%, var(--line));
  border-radius: var(--ui-module-radius-sm);
  background: color-mix(in srgb, var(--accent) 7%, var(--panel));
  color: var(--muted);
}

.table-wrap {
  overflow: auto;
  padding: 0;
}

.table-wrap table,
.dash-budgets-table,
.body-hist-table,
.oauth-diag-table {
  border-collapse: separate;
  border-spacing: 0;
}

:where(th, .dash-budgets-table th, .body-hist-table th, .oauth-diag-table th) {
  background: color-mix(in srgb, var(--panel-2) 82%, var(--panel));
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .045em;
}

:where(td, .dash-budgets-table td, .body-hist-table td, .oauth-diag-table td) {
  border-color: color-mix(in srgb, var(--line) 72%, transparent);
}

.view-switch,
.calc-tabs-bar,
.auth-tabs,
.body-chart-tabs,
.dm-stepper {
  border: 1px solid var(--ui-module-border);
  border-radius: calc(var(--ui-module-radius-sm) + 2px);
  background: var(--ui-module-soft);
  padding: 4px;
}
/* alpha.857 — menus do site CENTRALIZADOS: calculadora/saude (grupos .calc-group-bar + sub-abas
   .calc-tabs-bar) + ERP (grupos reusam .calc-group-bar + itens .erp-topnav-items) + sub-nav social.
   safe center = centra quando cabe e alinha ao inicio (sem cortar) quando ha overflow-x. */
.calc-group-bar,
.calc-tabs-bar,
.erp-topnav-items{justify-content:safe center}
/* a sub-nav social (.pn-viewtoggle) e um pill com largura de conteudo -> centra o PROPRIO elemento */
.social-subnav{display:flex;width:-moz-fit-content;width:fit-content;margin-inline:auto}

.view-switch .btn,
.calc-tab-btn,
.auth-tab,
.body-chart-tab {
  border-radius: var(--ui-module-radius-sm);
}

.view-switch .btn.is-active,
.calc-tab-btn.active,
.auth-tab.is-active,
.body-chart-tab.active {
  background: var(--panel);
  color: var(--text);
  box-shadow: 0 1px 3px rgba(var(--shadow-rgb),.10), inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent);
}

.sidenav-tree-trigger,
.sidenav-tree-item,
.sidenav-tree-subitem {
  border-radius: var(--ui-module-radius-sm) !important;
}

.sidenav-tree-icon,
.sidenav-tree-item-icon,
.sidenav-tree-subitem-icon,
.cfg-setting-icon,
.dash-hero-ic,
.bmc-icon,
.proto-card-icon,
.track-card-icon {
  background: color-mix(in srgb, var(--accent) 12%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
  color: var(--accent);
}

.modal-overlay[data-modal],
.dose-modal-backdrop {
  background: color-mix(in srgb, #020617 52%, transparent) !important;
  backdrop-filter: blur(8px) saturate(112%) !important;
}

.modal-card,
.dose-modal {
  width: min(760px, calc(100vw - 28px));
  max-height: calc(100dvh - 28px);
  overflow: auto;
}

.ui-architect,
.ui-architect-panel {
  font-family: inherit;
}

@media (max-width: 860px) {
  body.has-universal-topbar .main,
  .pub-main {
    gap: 12px;
  }

  .page-head,
  .calc-page-header,
  .store-shell > header,
  .public-status-card > header {
    flex-direction: column;
    align-items: stretch;
  }

  .page-actions,
  .section-head-actions,
  .form-actions,
  .filters-actions,
  .modal-actions,
  .track-form-actions,
  .calc-result-actions,
  .body-actions,
  .theme-card-actions,
  .ext-actions {
    align-items: stretch;
  }

  .page-actions .btn,
  .section-head-actions .btn,
  .filters-actions .btn,
  .form-actions .btn,
  .modal-actions .btn,
  .track-form-actions .btn,
  .calc-result-actions .btn,
  .body-actions .btn {
    width: 100%;
  }

  .card,
  .cfg-panel.card,
  .calc-panel,
  .report-chart-card,
  .dashboard-recent-card,
  .settings-shell,
  .commerce-card,
  .public-card,
  .auth-card,
  .customer-login-card {
    border-radius: 16px;
    padding: 14px;
  }

  .modal-card,
  .dose-modal {
    width: 100vw;
    max-width: 100vw;
    min-height: 100dvh;
    border-radius: 0;
  }
}

/* alpha.281 - Arquiteto UI: edicao visual direta, bordas, dimensoes e resize handle */
#uaHighlightOverlay {
  pointer-events: none;
  overflow: visible;
}

#uaResizeHandle {
  position: absolute;
  right: -9px;
  bottom: -9px;
  width: 18px;
  height: 18px;
  border: 2px solid var(--panel);
  border-radius: 7px;
  background: var(--accent);
  box-shadow: 0 8px 22px rgba(var(--shadow-rgb), .22);
  cursor: nwse-resize;
  pointer-events: auto;
}

#uaResizeHandle::before {
  content: "";
  position: absolute;
  inset: 4px;
  border-right: 2px solid rgba(255,255,255,.86);
  border-bottom: 2px solid rgba(255,255,255,.86);
}
/* alpha.482 — alças de borda: largura (direita) e altura (base) */
.ua-resize-edge{position:absolute;border:2px solid var(--panel);border-radius:var(--r-2xs);background:var(--accent);box-shadow:0 6px 16px rgba(var(--shadow-rgb),.2);pointer-events:auto;padding:0}
#uaResizeE{right:-7px;top:50%;transform:translateY(-50%);width:13px;height:34px;cursor:ew-resize}
#uaResizeS{bottom:-7px;left:50%;transform:translateX(-50%);width:34px;height:13px;cursor:ns-resize}

body.ui-resizing,
body.ui-resizing * {
  cursor: nwse-resize !important;
  user-select: none !important;
}

body.ui-resizing .ui-architect,
body.ui-resizing .ui-architect * {
  cursor: default !important;
}

.ui-architect .ua-section .ua-help {
  margin: 7px 0 0;
  font-size: 11px;
  line-height: 1.35;
  color: var(--muted);
}

.ui-architect .ua-row .ua-select {
  min-height: 34px;
  padding: 7px 10px;
}

/* alpha.282 - Arquiteto UI: drag com encaixe e guia de reposicionamento */
.ui-architect .ua-drag-options {
  display: grid;
  gap: 6px;
  margin: 8px 0 0;
  padding: 8px;
  border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--line));
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 7%, var(--panel));
}

.ui-architect .ua-drag-options label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 11px;
  font-weight: 850;
  color: var(--text);
  cursor: pointer;
}

.ui-architect .ua-drag-options input {
  width: 16px;
  height: 16px;
  min-height: 0;
  accent-color: var(--accent);
}

#uaDropGuide {
  position: absolute;
  z-index: 99998;
  pointer-events: none;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent), 0 8px 24px rgba(var(--shadow-rgb), .18);
}

#uaDropGuide::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 3px var(--panel);
}

#uaDropGuide[data-axis="y"]::after {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

#uaDropGuide[data-axis="x"]::after {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

body.ui-snap-moving .ua-drag-target.is-ua-dragging {
  opacity: .62;
  filter: saturate(.82);
}

/* ════════════════════════════════════════════════════════════════
   alpha.286 — Registro de dose: valor por dose ao vivo + tela de sucesso
   (substitui o alert() nativo feio)
   ════════════════════════════════════════════════════════════════ */
.dm-cost-live{
  margin-top:10px;display:flex;flex-direction:column;gap:2px;
  padding:12px 14px;border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--accent) 10%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--accent) 32%,transparent);
}
.dm-cost-live-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.dm-cost-live-value{font-size:24px;font-weight:900;letter-spacing:-.02em;color:var(--accent);line-height:1.1}
.dm-cost-live-note{font-size:11px;color:var(--muted)}

/* Tela de sucesso dentro do modal */
.dm-success{ text-align:center; padding:18px 8px 6px; }
.dm-success-check{
  width:72px;height:72px;border-radius:50%;margin:0 auto 14px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;background:linear-gradient(135deg,var(--green,#16a34a),#0f9d58);
  box-shadow:0 10px 26px rgba(22,163,74,.32);
  animation:dmPop .42s cubic-bezier(.34,1.56,.64,1) both;
}
.dm-success-check svg{ animation:dmCheck .5s .2s ease both; }
.dm-success-title{ margin:0 0 4px; font-size:21px; font-weight:900; letter-spacing:-.02em; color:var(--text); }
.dm-success-sub{ margin:0 0 14px; color:var(--muted); font-size:14px; font-weight:600; }
.dm-success-cost{
  display:inline-flex;flex-direction:column;gap:2px;
  padding:14px 26px;border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--accent) 12%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--accent) 34%,transparent);
}
.dm-success-cost-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.dm-success-cost-val{font-size:28px;font-weight:900;letter-spacing:-.03em;color:var(--accent);line-height:1.05}
@keyframes dmPop{ 0%{transform:scale(.4);opacity:0} 100%{transform:scale(1);opacity:1} }
@keyframes dmCheck{ 0%{stroke-dasharray:0 40;opacity:0} 100%{stroke-dasharray:40 40;opacity:1} }
@media (prefers-reduced-motion: reduce){ .dm-success-check,.dm-success-check svg{animation:none} }

/* ════════════════════════════════════════════════════════════════
   alpha.287 — zkToast: notificacoes flutuantes (substituem alert nativo)
   ════════════════════════════════════════════════════════════════ */
.zk-toast-wrap{
  position:fixed;z-index:99999;right:18px;bottom:18px;
  display:flex;flex-direction:column;gap:10px;
  max-width:min(380px,calc(100vw - 32px));pointer-events:none;
}
.zk-toast{
  pointer-events:auto;display:flex;align-items:flex-start;gap:11px;
  padding:13px 14px;border-radius:var(--r-sm);cursor:pointer;
  background:var(--panel);color:var(--text);
  border:1px solid var(--line);
  box-shadow:0 12px 34px rgba(var(--shadow-rgb),.18);
  font-size:14px;font-weight:600;line-height:1.4;
  opacity:0;transform:translateX(24px) scale(.96);
  transition:opacity .24s ease, transform .24s cubic-bezier(.34,1.4,.64,1);
}
.zk-toast.zk-in{opacity:1;transform:translateX(0) scale(1);}
.zk-toast.zk-out{opacity:0;transform:translateX(24px) scale(.96);}
.zk-toast-ic{flex:0 0 auto;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;margin-top:1px;}
.zk-toast-ic svg{width:16px;height:16px;}
.zk-toast-success .zk-toast-ic{background:linear-gradient(135deg,var(--green,#16a34a),#0f9d58);}
.zk-toast-error   .zk-toast-ic{background:linear-gradient(135deg,#ef4444,#dc2626);}
.zk-toast-info    .zk-toast-ic{background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 65%,#000));}
.zk-toast-success{border-color:color-mix(in srgb,var(--green,#16a34a) 38%,transparent);}
.zk-toast-error{border-color:color-mix(in srgb,#ef4444 38%,transparent);}
.zk-toast-info{border-color:color-mix(in srgb,var(--accent) 38%,transparent);}
.zk-toast-msg{flex:1 1 auto;min-width:0;word-break:break-word;}
.zk-toast-x{flex:0 0 auto;background:none;border:none;color:var(--muted);font-size:20px;line-height:1;cursor:pointer;padding:0 2px;opacity:.6;transition:opacity .12s;}
.zk-toast-x:hover{opacity:1;}
@media(max-width:560px){
  .zk-toast-wrap{right:12px;left:12px;bottom:12px;max-width:none;align-items:stretch;}
  .zk-toast{transform:translateY(24px) scale(.96);}
  .zk-toast.zk-in{transform:translateY(0) scale(1);}
  .zk-toast.zk-out{transform:translateY(24px) scale(.96);}
}
@media (prefers-reduced-motion: reduce){
  .zk-toast{transition:opacity .2s ease;transform:none!important;}
}

/* alpha.288 — texto dos Termos dentro do modal (rolável e legível) */
.terms-modal-text{
  max-height:46vh;overflow-y:auto;
  background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:14px 16px;margin:4px 0 12px;
  font-size:13.5px;line-height:1.6;color:var(--text);
  white-space:normal;
}

/* alpha.290 — dica de aplicacao por categoria de peptideo (passo 3 do registrar dose) */
.dm-peptide-tip{
  display:flex;align-items:flex-start;gap:9px;
  margin:8px 0 6px;padding:11px 13px;border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--accent) 9%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);
  font-size:13px;line-height:1.5;color:var(--text);font-weight:600;
}
.dm-peptide-tip .dm-peptip-ic{flex:0 0 auto;font-size:16px;line-height:1.3;}

/* alpha.296 — aviso de servicos de frete indisponiveis (ex: Loggi fora da rota) */
.freight-unavailable{
  margin-top:8px;padding:9px 12px;border-radius:var(--r-sm);font-size:12px;line-height:1.45;
  background:color-mix(in srgb,var(--amber,#f59e0b) 12%,var(--panel-2));
  border:1px solid color-mix(in srgb,#f59e0b 32%,transparent);color:var(--text);
}
.freight-unavailable strong{color:#b45309}

/* ════════════════════════════════════════════════════════════════
   alpha.298 — Modal .modal-box (Editar usuário etc.): faltava estilo,
   por isso a caixa aparecia "crua" sobre o overlay escuro. Padroniza
   com o visual do .modal-card.
   ════════════════════════════════════════════════════════════════ */
.modal-overlay{background:rgba(var(--shadow-rgb),.6);backdrop-filter:blur(6px) saturate(1.1);-webkit-backdrop-filter:blur(6px) saturate(1.1)}
.modal-box{
  width:100%;max-width:540px;max-height:90vh;overflow-y:auto;
  background:var(--panel);color:var(--text);
  border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:0 24px 60px rgba(var(--shadow-rgb),.32);
  padding:0;animation:modal-pop-bounce .22s cubic-bezier(.34,1.4,.64,1); /* alpha.938 — descolidiu do modal-pop generico */
}
@keyframes modal-pop-bounce{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}} /* alpha.938 — era 2o @keyframes modal-pop (colisao de nome): renomeado */
.modal-box .modal-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:18px 22px;border-bottom:1px solid var(--line);
  position:sticky;top:0;background:var(--panel);z-index:1;border-radius:20px 20px 0 0;
}
.modal-box .modal-head h2{margin:0;font-size:19px;font-weight:900;letter-spacing:-.02em}
.modal-box .modal-close{
  width:34px;height:34px;border-radius:var(--r-sm);border:1px solid var(--line);
  background:var(--panel-2);color:var(--muted);font-size:16px;cursor:pointer;
  display:grid;place-items:center;transition:.14s ease;flex:0 0 auto;
}
.modal-box .modal-close:hover{background:color-mix(in srgb,var(--red,#ef4444) 12%,var(--panel-2));color:var(--red,#ef4444);border-color:color-mix(in srgb,var(--red,#ef4444) 30%,transparent)}
.modal-box form{padding:20px 22px 22px}
.modal-box .form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}
@media(max-width:560px){
  .modal-box{max-width:none;border-radius:var(--r-md)}
  .modal-box form{padding:16px}
  .modal-box .form-actions{flex-direction:column-reverse}
  .modal-box .form-actions .btn{width:100%}
}
/* alpha.302 — Calculadora reversa */
.reverse-calc-shell{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:22px;
  align-items:start;
}
.reverse-head{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin-bottom:18px;
}
.reverse-head-icon{
  width:42px;
  height:42px;
  border-radius:var(--r-sm);
  display:grid;
  place-items:center;
  background:color-mix(in srgb,var(--accent) 12%,var(--panel-2));
  color:var(--accent);
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
}
.reverse-head h2{margin:0;font-size:22px;font-weight:950;letter-spacing:-.03em}
.reverse-head p{margin:4px 0 0;color:var(--muted);font-size:13px;font-weight:700;line-height:1.45}
.reverse-step h3{
  margin:0 0 10px;
  color:var(--muted);
  font-size:11px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.reverse-peptide-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:12px;
  margin-bottom:16px;
}
/* alpha.472 — alternância Custom / Escolha sua marca no passo do peptídeo */
.reverse-source-tabs{display:flex;gap:6px;margin:0 0 12px;flex-wrap:wrap}
.reverse-source-tab{padding:8px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);color:var(--muted);font:inherit;font-weight:800;font-size:13px;cursor:pointer;transition:.12s ease}
.reverse-source-tab:hover{color:var(--text);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.reverse-source-tab.active{color:#fff;background:var(--accent);border-color:var(--accent)}
[data-rev-grid][hidden]{display:none} /* cobre AMBOS os grids (custom e marca); .reverse-peptide-grid{display:grid} venceria o [hidden] do user-agent */
.reverse-brand-empty{grid-column:1/-1;padding:14px 16px;border:1px dashed var(--line);border-radius:var(--r-sm);color:var(--muted);font-size:13px;line-height:1.4}
.reverse-peptide-card{
  border:1px solid var(--line);
  border-radius:var(--r-md);
  background:var(--panel-2);
  color:var(--text);
  padding:13px 14px;
  text-align:left;
  cursor:pointer;
  transition:all .2s ease;
  font:inherit;
}
.reverse-peptide-card:hover{
  border-color:color-mix(in srgb,var(--accent) 42%,var(--line));
  background:color-mix(in srgb,var(--accent) 7%,var(--panel-2));
  transform:translateY(-2px) scale(1.02);
  box-shadow:0 8px 18px rgba(var(--accent-rgb),.15);
}
.reverse-peptide-card:active{transform:scale(.97)}
.reverse-peptide-card.active{
  border-color:var(--accent);
  background:color-mix(in srgb,var(--accent) 12%,var(--panel));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent), 0 6px 16px rgba(var(--accent-rgb),.12);
}
.reverse-peptide-card strong{display:block;font-size:13px;font-weight:950}
.reverse-peptide-card small{display:block;margin-top:3px;color:var(--muted);font-size:11px;font-weight:750}
.reverse-form-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.reverse-form-grid label{
  display:grid;
  gap:6px;
  color:var(--muted);
  font-size:12px;
  font-weight:850;
}
.reverse-form-grid input{
  min-height:42px;
  border-radius:var(--r-sm);
  font-size:14px;
  font-weight:850;
}
.reverse-help-card{
  margin-top:14px;
  display:grid;
  gap:4px;
  border:1px dashed color-mix(in srgb,var(--accent) 35%,var(--line));
  background:color-mix(in srgb,var(--accent) 6%,var(--panel));
  border-radius:var(--r-sm);
  padding:12px 14px;
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}
.reverse-help-card strong{color:var(--text);font-size:13px}
.reverse-actions{
  margin-top:16px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.reverse-preview-panel h3{
  margin:0 0 14px;
  text-align:center;
  color:var(--muted);
  font-size:12px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.reverse-preview-main{
  min-height:142px;
  border-radius:24px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:6px;
  background:
    radial-gradient(circle at 28% 18%,color-mix(in srgb,var(--accent) 34%,transparent),transparent 36%),
    linear-gradient(135deg,color-mix(in srgb,var(--accent) 18%,var(--panel)),var(--panel-2));
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
  margin-bottom:14px;
}
.reverse-preview-main span{color:var(--muted);font-size:11px;font-weight:950;text-transform:uppercase;letter-spacing:.08em}
.reverse-preview-main strong{font-size:44px;font-weight:950;color:var(--accent);letter-spacing:-.05em}
.reverse-note{margin:12px 0 0;color:var(--muted);font-size:12px;text-align:center;font-weight:700}
.reverse-result-modal{
  position:fixed;
  inset:0;
  z-index:10050;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(var(--shadow-rgb),.54);
  backdrop-filter:blur(16px);
}
.reverse-result-modal.is-open{display:flex}
.reverse-result-card{
  position:relative;
  width:min(560px,100%);
  max-height:min(760px,92vh);
  overflow:auto;
  border-radius:24px;
  background:var(--panel);
  border:1px solid var(--line);
  box-shadow:0 30px 90px rgba(0,0,0,.24);
  padding:24px;
}
.reverse-result-close{
  position:absolute;
  right:16px;
  top:16px;
  width:34px;
  height:34px;
  border-radius:var(--r-sm);
  border:1px solid var(--line);
  background:var(--panel-2);
  color:var(--text);
  cursor:pointer;
  font-size:20px;
  line-height:1;
}
.reverse-result-kicker{
  color:var(--accent);
  font-size:11px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.reverse-result-card h2{margin:5px 44px 8px 0;font-size:24px;font-weight:950;letter-spacing:-.04em}
.reverse-result-dose{
  font-size:58px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.06em;
  color:var(--accent);
  margin:14px 0;
}
.reverse-result-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:0 0 14px;
}
.reverse-result-grid span{
  display:grid;
  gap:2px;
  padding:10px 12px;
  border-radius:var(--r-sm);
  background:var(--panel-2);
  color:var(--muted);
  font-size:11px;
  font-weight:850;
}
.reverse-result-grid strong{color:var(--text);font-size:14px;font-weight:950}
.reverse-result-copy{
  white-space:pre-wrap;
  margin:0;
  padding:16px;
  border-radius:var(--r-md);
  border:1px solid var(--line);
  background:color-mix(in srgb,var(--panel-2) 82%,#000);
  color:var(--text);
  font:700 13px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.reverse-result-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:16px;
}
@media(max-width:980px){
  .reverse-calc-shell{grid-template-columns:1fr}
  .reverse-preview-panel{position:static}
}
@media(max-width:640px){
  .reverse-form-grid{grid-template-columns:1fr 1fr}
  .reverse-peptide-grid{grid-template-columns:1fr}
  .reverse-result-grid{grid-template-columns:1fr}
  .reverse-result-dose{font-size:44px}
  .reverse-actions,.reverse-result-actions{flex-direction:column}
  .reverse-actions .btn,.reverse-result-actions .btn{width:100%;justify-content:center}
}
@media(max-width:440px){
  .reverse-form-grid{grid-template-columns:1fr}
}

/* alpha.303 — Calculadora reversa: seringa em cards + vial animado */
.reverse-input-panel{
  --rv-color:var(--accent);
}
.reverse-form-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.reverse-syringe-step{
  margin-top:16px;
}
.reverse-syringe-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.reverse-syringe-card{
  position:relative;
  min-height:70px;
  border:1px solid var(--line);
  border-radius:var(--r-md);
  background:var(--panel-2);
  color:var(--text);
  padding:13px 14px 12px 46px;
  text-align:left;
  cursor:pointer;
  transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;
  font:inherit;
  overflow:hidden;
}
.reverse-syringe-card::before{
  content:'';
  position:absolute;
  left:13px;
  top:50%;
  width:22px;
  height:11px;
  transform:translateY(-50%);
  border:1.5px solid color-mix(in srgb,var(--accent) 58%,var(--line));
  border-radius:4px 2px 2px 4px;
  background:
    linear-gradient(90deg,color-mix(in srgb,var(--accent) 24%,transparent) 0 58%,transparent 58%),
    var(--panel);
  box-shadow:
    -5px 0 0 -2px color-mix(in srgb,var(--muted) 60%,transparent),
    7px 0 0 -5px var(--muted),
    15px 0 0 -6px var(--muted);
}
.reverse-syringe-card:hover{
  transform:translateY(-2px) scale(1.02);
  border-color:color-mix(in srgb,var(--accent) 42%,var(--line));
  background:color-mix(in srgb,var(--accent) 7%,var(--panel-2));
  box-shadow:0 8px 18px rgba(var(--accent-rgb),.15);
}
.reverse-syringe-card:active{transform:scale(.97)}
.reverse-syringe-card.active{
  border-color:var(--accent);
  background:color-mix(in srgb,var(--accent) 12%,var(--panel));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent), 0 6px 16px rgba(var(--accent-rgb),.12);
}
.reverse-syringe-card strong{
  display:block;
  font-size:14px;
  font-weight:950;
}
.reverse-syringe-card small{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}
.reverse-vial-stage,
.reverse-result-visual{
  --rv-color:var(--accent);
}
.reverse-vial-stage.rv-blue,
.reverse-result-visual.rv-blue{
  --rv-color:#2563eb;
}
.reverse-vial-stage{
  display:grid;
  place-items:center;
  min-height:245px;
  margin-bottom:14px;
  border-radius:24px;
  background:
    radial-gradient(circle at 30% 12%,color-mix(in srgb,var(--rv-color) 22%,transparent),transparent 38%),
    linear-gradient(145deg,color-mix(in srgb,var(--rv-color) 9%,var(--panel)),var(--panel-2));
  border:1px solid color-mix(in srgb,var(--rv-color) 22%,var(--line));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.36);
}
.reverse-vial{
  position:relative;
  width:132px;
  height:198px;
  display:grid;
  justify-items:center;
  align-content:start;
}
.reverse-vial-mini{
  width:78px;
  height:118px;
}
.reverse-vial-cap{
  width:54px;
  height:18px;
  border-radius:8px 8px 4px 4px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.4),transparent),
    color-mix(in srgb,var(--rv-color) 16%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--rv-color) 30%,var(--line));
  box-shadow:0 8px 18px color-mix(in srgb,var(--rv-color) 12%,transparent);
  z-index:2;
}
.reverse-vial-mini .reverse-vial-cap{
  width:34px;
  height:12px;
  border-radius:6px 6px 3px 3px;
}
.reverse-vial-neck{
  width:42px;
  height:20px;
  margin-top:-1px;
  background:rgba(255,255,255,.32);
  border-left:1px solid color-mix(in srgb,var(--text) 14%,transparent);
  border-right:1px solid color-mix(in srgb,var(--text) 14%,transparent);
  z-index:1;
}
.reverse-vial-mini .reverse-vial-neck{
  width:27px;
  height:12px;
}
.reverse-vial-body{
  position:relative;
  width:114px;
  height:154px;
  margin-top:-1px;
  overflow:hidden;
  border-radius:17px 17px 24px 24px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.72),rgba(255,255,255,.18) 18%,rgba(255,255,255,.04) 50%,rgba(255,255,255,.46) 100%),
    color-mix(in srgb,var(--panel) 86%,transparent);
  border:1.5px solid color-mix(in srgb,var(--text) 16%,var(--line));
  box-shadow:
    inset 0 1px 9px rgba(255,255,255,.42),
    inset 0 -10px 22px rgba(0,0,0,.05),
    0 22px 45px color-mix(in srgb,var(--rv-color) 14%,transparent);
}
.reverse-vial-mini .reverse-vial-body{
  width:68px;
  height:91px;
  border-radius:11px 11px 15px 15px;
}
.reverse-vial-liquid{
  --rv-fill:22%;
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:var(--rv-fill);
  overflow:hidden;
  background:linear-gradient(90deg,
    color-mix(in srgb,var(--rv-color) 68%,#fff) 0%,
    var(--rv-color) 32%,
    color-mix(in srgb,var(--rv-color) 86%,#fff) 52%,
    var(--rv-color) 72%,
    color-mix(in srgb,var(--rv-color) 68%,#fff) 100%);
  background-size:220% 100%;
  animation:cs-flow 3s linear infinite;
  transition:height .32s cubic-bezier(.4,0,.2,1);
}
.reverse-vial-liquid::before{
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:12px;
  border-radius:50%;
  transform:translateY(-6px);
  background:rgba(255,255,255,.48);
  box-shadow:0 2px 14px rgba(255,255,255,.2);
}
.reverse-vial-liquid::after{
  content:'';
  position:absolute;
  inset:0;
  height:200%;
  background-image:
    radial-gradient(circle 3px at 18% 92%, rgba(255,255,255,.66), transparent 60%),
    radial-gradient(circle 2px at 35% 78%, rgba(255,255,255,.56), transparent 60%),
    radial-gradient(circle 2.8px at 58% 88%, rgba(255,255,255,.58), transparent 60%),
    radial-gradient(circle 1.8px at 78% 70%, rgba(255,255,255,.52), transparent 60%),
    radial-gradient(circle 2.4px at 90% 96%, rgba(255,255,255,.58), transparent 60%),
    radial-gradient(circle 2px at 23% 42%, rgba(255,255,255,.52), transparent 60%),
    radial-gradient(circle 1.7px at 51% 32%, rgba(255,255,255,.48), transparent 60%),
    radial-gradient(circle 2.5px at 72% 45%, rgba(255,255,255,.56), transparent 60%);
  background-repeat:no-repeat;
  animation:cs-bubbles 3.2s linear infinite;
  will-change:transform;
}
/* alpha.460 — superfície líquida ONDULANTE (estilo "onda do PS3"): 2 camadas de
   onda em parallax + crista luminosa. A faixa fica colada na superfície do líquido
   (bottom = nível de preenchimento, ajustado via JS) e balança de leve. */
.reverse-vial-wave{
  position:absolute;
  left:0;
  right:0;
  bottom:22%;
  height:22px;
  overflow:hidden;
  pointer-events:none;
  transition:bottom .32s cubic-bezier(.4,0,.2,1);
  animation:rvw-bob 4.6s ease-in-out infinite;
}
.reverse-vial-wave .rvw{
  position:absolute;
  left:0;
  bottom:-1px;
  width:200%;
  height:100%;
  display:block;
}
.reverse-vial-wave .rvw-back{ animation:rvw-scroll 7.5s linear infinite; }
.reverse-vial-wave .rvw-front{ animation:rvw-scroll 4.6s linear infinite reverse; animation-delay:-1.6s; }
/* alpha.461 — onda na COR do líquido (var --rv-color), p/ não criar uma faixa mais
   clara na superfície (o "corte" no render). A onda de trás é só um brilho sutil
   (foam) que aparece nas cavas; a crista branca dá o destaque. */
.reverse-vial-wave .rvw-back .rvw-fill{ fill:color-mix(in srgb,var(--rv-color) 72%,#fff); opacity:.35; }
.reverse-vial-wave .rvw-front .rvw-fill{ fill:var(--rv-color); }
/* alpha.462 — sem a crista branca: a linha branca virava um "corte" reto na
   superfície em vários momentos da animação. A onda em si (cor do líquido) já
   dá o efeito; o brilho fica por conta do reflexo do vidro (.reverse-vial-glass). */
.reverse-vial-wave .rvw-crest{ display:none; }
@keyframes rvw-scroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes rvw-bob{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-2px)} }
/* alpha.642 — ondas removidas (render bugado, 3 tentativas); a prévia usa o brilho suave
   arredondado do líquido (::before) como superfície limpa, sem faixa de onda nem corte reto.
   Suavizado p/ a prévia (vial maior): highlight mais sutil. */
#reverseVialStage .reverse-vial-liquid::before{ height:9px; background:rgba(255,255,255,.34); box-shadow:0 2px 12px rgba(255,255,255,.14); }
.reverse-vial-glass{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,255,255,.75),transparent 18%,transparent 72%,rgba(255,255,255,.52)),
    radial-gradient(circle at 38% 20%,rgba(255,255,255,.45),transparent 24%);
}
.reverse-vial-dose{
  position:absolute;
  inset:0;
  z-index:3;
  display:grid;
  place-items:center;
  align-content:center;
  gap:6px;
  text-align:center;
  padding:14px;
}
.reverse-vial-dose span{
  color:var(--muted);
  font-size:10px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.reverse-vial-dose strong{
  color:var(--text);
  font-size:30px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.05em;
  text-shadow:0 1px 0 rgba(255,255,255,.55);
}
.reverse-result-visual{
  display:grid;
  place-items:center;
  margin:-2px 0 14px;
  min-height:120px;
  border-radius:var(--r-md);
  background:color-mix(in srgb,var(--rv-color) 8%,var(--panel-2));
  border:1px solid color-mix(in srgb,var(--rv-color) 18%,var(--line));
}
@media(max-width:640px){
  .reverse-form-grid{grid-template-columns:1fr}
  .reverse-syringe-grid{grid-template-columns:1fr}
  .reverse-vial-stage{min-height:220px}
  .reverse-vial{transform:scale(.9)}
}
/* alpha.460 — o líquido do reservatório (fluxo, bolhas e ONDA) é micro-interação
   assinatura do produto: a pedido do dono, continua animando mesmo com "reduzir
   movimento" ligado, igual à garrafa/seringa (alpha.435). */

/* alpha.304 - Doses estritas da calculadora */
.calc-preset-note,
.preset-note{
  display:block;
  margin-top:7px;
  color:var(--muted);
  font-size:11px;
  line-height:1.35;
  font-weight:750;
}
.custom-row.is-locked{
  display:none !important;
}
/* alpha.458 — dose travada (produto de dose fixa): esconde só o campo de
   valor + unidade, MAS mantém o botão "Próximo" visível para o usuário
   conseguir avançar do passo (antes o auto-avanço cobria isso). */
.calc-custom-row.is-locked input,
.calc-custom-row.is-locked .unit{
  display:none !important;
}

/* ════════════════════════════════════════════════════════════════
   alpha.459 — Lista de Usuários: mais compacta + botões de ação
   padronizados (3 neutros + 1 vermelho "Desativar"). Escopo só em
   #usersTable para não afetar outras tabelas.
   ════════════════════════════════════════════════════════════════ */
#usersTable{min-width:640px}
#usersTable th,
#usersTable td{padding:8px 12px;font-size:13px}
#usersTable td strong{font-size:13.5px;font-weight:800}
#usersTable .user-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap;align-items:center;row-gap:6px}
/* alpha.752 — Pessoas (cadastro) enxuto: ações compactas em ícones + seletor de modo Cadastros/Atividade */
.pn-actions{display:inline-flex;gap:6px;justify-content:flex-end;align-items:center;flex-wrap:nowrap}
.pn-actions form{margin:0}
.pn-actions .iconbtn{width:34px;height:34px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:15px;line-height:1;border-radius:var(--r-md,9px);background:var(--panel-2);border:1px solid var(--line);color:var(--text);cursor:pointer;transition:background .12s,border-color .12s,transform .12s}
.pn-actions .iconbtn:hover{background:var(--panel);transform:translateY(-1px)}
.pn-actions .iconbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pn-actions .iconbtn.danger{color:#c0392b}
.pn-actions .iconbtn.danger:hover{background:rgba(192,57,43,.12);border-color:rgba(192,57,43,.4)}
.pn-actions .btn.small{padding:7px 11px;font-size:12px;font-weight:800;white-space:nowrap}
.pn-viewtoggle{display:inline-flex;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-pill,999px);padding:3px;gap:2px}
.pn-viewtoggle a{padding:7px 15px;border-radius:var(--r-pill,999px);font-weight:800;font-size:13px;color:var(--muted);text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:background .12s,color .12s;white-space:nowrap}
.pn-viewtoggle a:hover{color:var(--text)}
.pn-viewtoggle a.on{background:var(--accent);color:var(--accent-text,#fff);box-shadow:0 1px 3px rgba(0,0,0,.12)}
/* alpha.753 — ferramenta de arquivamento de pedidos */
.oa-tool{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}
.oa-tool>label{display:flex;flex-direction:column;gap:4px;font-weight:800;font-size:13px}
.oa-tool>label.row-check{flex-direction:row;align-items:center;gap:7px;font-weight:600}
.oa-tool input[type=date]{padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-md,9px);background:var(--panel-2);color:var(--text)}
.oa-actions{display:flex;gap:8px;margin-left:auto;flex-wrap:wrap}
.oa-result{font-size:14px;line-height:1.5}
#usersTable .user-actions form{margin:0}
#usersTable .user-actions .btn.small{box-shadow:none;padding:6px 11px;font-size:12px;font-weight:800;background:var(--panel-2);border-color:var(--line);color:var(--text);white-space:nowrap}
#usersTable .user-actions .btn.small:hover{background:var(--panel);border-color:rgba(var(--accent-rgb),.45);transform:none}
#usersTable .user-actions .btn.small.danger{background:transparent;color:var(--red,#dc2626);border-color:rgba(220,38,38,.28)}
#usersTable .user-actions .btn.small.danger:hover{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.45)}
/* Telas médias (tablet retrato / janela dividida): deixa as ações QUEBRAREM em
   2 linhas antes de a tabela forçar scroll horizontal — assim "Desativar" não
   fica escondido fora da tela. */
@media(max-width:900px){
  #usersTable .user-actions{flex-wrap:wrap}
  #usersTable .user-actions .btn.small{flex:0 0 auto}
}
/* Card-view (≤560px): libera a largura mínima p/ a tabela virar cards sem rolar */
@media(max-width:560px){
  #usersTable{min-width:0}
}

/* ════════════════════════════════════════════════════════════════
   alpha.305 — FASE 2: Padronização visual (auditoria UX/UI)
   Correções cirúrgicas que HERDAM as variáveis de tema. Não reescreve
   nada existente — só harmoniza alinhamento, foco e transições.
   ════════════════════════════════════════════════════════════════ */

/* (1) alpha.280 fez .main/.pub-main virar grid + filhos com width:min(1280px,
   100%) porém SEM centralizar — em telas largas o conteúdo encostava à
   esquerda. Centraliza as colunas do grid, mantendo o limite de largura. */
body.has-universal-topbar .main,
.pub-main {
  justify-items: center;
}
body.has-universal-topbar .main > *,
.pub-main > * {
  margin-inline: auto;
}
/* alpha.334 — FIX do "menu lateral": com a sidebar RECOLHIDA o .main fica largo e
   o conteúdo centralizado (regra acima) deixava faixas vazias enormes dos dois
   lados, parecendo quebrado. No estado recolhido, alinha o conteúdo à esquerda
   (junto ao rail de ícones), como VS Code/Notion. Estado expandido fica intacto. */
body.sidenav-collapsed.has-universal-topbar .main { justify-items: start; }
body.sidenav-collapsed.has-universal-topbar .main > * {
  justify-self: start;
  width: 100% !important;          /* anula larguras fixas (ex.: cfg-layout width:1180px) */
  max-width: 1280px !important;    /* mantém o teto de leitura */
  margin-left: 0 !important;
  margin-right: auto !important;   /* sobra fica à direita; conteúdo encosta no rail */
}

/* (2) Foco unificado em TODOS os controles (inputs, selects, textarea,
   botões-gatilho), sempre na cor do tema — transição suave e anel coerente.
   Baixa especificidade (:where) para nunca vencer overrides intencionais. */
:where(input, select, textarea, .status-trigger, .calc-preset-search,
       .calc-theme-btn, .topbar-theme-btn, .menu-label-input) {
  transition: border-color .14s ease, box-shadow .14s ease, background .14s ease;
}
:where(input, select, textarea):focus-visible {
  outline: none;
  border-color: color-mix(in srgb, var(--accent) 60%, var(--line));
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent);
}

/* (3) Tipografia consistente de rótulos de formulário (peso/cor coerentes
   entre módulos — alguns labels vinham 850, outros 700). */
:where(.form-grid, .form-stack, .cfg-field-grid, .my-profile-form) > label {
  font-weight: 700;
  letter-spacing: .005em;
}
/* alpha.755 — checkbox/rádio INLINE com o texto. As regras globais `label{display:grid}`
   (empilha rótulo acima do campo) + `input{width:100%}` esticavam o checkbox p/ a largura
   toda da célula e jogavam o texto p/ baixo (aparência "checkbox flutuando no meio,
   desalinhado" — visível no modal de edição de pessoa/usuário e em todo .row-check). */
label.row-check {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}
label.row-check input[type=checkbox],
label.row-check input[type=radio] {
  width: auto !important;
  flex: 0 0 auto;
  margin: 0;
}

/* (4) Espaçamento vertical uniforme entre seções/cards de uma mesma página. */
.main > section + section,
.pub-main > section + section { margin-top: 0; }

/* ════════════════════════════════════════════════════════════════
   alpha.307 — FASE 4: Responsividade/Chrome (desktop + emulador mobile)
   Foco no motor do Chrome e no emulador de dispositivos do DevTools.
   Aditivo — não remove regras existentes.
   ════════════════════════════════════════════════════════════════ */

/* (1) Menus que abrem por :hover só devem fazê-lo em dispositivos com
   ponteiro fino real (mouse). No emulador mobile / toque, hover-to-open
   causa o problema do "duplo toque" — ali o menu abre por clique (JS). */
@media (hover: none), (pointer: coarse) {
  .nav-group:hover .dropdown-panel,
  .sidenav-group:hover .sidenav-flyout {
    opacity: 0;
    pointer-events: none;
  }
  /* mas se o JS marcar como aberto, mostra normalmente */
  .nav-group.is-open .dropdown-panel,
  .sidenav-group.is-open .sidenav-flyout {
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

/* (2) Alvos de toque confortáveis no Chrome mobile (mín. ~44px) e
   remove o atraso de 300ms / realça o tap de forma sutil. */
@media (pointer: coarse) {
  .btn, .icon-btn, .calc-tab-btn, .dm-chip, .calc-chip,
  .sidenav-tree-trigger, .sidenav-tree-item, .dm-site-btn,
  .toggle-sw, .color-opt, select, .status-trigger {
    touch-action: manipulation;
  }
  .btn, .icon-btn { min-height: 44px; }
  /* inputs com 16px evitam o zoom automático do Chrome ao focar no mobile */
  input, select, textarea { font-size: 16px; }
}

/* (3) Garante que nada estoure a largura no emulador (overflow-x lateral
   é o defeito mais comum em telas estreitas do DevTools). */
@media (max-width: 480px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ════════════════════════════════════════════════════════════════
   alpha.308 — Topbar mobile: ícones do topo com respiro e tamanho
   consistente (estavam apertados/confusos no emulador). Só ≤700px.
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 700px) {
  .pub-topbar .pub-actions { gap: 4px; align-items: center; }
  /* todos os controles do topo com o MESMO tamanho de toque (38px) */
  .pub-topbar .pub-actions > .icon-btn,
  .pub-topbar .pub-actions > .color-picker > .color-picker-btn,
  .pub-topbar .pub-actions > .user-menu > summary,
  .pub-topbar .pub-actions > .pub-mobile-nav-btn {
    width: 38px; height: 38px; min-height: 38px;
    padding: 0; display: flex; align-items: center; justify-content: center;
    border-radius: 11px;
  }
  /* esconde rótulos de texto que estouram (Tema, nome do usuário, "Azul Digital") */
  .pub-topbar .pub-actions .topbar-label,
  .pub-topbar .pub-actions .color-picker-label,
  .pub-topbar .pub-actions .pub-user-name,
  .pub-topbar .pub-actions .color-picker-caret { display: none; }
  /* o avatar do usuário centralizado no botão-summary */
  .pub-topbar .pub-actions .user-menu > summary .pub-user-avatar { margin: 0; }
  /* dropdowns (cor/usuário) não podem vazar a tela: ancora à direita */
  .pub-topbar .topbar-color-panel,
  .pub-topbar .topbar-user-panel {
    position: fixed; right: 10px; left: auto;
    top: calc(var(--topbar-h, 52px) + 6px);
    max-width: calc(100vw - 20px);
  }
}

/* alpha.319/320 — Afiliados */
.affiliate-code-badge{
  display:inline-block;font-family:ui-monospace,monospace;font-weight:900;
  letter-spacing:2px;font-size:20px;padding:6px 16px;border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--accent) 14%,var(--panel-2));
  color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 32%,transparent);
}
.affiliate-id-grid{display:grid;grid-template-columns:repeat(3,auto);gap:18px;align-items:start}
.affiliate-big{font-size:24px;font-weight:900;letter-spacing:-.02em}
.affiliate-panel .auth-hero-mini h1{margin:0 0 4px}
.affiliate-admin-item summary::-webkit-details-marker{display:none}
@media(max-width:560px){.affiliate-id-grid{grid-template-columns:1fr 1fr}}

/* alpha.321 — zk-select: dropdown customizado alinhado ao design do sistema */
.zk-select-wrap{position:relative;width:100%}
.zk-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:38px;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:14px;font-weight:700;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.zk-select-trigger:hover{border-color:var(--line-strong)}
.zk-select-wrap.open .zk-select-trigger{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}
.zk-select-caret{flex:0 0 auto;color:var(--muted);transition:transform .18s}
.zk-select-wrap.open .zk-select-caret{transform:rotate(180deg)}
.zk-select-menu{position:absolute;z-index:60;top:calc(100% + 6px);left:0;right:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 14px 40px rgba(0,0,0,.18);padding:6px;display:none;max-height:280px;overflow:auto}
.zk-select-wrap.open .zk-select-menu{display:block;animation:zkSelIn .14s ease}
@keyframes zkSelIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.zk-select-option{padding:9px 11px;border-radius:var(--r-xs);font-size:14px;font-weight:650;cursor:pointer;color:var(--text);display:flex;align-items:center;gap:8px}
.zk-select-option:hover{background:color-mix(in srgb,var(--accent) 14%,transparent)}
.zk-select-option.is-selected{background:color-mix(in srgb,var(--accent) 20%,transparent);font-weight:850}
.zk-select-option.is-selected::after{content:'✓';margin-left:auto;color:var(--accent);font-weight:900}

/* alpha.321 — feedback do cupom de afiliado no checkout */
.aff-code-msg{margin:-4px 0 4px;font-size:13px;font-weight:750;padding:8px 12px;border-radius:var(--r-sm)}
.aff-code-msg.ok{color:var(--green);background:rgba(22,163,74,.10);border:1px solid rgba(22,163,74,.26)}
.aff-code-msg.bad{color:var(--red);background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.24)}
.store-order-summary .summary-discount{display:flex;align-items:center;justify-content:space-between;color:var(--green);font-weight:800;padding:4px 0}

/* alpha.322 — logo oficial (wireframe + wordmark) no topbar público/ERP */
.pub-brand svg{height:32px;width:auto;display:block}

/* alpha.325 — galeria de mídia do catálogo (ERP) */
.media-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:12px}
.media-gallery-item{position:relative;margin:0;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:var(--panel-2)}
.media-gallery-item>img,.media-gallery-item .media-video-thumb{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.media-gallery-item .media-video-thumb{display:flex;align-items:center;justify-content:center;background-size:cover;background-position:center;color:#fff;background-color:#111}
.media-gallery-item .media-video-thumb svg{filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
.media-badge{position:absolute;top:8px;left:8px;padding:3px 9px;border-radius:var(--r-pill);font-size:11px;font-weight:800;color:#fff;background:rgba(0,0,0,.6)}
.media-badge.cover{background:var(--accent);color:var(--accent-text,#1a1207)}
.media-gallery-item figcaption{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;font-size:12px}
.media-gallery-item figcaption form{margin:0}
.btn.small.danger{background:rgba(220,38,38,.12);color:var(--red);border-color:rgba(220,38,38,.28);padding:4px 9px}

/* alpha.325 — galeria na página de produto (loja) */
.store-gallery{display:flex;flex-direction:column;gap:12px}
.store-gallery-main{border-radius:var(--r-md);overflow:hidden;background:var(--panel-2);border:1px solid var(--line)}
.store-gallery-main img{width:100%;display:block;object-fit:cover}
.store-gallery-thumbs{display:flex;gap:8px;flex-wrap:wrap}
.store-gallery-thumb{width:64px;height:64px;border-radius:var(--r-sm);overflow:hidden;border:2px solid var(--line);background:#111 center/cover no-repeat;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}
.store-gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.store-gallery-thumb:hover{border-color:var(--accent)}
.store-gallery-thumb.is-video{position:relative}
.store-media-video{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--r-sm);overflow:hidden;background:#000;margin-top:10px}
.store-media-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.store-gallery-videos{display:flex;flex-direction:column;gap:10px}

/* alpha.326 — uploader YouTube no editor de produto */
.yt-upbox{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:6px}
.yt-progress{margin-top:12px}
.yt-progress-bar{height:10px;border-radius:var(--r-pill);background:var(--panel-2);border:1px solid var(--line);overflow:hidden}
.yt-progress-bar span{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.yt-progress small{display:block;margin-top:6px;color:var(--muted);font-size:12px}

/* alpha.327 — seletores de opção do produto (loja) */
.store-buy-box .store-opt{display:flex;flex-direction:column;gap:4px;font-weight:700;font-size:13px;margin-bottom:10px}
.store-buy-box .store-opt select,.store-buy-box .store-opt input{font-weight:600}
.store-therm{border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;margin-bottom:12px}
.store-therm legend{font-weight:800;font-size:13px;padding:0 6px}
.store-radio{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:13px;margin-right:14px;cursor:pointer}
.store-therm-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.store-therm-opts label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700}
.store-therm-stock{grid-column:1/-1;margin:2px 0 0;font-size:12px;font-weight:700}
.store-therm-stock.ok{color:var(--green)}
.store-therm-stock.bad{color:var(--red)}

/* alpha.328 — banner de instalação do app (PWA) */
.pwa-install{position:fixed;left:12px;right:12px;bottom:12px;z-index:120;display:flex;align-items:center;gap:10px;
  background:var(--panel);border:1px solid var(--line-strong,var(--line));border-radius:var(--r-md);padding:12px 14px;
  box-shadow:0 12px 40px rgba(0,0,0,.28);font-size:13px;font-weight:700;color:var(--text);max-width:560px;margin:0 auto}
.pwa-install span{flex:1;line-height:1.35}
.pwa-install .pwa-install-x{background:transparent;border:0;color:var(--muted);font-size:16px;cursor:pointer;padding:2px 6px;line-height:1}
@media(min-width:760px){.pwa-install{left:auto;right:20px;bottom:20px}}

/* alpha.331 — página de Política de Privacidade */
.legal-doc{max-width:820px;margin:0 auto;padding:24px 20px 60px;line-height:1.65;color:var(--text)}
.legal-doc h1{font-size:30px;margin:0 0 4px}
.legal-doc .legal-updated{color:var(--muted);font-size:13px;margin:0 0 22px}
.legal-doc h2{font-size:19px;margin:26px 0 8px;padding-top:10px;border-top:1px solid var(--line)}
.legal-doc p{margin:0 0 12px}
.legal-doc ul{margin:0 0 12px;padding-left:22px}
.legal-doc li{margin:5px 0}
.legal-doc a{color:var(--accent);font-weight:700}
.legal-doc code{background:var(--panel-2);padding:1px 6px;border-radius:var(--r-2xs);font-size:13px}

/* ═══════════════ alpha.333 — Dashboard de Produção do Cliente ═══════════════ */
.prod-dash{max-width:760px;margin:28px auto 64px;padding:0 16px;display:flex;flex-direction:column;gap:16px}
.pd-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.pd-eyebrow{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pd-title{font-size:26px;font-weight:950;letter-spacing:-.02em;margin:4px 0 6px;line-height:1.15}
.pd-code{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:800;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-pill);padding:4px 12px;color:var(--text)}
.pd-hero-status{flex:0 0 auto}
.pd-cancelled{background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.28);color:var(--red);border-radius:var(--r-sm);padding:12px 14px;font-weight:700;font-size:14px}

/* Esteira */
.pd-timeline{list-style:none;margin:6px 0;padding:0;display:flex;justify-content:space-between;position:relative;gap:4px}
.pd-timeline::before{content:'';position:absolute;top:21px;left:24px;right:24px;height:3px;background:var(--line);border-radius:3px;z-index:0}
.pd-step{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:7px;flex:1;text-align:center;min-width:0}
.pd-step-dot{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--panel);border:3px solid var(--line);color:var(--muted);transition:.25s}
.pd-step-label{font-size:11.5px;font-weight:800;color:var(--muted);line-height:1.2}
.pd-step.pd-done .pd-step-dot{background:var(--green,#16a34a);border-color:var(--green,#16a34a);color:#fff}
.pd-step.pd-done .pd-step-label{color:var(--text)}
.pd-step.pd-active .pd-step-dot{background:var(--accent);border-color:var(--accent);color:var(--accent-text,#1a1207);box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 22%,transparent);animation:pdPulse 1.8s ease-in-out infinite}
.pd-step.pd-active .pd-step-label{color:var(--text);font-weight:900}
@keyframes pdPulse{0%,100%{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 24%,transparent)}50%{box-shadow:0 0 0 10px color-mix(in srgb,var(--accent) 8%,transparent)}}
.pd-timeline.is-cancelled{opacity:.5;filter:grayscale(.6)}

/* Cards */
.pd-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);padding:18px;box-shadow:var(--shadow-soft,0 1px 2px rgba(0,0,0,.04))}
.pd-card-h{font-size:16px;font-weight:900;margin:0 0 12px}
.pd-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.pd-items li{display:flex;gap:10px;align-items:center;font-size:14px;font-weight:600}
.pd-item-qty{font-weight:900;color:var(--accent);min-width:34px}

/* Produção ao vivo (animação) */
.pd-prod{display:flex;align-items:center;gap:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,var(--panel)),var(--panel))}
.pd-prod-pulse{display:flex;align-items:flex-end;gap:4px;height:34px;flex:0 0 auto}
.pd-prod-pulse span{width:6px;background:var(--accent);border-radius:3px;animation:pdBars 1s ease-in-out infinite}
.pd-prod-pulse span:nth-child(1){animation-delay:0s}.pd-prod-pulse span:nth-child(2){animation-delay:.15s}.pd-prod-pulse span:nth-child(3){animation-delay:.3s}.pd-prod-pulse span:nth-child(4){animation-delay:.45s}
@keyframes pdBars{0%,100%{height:10px}50%{height:34px}}
.pd-prod-info{display:flex;flex-direction:column;gap:3px}
.pd-prod-info strong{font-size:15px}

/* Rastreio */
.pd-track-status{font-weight:900;font-size:15px;margin-bottom:4px}
.pd-track-meta{font-size:12px;margin:0 0 10px}
.pd-track-events{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:10px}
.pd-track-events li{display:flex;gap:10px}
.pd-ev-dot{flex:0 0 auto;width:10px;height:10px;border-radius:50%;background:var(--accent);margin-top:5px}
.pd-track-events small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}
.pd-track .btn{min-height:44px;display:inline-flex;align-items:center}

/* Galeria + lightbox */
.pd-media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.pd-media{margin:0;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);background:var(--panel-2)}
.pd-media img,.pd-media video{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.pd-media figcaption{font-size:12px;padding:6px 8px;color:var(--muted)}
.pd-lightbox{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;padding:24px}
.pd-lightbox img{max-width:96vw;max-height:90vh;border-radius:var(--r-sm)}
.pd-lightbox-close{position:absolute;top:16px;right:18px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.15);color:#fff;font-size:20px;cursor:pointer}

/* Mobile: esteira vira vertical (sem aperto/overflow) */
@media(max-width:560px){
  .pd-title{font-size:22px}
  .pd-timeline{flex-direction:column;gap:2px}
  .pd-timeline::before{top:24px;bottom:24px;left:21px;right:auto;width:3px;height:auto}
  .pd-step{flex-direction:row;justify-content:flex-start;gap:12px;text-align:left;padding:6px 0}
  .pd-step-label{font-size:14px}
}

/* alpha.343 — Analisador de refeições (aba Refeições) */
/* alpha.659 — Nutrição: coluna única 640px (encostada à esquerda) → grid responsivo
   que preenche a largura: 1 coluna no mobile, até 3 no widescreen (menos rolagem). */
.meal-wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:14px;align-items:start}
.meal-goal-card,.meal-analyze-card,.meal-day-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);padding:16px}
.meal-goal-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.meal-goal-value{font-size:20px;font-weight:950;color:var(--accent)}
.meal-goal-bar{height:10px;border-radius:var(--r-pill);background:var(--panel-2);border:1px solid var(--line);overflow:hidden}
.meal-goal-bar span{display:block;height:100%;width:0;background:var(--accent);transition:width .3s}
.meal-goal-stats{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-top:6px}
.meal-goal-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.meal-goal-fields label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700}
.meal-photo-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.meal-items{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.meal-item-row{display:grid;grid-template-columns:1fr 72px 80px auto;gap:6px;align-items:center}
.meal-item-row input{min-height:38px}
/* alpha.464 — cada alimento em um CARD (peso/kcal + macro predominante) */
.meal-item-card{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);padding:12px}
.meal-item-card .mic-top{display:flex;align-items:center;gap:8px}
.meal-item-card .mi-name{flex:1;min-width:0;min-height:38px;font-weight:800;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:8px 10px;color:var(--text)}
.mic-badge{flex:0 0 auto;font-size:11px;font-weight:850;padding:5px 11px;border-radius:var(--r-pill);color:#fff;white-space:nowrap}
.mic-badge.mt-p{background:#2563eb}.mic-badge.mt-c{background:#d99a00}.mic-badge.mt-f{background:#dc2626}.mic-badge.mt-b{background:#16a34a}.mic-badge.mt-o{background:var(--muted)}
.mic-del{flex:0 0 auto;border:1px solid var(--line);background:var(--panel);color:var(--red,#dc2626);border-radius:var(--r-xs);width:32px;height:32px;cursor:pointer;font-weight:900;line-height:1}
.mic-del:hover{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.35)}
.mic-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.mic-fields label{display:flex;flex-direction:column;gap:4px;font-size:11px;font-weight:800;color:var(--muted)}
.mic-suf{display:flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:0 10px;min-height:40px;font-size:13px;font-weight:800;color:var(--muted)}
.mic-suf input{border:none;background:transparent;outline:none;width:100%;min-width:0;font-size:15px;font-weight:850;color:var(--text);padding:8px 0}
.mic-macros{display:flex;flex-wrap:wrap;gap:10px;margin-top:9px;font-size:11.5px;font-weight:800;align-items:center}
.mic-est{color:var(--muted);font-weight:750;opacity:.85;text-transform:uppercase;letter-spacing:.04em;font-size:10px}
.mic-macros .mt-p{color:#2563eb}.mic-macros .mt-c{color:color-mix(in srgb,#d99a00 60%,var(--text))}.mic-macros .mt-f{color:#dc2626}.mic-macros .mt-fib{color:#16a34a}
/* alpha.464 — painel dos 3 especialistas (consenso) */
.meal-panel{margin:2px 0 14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel-2);padding:14px 16px}
.meal-panel-title{font-size:13px;font-weight:900;color:var(--text);margin-bottom:10px}
.meal-panel-specs{display:grid;gap:8px;margin-bottom:10px}
@media(min-width:640px){.meal-panel-specs{grid-template-columns:repeat(3,1fr)}}
.meal-spec{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:10px 12px}
.meal-spec-h{font-size:12px;font-weight:900;color:var(--accent);margin-bottom:4px}
.meal-spec p{margin:0;font-size:12.5px;line-height:1.5;color:var(--text)}
.meal-consensus{border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:var(--r-sm);background:color-mix(in srgb,var(--accent) 8%,var(--panel));padding:11px 13px}
.meal-consensus strong{display:block;font-size:12.5px;font-weight:900;color:var(--accent);margin-bottom:4px}
.meal-consensus p{margin:0;font-size:13px;line-height:1.55;color:var(--text)}
.meal-result-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.meal-day-list{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.meal-day-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.meal-day-item .block{display:block}
@media(max-width:560px){.meal-item-row{grid-template-columns:1fr 60px 68px auto}.meal-goal-fields{grid-template-columns:1fr}}

/* alpha.344 — Bioanálise da refeição (estilo Zepp) */
.meal-bio{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.bio-top{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.bio-score{flex:0 0 auto;width:96px;height:96px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:4px solid var(--line);color:var(--muted)}
.bio-score svg{width:20px;height:20px}
.bio-score-num{font-size:26px;font-weight:950;line-height:1}
.bio-score-lbl{font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.bio-score--good{border-color:var(--green,#16a34a);color:var(--green,#16a34a)}
.bio-score--mid{border-color:#d99a00;color:#d99a00}
.bio-score--low{border-color:var(--red,#dc2626);color:var(--red,#dc2626)}
.bio-chips{display:flex;flex-wrap:wrap;gap:6px;flex:1;min-width:180px}
.bio-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;padding:5px 10px;border-radius:var(--r-pill);background:var(--panel-2);border:1px solid var(--line);color:var(--text)}
.bio-chip svg{flex:0 0 auto}
.bio-chip--win{background:color-mix(in srgb,var(--accent) 12%,var(--panel-2));border-color:color-mix(in srgb,var(--accent) 30%,var(--line))}
.bio-chip--warn{background:rgba(220,38,38,.1);border-color:rgba(220,38,38,.28);color:var(--red)}
.bio-win-msg{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);margin:10px 0 0;font-weight:600}
.bio-win-msg svg{flex:0 0 auto;opacity:.7}
.bio-macros{margin-top:12px}
.bio-macro-bar{display:flex;height:12px;border-radius:var(--r-pill);overflow:hidden;background:var(--panel-2);border:1px solid var(--line)}
.bio-macro-bar span{display:block;height:100%}
.bio-macro-bar .mb-p{background:#2563eb}.bio-macro-bar .mb-c{background:#d99a00}.bio-macro-bar .mb-f{background:#dc2626}.bio-macro-bar .mb-fib{background:#16a34a}
.bio-macro-legend{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.mb-leg{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:800}
.mb-leg::before{content:"";width:10px;height:10px;border-radius:3px;display:inline-block}
.mb-leg.mb-p::before{background:#2563eb}.mb-leg.mb-c::before{background:#d99a00}.mb-leg.mb-f::before{background:#dc2626}.mb-leg.mb-fib::before{background:#16a34a}
.mb-leg input{width:56px;min-height:32px;padding:4px 6px}
.meal-items-head{font-weight:850;font-size:13px;margin-bottom:6px}
.meal-day-main{display:flex;align-items:center;gap:10px}
.bio-score-mini{flex:0 0 auto;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:950;font-size:13px;border:2px solid var(--line);color:var(--muted)}

/* ───────────────────────────────────────────────────────────────────────────
   alpha.349 — Antes × Depois (slider de comparação) + análise corporal por IA
   ─────────────────────────────────────────────────────────────────────────── */
.body-compare-card{display:flex;flex-direction:column;gap:14px}
.bcc-head{display:flex;align-items:flex-start;gap:10px}
.bcc-head .bcc-icon{font-size:22px;flex:0 0 auto;width:40px;height:40px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;background:rgba(99,102,241,.12)}
.bcc-head strong{display:block;font-size:15px}
.bcc-head small{color:var(--muted);font-size:12px;line-height:1.35}
.bcc-mode{display:inline-flex;background:var(--line,#eef0f4);border-radius:var(--r-sm);padding:3px;gap:3px;align-self:flex-start}
.bcc-mode-btn{border:0;background:transparent;padding:7px 14px;border-radius:var(--r-xs);font-weight:800;font-size:13px;color:var(--muted);cursor:pointer}
.bcc-mode-btn.active{background:var(--panel,#fff);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.bcc-pickers{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bcc-pick{display:flex;flex-direction:column;gap:5px;font-weight:800;font-size:12px;color:var(--muted)}
.bcc-pick input[type=file]{font-weight:600;font-size:12px}
.bcc-empty{grid-column:1/-1;margin:0;color:var(--muted);font-size:12px;background:var(--line,#f4f5f8);padding:9px 11px;border-radius:var(--r-xs)}
/* slider before/after */
.ba-slider{position:relative;width:100%;aspect-ratio:3/4;max-height:62vh;border-radius:var(--r-sm);overflow:hidden;background:#0d0f14;user-select:none;touch-action:none}
.ba-slider .ba-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#9aa3b2;font-size:13px;text-align:center;padding:20px}
.ba-slider.ready .ba-empty{display:none}
.ba-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#0d0f14}
.ba-before{clip-path:inset(0 calc(100% - var(--ba-pos,50%)) 0 0)}
.ba-divider{position:absolute;top:0;bottom:0;left:50%;width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.25);display:none;pointer-events:none}
.ba-slider.ready .ba-divider{display:block}
.ba-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center}
.ba-handle::before{content:"\21FA\2009\21FB";font-size:13px;color:#222;font-weight:900;letter-spacing:-2px}
.ba-label{position:absolute;top:10px;font-size:11px;font-weight:900;letter-spacing:.5px;color:#fff;background:rgba(0,0,0,.5);padding:3px 8px;border-radius:var(--r-lg);display:none}
.ba-slider.ready .ba-label{display:block}
.ba-label-before{left:10px}.ba-label-after{right:10px}
.ba-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;display:none}
.ba-slider.ready .ba-range{display:block}
.ba-range::-webkit-slider-thumb{-webkit-appearance:none;width:44px;height:100%}
.ba-range::-moz-range-thumb{width:44px;height:100%;border:0;background:transparent}
.bcc-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bcc-status{font-size:13px;font-weight:700}
.bcc-privacy{margin:0;font-size:11px;color:var(--muted);line-height:1.4;background:var(--line,#f4f5f8);padding:9px 11px;border-radius:var(--r-xs)}
/* resultado da análise IA */
.bcc-result{display:flex;flex-direction:column;gap:12px}
.bca-top{display:flex;gap:14px;align-items:center}
.bca-score{position:relative;flex:0 0 auto;width:84px;height:84px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.bca-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.bca-ring-bg{fill:none;stroke:var(--line,#e8eaef);stroke-width:3}
.bca-ring-fg{fill:none;stroke:var(--accent,#6366f1);stroke-width:3;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--p,0));transition:stroke-dashoffset .6s ease}
.bca-score-num{font-size:24px;font-weight:950;line-height:1}
.bca-score small{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.bca-summary{flex:1}
.bca-summary strong{display:block;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px}
.bca-summary p{margin:0;font-size:14px;line-height:1.45}
.bca-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.bca-card{background:var(--panel,#fff);border:1px solid var(--line,#e8eaef);border-radius:var(--r-sm);padding:11px 12px}
.bca-card .bca-k{display:block;font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}
.bca-card b{display:block;font-size:15px;text-transform:capitalize;margin:2px 0 4px}
.bca-card p{margin:0;font-size:12.5px;color:var(--text);line-height:1.4}
.bca-regions strong,.bca-list strong{display:block;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px}
.bca-region-list{display:flex;flex-direction:column;gap:6px}
.bca-region{display:flex;gap:10px;align-items:baseline;padding:8px 11px;border-radius:var(--r-xs);border-left:3px solid var(--line);background:var(--line,#f4f5f8)}
.bca-region b{flex:0 0 34%;font-size:13px}
.bca-region span{font-size:12.5px;color:var(--text);line-height:1.35}
.bca-region.pos{border-left-color:#16a34a;background:rgba(22,163,74,.07)}
.bca-region.warn{border-left-color:#d99a00;background:rgba(217,154,0,.08)}
.bca-region.neu{border-left-color:#64748b}
.bca-list ul{margin:0;padding-left:18px}
.bca-list li{font-size:13px;line-height:1.5}
.bca-list.pos li::marker{color:#16a34a}
.bca-aviso{margin:0;font-size:11.5px;color:var(--muted);font-style:italic}
@media(max-width:560px){.bca-top{flex-direction:column;align-items:flex-start}.bcc-pickers{grid-template-columns:1fr}}

/* alpha.350 — card do Relatório de Acompanhamento (PDF) */
.body-report-card{display:flex;flex-direction:column;gap:12px}
.brc-head{display:flex;align-items:flex-start;gap:10px}
.brc-head .brc-icon{font-size:22px;flex:0 0 auto;width:40px;height:40px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;background:rgba(37,99,235,.12)}
.brc-head strong{display:block;font-size:15px}
.brc-head small{color:var(--muted);font-size:12px;line-height:1.35}
.brc-row{display:flex;flex-wrap:wrap;gap:10px}
.brc-field{display:flex;flex-direction:column;gap:5px;font-weight:800;font-size:12px;color:var(--muted);min-width:160px}
.brc-secs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.brc-secs label{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--text)}
.brc-secs label small{font-weight:500;color:var(--muted);font-size:11px}
.brc-secs input{width:16px;height:16px;accent-color:var(--accent,#2563eb)}
@media(max-width:560px){.brc-secs{grid-template-columns:1fr}}

/* ───────────────────────────────────────────────────────────────────────────
   alpha.351 — Sistema de ÍCONES/MEDALHAS (badges) + Conquistas (troféus)
   .zk-medal = medalhão circular reutilizável, com tier (bronze/prata/ouro/
   diamante/coroa) e estado .locked (cinza + cadeado).
   ─────────────────────────────────────────────────────────────────────────── */
.zk-medal{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;flex:0 0 auto;position:relative;box-shadow:0 3px 8px rgba(0,0,0,.18);border:2px solid rgba(255,255,255,.55)}
.zk-medal span{filter:drop-shadow(0 1px 1px rgba(0,0,0,.22))}
.zk-medal.t-bronze{background:linear-gradient(145deg,#dd9a63,#a8631f)}
.zk-medal.t-silver{background:linear-gradient(145deg,#eef2f6,#a7b2c0)}
.zk-medal.t-gold{background:linear-gradient(145deg,#ffd86f,#e0a313)}
.zk-medal.t-diamond{background:linear-gradient(145deg,#a3ebff,#36a7d8)}
.zk-medal.t-crown{background:linear-gradient(145deg,#c89bff,#7c3aed)}
.zk-medal.locked{background:linear-gradient(145deg,#e5e7eb,#cbd1d9);box-shadow:none;border-color:rgba(255,255,255,.4)}
.zk-medal.locked span{opacity:.4;filter:grayscale(1)}
.zk-medal.locked::after{content:"🔒";position:absolute;right:-4px;bottom:-4px;font-size:11px;background:#fff;border-radius:50%;width:19px;height:19px;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.28)}

.ach-wrap{display:flex;flex-direction:column;gap:14px}
.ach-hero{background:linear-gradient(120deg,#7c3aed 0%,#4f46e5 55%,#2563eb 100%);color:#fff;border:none;text-shadow:0 1px 2px rgba(0,0,0,.18)}
.ach-hero-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ach-hero-stat{display:flex;flex-direction:column;align-items:center;flex:1;min-width:68px}
.ach-hero-stat span{font-size:22px;font-weight:950;line-height:1.1}
.ach-hero-stat small{font-size:10.5px;color:#fff;opacity:.95;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-top:3px}
.ach-hero-stat span{color:#fff}
.ach-hero .ach-label{color:#fff}
.ach-hero .ach-level-bar{height:9px;border-radius:var(--r-2xs);background:rgba(255,255,255,.22);margin-top:14px;overflow:hidden}
.ach-hero .ach-level-fill{height:100%;border-radius:var(--r-2xs);background:#fff;transition:width .6s ease}
.ach-hero .ach-level-cap{font-size:12px;color:#fff;opacity:.95;margin-top:8px;text-align:center}
.ach-hero strong{font-weight:900}
.ach-h2{font-size:15px;font-weight:850;margin:0 0 4px}
.ach-sub{font-size:12.5px;color:var(--muted);margin:0 0 12px}
.ach-medals{display:flex;gap:12px;overflow-x:auto;padding:4px 2px 8px}
.ach-medal-item{display:flex;flex-direction:column;align-items:center;gap:5px;flex:0 0 auto}
.ach-medal-item small{font-size:11px;font-weight:800;color:var(--muted)}
.ach-medal-item .zk-medal{width:48px;height:48px;font-size:23px}
.ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(225px,1fr));gap:10px}
.ach-card{display:flex;gap:11px;align-items:center;padding:11px;border:1px solid var(--line,#e8eaef);border-radius:var(--r-sm);background:var(--panel,#fff)}
.ach-card.on{border-color:rgba(37,99,235,.35);background:linear-gradient(180deg,rgba(37,99,235,.12),transparent),var(--panel,#fff)}
.ach-card .zk-medal{width:44px;height:44px;font-size:21px}
.ach-cbody{min-width:0;flex:1}
.ach-cbody strong{display:block;font-size:13px;line-height:1.2}
.ach-cbody small{display:block;font-size:11px;color:var(--muted);line-height:1.3;margin:2px 0 0}
.ach-done{display:inline-block;font-size:11px;font-weight:800;color:#16a34a;margin-top:5px}
.ach-locktag{display:inline-block;font-size:11px;color:var(--muted);margin-top:5px}
.ach-prog{display:flex;align-items:center;gap:7px;margin-top:7px}
.ach-prog-bar{flex:1;height:7px;border-radius:var(--r-2xs);background:var(--line,#e8eaef);overflow:hidden}
.ach-prog-bar i{display:block;height:100%;border-radius:var(--r-2xs);background:var(--accent,#2563eb)}
.ach-prog span{font-size:10.5px;font-weight:800;color:var(--muted);white-space:nowrap}
.ach-cta{text-align:center;padding:32px 20px}
.ach-cta-icon{font-size:42px}
.ach-cta h2{margin:10px 0 6px;font-size:18px}
.ach-cta p{color:var(--muted);font-size:13px;max-width:430px;margin:0 auto 14px}
.ach-toast{position:fixed;right:16px;z-index:9999;display:flex;align-items:center;gap:11px;background:var(--panel,#fff);border:1px solid var(--line,#e8eaef);border-left:4px solid var(--accent,#2563eb);border-radius:var(--r-sm);padding:11px 15px;box-shadow:0 12px 32px rgba(0,0,0,.2);transform:translateX(135%);transition:transform .42s cubic-bezier(.2,.9,.3,1.15);max-width:300px}
.ach-toast.show{transform:translateX(0)}
.ach-toast-ic{font-size:26px}
.ach-toast strong{display:block;font-size:13px}
.ach-toast small{display:block;font-size:12px;color:var(--muted)}
@media(max-width:560px){.ach-grid{grid-template-columns:1fr}.ach-hero-stat span{font-size:19px}}

/* alpha.352 — card "Dica do Dia" (orientações), colorido por importância/categoria */
.dtip{--c:#2563eb;--bg1:rgba(37,99,235,.12);position:relative;overflow:hidden;border-left:4px solid var(--c)}
.dtip.tone-blue{--c:#2563eb;--bg1:rgba(37,99,235,.12);--bg2:rgba(37,99,235,.02)}
.dtip.tone-red{--c:#dc2626;--bg1:rgba(220,38,38,.12);--bg2:rgba(220,38,38,.02)}
.dtip.tone-purple{--c:#7c3aed;--bg1:rgba(124,58,237,.12);--bg2:rgba(124,58,237,.02)}
.dtip.tone-cyan{--c:#0891b2;--bg1:rgba(8,145,178,.12);--bg2:rgba(8,145,178,.02)}
.dtip.tone-amber{--c:#d97706;--bg1:rgba(217,119,6,.14);--bg2:rgba(217,119,6,.02)}
.dtip.tone-green{--c:#16a34a;--bg1:rgba(22,163,74,.12);--bg2:rgba(22,163,74,.02)}
.dtip-top{display:flex;align-items:center;gap:8px;margin-bottom:11px}
.dtip-kicker{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:900;letter-spacing:.6px;color:var(--c);text-transform:uppercase}
.dtip-kicker svg{width:15px;height:15px}
.dtip-chip{font-size:11px;font-weight:800;color:var(--c);background:var(--bg1);padding:3px 10px;border-radius:var(--r-lg)}
.dtip-refresh{margin-left:auto;border:none;background:transparent;color:var(--c);cursor:pointer;width:30px;height:30px;border-radius:var(--r-xs);display:flex;align-items:center;justify-content:center;transition:background .15s,transform .3s}
.dtip-refresh:hover{background:var(--bg1)}
.dtip-refresh:active{transform:rotate(180deg)}
.dtip-refresh svg{width:18px;height:18px}
.dtip-body{display:flex;gap:13px;align-items:flex-start}
.dtip-icon{flex:0 0 auto;width:44px;height:44px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;background:var(--c);color:#fff;box-shadow:0 4px 10px rgba(0,0,0,.14)}
.dtip-icon svg{width:24px;height:24px}
.dtip-txt{min-width:0}
.dtip-txt strong{display:block;font-size:15px;color:var(--text);margin-bottom:3px}
.dtip-txt p{margin:0;font-size:13px;line-height:1.45;color:var(--text);opacity:.82}
.dtip-foot{display:flex;gap:6px;align-items:flex-start;margin-top:13px;padding-top:10px;border-top:1px solid var(--line);font-size:10.5px;color:var(--muted);line-height:1.35}
.dtip-foot svg{width:13px;height:13px;flex:0 0 auto;margin-top:1px;opacity:.7}
.dtip-anim{animation:dtipIn .35s ease}
@keyframes dtipIn{from{opacity:.25;transform:translateY(5px)}to{opacity:1;transform:none}}

/* alpha.353 — Dashboard do Corpo: Resumo Semanal + Resposta por marca */
.body-dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
@media(max-width:820px){.body-dash-grid{grid-template-columns:1fr}}
.bwk-card{--wk:var(--accent)} /* D3 (auditoria) — neutro segue o tema; low/mid/good continuam semânticos */
.bwk-card.bwk-low{--wk:#dc2626}
.bwk-card.bwk-mid{--wk:#d97706}
.bwk-card.bwk-good{--wk:#16a34a}
.bwk-head,.brand-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.bwk-head h3,.brand-head h3{margin:0;font-size:15px;font-weight:850}
.bwk-range{font-size:12px;color:var(--muted);font-weight:700}
.bwk-score{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.bwk-ring{flex:0 0 auto;width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--wk);box-shadow:0 4px 10px rgba(0,0,0,.14)}
.bwk-score-num{font-size:24px;font-weight:950;color:#fff;line-height:1}
.bwk-ring small{color:#fff;font-size:11px;font-weight:800;margin:6px 0 0 1px}
.bwk-score-meta{flex:1;min-width:0}
.bwk-label{font-weight:850;font-size:14px;color:var(--wk)}
.bwk-bar{height:8px;border-radius:var(--r-2xs);background:var(--line,#e8eaef);overflow:hidden;margin:5px 0}
.bwk-bar i{display:block;height:100%;border-radius:var(--r-2xs);background:var(--wk);transition:width .6s ease}
.bwk-score-meta small{font-size:11px;color:var(--muted)}
.bwk-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.bwk-stats>div{display:flex;flex-direction:column;align-items:center;gap:1px;background:var(--line,#f4f5f8);border-radius:var(--r-sm);padding:8px 4px}
.bwk-stats>div span{font-size:15px;color:var(--accent)} /* alpha.651 — ícone de atividade colorido (tema) */
.bwk-stats>div strong{font-size:16px;font-weight:900}
.bwk-stats>div small{font-size:10px;color:var(--muted)}
@media(max-width:560px){.bwk-stats{grid-template-columns:repeat(3,1fr)}}
.brand-head{flex-direction:column;align-items:flex-start;gap:2px}
.brand-head small{color:var(--muted);font-size:12px;font-weight:500}
.brand-periods{display:inline-flex;background:var(--line,#eef0f4);border-radius:var(--r-xs);padding:3px;gap:3px;margin-bottom:12px}
.brand-per{border:0;background:transparent;padding:6px 12px;border-radius:var(--r-2xs);font-weight:800;font-size:12px;color:var(--muted);cursor:pointer}
.brand-per.active{background:var(--panel,#fff);color:var(--accent,#2563eb);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.brand-list{display:flex;flex-direction:column;gap:8px}
.brand-best{font-size:12px;color:var(--muted);margin-bottom:2px}
.brand-row{border:1px solid var(--line,#e8eaef);border-radius:var(--r-sm);padding:10px 12px}
.brand-name{font-weight:850;font-size:14px;margin-bottom:6px}
.brand-kpis{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);align-items:baseline}
.brand-kpis strong{color:var(--text);font-size:14px}
.brand-loss strong{color:var(--muted)}
.brand-loss.pos strong{color:#16a34a}
.brand-empty{font-size:12.5px;color:var(--muted);background:var(--line,#f4f5f8);padding:11px;border-radius:var(--r-sm);margin:0}

/* alpha.354 — doses registradas localmente (visitante sem login) */
.local-dose-block{background:var(--panel,#fff);border:1px solid var(--line,#e8eaef);border-radius:var(--r-sm);padding:14px;margin-bottom:12px}
.ldb-head{font-weight:850;font-size:14px;margin-bottom:8px}
.ldb-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line,#eef0f4);font-size:13px}
.ldb-row:first-of-type{border-top:0}
.ldb-when{flex:0 0 auto;color:var(--muted);font-weight:700;font-size:12px;min-width:40px}
.ldb-main{flex:1;min-width:0}
.ldb-site{flex:0 0 auto;color:var(--muted);font-size:12px}
.ldb-del{flex:0 0 auto;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:18px;line-height:1;width:24px;height:24px;border-radius:var(--r-2xs)}
.ldb-del:hover{background:var(--line,#f4f5f8);color:#dc2626}
.ldb-note{display:block;margin-top:8px;font-size:11px;color:var(--muted);line-height:1.4}

/* ════════════════════════════════════════════════════════════════════════
   alpha.356 — Linguagem visual UNIFICADA de gráficos ("vector flow").
   Um degradê vibrante (violeta → índigo → ciano) aplicado às barras de dados,
   ao anel de pontuação e à linha de Relatórios (com glow + área preenchida).
   → Para retematizar TODOS os gráficos, mude só as 3 cores abaixo.
   → Cores SEMÂNTICAS preservadas de propósito: macros (proteína/carbo/gordura)
     e o medidor de hidratação (azul = água).
   ════════════════════════════════════════════════════════════════════════ */
:root{
  --zk-c1:#7c3aed; --zk-c2:#4f46e5; --zk-c3:#06b6d4;
  --zk-flow:linear-gradient(90deg,var(--zk-c1),var(--zk-c2) 55%,var(--zk-c3));
  --zk-flow-v:linear-gradient(180deg,var(--zk-c3),var(--zk-c1));
}
/* stops dos degradês SVG (gráfico de linha de Relatórios) — herdam os tokens */
.zkfs1{stop-color:var(--zk-c1)} .zkfs2{stop-color:var(--zk-c2)} .zkfs3{stop-color:var(--zk-c3)}
.zkfa1{stop-color:var(--zk-c2);stop-opacity:.34} .zkfa2{stop-color:var(--zk-c3);stop-opacity:0}
/* barras de dados (valor único) → degradê flow */
.report-bar-track i,
.track-score-bar>span,
#weekBar,
.ach-prog-bar i,
.bwk-bar i{ background:var(--zk-flow)!important; }
/* anel de pontuação (dashboard) → degradê */
.bwk-ring{ background:linear-gradient(135deg,var(--zk-c1),var(--zk-c3))!important; }
/* gráfico de linha (Relatórios): linha com degradê + glow + área sob a curva */
.report-line-shell polyline{ stroke:url(#zkRepLine)!important; filter:url(#zkRepGlow); }
.report-line-shell .report-area{ fill:url(#zkRepArea); stroke:none; }
/* alpha.935 — MESMA linguagem de entrada do gráfico de doses nos relatórios: a linha do
   "Desempenho diário" desenha (pathLength="1" no <polyline>); as barras de "Status" e "Itens
   em alta" crescem revelando da esquerda. Reusa os keyframes ztDraw/ztArea (gráfico de doses). */
@keyframes ztBarGrow{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
/* alpha.936 — idem trend: anima quando entra na viewport (.zt-go via zkScanCharts) */
.report-line-shell polyline{stroke-dasharray:1;stroke-dashoffset:1}
.report-line-shell .report-area{opacity:0}
.report-line-shell.zt-go polyline{animation:ztDraw 1.15s cubic-bezier(.45,0,.2,1) forwards}
.report-line-shell.zt-go .report-area{animation:ztArea .9s ease .4s forwards}
.report-bar-list .report-bar-track i{clip-path:inset(0 100% 0 0)}
.report-bar-list.zt-go .report-bar-track i{animation:ztBarGrow .85s cubic-bezier(.45,0,.2,1) forwards}
@media(prefers-reduced-motion:reduce){.report-line-shell polyline{stroke-dashoffset:0}.report-line-shell .report-area{opacity:1}.report-bar-list .report-bar-track i{clip-path:none}.report-line-shell.zt-go polyline,.report-line-shell.zt-go .report-area,.report-bar-list.zt-go .report-bar-track i{animation:none}}

/* ════════════════════════════════════════════════════════════════
   alpha.366 — MÓDULO DE MEDIDAS: hero da última medição, deltas ao
   vivo no formulário (hero da cintura) e gráfico multi-linha.
   Tudo dark-safe (usa --panel/--panel-2/--line/--accent/--text).
   ════════════════════════════════════════════════════════════════ */

/* (1) Hero da última medição — resumo com tendência + total + chips */
/* D2 (auditoria) — hero das Medidas seguia o tema via accent (era teal hardcoded) */
.bm-hero{position:relative;overflow:hidden;border-radius:var(--r-md);padding:18px 20px;margin:0 0 16px;
  background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 40%,#0f172a) 0%,color-mix(in srgb,var(--accent) 58%,#0f172a) 46%,color-mix(in srgb,var(--accent) 70%,#0f172a) 100%);color:#fff;border:none;
  box-shadow:0 10px 30px color-mix(in srgb,var(--accent) 26%,transparent)}
.bm-hero::after{content:"";position:absolute;right:-44px;top:-44px;width:190px;height:190px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.16),transparent 70%);pointer-events:none}
.bm-hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;position:relative}
.bm-hero-h{font-size:12.5px;font-weight:850;color:#fff;opacity:.95;text-transform:uppercase;letter-spacing:.6px;display:flex;align-items:center;gap:7px}
.bm-hero-date{font-size:11.5px;color:#fff;opacity:.9;font-weight:750;white-space:nowrap}
.bm-hero-main{display:flex;align-items:center;gap:13px;flex-wrap:wrap;margin-top:9px;position:relative}
.bm-hero-val{font-size:33px;font-weight:950;line-height:1;color:#fff;letter-spacing:-.5px}
.bm-hero-val small{font-size:15px;font-weight:800;opacity:.9;margin-left:3px}
.bm-hero-trend{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:850;
  padding:5px 12px;border-radius:var(--r-lg);background:rgba(255,255,255,.20);color:#fff}
.bm-hero-sub{font-size:12.5px;color:#fff;opacity:.95;font-weight:750;margin-top:7px;position:relative}
.bm-hero-sub b{font-weight:900}
.bm-hero-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px;position:relative}
.bm-hero-chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:750;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.20);color:#fff;border-radius:var(--r-sm);padding:5px 10px}
.bm-hero-chip b{font-weight:900}
.bm-hero-chip .bmhc-d{font-weight:850}
.bm-hero-chip .bmhc-d.down{color:#bbf7d0}
.bm-hero-chip .bmhc-d.up{color:#fecaca}

/* (2) Hero da cintura AO VIVO + deltas inline no formulário */
.blh{display:none;align-items:center;gap:13px;border-radius:var(--r-sm);padding:12px 15px;margin:0 0 14px;
  background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 13%,var(--panel)),var(--panel));
  border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line))}
.blh.on{display:flex}
.blh-ic{width:42px;height:42px;flex:0 0 42px;border-radius:var(--r-sm);display:grid;place-items:center;font-size:21px;
  background:color-mix(in srgb,var(--accent) 18%,var(--panel-2));color:var(--accent)}
.blh-body{min-width:0;flex:1}
.blh-title{font-size:10.5px;font-weight:850;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
.blh-main{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-top:1px}
.blh-val{font-size:21px;font-weight:950;color:var(--text);line-height:1.1}
.blh-val small{font-size:12px;font-weight:800;color:var(--muted)}
.blh-delta{font-size:12.5px;font-weight:850;padding:2px 9px;border-radius:var(--r-lg)}
.blh-delta.down{color:#16a34a;background:rgba(22,163,74,.15)}
.blh-delta.up{color:#dc2626;background:rgba(220,38,38,.15)}
.blh-delta.flat{color:var(--muted);background:var(--panel-2)}
.blh-msg{font-size:11.5px;color:var(--muted);margin-top:3px}
/* delta inline ao lado de cada input do form */
.bmd-delta{display:none;margin-top:4px;font-size:10.5px;font-weight:800;padding:1px 7px;border-radius:var(--r-sm);width:fit-content}
.bmd-delta.show{display:inline-block}
.bmd-delta.down{color:#16a34a;background:rgba(22,163,74,.14)}
.bmd-delta.up{color:#dc2626;background:rgba(220,38,38,.14)}
.bmd-delta.flat{color:var(--muted);background:var(--panel-2)}

/* (3) Gráfico de evolução MULTI-LINHA + legenda colorida */
.bmc{margin-top:2px}
.bmc-legend{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:11px}
.bmc-leg{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;cursor:pointer;
  padding:4px 10px;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--panel-2);color:var(--text);
  transition:.13s ease;user-select:none}
.bmc-leg .bmc-dot{width:10px;height:10px;border-radius:50%;flex:0 0 10px;transition:.13s ease}
.bmc-leg.off{opacity:.45;color:var(--muted)}
.bmc-leg.off .bmc-dot{background:var(--muted)!important}
.bmc-svg{width:100%;height:auto;display:block;background:var(--panel-2);border-radius:var(--r-sm);border:1px solid var(--line)}
.bmc-svg .bmc-grid{stroke:color-mix(in srgb,var(--line) 70%,transparent);stroke-width:1}
.bmc-svg .bmc-axis{fill:var(--muted);font-size:11px;font-weight:700}
.bmc-svg polyline{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.bmc-svg circle{stroke:var(--panel-2);stroke-width:1.5}
.bmc-empty{color:var(--muted);font-size:12.5px;padding:20px;text-align:center}

/* ════════════════════════════════════════════════════════════════
   alpha.367 — ABA ATIVIDADES (GPS, sequência, conquistas, análise IA).
   Dark-safe: usa --panel/--panel-2/--line/--accent/--text/--muted.
   ════════════════════════════════════════════════════════════════ */
#tabActivity{max-width:1280px;margin:0 auto} /* alpha.439 — alinhado aos demais painéis (era 760px → ficava estreito/deslocado) */
.actgps-keepopen{margin:2px 0 10px;font-size:11.5px;line-height:1.45;color:var(--muted);background:color-mix(in srgb,var(--accent) 8%,transparent);border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 11px;text-align:left} /* alpha.440 */
.act-login-cta{text-align:center;padding:34px 22px}
.act-login-cta .act-cta-ic{font-size:42px;display:block;margin-bottom:8px}
.act-login-cta h3{margin:0 0 8px;font-size:20px;font-weight:950}
.act-login-cta p{color:var(--muted);font-size:13.5px;max-width:440px;margin:0 auto 16px}
.act-head{margin:2px 0 14px}
.act-title{margin:0;font-size:22px;font-weight:950}
.act-sub{margin:2px 0 0;color:var(--muted);font-size:13px}
/* alpha.728 — Aba Exercícios: grid responsivo (padrão .meal-wrap) + headers compactos + folga do dock.
   Antes: cards empilhados full-width (desktop desorganizado; headers grandes demais).
   Agora: grade auto-fit; cards largos (GPS, Metas, Sequência, Tendência, Totais, Conquistas,
   Histórico) ocupam a linha toda; registro (Musculação|Planos) e IA|Dica pareiam em colunas. */
.calc-tab-panel#tabActivity.active{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));
  gap:14px;align-items:start;padding-bottom:96px;
}
#tabActivity.active > .act-head,
#tabActivity.active > #actGpsCard,
#tabActivity.active > #actGoalsCard,
#tabActivity.active > #actTrendCard,
#tabActivity.active > #actStreakCard,
#tabActivity.active > .act-totals,
#tabActivity.active > .act-ach-card,
#tabActivity.active > .act-hist-card{grid-column:1 / -1}
#tabActivity.active > .calc-panel{margin-bottom:0}
/* headers eram grandes demais — compacta GPS/Musculação/Planos (Planos reusa .str-head) */
.act-gps-card .act-gps-head,.str-card .str-head,.wp-card .str-head{padding:11px 15px;gap:10px}
.act-gps-card .act-gps-head .act-gps-ic,.str-card .str-head .str-ic,.wp-card .str-head .str-ic{width:40px;height:40px;flex:0 0 40px;font-size:22px}
.act-gps-card .act-gps-head strong,.str-card .str-head strong,.wp-card .str-head strong{font-size:14px}
.act-gps-card .act-gps-head small,.str-card .str-head small,.wp-card .str-head small{font-size:11px}

/* GPS card */
.act-gps-card{padding:0;overflow:hidden}
.act-gps-head{display:flex;align-items:center;gap:12px;padding:15px 17px;
  background:linear-gradient(120deg, color-mix(in srgb,var(--accent) 38%,#0f172a) 0%, color-mix(in srgb,var(--accent) 60%,#0f172a) 100%);color:#fff}
.act-gps-head .act-gps-ic{font-size:26px;width:46px;height:46px;flex:0 0 46px;border-radius:var(--r-sm);display:grid;place-items:center;background:rgba(255,255,255,.22)}
.act-gps-head strong{display:block;font-size:15.5px;font-weight:900;color:#fff}
.act-gps-head small{display:block;font-size:11.5px;color:#fff;opacity:.9;margin-top:1px}
.act-gps-idle,.act-gps-live,.act-gps-save{padding:15px 17px}
.act-type-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:13px}
.act-type-opt{position:relative;cursor:pointer}
.act-type-opt input{position:absolute;opacity:0;inset:0;cursor:pointer}
.act-type-opt span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;padding:8px 13px;border-radius:var(--r-sm);border:1.5px solid var(--line);background:var(--panel-2);color:var(--text);transition:.13s ease}
.act-type-opt input:checked + span{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--panel));color:var(--accent)}
.act-gps-start{width:100%;font-size:15px;padding:12px}
.act-gps-note{display:block;margin-top:9px;color:var(--muted);font-size:11px;line-height:1.4}
.act-gps-map{position:relative;width:100%;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);
  background:var(--panel-2);
  background-image:linear-gradient(color-mix(in srgb,var(--line) 60%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--line) 60%,transparent) 1px,transparent 1px);
  background-size:26px 26px;margin-bottom:13px}
.act-route-svg{display:block;width:100%;height:auto}
.act-route-line{fill:none;stroke:var(--accent);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px color-mix(in srgb,var(--accent) 45%,transparent))}
.act-gps-acc{position:absolute;top:7px;right:9px;font-size:10.5px;font-weight:800;color:var(--muted);background:color-mix(in srgb,var(--panel) 80%,transparent);padding:2px 7px;border-radius:var(--r-lg);border:1px solid var(--line)}
.act-gps-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;margin-bottom:13px}/* alpha.1010 — auto-fit: reflui c/ a largura do modal (440px), sem @media */
.act-gps-stats .act-stat{text-align:center;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 4px}
.act-gps-stats .act-stat strong{display:block;font-size:19px;font-weight:950;color:var(--text);line-height:1}
.act-gps-stats .act-stat em{font-style:normal;font-size:10.5px;color:var(--muted);font-weight:700}
.act-gps-actions{display:flex;gap:9px}
.act-gps-actions .btn{flex:1}
.act-save-summary{margin-bottom:13px}
.act-save-line{font-weight:900;font-size:15px;margin-bottom:8px}
.act-save-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.act-save-grid>div{text-align:center;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 4px}
.act-save-grid strong{display:block;font-size:18px;font-weight:950}
.act-save-grid em{font-style:normal;font-size:10.5px;color:var(--muted);font-weight:700}
/* alpha.374 — métricas extras (sensores) + mapa real da rota */
.act-gps-extra{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;margin:0 0 13px;font-size:12px;color:var(--muted)}
.act-gps-extra strong{color:var(--text);font-weight:850}
.act-route-map{height:230px;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);margin-bottom:13px;background:var(--panel-2);position:relative;z-index:0}
.act-route-map .leaflet-container{height:100%;width:100%;font:inherit;background:var(--panel-2)}
.act-map-empty{height:100%;display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;color:var(--muted);font-size:12.5px}

/* alpha.375 — modo Foto/Câmera nos exames + render da análise detalhada */
.exam-mode-tabs{flex-wrap:wrap}
.exam-photo-thumbs{display:flex;flex-wrap:wrap;gap:9px;margin-top:11px}
.exam-photo-thumb{position:relative;width:84px;height:84px;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);background:var(--panel-2)}
.exam-photo-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.exam-photo-del{position:absolute;top:3px;right:3px;width:22px;height:22px;border-radius:50%;border:none;cursor:pointer;background:rgba(var(--shadow-rgb),.72);color:#fff;font-size:12px;line-height:1;display:grid;place-items:center}
.exam-photo-del:hover{background:#dc2626}
.exam-ai-box{white-space:normal}
.exam-ai-box h5{margin:13px 0 5px;font-size:13.5px;font-weight:900;color:var(--text)}
.exam-ai-box h5:first-child{margin-top:0}
.exam-ai-box p{margin:0 0 8px;font-size:13px;line-height:1.55;color:var(--text)}
.exam-ai-box ul{margin:0 0 10px;padding-left:20px}
.exam-ai-box li{font-size:13px;line-height:1.5;margin-bottom:3px;color:var(--text)}
.exam-ai-box strong{font-weight:800}

/* alpha.461 — análise do protocolo: barra de rolagem SEMPRE visível (o overlay
   do SO costuma esconder a barra → o texto parecia "cortado"). */
#pwAiResult{
  max-height:min(62vh,480px);
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-gutter:stable;
  scrollbar-color:var(--accent) color-mix(in srgb,var(--accent) 12%,transparent);
}
#pwAiResult::-webkit-scrollbar{width:11px}
#pwAiResult::-webkit-scrollbar-track{background:color-mix(in srgb,var(--accent) 9%,transparent);border-radius:var(--r-xs)}
#pwAiResult::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 60%,var(--line));border-radius:var(--r-xs);border:2px solid var(--panel-2)}
#pwAiResult::-webkit-scrollbar-thumb:hover{background:var(--accent)}

/* alpha.461 — popup vermelho do aviso obrigatório (OK revela a análise) */
.proto-aviso-overlay{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(var(--shadow-rgb),.55);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.proto-aviso-overlay[hidden]{display:none}
.proto-aviso-box{background:var(--panel);border:2px solid #dc2626;border-radius:var(--r-md);max-width:460px;width:100%;padding:24px;text-align:center;box-shadow:0 24px 60px rgba(220,38,38,.28);animation:protoAvisoIn .18s ease}
@keyframes protoAvisoIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.proto-aviso-icon{font-size:34px;line-height:1;margin-bottom:8px}
.proto-aviso-box h3{margin:0 0 10px;color:#dc2626;font-size:17px;font-weight:950;text-transform:uppercase;letter-spacing:.02em}
.proto-aviso-box p{margin:0 0 18px;font-size:13.5px;line-height:1.6;color:var(--text);text-align:left}
.proto-aviso-box .btn{background:#dc2626;color:#fff;border-color:#dc2626;font-weight:900;width:100%;justify-content:center}
.proto-aviso-box .btn:hover{background:#b91c1c;border-color:#b91c1c;transform:none}

/* alpha.463 — card de custo do tratamento no gerador de protocolos */
.pw-cost-card{margin-top:14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel-2);padding:16px 18px}
.pw-cost-head{font-size:14px;font-weight:900;color:var(--text);margin-bottom:12px}
.pw-cost-grid{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end}
.pw-cost-field{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:800;color:var(--muted)}
.pw-cost-price{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:0 12px;min-height:42px}
.pw-cost-price span{color:var(--muted);font-weight:850;font-size:14px}
.pw-cost-price input{border:none;background:transparent;font-size:16px;font-weight:850;color:var(--text);width:120px;padding:8px 0;outline:none}
#pwCostPerBox{min-height:42px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:8px 12px;font-size:15px;font-weight:800;color:var(--text);width:120px}
.pw-cost-seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:var(--panel)}
.pw-cost-seg label{position:relative;cursor:pointer}
.pw-cost-seg label input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.pw-cost-seg label span{display:block;padding:10px 18px;font-size:13px;font-weight:850;color:var(--muted);transition:.12s ease}
.pw-cost-seg label input:checked+span{background:var(--accent);color:#fff}
.pw-cost-seg label input:focus-visible+span{outline:2px solid var(--accent);outline-offset:-2px}
.pw-cost-result{margin-top:14px;min-height:22px}
.pw-cost-total{font-size:30px;font-weight:950;color:var(--accent);letter-spacing:-.03em;line-height:1}
.pw-cost-sub{font-size:12.5px;font-weight:700;color:var(--muted);margin-top:5px}
/* 0.2.0-alpha.14 — custo por dose de cada medicamento no bloco de total */
.pw-cost-permed{display:flex;flex-direction:column;gap:3px;margin-top:8px}
.pw-cost-permed-i{font-size:12.5px;font-weight:700;color:var(--text)}
.pw-cost-permed-i b{color:var(--accent);font-weight:900}
.pw-cost-hint{font-size:12.5px;color:var(--muted)}
@media(max-width:560px){
  .pw-cost-grid{flex-direction:column;align-items:stretch}
  .pw-cost-price input,#pwCostPerBox{width:100%}
  .pw-cost-seg{width:100%}
  .pw-cost-seg label{flex:1}
  .pw-cost-seg label span{text-align:center}
}

/* alpha.378 — Análise Inteligente das medidas */
.bma-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:13px}
.bma-title{display:flex;align-items:center;gap:10px}
.bma-ic{font-size:19px;width:38px;height:38px;flex:0 0 38px;border-radius:var(--r-sm);display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 16%,var(--panel-2));color:var(--accent)}
.bma-title strong{display:block;font-size:16px;font-weight:900;color:var(--text)}
.bma-title small{display:block;font-size:11.5px;color:var(--muted)}
.bma-refresh{flex:0 0 auto;width:34px;height:34px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel-2);color:var(--muted);cursor:pointer;font-size:15px}
.bma-refresh:hover{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.bma-empty{text-align:center;padding:16px 10px;color:var(--muted)}
.bma-empty p{margin:0 0 12px;font-size:13px;line-height:1.5}
.bma-loading{padding:22px;text-align:center;color:var(--muted);font-size:13px}
.bma-intro{background:color-mix(in srgb,var(--accent) 8%,var(--panel-2));border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));border-radius:var(--r-sm);padding:12px 14px;font-size:13px;line-height:1.55;color:var(--text);margin-bottom:6px}
.bma-sec-h{font-size:13px;font-weight:850;color:var(--text);margin:15px 0 9px}
.bma-regions{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:9px}
.bma-region{border:1px solid var(--line);border-radius:var(--r-sm);padding:11px 12px;background:var(--panel-2)}
.bma-rg-name{display:block;font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.bma-rg-delta{display:block;font-size:19px;font-weight:950;line-height:1.1;margin:2px 0 3px;color:var(--text)}
.bma-region small{font-size:11px;color:var(--muted);line-height:1.4;display:block}
.bma-region.pos{border-color:color-mix(in srgb,#16a34a 35%,var(--line));background:color-mix(in srgb,#16a34a 7%,var(--panel-2))}
.bma-region.pos .bma-rg-delta{color:#16a34a}
.bma-region.warn{border-color:color-mix(in srgb,#dc2626 35%,var(--line));background:color-mix(in srgb,#dc2626 7%,var(--panel-2))}
.bma-region.warn .bma-rg-delta{color:#dc2626}
.bma-cards2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}
.bma-best,.bma-warn{border-radius:var(--r-sm);padding:12px 13px;font-size:12.5px}
.bma-best{background:color-mix(in srgb,#16a34a 9%,var(--panel-2));border:1px solid color-mix(in srgb,#16a34a 25%,var(--line))}
.bma-warn{background:color-mix(in srgb,#d97706 10%,var(--panel-2));border:1px solid color-mix(in srgb,#d97706 26%,var(--line))}
.bma-best strong{display:block;font-size:12.5px;margin-bottom:4px;color:#16a34a}
.bma-warn strong{display:block;font-size:12.5px;margin-bottom:4px;color:#d97706}
.bma-best p,.bma-warn p{margin:0;color:var(--text);line-height:1.45}
.bma-recs{margin:0;padding-left:20px}
.bma-recs li{font-size:12.5px;line-height:1.5;color:var(--text);margin-bottom:6px}
.bma-pred{margin-top:15px;background:color-mix(in srgb,#7c3aed 8%,var(--panel-2));border:1px solid color-mix(in srgb,#7c3aed 22%,var(--line));border-radius:var(--r-sm);padding:12px 14px}
.bma-pred strong{display:block;font-size:12.5px;color:color-mix(in srgb,#7c3aed 78%,var(--text));margin-bottom:4px}
.bma-pred p{margin:0;font-size:12.5px;line-height:1.5;color:var(--text)}
.bma-quote{margin-top:15px;text-align:center;font-style:italic;font-size:13px;line-height:1.55;color:var(--text);background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 9%,var(--panel-2)),var(--panel-2));border:1px solid var(--line);border-radius:var(--r-sm);padding:14px 16px}
.bma-disclaimer{margin-top:12px;font-size:10.5px;color:var(--muted);text-align:center;line-height:1.4}
@media(max-width:560px){.bma-cards2{grid-template-columns:1fr}}

/* alpha.379 — Protocolo no padrão do site: cada etapa vira um card .calc-panel
   (antes o .proto-wizard/.pw-step era transparente, "solto" na página). */
.proto-wizard{padding:0}
.pw-step{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);margin-bottom:16px}
.pw-step:last-child{margin-bottom:0}
.pw-step-head{margin-bottom:16px}

/* alpha.381 — Refeições: pick-zone (câmera/galeria) + preview + auto-análise */
.meal-pick{position:relative;border:1.5px dashed var(--line);border-radius:var(--r-sm);background:var(--panel-2);min-height:124px;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;transition:border-color .15s ease,background .15s ease}
.meal-pick:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:color-mix(in srgb,var(--accent) 5%,var(--panel-2))}
.meal-pick-input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.meal-pick-inner{text-align:center;padding:20px 16px;color:var(--muted);pointer-events:none}
.meal-pick-ic{width:34px;height:34px;color:var(--muted);margin-bottom:6px}
.meal-pick-inner strong{display:block;font-size:13.5px;color:var(--text);font-weight:800}
.meal-pick-inner small{display:block;font-size:11px;margin-top:2px;line-height:1.4}
.meal-preview{max-width:100%;max-height:240px;border-radius:var(--r-sm);display:block}
/* alpha.404 — respeita o atributo hidden (o display:block acima sobrescrevia o [hidden],
   deixando a img de preview VAZIA visível como "imagem quebrada" + texto alt). */
.meal-preview[hidden],.bphoto-prev[hidden]{display:none !important}
.meal-reanalyze{margin-top:10px}
/* alpha.441 — botão (LABEL) de câmera nativa PADRONIZADO em TODOS os campos:
   full-width, mesma proporção do seletor de galeria/arquivo, simétrico e claro (📷 Câmera ↔ 🖼️ Galeria). */
.photo-cam-btn{margin-top:9px;display:flex;width:100%;align-items:center;justify-content:center;gap:8px;padding:12px 16px;font-size:14.5px;font-weight:800;cursor:pointer;border:1.5px solid var(--accent);border-radius:var(--r-sm);background:color-mix(in srgb,var(--accent) 10%,var(--panel));color:var(--accent);transition:.13s ease;-webkit-tap-highlight-color:transparent}
.photo-cam-btn span[aria-hidden]{font-size:18px;line-height:1}
.photo-cam-btn:hover,.photo-cam-btn:focus-within{background:var(--accent);color:#fff}
.exam-drop-zone + .photo-cam-btn,.meal-pick + .photo-cam-btn{margin-top:10px}
/* alpha.442 — blocos de "Agenda do celular" (lembretes .ics de medicamento/água) */
.cal-rem-block{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.cal-rem-block:first-of-type{margin-top:6px;padding-top:0;border-top:0}
.cal-rem-block>strong{display:block;margin-bottom:9px;font-size:14px}
.cal-rem-block input[type=text]{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:14px;margin-bottom:9px}
.cal-rem-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:11px;font-size:13px;color:var(--muted)}
.cal-rem-row label{display:inline-flex;align-items:center;gap:6px}
.cal-rem-row select,.cal-rem-row input[type=time]{padding:7px 9px;border:1px solid var(--line);border-radius:var(--r-xs);background:var(--panel);color:var(--text);font-size:13px}
.btn.full{width:100%}
/* alpha.447 — banner de notificação de novos relatos de bug (admin) */
.bug-notify-banner{display:flex;align-items:center;gap:10px;background:linear-gradient(90deg,#dc2626,#ef4444);color:#fff;padding:9px 16px;font-size:13.5px;font-weight:700;position:relative;z-index:60}
.bug-notify-banner .bnb-ic{font-size:17px;line-height:1}
.bug-notify-banner .bnb-txt{min-width:0}
.bug-notify-banner .bnb-go{margin-left:auto;background:rgba(255,255,255,.22);color:#fff;padding:5px 12px;border-radius:var(--r-xs);text-decoration:none;font-weight:800;font-size:12.5px;white-space:nowrap}
.bug-notify-banner .bnb-go:hover{background:rgba(255,255,255,.34)}
.bug-notify-banner .bnb-x{background:none;border:0;color:#fff;font-size:20px;cursor:pointer;line-height:1;padding:0 2px}
@media(max-width:600px){.bug-notify-banner{font-size:12px;padding:8px 12px}.bug-notify-banner .bnb-txt{flex:1}}
/* alpha.449 — Tour de boas-vindas guiado (spotlight + tooltip) */
.zk-tour{position:fixed;inset:0;z-index:9000}
.zk-tour[hidden]{display:none}
.zkt-spot{position:fixed;border-radius:var(--r-sm);box-shadow:0 0 0 9999px rgba(8,15,30,.66);border:2px solid var(--accent);transition:top .35s cubic-bezier(.4,0,.2,1),left .35s cubic-bezier(.4,0,.2,1),width .35s ease,height .35s ease;pointer-events:none}
.zkt-spot.center{width:0;height:0;top:50%;left:50%;border-color:transparent}
.zkt-pop{position:fixed;width:min(340px,calc(100vw - 32px));background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:0 18px 50px rgba(0,0,0,.34);padding:15px 17px;z-index:9001;transition:top .3s ease,left .3s ease}
.zkt-pop-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.zkt-step{font-size:11px;font-weight:800;color:var(--muted);letter-spacing:.04em}
.zkt-skip{background:none;border:0;color:var(--muted);font-size:12px;cursor:pointer;font-weight:700}
.zkt-skip:hover{color:var(--text)}
.zkt-pop h3{margin:0 0 6px;font-size:17px;font-weight:900;letter-spacing:-.01em}
.zkt-pop p{margin:0 0 12px;font-size:13.5px;line-height:1.5;color:var(--muted)}
.zkt-dots{display:flex;gap:5px;margin-bottom:12px}
.zkt-dots i{width:6px;height:6px;border-radius:50%;background:var(--line-strong,#cbd5e1);transition:.2s ease}
.zkt-dots i.on{background:var(--accent);width:18px;border-radius:3px}
.zkt-nav{display:flex;gap:8px}
.zkt-nav .btn{flex:1;justify-content:center}
.calc-tour-btn{display:inline-block;margin-top:9px;background:color-mix(in srgb,var(--accent) 12%,var(--panel));border:1px solid var(--line);color:var(--accent);font-weight:800;font-size:12.5px;padding:6px 13px;border-radius:var(--r-sm);cursor:pointer}
.calc-tour-btn:hover{background:color-mix(in srgb,var(--accent) 22%,var(--panel))}
/* alpha.455 — card unificado de envio (cotação + serviço + saldo) */
.zk-ship-carriers{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.zk-ship-tab{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--line);border-radius:var(--r-sm);font-weight:700;font-size:13px;cursor:pointer}
.zk-ship-tab input{accent-color:var(--accent)}
.zk-ship-balance{margin-left:auto;font-weight:800;font-size:13px;color:var(--accent)}
.zk-ship-dims{display:flex;gap:8px;flex-wrap:wrap;align-items:end;margin-bottom:10px}
.zk-ship-dims label{display:flex;flex-direction:column;gap:3px;font-size:11.5px;font-weight:700;color:var(--muted)}
.zk-ship-dims input{width:86px;padding:8px 9px;border:1px solid var(--line);border-radius:var(--r-xs);background:var(--panel);color:var(--text);font-size:13.5px;font-weight:600}
.zk-ship-msg{font-size:13px;color:var(--muted);margin:6px 0}
.zk-ship-services{display:flex;flex-direction:column;gap:8px}
.zk-ship-svc{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);cursor:pointer;transition:.12s ease}
.zk-ship-svc:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
.zk-ship-svc.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel))}
.zk-ship-svc input{accent-color:var(--accent)}
.zk-ship-svc-info{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.zk-ship-svc-info strong{font-size:13.5px;font-weight:800}
.zk-ship-svc-info small{font-size:11.5px;color:var(--muted)}
.zk-ship-svc-price{font-size:15px;font-weight:900;color:var(--accent);white-space:nowrap}
@media(max-width:600px){.zk-ship-dims input{width:64px}.zk-ship-balance{margin-left:0;width:100%}}
/* alpha.456 — grade de atalhos/resumos das ferramentas no dashboard */
.home-tools{margin-bottom:14px}
.home-tools-title{margin:0 0 10px;font-size:14px;font-weight:900}
.home-tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.home-tool{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:11px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2,var(--panel));cursor:pointer;transition:.13s ease}
.home-tool:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.08)}
.home-tool .ht-ic{font-size:20px;line-height:1;margin-bottom:3px}
.home-tool strong{font-size:13px;font-weight:800;color:var(--text)}
.home-tool small{font-size:11px;color:var(--muted);line-height:1.3}
@media(max-width:600px){.home-tools-grid{grid-template-columns:repeat(2,1fr);gap:8px}.home-tool{padding:10px}}

/* alpha.443 — Widget de CLIMA animado (dashboard) */
.zk-weather{position:relative;overflow:hidden;border:0;border-radius:15px;padding:11px 13px 10px;margin-bottom:12px;color:#fff;background:linear-gradient(165deg,#5aa9ff,#3d86e0 55%,#bfe0ff);transition:background .8s ease}
.zk-weather[data-day="0"]{background:linear-gradient(165deg,#0c1c3a,#13294d 55%,#274069)}
.zk-weather[data-sky="cloud"][data-day="1"],.zk-weather[data-sky="fog"][data-day="1"]{background:linear-gradient(165deg,#90b4d6,#6f93b8 60%,#aac3dc)}
.zk-weather[data-sky="rain"][data-day="1"],.zk-weather[data-sky="storm"][data-day="1"]{background:linear-gradient(165deg,#5b7088,#3f5168 60%,#6b809a)}
.zk-weather[data-sky="rain"][data-day="0"],.zk-weather[data-sky="storm"][data-day="0"],.zk-weather[data-sky="cloud"][data-day="0"]{background:linear-gradient(165deg,#0a1526,#152033 60%,#243248)}
.zkw-scene{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.zkw-stars{position:absolute;inset:0;opacity:0;background-image:radial-gradient(1.5px 1.5px at 20% 28%,#fff,transparent),radial-gradient(1.5px 1.5px at 62% 18%,#fff,transparent),radial-gradient(1px 1px at 82% 38%,#fff,transparent),radial-gradient(1.5px 1.5px at 42% 58%,#fff,transparent),radial-gradient(1px 1px at 73% 68%,#fff,transparent),radial-gradient(1px 1px at 30% 78%,#fff,transparent);animation:zkw-twinkle 3.6s ease-in-out infinite}
.zk-weather[data-day="0"] .zkw-stars{opacity:.85}
@keyframes zkw-twinkle{0%,100%{opacity:.85}50%{opacity:.4}}
.zkw-sun{position:absolute;top:-10px;right:-2px;width:66px;height:66px;border-radius:50%;background:radial-gradient(circle at 50% 50%,#fff7cc 32%,#ffd23f 72%);box-shadow:0 0 30px rgba(255,210,63,.6);opacity:0;transform:scale(.6);transition:opacity .6s,transform .6s}
.zkw-sun::before{content:"";position:absolute;inset:-13px;border-radius:50%;background:repeating-conic-gradient(rgba(255,221,87,.55) 0deg 7deg,transparent 7deg 45deg);-webkit-mask:radial-gradient(circle,transparent 33px,#000 35px);mask:radial-gradient(circle,transparent 33px,#000 35px);animation:zkw-spin 22s linear infinite}
.zk-weather[data-sky="clear"][data-day="1"] .zkw-sun,.zk-weather[data-sky="partly"][data-day="1"] .zkw-sun{opacity:1;transform:scale(1)}
@keyframes zkw-spin{to{transform:rotate(360deg)}}
.zkw-moon{position:absolute;top:-2px;right:14px;width:42px;height:42px;border-radius:50%;background:radial-gradient(circle at 64% 36%,#fff 58%,#cdd6e6);box-shadow:0 0 20px rgba(220,230,255,.5),inset -8px -5px 0 -2px rgba(170,188,222,.4);opacity:0;transform:scale(.6);transition:.6s}
.zk-weather[data-sky="clear"][data-day="0"] .zkw-moon,.zk-weather[data-sky="partly"][data-day="0"] .zkw-moon{opacity:1;transform:scale(1)}
.zkw-cloud{position:absolute;border-radius:50px;background:rgba(255,255,255,.92);opacity:0;filter:drop-shadow(0 6px 10px rgba(0,0,0,.12));transition:opacity .6s}
.zkw-cloud::before,.zkw-cloud::after{content:"";position:absolute;border-radius:50%;background:inherit}
.zkw-cloud.k1{top:14px;width:88px;height:25px;animation:zkw-drift 28s linear infinite}
.zkw-cloud.k1::before{width:38px;height:38px;top:-16px;left:14px}.zkw-cloud.k1::after{width:30px;height:30px;top:-12px;left:46px}
.zkw-cloud.k2{top:42px;width:68px;height:20px;animation:zkw-drift 36s linear infinite reverse;animation-delay:-8s}
.zkw-cloud.k2::before{width:28px;height:28px;top:-12px;left:12px}.zkw-cloud.k2::after{width:22px;height:22px;top:-9px;left:36px}
.zkw-cloud.k3{top:66px;width:56px;height:16px;animation:zkw-drift 44s linear infinite;animation-delay:-22s}
.zkw-cloud.k3::before{width:22px;height:22px;top:-10px;left:10px}.zkw-cloud.k3::after{width:18px;height:18px;top:-7px;left:28px}
.zk-weather[data-sky="partly"] .zkw-cloud.k1{opacity:.92}
.zk-weather[data-sky="cloud"] .zkw-cloud,.zk-weather[data-sky="rain"] .zkw-cloud,.zk-weather[data-sky="storm"] .zkw-cloud,.zk-weather[data-sky="snow"] .zkw-cloud{opacity:.95}
.zk-weather[data-sky="fog"] .zkw-cloud{opacity:.55}
@keyframes zkw-drift{from{transform:translateX(-130px)}to{transform:translateX(430px)}}
.zkw-precip{position:absolute;inset:0}
.zkw-precip i{position:absolute;top:-12px}
.zkw-precip.is-rain i{width:2px;height:14px;background:linear-gradient(transparent,rgba(200,225,255,.95));border-radius:2px;animation:zkw-rain linear infinite}
.zkw-precip.is-snow i{width:6px;height:6px;background:#fff;border-radius:50%;opacity:.92;animation:zkw-snow linear infinite}
@keyframes zkw-rain{0%{transform:translateY(-12px);opacity:0}12%{opacity:1}100%{transform:translateY(160px);opacity:.25}}
@keyframes zkw-snow{0%{transform:translateY(-12px) translateX(0);opacity:0}12%{opacity:1}100%{transform:translateY(160px) translateX(18px);opacity:.25}}
.zkw-bolt{position:absolute;inset:0;background:rgba(255,255,255,0)}
.zk-weather[data-sky="storm"] .zkw-bolt{animation:zkw-flash 6s linear infinite}
@keyframes zkw-flash{0%,92%,100%{background:rgba(255,255,255,0)}93%{background:rgba(255,255,255,.5)}94%{background:rgba(255,255,255,0)}96%{background:rgba(255,255,255,.35)}97%{background:rgba(255,255,255,0)}}
.zkw-top{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start}
.zkw-main{position:relative;z-index:2}
.zkw-loc{font-size:11.5px;font-weight:800;opacity:.95;margin-bottom:1px;text-shadow:0 1px 3px rgba(0,0,0,.32);max-width:62vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zkw-temp{font-size:34px;font-weight:900;line-height:1;text-shadow:0 2px 8px rgba(0,0,0,.22)}
.zkw-temp sup{font-size:14px;font-weight:800;vertical-align:super;opacity:.9}
.zkw-cond{font-size:12px;font-weight:800;margin-top:2px;text-shadow:0 1px 4px rgba(0,0,0,.28)}
.zkw-refresh{background:rgba(255,255,255,.2);border:0;color:#fff;width:34px;height:34px;border-radius:50%;font-size:16px;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.zkw-refresh:hover{background:rgba(255,255,255,.34)}
/* alpha.483 — alternar clima compacto/expandido */
.zkw-toggle{flex:0 0 auto;background:rgba(255,255,255,.2);border:0;color:#fff;width:30px;height:30px;border-radius:var(--r-xs);font-size:14px;line-height:1;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:transform .2s ease,background .15s ease}
.zkw-toggle:hover{background:rgba(255,255,255,.34)}
.zk-weather:not(.zkw-compact) .zkw-toggle{transform:rotate(180deg)}
.zk-weather.zkw-compact .zkw-tiles,
.zk-weather.zkw-compact .zkw-hourly{display:none!important}
.zkw-tiles{position:relative;z-index:2;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:10px}
.zkw-tile{background:rgba(255,255,255,.15);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:var(--r-sm);padding:6px 3px;text-align:center;display:flex;flex-direction:column;gap:0;align-items:center}
.zkw-tile-ic{font-size:13px;line-height:1.1}
.zkw-tile strong{font-size:12px;font-weight:900}
.zkw-tile em{font-size:8.5px;font-style:normal;opacity:.85;font-weight:700}
.zkw-cta{position:relative;z-index:2;margin-top:12px;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.zkw-cta .btn{background:rgba(255,255,255,.94);color:color-mix(in srgb,var(--accent) 70%,#111827);font-weight:800;border:0} /* D5 (auditoria) — CTA segue o tema (era azul-marinho fixo) */
.zkw-cta small{font-size:10.5px;opacity:.92}
.zkw-err{position:relative;z-index:2;margin-top:8px;font-size:12px;background:rgba(0,0,0,.22);padding:7px 10px;border-radius:var(--r-xs)}
/* alpha.446 — MOBILE bem mais compacto: tiles viram faixa rolável de 1 linha (economiza muito espaço vertical) + tudo menor */
@media(max-width:640px){
  .zk-weather{padding:9px 10px 8px;border-radius:var(--r-sm);margin-bottom:10px}
  .zkw-temp{font-size:28px}
  .zkw-temp sup{font-size:12px}
  .zkw-cond{font-size:11px}
  .zkw-loc{font-size:10.5px}
  .zkw-sun{width:52px;height:52px}
  .zkw-moon{width:34px;height:34px}
  .zkw-tiles{display:flex;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:5px;margin-top:9px;grid-template-columns:none;scrollbar-width:none}
  .zkw-tiles::-webkit-scrollbar{display:none}
  .zkw-tile{flex:0 0 auto;width:58px;padding:5px 4px}
  .zkw-hourly{margin-top:8px}
  .zkw-hr{width:42px;padding:5px 3px}
}
/* alpha.443 — widget de clima é ANIMADO por pedido do dono; roda mesmo com "reduzir movimento" (igual garrafa/seringa). */
/* alpha.444 — faixa de previsão horária (próximas 12h) */
.zkw-hourly{position:relative;z-index:2;margin-top:12px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.zkw-hourly::-webkit-scrollbar{display:none}
.zkw-hourly-inner{display:flex;gap:6px;min-width:min-content;align-items:flex-end}
.zkw-hr{flex:0 0 auto;width:45px;background:rgba(255,255,255,.13);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:var(--r-sm);padding:6px 3px 6px;display:flex;flex-direction:column;align-items:center;gap:2px}
.zkw-hr-t{font-size:9.5px;font-weight:800;opacity:.92;white-space:nowrap}
.zkw-hr-ic{font-size:15px;line-height:1}
.zkw-hr-bar{width:5px;border-radius:3px;background:linear-gradient(to top,rgba(255,255,255,.3),#fff);min-height:12px;transition:height .5s ease}
.zkw-hr strong{font-size:12px;font-weight:900}
.zkw-hr-pop{font-size:9px;font-weight:800;color:#cdeaff;min-height:12px;white-space:nowrap}

/* alpha.402 — fotos de progresso por ÂNGULO (frente/lado/costas) no modal Nova medição */
.bphoto-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.bphoto-slot{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.bphoto-thumb{width:100%;aspect-ratio:3/4;border:1px dashed var(--line);border-radius:var(--r-sm);background:var(--panel-2);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
.bphoto-slot.has-photo .bphoto-thumb{border-style:solid;border-color:var(--accent)}
.bphoto-prev{width:100%;height:100%;object-fit:cover;display:block}
.bphoto-ph{font-size:22px;opacity:.4}
.bphoto-name{font-size:12px;font-weight:700;color:var(--text)}
.bphoto-acts{display:flex;gap:6px}
.bphoto-btn{padding:5px 9px;cursor:pointer;font-size:13px;margin:0}
@media(max-width:560px){.bphoto-grid{grid-template-columns:repeat(2,1fr)}}

/* alpha.403 — Evolução Visual (comparador 4 ângulos antes×depois + deltas + IA) */
.evo-selectors{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.evo-selectors label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700;color:var(--muted)}
.evo-selectors select{padding:9px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:14px}
.evo-grid{display:flex;flex-direction:column;gap:8px;margin:8px 0 16px}
.evo-row{display:grid;grid-template-columns:64px 1fr 1fr;gap:8px;align-items:center}
.evo-row-head{font-size:12px;font-weight:800;color:var(--muted);text-align:center}
.evo-row-head>div:first-child{text-align:left}
.evo-row-lbl{font-size:12px;font-weight:700;color:var(--text)}
.evo-cell{aspect-ratio:3/4;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:var(--panel-2);display:flex;align-items:center;justify-content:center}
.evo-cell img{width:100%;height:100%;object-fit:cover;display:block}
.evo-cell-empty{color:var(--muted);font-size:11px;border-style:dashed}
.evo-sub{font-weight:800;font-size:13px;margin:6px 0 4px;color:var(--text)}
.evo-table{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed;min-width:0}
.evo-table th,.evo-table td{padding:6px 8px;text-align:left;border-bottom:1px solid var(--line);word-break:break-word}
.evo-table th{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.evo-table td:last-child,.evo-table th:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:800}
.evo-table .evo-up{color:#c0392b}     /* aumentou (medida maior) */
.evo-table .evo-down{color:#1e8e5a}   /* diminuiu (medida menor) */
.evo-score{display:inline-block;padding:6px 12px;border-radius:var(--r-pill);background:rgba(var(--accent-rgb),.12);color:var(--accent);font-weight:800;margin-bottom:8px}
/* alpha.490 — chip de confiança da leitura visual (Fotos) */
.ev-conf{display:inline-block;margin:0 0 10px 8px;padding:5px 11px;border-radius:var(--r-pill);font-weight:800;font-size:12px;border:1px solid var(--line)}
.ev-conf strong{text-transform:capitalize}
.ev-conf--alta{background:color-mix(in srgb,var(--green) 16%,transparent);color:var(--green);border-color:color-mix(in srgb,var(--green) 35%,transparent)}
.ev-conf--media{background:color-mix(in srgb,var(--orange) 16%,transparent);color:var(--orange);border-color:color-mix(in srgb,var(--orange) 35%,transparent)}
.ev-conf--baixa{background:color-mix(in srgb,var(--red) 14%,transparent);color:var(--red);border-color:color-mix(in srgb,var(--red) 35%,transparent)}
.evo-trends,.evo-regioes{margin:6px 0;padding-left:18px;font-size:14px;line-height:1.6}
@media(max-width:560px){.evo-row{grid-template-columns:48px 1fr 1fr;gap:6px}}

/* alpha.405 — FIX overflow horizontal no mobile (abas Medidas e Conquistas).
   Causa: o .pub-main e um grid e seus itens (.calc-tab-panel) tinham min-width:auto,
   entao um filho largo (a tabela de comparacao, com min-width herdado de ~820px, e as
   medalhas) estourava a coluna -> a pagina inteira ia a ~850px no celular.
   min-width:0 deixa o item de grid encolher; o resto garante que filhos largos caibam. */
.calc-tab-panel{min-width:0}
.ach-medals,.ach-medal-row{flex-wrap:wrap;min-width:0}

/* alpha.407 — Gráfico de evolução PREMIUM (estilo do relatório PDF), 100% theme-aware.
   Usa os tokens do tema (--accent / --panel / --panel-2 / --line / --text / --muted). */
.zk-trend-svg{width:100%;height:auto;display:block;margin-top:4px;overflow:visible}
.zt-grid{stroke:var(--line);stroke-width:1}
.zt-axis{fill:var(--muted);font-size:9px;font-weight:600}
.zt-pt-val{fill:var(--text);font-size:9.5px;font-weight:800;paint-order:stroke;stroke:var(--panel);stroke-width:2.5px;stroke-linejoin:round}
.zt-line{fill:none;stroke:var(--accent);stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round} /* fallback sólido; o gradiente único é aplicado inline por gráfico (alpha.478) */
.zt-area{fill:rgba(var(--accent-rgb),.12);stroke:none}
.zt-g0{stop-color:var(--accent)}
.zt-g1{stop-color:var(--accent);stop-color:color-mix(in srgb, var(--accent) 52%, #ffffff)}
.zt-f0{stop-color:var(--accent);stop-color:rgba(var(--accent-rgb),.22)}
.zt-f1{stop-color:var(--accent);stop-color:rgba(var(--accent-rgb),0)}
.zt-mk-out{fill:var(--panel);stroke:var(--accent);stroke-width:2}
.zt-mk-in{fill:var(--accent)}
.zt-mk-last{fill:var(--accent);stroke:var(--panel);stroke-width:1.5}
/* alpha.935 — animação de ENTRADA (referência: gráfico "Evolução das doses"): a linha
   desenha da esquerda p/ a direita, a área sobe atrás dela, e cada ponto+rótulo PULA quando
   a linha o alcança (atraso --ztd por ponto, vindo do JS). pathLength="1" na .zt-line deixa
   o dashoffset trabalhar em fração (0..1) sem medir o comprimento real. */
@keyframes ztDraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes ztArea{from{opacity:0}to{opacity:1}}
@keyframes ztPop{0%{opacity:0;transform:scale(0)}62%{transform:scale(1.18)}100%{opacity:1;transform:scale(1)}}
@keyframes ztVal{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
/* alpha.936 — escondido por padrão; anima só quando .zt-go entra (IntersectionObserver via
   window.zkAnimateOnView). Sem JS, o SVG só existe se o JS o renderizou → sem regressão. */
.zk-trend-svg .zt-line{stroke-dasharray:1;stroke-dashoffset:1}
.zk-trend-svg .zt-area{opacity:0}
.zk-trend-svg .zt-mk-out,.zk-trend-svg .zt-mk-in,.zk-trend-svg .zt-mk-last{opacity:0}
.zk-trend-svg .zt-pt-val{opacity:0}
.zk-trend-svg.zt-go .zt-line{animation:ztDraw 1.15s cubic-bezier(.45,0,.2,1) forwards}
.zk-trend-svg.zt-go .zt-area{animation:ztArea .9s ease .4s forwards}
.zk-trend-svg.zt-go .zt-mk-out,.zk-trend-svg.zt-go .zt-mk-in,.zk-trend-svg.zt-go .zt-mk-last{transform-box:fill-box;transform-origin:center;animation:ztPop .5s cubic-bezier(.34,1.56,.64,1) var(--ztd,.4s) forwards}
.zk-trend-svg.zt-go .zt-pt-val{animation:ztVal .45s ease var(--ztd,.9s) forwards}
@media(prefers-reduced-motion:reduce){.zk-trend-svg .zt-line{stroke-dashoffset:0}.zk-trend-svg .zt-area,.zk-trend-svg .zt-mk-out,.zk-trend-svg .zt-mk-in,.zk-trend-svg .zt-mk-last,.zk-trend-svg .zt-pt-val{opacity:1}.zk-trend-svg.zt-go .zt-line,.zk-trend-svg.zt-go .zt-area,.zk-trend-svg.zt-go .zt-mk-out,.zk-trend-svg.zt-go .zt-mk-in,.zk-trend-svg.zt-go .zt-mk-last,.zk-trend-svg.zt-go .zt-pt-val{animation:none}}
/* alpha.875 — tooltip interativo dos pontos (hover + toque) */
.zt-hit{cursor:pointer}
.zt-tip{position:absolute;z-index:6;transform:translate(-50%,calc(-100% - 12px));background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:7px 10px;font-size:12px;line-height:1.32;color:var(--text);box-shadow:var(--shadow);pointer-events:none;white-space:nowrap;max-width:220px}
.zt-tip strong{display:block;font-weight:850;font-size:12.5px}
.zt-tip .ztt-row{display:block;font-weight:800;color:var(--accent)}
.zt-tip .ztt-sub{display:block;color:var(--muted);font-size:11px;margin-top:1px}
.zk-trend-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}
.ztc{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 11px;display:flex;flex-direction:column;gap:2px;min-width:0}
.ztc span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.ztc strong{font-size:15px;color:var(--text);font-weight:800;font-variant-numeric:tabular-nums}
.ztc-d.up{color:#d9534f}
.ztc-d.down{color:#1e9e6a}
@media(max-width:560px){.zk-trend-chips{grid-template-columns:repeat(2,1fr)}}

/* alpha.393 — chip de prazo de entrega (página de produto) */
.store-delivery-chip{display:flex;align-items:center;gap:12px;margin:14px 0 0;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);box-shadow:0 1px 3px rgba(0,0,0,.04)}
.store-delivery-chip .sdc-ic{font-size:24px;line-height:1;flex:0 0 auto}
.store-delivery-chip .sdc-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.store-delivery-chip strong{font-weight:800;color:var(--text)}
.store-delivery-chip small{color:var(--muted);font-size:12px}
/* alpha.393 — fieldset de personalização */
.store-perso{display:flex;flex-direction:column;gap:6px}
.store-perso legend{font-weight:700;padding:0 4px}
.store-perso .store-radio{display:flex;align-items:center;gap:6px}
.store-perso-opts{display:flex;flex-direction:column;gap:10px;margin-top:8px;padding:10px 12px;border:1px dashed var(--line);border-radius:var(--r-sm);background:var(--panel)}
/* alpha.393 — bloco de prazo no checkout (resumo) */
.store-checkout-eta{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);margin:8px 0}
.store-checkout-eta .sce-ic{font-size:18px}
.store-checkout-eta strong{color:var(--text);font-weight:700}
.store-checkout-eta small{display:block;color:var(--muted);font-size:12px;margin-top:2px}

/* alpha.394 — Cotação pública de frete (Frenet) na página de produto */
.store-freight-box{margin-top:10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);overflow:hidden;transition:box-shadow .18s}
.store-freight-box.open{box-shadow:0 4px 14px rgba(0,0,0,.06)}
.store-freight-toggle{appearance:none;width:100%;display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--panel-2);border:0;border-bottom:1px solid transparent;font:inherit;color:var(--text);font-weight:700;cursor:pointer;text-align:left}
.store-freight-toggle:hover{filter:brightness(.98)}
.store-freight-box.open .store-freight-toggle{border-bottom-color:var(--line)}
.store-freight-toggle .sft-chev{margin-left:auto;transition:transform .2s}
.store-freight-box.open .store-freight-toggle .sft-chev{transform:rotate(180deg)}
.store-freight-panel{padding:14px}
.sfp-label{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:4px;text-transform:uppercase;letter-spacing:.4px}
.sfp-row{display:flex;gap:8px;align-items:center}
.sfp-row input{flex:1 1 auto;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:15px;font-weight:600;letter-spacing:.5px;background:var(--panel);color:var(--text);font-variant-numeric:tabular-nums}
.sfp-row input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb,200,160,80),.15)}
.sfp-row .btn{flex:0 0 auto;white-space:nowrap}
.sfp-help{display:inline-block;margin-top:6px;font-size:12px;color:var(--muted);text-decoration:none;border-bottom:1px dashed currentColor}
.sfp-help:hover{color:var(--accent)}
.sfp-result{margin-top:14px}
.sfp-loading,.sfp-empty{padding:12px;text-align:center;color:var(--muted);font-size:14px;border:1px dashed var(--line);border-radius:var(--r-sm)}
.sfp-list{display:flex;flex-direction:column;gap:6px}
.sfp-opt{display:grid;grid-template-columns:auto 1fr auto auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);cursor:pointer;background:var(--panel-2);transition:background .12s,border-color .12s}
.sfp-opt:hover{background:var(--panel)}
.sfp-opt input{accent-color:var(--accent)}
.sfp-opt-carrier{min-width:0;color:var(--text);font-size:14px}
.sfp-opt-carrier strong{font-weight:800;margin-right:6px}
.sfp-opt-days{color:var(--muted);font-size:13px;white-space:nowrap;display:flex;flex-direction:column;gap:1px;align-items:flex-end;text-align:right}
.sfp-opt-price{color:var(--text);font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.sfp-opt:has(input:checked){border-color:var(--accent);background:color-mix(in srgb, var(--accent) 8%, var(--panel))}
/* alpha.796 — ETA de data + botão compartilhar */
.sfp-eta-date{font-size:12px;font-weight:800;color:var(--accent);white-space:nowrap}
.sfp-opt-days small{font-size:10px;color:var(--muted);white-space:nowrap}
.sfp-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;flex-wrap:wrap}
.sfp-actions .sfp-foot{margin-top:0;flex:1;min-width:0}
.sfp-foot{display:block;margin-top:10px;color:var(--muted);font-size:11px;line-height:1.5}
.sfp-share-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--muted);font:700 11px/1 inherit;cursor:pointer;white-space:nowrap;transition:color .14s,border-color .14s;flex-shrink:0}
.sfp-share-btn:hover{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
@media(max-width:520px){
  .sfp-opt{grid-template-columns:auto 1fr;grid-template-areas:"r c" "_ d" "_ p";row-gap:2px}
  .sfp-opt input{grid-area:r}
  .sfp-opt-carrier{grid-area:c}
  .sfp-opt-days{grid-area:d}
  .sfp-opt-price{grid-area:p}
}

/* alpha.387 — Nova medição em MODAL (aba Medidas mais limpa) */
.bm-new-row{display:flex;justify-content:flex-end;margin:0 0 16px}
.bm-new-btn{font-weight:800}
.bmform-modal{position:fixed;inset:0;z-index:9000;display:none;align-items:flex-start;justify-content:center;padding:28px 14px;background:rgba(0,0,0,.55);overflow-y:auto;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.bmform-modal.open{display:flex}
.bmform-dialog{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 24px 60px rgba(0,0,0,.42);width:100%;max-width:680px;max-height:92vh;display:flex;flex-direction:column;overflow:hidden;margin:auto}
.bmform-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;border-bottom:1px solid var(--line);flex:0 0 auto}
.bmform-close{appearance:none;border:1px solid var(--line);background:var(--panel-2);color:var(--text);width:34px;height:34px;border-radius:var(--r-sm);font-size:15px;cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.bmform-close:hover{background:var(--line)}
.bmform-body{flex:1 1 auto;overflow-y:auto;padding:20px 22px;margin:0;min-height:0}
.bmform-foot{display:flex;gap:10px;justify-content:flex-end;padding:14px 22px;border-top:1px solid var(--line);background:var(--panel);flex:0 0 auto}
.bmform-foot .btn{margin:0}
body.bmform-lock{overflow:hidden}
@media(max-width:560px){.bmform-modal{padding:10px}.bmform-dialog{max-height:96vh}.bmform-head{padding:14px 16px}.bmform-body{padding:14px 16px}.bmform-foot{padding:12px 16px}}

/* alpha.383 — Dashboard "Início" (unifica Medicamentos + Acompanhamento) */
#tabHome .home-wrap{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
.home-hero .bwk-head h3{font-size:18px}
.home-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.home-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}
.home-card-head h3{margin:0;font-size:15px;font-weight:900;color:var(--text)}
.home-card-head small{font-size:11.5px;color:var(--muted)}
.home-next{margin-bottom:12px}
.home-next strong{display:block;font-size:20px;font-weight:950;color:var(--text)}
.home-next small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.home-card .btn.primary{width:100%}
.home-water-quick{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}
.home-water-quick .btn{flex:1 1 auto;min-width:64px}
/* alpha.635 — alvos de toque >=40px no MOBILE (<=900px); não altera o desktop. Diferido da auditoria de UX. */
@media (max-width:900px){
  .btn.small{min-height:40px}
  .med-log-btn{min-height:40px}
  .track-water-quick .btn,.home-water-quick .btn{min-height:44px}
  .exam-photo-del{width:30px;height:30px;top:5px;right:5px;font-size:14px}
  .med-chip-x{min-width:32px;min-height:32px;padding:4px 8px}
  .link-btn{min-width:32px;min-height:32px;padding:6px 10px}
}
.home-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}
.home-nav-btn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:12px;font-weight:700;cursor:pointer;transition:border-color .13s ease,transform .13s ease,box-shadow .13s ease}
.home-nav-btn:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--accent) 12%,transparent)}
.home-nav-btn span{font-size:21px}
@media(max-width:640px){.home-grid{grid-template-columns:1fr}.home-nav{grid-template-columns:repeat(3,1fr)}}
/* ============================================================
   alpha.727 — Aba Exercícios: CTAs "soft-accent-fill" (mais bonitos e em evidência).
   Embeleza .act-manual-toggle / .act-hist-pdf / #actGoalsEditBtn / #actAiBtn.
   Origem: workflow design-panel (Soft Accent Fill + tiers via --act-tint).
   100% token-safe (8 acentos + claro/escuro), AA, :focus-visible, reduced-motion.
   CSS-only. NÃO toca em .btn/.btn.primary/.act-gps-start (GPS primário segue o
   mais chamativo) nem no motor "organizar" (uiorg-elem).
   ============================================================ */
/* 1) .act-manual-toggle — era link de texto chapado -> vira CTA pílula soft-accent.
   O card tem padding:0 (cabeçalho full-bleed) e raio 22px, então o botão usa
   MARGENS (sem width:100%) p/ ficar inset; display:flex já preenche o resto. */
.act-manual-toggle{
  --act-tint:.15;
  display:flex; align-items:center; justify-content:center; gap:9px;
  width:auto; align-self:center; min-width:220px; max-width:100%;
  margin:8px auto 16px;            /* centralizado p/ harmonizar com "Iniciar rastreio" */
  min-height:46px;
  padding:13px 26px;
  border:1px solid rgba(var(--accent-rgb),.32);
  border-radius:13px;
  background:linear-gradient(135deg,
      rgba(var(--accent-rgb),var(--act-tint)),
      rgba(var(--accent-rgb),calc(var(--act-tint) * .45)));
  color:color-mix(in srgb,var(--accent) 55%,var(--text)); /* 55%: AA (>=4.5) ate no acento dourado (medido) */
  font-size:13px; font-weight:800; letter-spacing:.1px; line-height:1.1;
  text-align:center; cursor:pointer;
  -webkit-appearance:none; appearance:none;
  -webkit-tap-highlight-color:transparent;
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.act-manual-toggle:hover{
  background:linear-gradient(135deg,var(--accent-2),var(--accent));
  border-color:color-mix(in srgb,var(--accent) 80%,#000);
  color:#fff; transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(var(--accent-rgb),.30);
}
.act-manual-toggle:active{ transform:translateY(0); box-shadow:0 3px 9px rgba(var(--accent-rgb),.24); }
.act-manual-toggle:focus-visible{ outline:none; box-shadow:0 0 0 2px var(--panel),0 0 0 5px rgba(var(--accent-rgb),.40); }
/* CTA-único do card (Musculação/Planos): presença mais forte, mas SOFT em repouso
   (nunca fill no repouso -> o GPS LOUD "Iniciar rastreio" continua soberano). */
#actStrToggle.act-manual-toggle,
#actWpToggle.act-manual-toggle{
  --act-tint:.20;
  border-color:rgba(var(--accent-rgb),.42);
  box-shadow:0 2px 10px rgba(var(--accent-rgb),.12);
}
/* Secundário do card GPS (há o "Iniciar rastreio" acima): recua um degrau. */
#actLogOpen.act-manual-toggle{ --act-tint:.10; font-weight:750; border-color:rgba(var(--accent-rgb),.24); box-shadow:none; }
#actLogOpen.act-manual-toggle:hover{ font-weight:800; }
/* 2) .act-hist-pdf — "Exportar PDF": pílula accent-outline (sobrescreve .btn.small). */
.act-hist-pdf.btn,
.act-hist-pdf.btn.small{
  display:inline-flex; align-items:center; gap:7px;
  min-height:38px; padding:8px 15px !important;
  border-radius:999px !important;
  font-size:12.5px !important; font-weight:800; letter-spacing:.1px; white-space:nowrap;
  border:1px solid rgba(var(--accent-rgb),.34) !important;
  background:linear-gradient(135deg,rgba(var(--accent-rgb),.14),rgba(var(--accent-rgb),.06)) !important;
  color:color-mix(in srgb,var(--accent) 55%,var(--text)) !important; /* AA-safe (medido no dourado) */
  box-shadow:none !important; text-decoration:none;
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.act-hist-pdf.btn:hover,
.act-hist-pdf.btn.small:hover{
  background:linear-gradient(135deg,var(--accent-2),var(--accent)) !important;
  border-color:color-mix(in srgb,var(--accent) 80%,#000) !important;
  color:#fff !important; transform:translateY(-1px);
  box-shadow:0 6px 15px rgba(var(--accent-rgb),.28) !important;
}
.act-hist-pdf.btn:active{ transform:translateY(0); box-shadow:0 3px 8px rgba(var(--accent-rgb),.22) !important; }
.act-hist-pdf.btn:focus-visible{ outline:none; box-shadow:0 0 0 2px var(--panel),0 0 0 5px rgba(var(--accent-rgb),.40) !important; }
/* 3) #actGoalsEditBtn — "Editar metas": mesmo accent-outline (sobrescreve .btn.ghost cinza). */
#actGoalsEditBtn.btn,
#actGoalsEditBtn.btn.ghost,
#actGoalsEditBtn.btn.small{
  display:inline-flex; align-items:center; gap:6px;
  min-height:34px; padding:6px 13px !important;
  border-radius:999px !important; font-size:12px !important; font-weight:800; white-space:nowrap;
  border:1px solid rgba(var(--accent-rgb),.30) !important;
  background:rgba(var(--accent-rgb),.10) !important;
  color:color-mix(in srgb,var(--accent) 55%,var(--text)) !important; /* AA-safe (medido no dourado) */
  box-shadow:none !important;
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
#actGoalsEditBtn.btn:hover{
  background:linear-gradient(135deg,var(--accent-2),var(--accent)) !important;
  border-color:color-mix(in srgb,var(--accent) 80%,#000) !important;
  color:#fff !important; transform:translateY(-1px);
  box-shadow:0 5px 13px rgba(var(--accent-rgb),.26) !important;
}
#actGoalsEditBtn.btn:active{ transform:translateY(0); }
#actGoalsEditBtn.btn:focus-visible{ outline:none; box-shadow:0 0 0 2px var(--panel),0 0 0 5px rgba(var(--accent-rgb),.40) !important; }
/* 4) #actAiBtn — "Gerar análise" (já .btn.primary cheio): reflexo (shine) que varre
   no hover + glow pulsante via FILTER. (O box-shadow do .btn.primary é !important e
   venceria animação de box-shadow; drop-shadow não conflita com o cascade.) */
#actAiBtn{ position:relative; overflow:hidden; isolation:isolate; }
#actAiBtn::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(120deg,transparent 38%,rgba(255,255,255,.32) 50%,transparent 62%);
  transform:translateX(-130%);
}
#actAiBtn:hover{ box-shadow:0 8px 22px rgba(var(--accent-rgb),.38) !important; }
#actAiBtn:focus-visible{ outline:none; box-shadow:0 0 0 2px var(--panel),0 0 0 5px rgba(var(--accent-rgb),.45) !important; }
@media (prefers-reduced-motion: no-preference){
  #actAiBtn{ animation:actAiGlow 2.6s ease-in-out infinite; }
  #actAiBtn:hover::after{ animation:actAiShine .9s ease; }
  @keyframes actAiGlow{
    0%,100%{ filter:drop-shadow(0 3px 8px rgba(var(--accent-rgb),.25)); }
    50%    { filter:drop-shadow(0 6px 16px rgba(var(--accent-rgb),.45)); }
  }
  @keyframes actAiShine{ 0%{ transform:translateX(-130%); } 100%{ transform:translateX(130%); } }
}
@media (prefers-reduced-motion: reduce){
  #actAiBtn{ filter:drop-shadow(0 4px 12px rgba(var(--accent-rgb),.32)); }
  #actAiBtn::after{ display:none; }
}
.act-manual-form{padding:0 17px 16px}

/* Sequência (streak) — hero laranja/fogo */
.act-streak-card{background:linear-gradient(125deg, color-mix(in srgb,var(--accent) 44%,#0f172a) 0%, color-mix(in srgb,var(--accent) 66%,#0f172a) 100%);color:#fff;border:none;box-shadow:0 10px 30px color-mix(in srgb,var(--accent) 26%,transparent)}
.act-streak-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.act-streak-head h3{margin:0;font-size:16px;font-weight:900;color:#fff}
.act-streak-msg{font-size:12px;font-weight:800;color:#fff;opacity:.95}
.act-streak-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:13px 0}
.act-streak-stat{text-align:center;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.18);border-radius:var(--r-sm);padding:12px 6px}
.act-streak-stat strong{display:block;font-size:28px;font-weight:950;color:#fff;line-height:1}
.act-streak-stat em{font-style:normal;font-size:11px;color:#fff;opacity:.92;font-weight:700;margin-top:3px;display:block}
.act-level-top{display:flex;justify-content:space-between;font-size:12px;font-weight:800;color:#fff;margin-bottom:5px}
.act-streak-card small{color:#fff}
.act-level-bar{height:9px;border-radius:var(--r-lg);background:rgba(255,255,255,.25);overflow:hidden}
.act-level-bar i{display:block;height:100%;border-radius:var(--r-lg);background:#fff;transition:width .5s cubic-bezier(.2,.9,.3,1)}

/* Totais */
.act-totals{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:9px;margin-bottom:14px}/* alpha.1010 — auto-fit */
.act-total{text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:11px 5px}
.act-total span{font-size:18px}
.act-total strong{display:block;font-size:19px;font-weight:950;color:var(--text);line-height:1.1;margin-top:2px}
.act-total em{font-style:normal;font-size:10.5px;color:var(--muted);font-weight:700}

/* Conquistas */
.act-ach-head,.act-ai-head,.act-hist-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.act-ach-head h3,.act-ai-head h3,.act-hist-head h3{margin:0;font-size:16px;font-weight:900}
.act-ach-head span{font-size:11.5px;color:var(--muted);font-weight:700}
.act-ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:9px}
.act-ach{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:13px 9px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel-2)}
.act-ach.on{border-color:color-mix(in srgb,var(--accent) 35%,var(--line));background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 10%,transparent),transparent),var(--panel-2)}
.act-ach.off{opacity:.5;filter:grayscale(.6)}
.act-ach-ic{font-size:25px}
.act-ach strong{font-size:12px;font-weight:850;color:var(--text)}
.act-ach small{font-size:10px;color:var(--muted);line-height:1.2}

/* Análise IA */
.act-ai-result{font-size:13px;line-height:1.55;color:var(--text);background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:13px 15px;margin-bottom:10px}
.act-ai-card .btn{width:100%}

/* Dica */
.act-tip-card{display:flex;align-items:flex-start;gap:12px;
  background:linear-gradient(120deg,color-mix(in srgb,#0891b2 12%,var(--panel)),var(--panel));border:1px solid color-mix(in srgb,#0891b2 25%,var(--line))}
.act-tip-ic{font-size:24px;flex:0 0 auto}
.act-tip-body{flex:1;min-width:0}
.act-tip-title{display:block;font-size:13.5px;font-weight:900;color:var(--text)}
.act-tip-text{display:block;font-size:12px;color:var(--muted);line-height:1.5;margin-top:2px}
.act-tip-warn{color:color-mix(in srgb,#d97706 80%,var(--text));font-weight:700}
.act-tip-next{flex:0 0 auto;background:var(--panel-2);border:1px solid var(--line);color:var(--muted);width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:14px}

/* Histórico / lista */
.act-list-inner{display:flex;flex-direction:column;gap:9px}
.act-item{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel-2)}
.act-item-ic{font-size:22px;width:40px;height:40px;flex:0 0 40px;border-radius:var(--r-sm);display:grid;place-items:center;background:var(--panel)}
.act-item-body{flex:1;min-width:0}
.act-item-top{display:flex;align-items:center;gap:7px}
.act-item-top strong{font-size:13.5px;font-weight:850;color:var(--text)}
.act-gps-badge{font-size:12px}
.act-item-when{display:block;font-size:11px;color:var(--muted);margin:1px 0 4px}
.act-item-bits{display:flex;flex-wrap:wrap;gap:5px}
.act-item-bits span{font-size:10.5px;font-weight:700;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:var(--r-xs);padding:2px 7px}
.act-del{flex:0 0 auto;background:none;border:none;color:var(--muted);cursor:pointer;padding:6px;border-radius:var(--r-xs)}
.act-del:hover{color:#dc2626;background:color-mix(in srgb,#dc2626 12%,transparent)}
/* alpha.477 — botão "Ver rota" + modal de mapa (Leaflet/OSM) */
.act-route{flex:0 0 auto;background:none;border:none;color:var(--muted);cursor:pointer;padding:6px;border-radius:var(--r-xs)}
.act-route:hover{color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.act-route-modal{position:fixed;inset:0;z-index:3000;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.55);padding:18px}
.act-route-modal.is-open{display:flex}
.act-route-card{position:relative;width:min(760px,100%);max-height:88vh;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.4);display:flex;flex-direction:column}
.act-route-close{position:absolute;top:8px;right:10px;z-index:1200;width:32px;height:32px;border:0;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;font-size:20px;line-height:1;cursor:pointer}
.act-route-map{width:100%;height:min(60vh,460px);background:var(--panel-2)}
.act-route-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.act-empty{text-align:center;padding:26px 16px;color:var(--muted)}
.act-empty span{font-size:34px;display:block;margin-bottom:6px}
.act-empty strong{display:block;font-size:14px;color:var(--text);font-weight:850}
.act-empty small{font-size:12px}
/* alpha.1010 — .act-gps-stats/.act-totals viraram auto-fit; @media 560 removido */

/* alpha.372 — Menu "Tracking GPS" (modal de inicio de rastreio, estilo Tirzia) */
.actgps-modal-backdrop{position:fixed;inset:0;z-index:9998;background:rgba(var(--shadow-rgb),.5);display:flex;align-items:flex-start;justify-content:center;padding:26px 14px;overflow-y:auto;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.actgps-modal-backdrop[hidden]{display:none}
.actgps-modal{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);width:100%;max-width:440px;padding:18px;box-shadow:0 30px 70px rgba(0,0,0,.35);animation:actgpsIn .26s cubic-bezier(.2,.9,.3,1.05)}
@keyframes actgpsIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.actgps-modal-head{display:flex;align-items:center;gap:11px;margin-bottom:15px}
.actgps-modal-close{flex:0 0 auto;width:34px;height:34px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel-2);color:var(--text);cursor:pointer;display:grid;place-items:center}
.actgps-modal-close:hover{background:var(--line)}
.actgps-modal-ic{flex:0 0 auto;width:40px;height:40px;border-radius:var(--r-sm);display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 16%,var(--panel-2));color:var(--accent)}
.actgps-modal-ttl strong{display:block;font-size:17px;font-weight:900;color:var(--text)}
.actgps-modal-ttl small{display:block;font-size:12px;color:var(--muted)}
.actgps-tip{display:flex;gap:10px;align-items:flex-start;background:color-mix(in srgb,#0891b2 9%,var(--panel-2));border:1px solid color-mix(in srgb,#0891b2 22%,var(--line));border-radius:var(--r-sm);padding:12px 13px;margin-bottom:11px}
.actgps-tip-ic{font-size:18px;flex:0 0 auto;line-height:1.3}
.actgps-tip strong{display:block;font-size:13px;font-weight:850;color:var(--text);margin-bottom:2px}
.actgps-tip p{margin:0;font-size:12px;color:var(--muted);line-height:1.5}
.actgps-warn{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:color-mix(in srgb,#b45309 70%,var(--text));background:color-mix(in srgb,#f59e0b 12%,var(--panel-2));border:1px solid color-mix(in srgb,#f59e0b 28%,var(--line));border-radius:var(--r-sm);padding:10px 12px;margin-bottom:15px;line-height:1.45}
.actgps-warn span:first-child{flex:0 0 auto}
.actgps-types-label{font-size:13px;font-weight:850;color:var(--text);margin-bottom:9px}
.actgps-types{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:9px;margin-bottom:13px}/* alpha.1010 — auto-fit (reflui 2-3 col; removido o @media 420) */
.actgps-type{display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px 6px;border-radius:var(--r-sm);border:1.5px solid var(--line);background:var(--panel-2);color:var(--text);font-size:12.5px;font-weight:800;cursor:pointer;transition:.13s ease}
.actgps-type:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.actgps-type.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--panel));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}
.actgps-type-e{font-size:24px;line-height:1}
.actgps-type-other{border-style:dashed}
.actgps-other-input{width:100%;margin-bottom:13px;padding:11px 13px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel-2);color:var(--text);font-size:14px}
.actgps-start-big{width:100%;font-size:15px;padding:13px;border-radius:var(--r-sm)}
/* alpha.1010 — .actgps-types auto-fit; @media 420 removido */

/* ════════════════════════════════════════════════════════════════
   alpha.373 — Botão NATIVO de upload de arquivo seguindo o tema.
   Antes, todo <input type=file> mostrava o "Escolher arquivo" cru do
   navegador (cinza, fora do tema). Esta regra global estiliza o
   pseudo-botão em TODOS os file inputs do site de uma só vez.
   Seletores separados de propósito: se o navegador não reconhecer um
   pseudo-elemento, não invalida a regra do outro.
   ════════════════════════════════════════════════════════════════ */
input[type=file]{color:var(--muted);font-size:13px;max-width:100%}
input[type=file]::file-selector-button{
  font:inherit;font-size:13px;font-weight:800;cursor:pointer;
  margin-right:12px;padding:8px 15px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:var(--panel-2);color:var(--text);
  transition:background .14s ease,border-color .14s ease,color .14s ease;
}
input[type=file]::file-selector-button:hover{
  background:color-mix(in srgb,var(--accent) 12%,var(--panel-2));
  border-color:color-mix(in srgb,var(--accent) 45%,var(--line));
  color:var(--accent);
}
input[type=file]::-webkit-file-upload-button{
  font:inherit;font-size:13px;font-weight:800;cursor:pointer;
  margin-right:12px;padding:8px 15px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:var(--panel-2);color:var(--text);
}
input[type=file]::-webkit-file-upload-button:hover{
  background:color-mix(in srgb,var(--accent) 12%,var(--panel-2));
  border-color:color-mix(in srgb,var(--accent) 45%,var(--line));color:var(--accent);
}

/* ═══════════════ alpha.515 — Loja: redesign nível marketplace (cards/grid/hero/filtros) ═══════════════ */
/* Grade responsiva tipo marketplace */
.store-product-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
/* Card premium com hover */
.store-product-card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;will-change:transform}
.store-product-card:hover{transform:translateY(-5px);box-shadow:0 28px 64px rgba(var(--shadow-rgb),.18);border-color:color-mix(in srgb,var(--accent) 42%,var(--line))}
.store-product-media{aspect-ratio:1/1;position:relative}
.store-product-media img{transition:transform .4s ease}
.store-product-card:hover .store-product-media img{transform:scale(1.07)}
.store-card-badge{position:absolute;top:10px;left:10px;z-index:2;background:color-mix(in srgb,var(--panel) 88%,transparent);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid var(--line);color:var(--text);font-size:9.5px;font-weight:900;text-transform:uppercase;letter-spacing:.07em;padding:4px 9px;border-radius:var(--r-pill)}
.store-product-body{gap:9px;padding:15px 16px}
.store-product-body small{display:inline-block;width:fit-content;background:color-mix(in srgb,var(--accent) 11%,transparent);color:color-mix(in srgb,var(--accent) 82%,var(--text));padding:3px 9px;border-radius:var(--r-pill);letter-spacing:.05em}
.store-product-body h3{font-size:16.5px;font-weight:850;line-height:1.22}
.store-product-body p{min-height:38px;font-size:13px}
.store-product-foot{border-top:1px solid var(--line);padding-top:12px;margin-top:6px}
.store-price-from{display:block;font-size:9.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;line-height:1}
.store-product-foot strong{font-size:20px;font-weight:950;color:var(--text)}
.store-card-cta{border-radius:var(--r-sm);font-weight:850;gap:5px;white-space:nowrap}

/* Barra de filtros: sticky + cara de card */
.store-filterbar{position:sticky;top:8px;z-index:20;display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:10px;border:1px solid var(--line);border-radius:var(--r-sm);background:color-mix(in srgb,var(--panel) 94%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 8px 24px rgba(var(--shadow-rgb),.07)}
.store-search{flex:1;min-width:200px;display:flex;align-items:center;gap:8px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel)}
.store-search svg{color:var(--muted);flex:0 0 auto}
.store-search input{border:0;background:transparent;flex:1;height:42px;font-size:14px;color:var(--text);outline:none}
.store-sort{height:42px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:0 12px;font-weight:700;color:var(--text)}

/* Chips de categoria */
.store-cats{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 2px}
.store-cat{padding:7px 14px;border:1px solid var(--line);border-radius:var(--r-pill);font-size:13px;font-weight:800;color:var(--muted);text-decoration:none;background:var(--panel);transition:.13s ease}
.store-cat:hover{border-color:var(--accent);color:var(--text);transform:translateY(-1px)}
.store-cat.on{background:var(--accent);border-color:var(--accent);color:var(--accent-text,#1a1207)}

/* Paginação */
.store-pagination{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:10px}
.store-page{padding:8px 16px;border:1px solid var(--line);border-radius:var(--r-sm);font-weight:800;text-decoration:none;color:var(--text);background:var(--panel);transition:.13s}
.store-page:hover{border-color:var(--accent)}
.store-page.is-off{opacity:.4;pointer-events:none}
.store-page-info{color:var(--muted);font-weight:800;font-size:13px}

/* Seções + hero */
.store-catalog-section{margin-top:30px}
.store-section-head h2{font-size:clamp(24px,4vw,32px);font-weight:950;letter-spacing:-.01em}
.store-kicker{gap:6px;align-items:center;background:color-mix(in srgb,var(--accent) 11%,transparent);padding:6px 13px;border-radius:var(--r-pill)}
.store-hero h1{font-weight:950;letter-spacing:-.02em}

/* Passos com cara de card */
.store-steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.store-step{display:flex;gap:12px;border:1px solid var(--line);border-radius:var(--r-sm);padding:16px;background:var(--panel);transition:.16s ease}
.store-step:hover{border-color:color-mix(in srgb,var(--accent) 35%,var(--line));transform:translateY(-3px);box-shadow:0 14px 34px rgba(var(--shadow-rgb),.08)}
.store-step-num{color:var(--accent);font-weight:950;font-size:22px;line-height:1}
.store-step-body h3{margin:0 0 4px;font-size:15px;font-weight:850}
.store-step-body p{margin:0;font-size:13px;color:var(--muted);line-height:1.45}

/* Empty state centrado */
.store-empty{display:grid;justify-items:center;gap:12px;padding:48px 16px;text-align:center;color:var(--muted)}

/* Detalhe do produto: respiro + buy-box destacada */
.store-product-detail{gap:32px}
.store-buy-box{border:1px solid var(--line);border-radius:var(--r-md);padding:16px;background:color-mix(in srgb,var(--panel) 92%,transparent);display:grid;gap:12px;margin-top:14px;box-shadow:0 12px 30px rgba(var(--shadow-rgb),.06)}

@media (max-width:640px){
  .store-product-grid{grid-template-columns:repeat(auto-fill,minmax(156px,1fr));gap:12px}
  .store-product-detail{grid-template-columns:1fr}
  .store-product-body{padding:12px}
  .store-product-foot strong{font-size:17px}
  .store-card-cta{padding:6px 10px}
}

/* ═══════════════ alpha.516 — Loja: página de produto + carrinho + checkout (aprofundamento) ═══════════════ */
/* PRODUTO — galeria (alpha.588: tira vertical à esquerda + main à direita, hover troca, autoplay) */
.store-gallery{display:flex;flex-direction:column;gap:10px}
.store-gallery-stage{display:flex;gap:12px;align-items:flex-start}
.store-gallery-thumbs{display:flex;flex-direction:column;gap:8px;flex:0 0 68px;max-height:540px;overflow-y:auto;scrollbar-width:thin}
.store-gallery-main{flex:1;min-width:0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:color-mix(in srgb,var(--accent) 8%,var(--panel-2));aspect-ratio:1/1}
.store-gallery-main img{width:100%;height:100%;object-fit:cover;transition:opacity .25s ease}
.store-gallery-thumb{width:68px;height:68px;border:2px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:var(--panel);cursor:pointer;padding:0;flex:0 0 auto;transition:.13s ease}
.store-gallery-thumb:hover{border-color:var(--accent);transform:translateY(-1px)}
.store-gallery-thumb.is-active{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 32%,transparent)}
.store-gallery-thumb img{width:100%;height:100%;object-fit:cover}
.store-gallery-thumb.is-video{display:flex;align-items:center;justify-content:center;position:relative}
@media (max-width:640px){
  .store-gallery-stage{flex-direction:column}
  .store-gallery-thumbs{flex-direction:row;flex:0 0 auto;max-height:none;overflow-x:auto;overflow-y:hidden;width:100%;order:2}
  .store-gallery-main{order:1;width:100%}
}
/* PRODUTO — corpo + buy-box sticky no desktop */
.store-product-detail-body h1{font-size:clamp(26px,3.5vw,40px);font-weight:950;letter-spacing:-.01em;margin:6px 0}
.store-detail-meta{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.store-detail-meta span{display:inline-flex;flex-direction:column;gap:1px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);font-size:11px;font-weight:700;color:var(--muted)}
.store-detail-meta span strong{font-size:15px;color:var(--text);font-weight:900}
@media (min-width:861px){ .store-buy-box{position:sticky;top:16px} }
.store-buy-box button[type="submit"]{width:100%;padding:15px;font-size:15px;font-weight:900;border-radius:var(--r-sm)}
.store-opt{display:grid;gap:6px;font-weight:800;font-size:13px}
.store-opt > select,.store-opt > input,.store-opt > textarea{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:10px 12px;font-size:14px;color:var(--text)}
.store-therm{border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 12px}
.store-therm legend{font-weight:900;font-size:13px;padding:0 4px}
.store-radio{display:flex;align-items:center;gap:8px;font-weight:700;padding:4px 0}

/* CARRINHO */
.store-cart-section .store-cart-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,300px);gap:18px;align-items:start}
.store-cart-list{display:grid;gap:10px}
.store-cart-row{display:grid;grid-template-columns:72px minmax(0,1fr) auto auto;gap:14px;align-items:center;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:10px;box-shadow:none}
.store-cart-thumb{width:72px;height:72px;border-radius:var(--r-sm);overflow:hidden}
.store-cart-row > div small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.store-cart-row label{font-size:11px;font-weight:800;color:var(--muted);display:grid;gap:3px;justify-items:center}
.store-cart-row label input{width:64px;border:1px solid var(--line);border-radius:var(--r-xs);padding:6px;text-align:center;background:var(--panel-2)}
.store-summary{position:sticky;top:16px;display:grid;gap:10px;border:1px solid var(--line);border-radius:var(--r-md);background:color-mix(in srgb,var(--panel) 92%,transparent);padding:16px;box-shadow:0 14px 34px rgba(var(--shadow-rgb),.08)}
.store-summary > span{display:flex;justify-content:space-between;font-weight:800;color:var(--muted)}
.store-summary > span strong{font-size:24px;font-weight:950;color:var(--text)}
.store-summary .btn{width:100%;justify-content:center}

/* CHECKOUT */
.store-checkout-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,340px);gap:22px;align-items:start}
.store-checkout-form{padding:20px;display:grid;gap:12px}
.store-checkout-form label{display:grid;gap:5px;font-weight:800;font-size:13px}
.store-checkout-form label.full{grid-column:1/-1}
.store-checkout-form input,.store-checkout-form textarea{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding:11px 12px;font-size:14px;color:var(--text)}
.store-order-summary{position:sticky;top:16px;padding:18px;display:grid;gap:6px}
.store-order-summary h2{margin:0 0 6px;font-size:18px}
.store-order-summary > div{display:flex;justify-content:space-between;gap:10px;font-weight:700;padding:5px 0;border-bottom:1px dashed var(--line)}
.store-checkout-success{max-width:560px;margin:30px auto;text-align:center;padding:32px}
.store-success-icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:color-mix(in srgb,var(--green) 18%,transparent);color:var(--green);font-size:32px;font-weight:900;margin-bottom:10px}

@media (max-width:860px){
  .store-cart-section .store-cart-form{grid-template-columns:1fr}
  .store-checkout-grid{grid-template-columns:1fr}
  .store-cart-row{display:flex;flex-wrap:wrap}
  .store-cart-row > div{flex:1 1 50%}
}

/* alpha.791 — checkout: botão CTA grande + frete seção full-width + cupom accordion */
.store-checkout-form .btn.primary{min-height:54px!important;font-size:16px!important;font-weight:900!important;border-radius:var(--r-md)!important;letter-spacing:-.01em}
/* frete no checkout: seção card com destaque accent (não usa classes de toggle do produto) */
.co-freight{border:1.5px solid color-mix(in srgb,var(--accent) 28%,var(--line));border-radius:var(--r-sm);background:color-mix(in srgb,var(--accent) 4%,var(--panel));padding:14px 16px;grid-column:1/-1}
.co-freight-head{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.07em;color:color-mix(in srgb,var(--accent) 80%,var(--muted));margin-bottom:10px}
/* cupom de desconto: accordion (toggle + caixa revelada) */
.co-coupon-toggle{display:flex;align-items:center;gap:8px;width:100%;padding:10px 14px;background:none;border:1px dashed var(--line);border-radius:var(--r-sm);font:inherit;font-size:13px;font-weight:750;color:var(--muted);cursor:pointer;text-align:left;transition:border-color .14s,color .14s;-webkit-appearance:none;appearance:none}
.co-coupon-toggle:hover,.co-coupon-toggle.is-open{border-style:solid;border-color:color-mix(in srgb,var(--accent) 55%,var(--line));color:var(--text)}
.co-coupon-toggle .co-coup-caret{margin-left:auto;font-size:11px;transition:transform .18s}
.co-coupon-toggle.is-open .co-coup-caret{transform:rotate(180deg)}
.co-coupon-toggle.is-applied{border-style:solid;border-color:var(--green)!important;color:var(--green)!important;background:color-mix(in srgb,var(--green) 6%,var(--panel))}
.co-coupon-box{margin-top:8px;display:grid;gap:6px}
.co-coupon-box[hidden]{display:none}

/* alpha.524/526 — build ao lado da logo (só admin); agrupado p/ não quebrar o grid da topbar */
.pub-brand-col{display:flex;align-items:center;gap:8px;min-width:0}
.pub-build-badge{display:inline-flex;align-items:center;flex:0 0 auto;font-size:10px;font-weight:800;letter-spacing:.03em;line-height:1;color:color-mix(in srgb,var(--accent) 85%,var(--text));background:color-mix(in srgb,var(--accent) 13%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));padding:3px 8px;border-radius:var(--r-pill);white-space:nowrap}
@media (max-width:600px){ .pub-build-badge{display:none} }
/* alpha.540 — seletor de idioma: dropdown customizado (não o <select> nativo) */
.pub-lang{position:relative;display:inline-flex;align-items:center;flex:0 0 auto}
.pub-lang-globe{font-size:13px;line-height:1;opacity:.85}
.pub-lang-btn{display:inline-flex;align-items:center;gap:6px;background:var(--panel,#fff);color:var(--text,#1a1a1a);border:1px solid var(--line,#dcdce0);border-radius:var(--r-xs);padding:6px 9px;font-size:12.5px;font-weight:600;cursor:pointer;line-height:1;transition:border-color .14s,background .14s}
.pub-lang-btn:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--line,#dcdce0))}
.pub-lang-btn:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pub-lang.open .pub-lang-btn{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel,#fff))}
.pub-lang-cur{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pub-lang-caret{transition:transform .16s;opacity:.7;flex:0 0 auto}
.pub-lang.open .pub-lang-caret{transform:rotate(180deg)}
.pub-lang-panel{position:absolute;top:calc(100% + 6px);right:0;min-width:162px;background:var(--panel,#fff);border:1px solid var(--line,#dcdce0);border-radius:var(--r-sm);box-shadow:0 12px 30px rgba(0,0,0,.16);padding:6px;display:none;z-index:1200}
.pub-lang.open .pub-lang-panel{display:block;animation:pubLangIn .14s ease}
@keyframes pubLangIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.pub-lang-opt{display:block;padding:8px 11px;border-radius:var(--r-xs);font-size:13.5px;font-weight:600;color:var(--text,#1a1a1a);text-decoration:none;white-space:nowrap;transition:background .12s}
.pub-lang-opt:hover{background:color-mix(in srgb,var(--accent) 12%,transparent)}
.pub-lang-opt.on{background:color-mix(in srgb,var(--accent) 16%,transparent);color:color-mix(in srgb,var(--accent) 80%,var(--text))}
:lang(zh) .pub-lang-btn,html[lang^="zh"] .pub-lang-btn{font-size:13px}
@media (max-width:600px){ .pub-lang-globe{display:none} .pub-lang-cur{max-width:74px} }

/* alpha.610 - Pepzen: categorias dentro da aba Saude > Peptideos */
.pep-calc-browser{display:grid;gap:14px}
/* 0.2.0-alpha.2 — menu de categorias COLORIDO + "burro-friendly" (fonte AUTORITATIVA; espelha o inline da aba). Cada chip carrega a COR da categoria sempre; ativo = preenchido; emoji por função; flex-wrap sempre (mobile mostra TODAS, sem rolagem lateral). */
.pep-calc-cats{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:2px 0 6px}
.pep-calc-chip{display:inline-flex;align-items:center;gap:7px;min-height:46px;padding:9px 15px;border:1.5px solid color-mix(in srgb,var(--pep-acc,var(--accent)) 42%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--pep-acc,var(--accent)) 12%,var(--panel));color:var(--text);font-size:14px;font-weight:800;line-height:1;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,background .14s ease,border-color .14s ease}
.pep-calc-chip:hover{transform:translateY(-2px);border-color:var(--pep-acc,var(--accent));box-shadow:0 6px 16px color-mix(in srgb,var(--pep-acc,var(--accent)) 24%,transparent)}
.pep-calc-chip.active{color:#fff;background:var(--pep-acc,var(--accent));border-color:var(--pep-acc,var(--accent));box-shadow:0 7px 18px color-mix(in srgb,var(--pep-acc,var(--accent)) 42%,transparent);text-shadow:0 1px 2px rgba(0,0,0,.22)}
.pep-chip-emoji{font-size:17px;line-height:1;flex:0 0 auto}
.pep-chip-n{font-size:11px;font-weight:900;padding:2px 7px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--pep-acc,var(--accent)) 22%,transparent);color:var(--pep-acc,var(--accent))}
.pep-calc-chip.active .pep-chip-n{background:rgba(255,255,255,.26);color:#fff}
.pep-chip-all{--pep-acc:var(--accent)}
.pep-calc-card[hidden]{display:none!important}
.pep-calc-empty{border:1px dashed var(--line);border-radius:var(--r-sm);padding:16px;background:color-mix(in srgb,var(--panel-2) 72%,transparent);color:var(--muted);font-size:13px;font-weight:800;text-align:center}
@media (max-width:620px){
  .pep-calc-cats{flex-wrap:wrap;gap:8px}
  .pep-calc-chip{min-height:42px;padding:8px 12px;font-size:13px;gap:6px}
  .pep-chip-emoji{font-size:15px}
}

/* alpha.640 — Saúde: alinha o cabeçalho "título + ação" ao canônico .track-card-head (overrides escopados a #tabHome) + densidade escopada (NÃO afeta ERP/loja, que usam os mesmos seletores fora de #tabHome/#tabTrack/#tabExams) */
#tabHome .home-card-head, #tabHome .bwk-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
#tabHome .home-card-head>h3{font-size:16px;font-weight:900}
#tabHome .calc-panel, #tabTrack .calc-panel, #tabExams .calc-panel{padding:clamp(14px,1vw,16px)}
#tabTrack .track-grid{gap:10px}
#tabTrack .track-card{gap:8px}
#tabHome .home-grid{gap:10px}
#tabHome .home-card-head{margin-bottom:6px}
#tabHome .home-tools{margin-bottom:10px}
#tabHome .home-tools-title{margin:0 0 6px}
#tabHome .home-hero .bwk-head{margin-bottom:8px}
#tabExams .exam-module{gap:12px}
#tabTrack .cal-rem-block{margin-top:10px;padding-top:10px}

/* alpha.649 — lembretes do protocolo p/ a agenda (.ics) */
.pw-ics-row{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.pw-ics-field{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:800;color:var(--muted)}
.pw-ics-input{padding:8px 11px;border:1px solid var(--line);border-radius:var(--r-sm,8px);background:var(--panel,#fff);color:var(--text);font-size:13px;font-weight:700}
.pw-ics-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
.pw-ics-hint{display:block;margin-top:7px;font-size:11.5px;color:var(--muted);max-width:62ch}

/* alpha.649 — dropdown TEMÁTICO (enhance de <select data-zk-select>): o popup segue o tema (o <option> nativo não é estilizável) */
.zk-sel{position:relative;display:block;width:100%}
.zk-sel-native{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;opacity:0;pointer-events:none}
.zk-sel-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:10px 12px;border:1px solid var(--line,#e3e3e8);border-radius:var(--r-sm,8px);background:var(--panel,var(--card,#fff));color:var(--text,#1a1a1a);font:inherit;font-size:14px;font-weight:600;text-align:left;cursor:pointer;transition:border-color .14s ease,box-shadow .14s ease}
.zk-sel-btn:hover{border-color:color-mix(in srgb,var(--accent,#6b46c1) 45%,var(--line,#e3e3e8))}
.zk-sel-btn:focus-visible,.zk-sel.open .zk-sel-btn{outline:none;border-color:var(--accent,#6b46c1);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#6b46c1) 18%,transparent)}
.zk-sel-btn:disabled{opacity:.55;cursor:not-allowed}
.zk-sel-val{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zk-sel-chev{display:inline-flex;flex:0 0 auto;color:var(--muted,#777);transition:transform .16s ease}
.zk-sel.open .zk-sel-chev{transform:rotate(180deg);color:var(--accent,#6b46c1)}
.zk-sel-list{position:absolute;z-index:60;left:0;right:0;top:calc(100% + 5px);max-height:264px;overflow:auto;padding:5px;border:1px solid color-mix(in srgb,var(--accent,#6b46c1) 22%,var(--line,#e3e3e8));border-radius:var(--r-md,10px);background:var(--panel,var(--card,#fff));box-shadow:0 16px 40px rgba(var(--shadow-rgb),.18)}
.zk-sel-opt{display:block;padding:9px 11px;border-radius:var(--r-xs,6px);font-size:13.5px;font-weight:600;color:var(--text,#1a1a1a);cursor:pointer;transition:background .1s ease,color .1s ease}
.zk-sel-opt:hover{background:color-mix(in srgb,var(--accent,#6b46c1) 12%,transparent)}
.zk-sel-opt.on{background:color-mix(in srgb,var(--accent,#6b46c1) 15%,transparent);color:color-mix(in srgb,var(--accent,#6b46c1) 78%,var(--text,#1a1a1a))}
.zk-sel-opt.on::after{content:'✓';float:right;font-weight:900;color:var(--accent,#6b46c1)}
.zk-sel-opt.disabled{opacity:.45;cursor:not-allowed}

/* ════════════════════════════════════════════════════════════════════
   alpha.656 — PASS DE DESIGN (auditoria multi-agente). Aditivo/seguro:
   a11y de foco, sinal de estoque, alvos de toque mobile e motion reduzido.
   ════════════════════════════════════════════════════════════════════ */
/* #7 — anel de foco de teclado p/ botões/cards/links/summary que não tinham
   (inputs/nav/select já têm o seu). :where() = especificidade 0, não sobrepõe os existentes. */
:where(.btn,.icon-btn,button,a[href],summary,
  .v2-card,.v2-cat,.v2-add,.v3-btn,.v2-coll,.v2-thumb,.v2-page,
  .pz-chip,.pz-card,.pep-calc-card,.pep-calc-chip,
  .calc-chip,.calc-preset-btn,.calc-tab-btn,.dash-card,.topnav a,.nav-trigger,
  [role="tab"]):focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
  border-radius:inherit;
}
/* #4 — linha de estoque baixo: a classe .warn-row já era aplicada no markup, faltava o CSS */
.warn-row td{background:color-mix(in srgb,var(--orange,#f97316) 9%,transparent)}
.warn-row td:first-child{box-shadow:inset 3px 0 0 var(--orange,#f97316)}
/* #13 — alvos de toque ≥44px no mobile p/ chips/paginação/voltar pequenos */
@media (max-width:760px){
  .v2-cat,.v2-page,.pz-chip,.pep-calc-chip{min-height:44px;display:inline-flex;align-items:center}
  .pep-wiki-back,.pz-back{min-height:44px;display:inline-flex;align-items:center}
}
/* #25 — motion reduzido SISTÊMICO (respeita a preferência do usuário em todo o app) */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
}

/* ════ alpha.664 — Protocolo: produto personalizado, guia da Fase 2 e foto do medicamento ════ */
/* Produto personalizado (Nome/mg/mL/Dose) */
.pw-custom-form{margin-top:12px;padding:14px;border:1px solid var(--line);border-radius:var(--r-md,16px);background:var(--panel)}
.pw-custom-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:10px}
.pw-custom-field{display:flex;flex-direction:column;gap:5px;font-size:12.5px;font-weight:700;color:var(--muted)}
.pw-custom-field.pw-custom-name{grid-column:1/-1}
.pw-custom-field span{letter-spacing:.2px}
.pw-custom-field input{font-size:14px;font-weight:600;color:var(--text);padding:9px 11px;border:1.5px solid var(--line-strong);border-radius:var(--r-sm,12px);background:var(--bg);transition:border-color .15s ease}
.pw-custom-field input:focus{outline:none;border-color:var(--accent)}
.pw-custom-apply{margin-top:12px}
.pw-custom-hint{display:block;margin-top:8px;font-size:12.5px;font-weight:700;color:var(--red,#dc2626)}
.cpb-chip-custom{border-style:dashed!important}

/* Guia visual: transição p/ a Fase 2 (flecha vermelha) */
.pw-phase-guide{display:flex;align-items:center;gap:12px;margin:14px 0 8px;padding:12px 14px;border:1.5px solid var(--red,#dc2626);border-radius:var(--r-sm,12px);background:rgba(220,38,38,.06)}
.pw-guide-arrow{color:var(--red,#dc2626);flex:0 0 auto;animation:pwGuideBounce 1.1s ease-in-out infinite}
.pw-guide-body{flex:1;min-width:0}
.pw-guide-q{margin:0;font-size:14px;font-weight:850;color:var(--red,#dc2626)}
.pw-guide-hint{margin:2px 0 8px;font-size:12.5px;color:var(--muted)}
.pw-guide-actions{display:flex;gap:8px;flex-wrap:wrap}
.pw-guide-add{border:1.5px solid var(--red,#dc2626);background:transparent;color:var(--red,#dc2626);font-weight:850;font-size:12.5px;padding:7px 14px;border-radius:var(--r-sm,12px);cursor:pointer;transition:.15s ease}
.pw-guide-add:hover{background:var(--red,#dc2626);color:#fff}
.pw-guide-done{border:1.5px solid var(--line-strong);background:transparent;color:var(--muted);font-weight:700;font-size:12.5px;padding:7px 14px;border-radius:var(--r-sm,12px);cursor:pointer;transition:.15s ease}
.pw-guide-done:hover{border-color:var(--accent);color:var(--accent)}
.cpb-add-phase-btn.pw-add-target{border-color:var(--red,#dc2626);color:var(--red,#dc2626);background:rgba(220,38,38,.04);animation:pwTargetPulse 1.6s ease-in-out infinite}
.cpb-add-phase-btn.pw-add-target:hover{border-color:var(--red,#dc2626);color:#fff;background:var(--red,#dc2626)}
@keyframes pwGuideBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@keyframes pwTargetPulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,.35)}50%{box-shadow:0 0 0 5px rgba(220,38,38,0)}}

/* Foto do medicamento (opcional) */
.pw-photo-wrap{padding:14px;border:1px solid var(--line);border-radius:var(--r-md,16px);background:var(--panel)}
.pw-photo-head{font-size:13px;font-weight:800;color:var(--text);margin-bottom:10px}
.pw-photo-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.pw-photo-pick{display:inline-flex;align-items:center;gap:8px;cursor:pointer;padding:10px 16px;border:1.5px dashed var(--line-strong);border-radius:var(--r-sm,12px);color:var(--accent);font-weight:750;font-size:13px;background:rgba(var(--accent-rgb),.05);transition:.15s ease}
.pw-photo-pick:hover{border-color:var(--accent);background:rgba(var(--accent-rgb),.1)}
.pw-photo-preview{position:relative;width:96px;height:96px;border-radius:var(--r-sm,12px);overflow:hidden;border:1px solid var(--line-strong);background:var(--bg)}
.pw-photo-preview img{width:100%;height:100%;object-fit:cover;display:block}
.pw-photo-remove{position:absolute;top:4px;right:4px;width:24px;height:24px;border:none;border-radius:50%;background:rgba(0,0,0,.62);color:#fff;font-size:13px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.pw-photo-remove:hover{background:var(--red,#dc2626)}
.pw-photo-hint{display:block;margin-top:9px;font-size:12px;color:var(--muted)}

@media (max-width:560px){
  .pw-phase-guide{flex-direction:column;text-align:center;gap:8px}
  .pw-phase-guide .pw-guide-arrow{order:3}
  .pw-guide-actions{justify-content:center}
  .pw-guide-add,.pw-guide-done{flex:1 1 100%}
}
@media (prefers-reduced-motion:reduce){
  .pw-guide-arrow{animation:none}
  .cpb-add-phase-btn.pw-add-target{animation:none;box-shadow:0 0 0 2px rgba(220,38,38,.45)}
}

/* ════ alpha.670 — sugestão de IA no PDF + date picker temático ════ */
.pw-aiask-ov{position:fixed;inset:0;z-index:1000;background:rgba(var(--shadow-rgb,15,23,42),.5);display:flex;align-items:center;justify-content:center;padding:18px}
.pw-aiask{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg,18px);max-width:380px;width:100%;padding:22px 22px 18px;text-align:center;box-shadow:0 24px 60px rgba(var(--shadow-rgb,15,23,42),.3)}
.pw-aiask-ic{width:46px;height:46px;margin:0 auto 12px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(var(--accent-rgb),.12);color:var(--accent)}
.pw-aiask-q{margin:0 0 6px;font-size:16px;font-weight:850;color:var(--text)}
.pw-aiask-sub{margin:0 0 16px;font-size:13px;line-height:1.5;color:var(--muted)}
.pw-aiask-row{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}
.pw-aiask-row .btn{flex:1 1 auto;min-width:130px;justify-content:center}
/* native picker segue o tema (hora no desktop + tudo no mobile) */
input[type="date"],input[type="time"]{color-scheme:light}
html[data-theme="dark"] input[type="date"],html[data-theme="dark"] input[type="time"]{color-scheme:dark}
/* date picker custom (desktop) */
.pw-ics-field{position:relative}
.zk-dp-input{cursor:pointer}
.zk-dp{position:absolute;z-index:200;margin-top:6px;width:266px;background:var(--panel);border:1px solid var(--line-strong);border-radius:var(--r-md,14px);box-shadow:0 18px 44px rgba(var(--shadow-rgb,15,23,42),.26);padding:12px}
.zk-dp-hd{display:flex;align-items:center;gap:6px;margin-bottom:10px}
.zk-dp-nav{flex:0 0 auto;width:30px;height:32px;border:1px solid var(--line);background:var(--bg);border-radius:var(--r-sm,10px);color:var(--text);font-size:18px;line-height:1;cursor:pointer}
.zk-dp-nav:hover{border-color:var(--accent);color:var(--accent)}
.zk-dp-mo{flex:1 1 auto;min-width:0}
.zk-dp-yr{flex:0 0 auto;width:74px}
.zk-dp-mo,.zk-dp-yr{height:32px;border:1px solid var(--line-strong);background:var(--bg);color:var(--text);border-radius:var(--r-sm,10px);font-size:13px;font-weight:700;padding:0 8px;cursor:pointer}
.zk-dp-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}
.zk-dp-dow span{text-align:center;font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase}
.zk-dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.zk-dp-grid>span{height:32px}
.zk-dp-d{height:32px;border:none;background:transparent;border-radius:var(--r-sm,9px);color:var(--text);font-size:13px;font-weight:600;cursor:pointer;transition:.1s}
.zk-dp-d:hover{background:rgba(var(--accent-rgb),.13)}
.zk-dp-d.today{box-shadow:inset 0 0 0 1.5px var(--accent);color:var(--accent)}
.zk-dp-d.sel{background:var(--accent);color:var(--accent-text,#fff);font-weight:800}
.zk-dp-ft{display:flex;justify-content:space-between;margin-top:10px;border-top:1px solid var(--line);padding-top:9px}
.zk-dp-ft button{border:none;background:transparent;color:var(--accent);font-size:12.5px;font-weight:800;cursor:pointer;padding:4px 6px;border-radius:var(--r-xs,6px)}
.zk-dp-ft button:hover{background:rgba(var(--accent-rgb),.1)}

/* ════ alpha.671 — medicamento + preço por fase ════ */
.cpb-phase-med{width:100%;height:38px;border:1px solid var(--line-strong);background:var(--bg);color:var(--text);border-radius:var(--r-sm,10px);font-size:13.5px;font-weight:700;padding:0 10px;cursor:pointer}
.cpb-phase-med:focus{outline:none;border-color:var(--accent)}
.cpb-phase-price .pw-cost-price{max-width:200px}
.cpb-phase-price-inh{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);padding:6px 0}
.cpb-phase-price-inh strong{color:var(--text)}
.cpb-phase-price-inh svg{color:var(--accent);flex:0 0 auto}
.pw-cost-cardsub{display:block;color:var(--muted);font-size:12px;margin:-2px 0 10px;line-height:1.45}
.pw-cost-bd{display:grid;gap:7px;margin-bottom:10px}
.pw-cost-bd-row{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 10px;font-size:13px;padding-bottom:7px;border-bottom:1px solid var(--line)}
.pw-cost-bd-med{font-weight:800;color:var(--text);flex:1 1 auto}
.pw-cost-bd-q{color:var(--muted);font-size:12px;flex:1 1 100%;order:3}
.pw-cost-bd-sub{font-weight:800;color:var(--text);flex:0 0 auto;white-space:nowrap;text-align:right;display:flex;flex-direction:column;align-items:flex-end;line-height:1.25}
/* 0.2.0-alpha.11 — custo por dose de cada medicamento (sob o subtotal) */
.pw-cost-bd-cpd{font-weight:800;font-size:11px;color:var(--accent);white-space:nowrap}
/* 0.2.0-alpha.11 — admin: campo "protocolo para terceiros" */
.pw-forname-wrap{display:flex;flex-direction:column;gap:6px;margin:0 0 12px;padding:12px 14px;border:1.5px dashed rgba(var(--accent-rgb),.45);border-radius:var(--r-sm);background:rgba(var(--accent-rgb),.05)}
.pw-forname-label{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:900;color:var(--accent);text-transform:uppercase;letter-spacing:.04em}
.pw-forname-input{width:100%}

/* alpha.671b — toggle Frasco/Caixa por fase */
.cpb-price-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cpb-unit-seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r-sm,10px);overflow:hidden}
.cpb-unit-btn{border:none;background:var(--bg);color:var(--muted);font-weight:800;font-size:12.5px;padding:8px 14px;cursor:pointer;transition:.12s}
.cpb-unit-btn+.cpb-unit-btn{border-left:1px solid var(--line-strong)}
.cpb-unit-btn.active{background:var(--accent);color:var(--accent-text,#fff)}
.cpb-perbox{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}
.cpb-perbox input{width:64px;height:36px;border:1px solid var(--line-strong);background:var(--bg);color:var(--text);border-radius:var(--r-sm,10px);font-size:13px;font-weight:700;text-align:center}
.cpb-perbox input:focus{outline:none;border-color:var(--accent)}

/* alpha.675 — Sobra de peptídeo + troca de medicamento (família) no Protocolo */
.pw-medchange-warn{margin-top:12px;padding:12px 14px;border:1px solid var(--danger,#ef4444);background:color-mix(in srgb,var(--danger,#ef4444) 9%,transparent);border-left:4px solid var(--danger,#ef4444);border-radius:var(--r-sm,10px)}
.pw-mcw-title{font-weight:800;color:var(--danger,#ef4444);font-size:13px;margin-bottom:6px}
.pw-mcw-row{font-size:12.5px;color:var(--text);padding:4px 0;border-top:1px dashed color-mix(in srgb,var(--danger,#ef4444) 30%,transparent)}
.pw-mcw-row:first-of-type{border-top:none}
.pw-mcw-sobra{color:var(--danger,#ef4444);font-weight:700}
.pw-leftover-box{margin-top:12px;padding:12px 14px;border:1px solid var(--line-strong,#d8dee9);background:var(--bg-soft,rgba(0,0,0,.02));border-radius:var(--r-sm,10px)}
.pw-lo-title{font-weight:800;font-size:12px;letter-spacing:.4px;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.pw-lo-row{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:3px 0}
.pw-lo-fam{font-weight:700;color:var(--text)}
.pw-lo-q{font-weight:800;color:var(--accent)}
.pw-lo-note{margin-top:6px;font-size:11.5px;color:var(--muted);line-height:1.4}
/* Popup vermelho de troca de medicamento */
.pw-mc-popup{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:20px;animation:pwMcFade .15s ease}
@keyframes pwMcFade{from{opacity:0}to{opacity:1}}
.pw-mcp-box{max-width:440px;width:100%;background:var(--card,#fff);color:var(--text,#111);border-radius:var(--r-lg,16px);border-top:6px solid var(--danger,#ef4444);box-shadow:0 24px 60px rgba(0,0,0,.4);padding:20px 22px}
.pw-mcp-head{font-size:18px;font-weight:800;color:var(--danger,#ef4444);margin-bottom:8px}
.pw-mcp-intro{font-size:13px;color:var(--muted);line-height:1.5;margin-bottom:12px}
.pw-mcp-item{padding:10px 12px;margin:8px 0;border-radius:var(--r-sm,10px);background:color-mix(in srgb,var(--danger,#ef4444) 8%,transparent);border:1px solid color-mix(in srgb,var(--danger,#ef4444) 30%,transparent)}
.pw-mcp-trans{font-size:13.5px;color:var(--text)}
.pw-mcp-sobra{font-size:13px;color:var(--danger,#ef4444);margin-top:4px}
.pw-mcp-ok{margin-top:14px;width:100%;height:44px;border:none;border-radius:var(--r-sm,10px);background:var(--danger,#ef4444);color:#fff;font-weight:800;font-size:14px;cursor:pointer}
.pw-mcp-ok:hover{filter:brightness(1.05)}

/* alpha.679 — Protocolo: separar CAIXAS de AMPOLAS no resultado, com ícones */
.pw-vials-inline{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;padding:16px}
.pw-pack{display:inline-flex;align-items:center;gap:8px;font-size:15px;color:var(--muted);font-weight:600}
.pw-pack b{font-size:26px;font-weight:800;line-height:1;color:var(--accent)}
.pw-pack-ico{flex:none;color:var(--accent)}
.pw-pack-sep{font-size:16px;color:var(--muted);opacity:.55}
.pw-vials-sub{flex-basis:100%;text-align:center;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-top:-2px}
.pw-pack-ico-wrap{display:inline-flex;vertical-align:-2px;margin-right:5px;color:var(--accent)}
.pw-cost-bd-q{display:inline-flex;align-items:center}

/* alpha.681 — Protocolo: uso e reaproveitamento por fase (carry box-aware) */
.pw-flow-box{margin-top:12px;padding:12px 14px;border:1px solid var(--line-strong,#d8dee9);background:var(--bg-soft,rgba(0,0,0,.02));border-radius:var(--r-sm,10px)}
.pw-flow-row{padding:7px 0;border-top:1px dashed var(--line,#e6e9f0)}
.pw-flow-row:first-of-type{border-top:none}
.pw-flow-ph{font-weight:800;font-size:13px;color:var(--text)}
.pw-flow-detail{font-size:12.5px;color:var(--muted);margin-top:2px}
.pw-flow-detail b{color:var(--accent);font-weight:800}
.pw-flow-reuse{color:#2e9e6b;font-weight:700}
.pw-flow-reuse b{color:#2e9e6b}

/* alpha.682 — Protocolo: sugestão de estender o tratamento com a sobra */
.pw-ext-box{margin-top:12px;padding:12px 14px;border:1px solid color-mix(in srgb,#2e9e6b 35%,transparent);background:color-mix(in srgb,#2e9e6b 8%,transparent);border-left:4px solid #2e9e6b;border-radius:var(--r-sm,10px)}
.pw-ext-box .pw-lo-title{color:#2e9e6b}
.pw-ext-row{font-size:13px;color:var(--text);padding:5px 0;border-top:1px dashed color-mix(in srgb,#2e9e6b 25%,transparent)}
.pw-ext-row:first-of-type{border-top:none}
.pw-ext-row b{color:#2e9e6b;font-weight:800}

/* ─────────────── alpha.686 — Sorteio: card "Meus números da sorte" ─────────────── */
.rfl-card{margin-bottom:14px;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 7%,var(--panel)),var(--panel));overflow:hidden}
.rfl-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rfl-ico{font-size:26px;line-height:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.18))}
.rfl-head-txt{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:2px}
.rfl-head-txt strong{font-size:16px;font-weight:800;color:var(--text)}
.rfl-prize{font-size:12.5px;color:var(--muted)}
.rfl-prize b{color:var(--accent);font-weight:700}
.rfl-draw{font-size:11.5px;font-weight:700;color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);padding:3px 9px;border-radius:var(--r-pill)}
/* convite */
.rfl-join{margin-top:12px}
.rfl-join-desc{font-size:13.5px;color:var(--text);margin:0 0 10px}
.rfl-earn{list-style:none;margin:0 0 12px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:6px 14px}
.rfl-earn li{font-size:12.5px;color:var(--muted);position:relative;padding-left:14px}
.rfl-earn li::before{content:"🍀";position:absolute;left:-2px;top:0;font-size:10px}
.rfl-consent{display:flex;align-items:flex-start;gap:9px;font-size:12.5px;color:var(--text);margin-bottom:12px;cursor:pointer;line-height:1.45}
.rfl-consent input{margin-top:2px;flex:0 0 auto;width:16px;height:16px;accent-color:var(--accent)}
.rfl-rules-link{color:var(--accent);text-decoration:underline;font-weight:600;cursor:pointer}
/* participando — KPIs */
.rfl-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.rfl-kpi{text-align:center;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 8px;display:flex;flex-direction:column;gap:2px}
.rfl-kpi-main{background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 18%,var(--panel-2)),var(--panel-2));border-color:color-mix(in srgb,var(--accent) 35%,var(--line))}
.rfl-kpi-num{font-size:26px;font-weight:800;color:var(--text);line-height:1.05}
.rfl-kpi-main .rfl-kpi-num{color:var(--accent)}
.rfl-kpi small{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.rfl-empty{font-size:12.5px;color:var(--muted);margin:10px 0 0;text-align:center}
/* checklist de perfil */
.rfl-checklist{margin-top:12px;background:color-mix(in srgb,var(--red) 8%,var(--panel-2));border:1px solid color-mix(in srgb,var(--red) 28%,var(--line));border-radius:var(--r-md);padding:11px 13px}
.rfl-checklist strong{display:block;font-size:13px;color:var(--text);margin-bottom:3px}
.rfl-checklist p{font-size:12px;color:var(--muted);margin:0 0 8px}
.rfl-miss{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.rfl-miss-tag{font-size:11.5px;font-weight:600;color:var(--red);background:color-mix(in srgb,var(--red) 14%,transparent);border:1px solid color-mix(in srgb,var(--red) 30%,transparent);padding:2px 9px;border-radius:var(--r-pill)}
.rfl-ok{margin-top:12px;font-size:12.5px;font-weight:600;color:var(--green)}
/* lista de números */
.rfl-numbers{margin-top:12px}
.rfl-numbers summary{cursor:pointer;font-size:12.5px;font-weight:600;color:var(--accent);user-select:none;display:flex;align-items:center;min-height:40px}/* alpha.1019 — alvo de toque (era ~18px) */
.rfl-num-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:6px;margin-top:10px}
.rfl-num{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:700;letter-spacing:1px;text-align:center;color:var(--text);background:var(--panel-2);border:1px dashed color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:var(--r-sm);padding:6px 4px}
.rfl-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.rfl-foot small{font-size:11.5px;color:var(--muted)}
/* modal regulamento */
.rfl-modal{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:18px}
.rfl-modal[hidden]{display:none}
.rfl-modal-box{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);max-width:640px;width:100%;max-height:84vh;display:flex;flex-direction:column;box-shadow:0 18px 50px rgba(0,0,0,.4)}
.rfl-modal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line)}
.rfl-modal-head strong{font-size:15px;color:var(--text)}
.rfl-modal-x{background:none;border:none;font-size:24px;line-height:1;color:var(--muted);cursor:pointer;padding:0;min-width:40px;min-height:40px;display:grid;place-items:center}/* alpha.1019 — alvo de toque (era ~23px) */
.rfl-modal-x:hover{color:var(--text)}
.rfl-modal-body{padding:16px 18px;overflow:auto;font-size:12.5px;line-height:1.6;color:var(--text)}
@media(max-width:560px){.rfl-kpis{grid-template-columns:1fr}.rfl-kpi-num{font-size:23px}}

/* ─────────────── alpha.688 — Sorteio: banner do ganhador + aviso da campanha ─────────────── */
.rfl-win-banner{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 14px;padding:16px 18px;border-radius:var(--r-md);background:linear-gradient(135deg,color-mix(in srgb,#2e9e6b 22%,var(--panel)),color-mix(in srgb,#f2c84b 14%,var(--panel)));border:1px solid color-mix(in srgb,#2e9e6b 45%,var(--line));position:relative;overflow:hidden}
.rfl-win-burst{font-size:30px;line-height:1;flex:0 0 auto;animation:rflPop .6s ease}
@keyframes rflPop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}
.rfl-win-body{flex:1 1 240px;min-width:0}
.rfl-win-body strong{display:block;font-size:17px;color:var(--text);margin-bottom:2px}
.rfl-win-body p{margin:0;font-size:13px;color:var(--text)}
.rfl-win-body p b{color:#1f7a51;font-weight:800}
.rfl-win-prize{margin-top:4px!important;color:var(--muted)!important}
.rfl-win-banner .btn{flex:0 0 auto}
.rfl-announce{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:9px 13px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--accent) 10%,var(--panel-2));border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));font-size:13px;color:var(--text)}
.rfl-announce-ico{font-size:16px;flex:0 0 auto}
.rfl-announce-txt{flex:1 1 auto;min-width:0}
.rfl-announce-txt b{color:var(--accent);font-weight:700}
.rfl-announce-x{flex:0 0 auto;background:none;border:none;font-size:20px;line-height:1;color:var(--muted);cursor:pointer;padding:0;min-width:40px;min-height:40px;display:grid;place-items:center;margin:-8px -6px -8px 0}/* alpha.1019 — alvo de toque (era ~20px) */
.rfl-announce-x:hover{color:var(--text)}

/* ─────────────── alpha.691 — Sorteio: página pública de ganhadores ─────────────── */
.rfl-pub-wrap{max-width:920px;margin:0 auto;padding:28px 16px 48px}
.rfl-pub-head{text-align:center;margin-bottom:28px}
.rfl-pub-emoji{font-size:46px;line-height:1;margin-bottom:6px}
.rfl-pub-head h1{font-size:28px;margin:0 0 8px;color:var(--text)}
.rfl-pub-head p{font-size:15px;color:var(--muted);max-width:560px;margin:0 auto 16px;line-height:1.5}
.rfl-pub-cta{display:inline-block}
.rfl-pub-empty{text-align:center;color:var(--muted);background:var(--panel-2);border:1px dashed var(--line);border-radius:var(--r-md);padding:40px 20px;font-size:15px}
.rfl-pub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.rfl-pub-card{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 6%,var(--panel)),var(--panel));border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));border-radius:var(--r-md);padding:18px}
.rfl-pub-card-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.rfl-pub-camp{font-size:16px;color:var(--text)}
.rfl-pub-date{font-size:11.5px;color:var(--muted);white-space:nowrap}
.rfl-pub-prize{font-size:13px;color:var(--muted);margin-bottom:12px}
.rfl-pub-prize strong{color:var(--text)}
.rfl-pub-number-wrap{text-align:center;background:var(--panel-2);border:1px dashed color-mix(in srgb,var(--accent) 40%,var(--line));border-radius:var(--r-sm);padding:12px;margin-bottom:12px}
.rfl-pub-number-lbl{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:2px}
.rfl-pub-number{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:26px;font-weight:800;letter-spacing:4px;color:var(--accent)}
.rfl-pub-winner{font-size:14px;color:var(--text);text-align:center}
.rfl-pub-winner strong{color:var(--accent)}

/* ─────────────── alpha.694 — Sorteio: lista "como ganhar" + caixa de compartilhar ─────────────── */
.rfl-earn-box{margin-top:14px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px}
.rfl-earn-box>strong{display:block;font-size:13px;color:var(--text);margin-bottom:8px}
.rfl-earn-box .rfl-earn{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:5px 14px}
.rfl-earn-box .rfl-earn li{font-size:12.5px;color:var(--muted);position:relative;padding-left:15px;list-style:none}
.rfl-earn-box .rfl-earn li::before{content:"🍀";position:absolute;left:-1px;top:0;font-size:10px}
.rfl-earn-box .rfl-earn li.rfl-earn-hi{color:var(--accent);font-weight:600;grid-column:1/-1}
.rfl-earn-box .rfl-earn li.rfl-earn-hi::before{content:"📣"}
.rfl-share{margin-top:14px;border-radius:var(--r-md);padding:14px;background:linear-gradient(150deg,color-mix(in srgb,var(--accent) 16%,var(--panel-2)),var(--panel-2));border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line))}
.rfl-share>strong{display:block;font-size:14px;color:var(--text)}
.rfl-share>p{font-size:12.5px;color:var(--muted);margin:4px 0 10px}
.rfl-share-row{display:flex;gap:8px;align-items:stretch}
.rfl-share-row input{flex:1 1 auto;min-width:0;font-size:12.5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text)}
.rfl-share-row .btn{flex:0 0 auto}
.rfl-share-actions{display:flex;gap:10px;align-items:center;margin-top:10px;flex-wrap:wrap}
.rfl-share-count{font-size:12.5px;font-weight:600;color:#2e9e6b;background:color-mix(in srgb,#2e9e6b 12%,transparent);border:1px solid color-mix(in srgb,#2e9e6b 30%,transparent);padding:3px 10px;border-radius:var(--r-pill)}

/* alpha.698 — Sorteio: "Meus convidados" (indicações) */
.rfl-invited{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px dashed color-mix(in srgb,var(--accent) 22%,var(--line))}
.rfl-invited-stat{font-size:12.5px;color:var(--muted)}
.rfl-invited-stat strong{color:var(--text);font-size:14px}
.rfl-invited-ok strong{color:#2e9e6b}

/* alpha.699 — confirmação de e-mail no perfil */
.my-profile-email-verify{margin-top:6px;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.ev-badge{font-size:12px;font-weight:600;padding:2px 10px;border-radius:var(--r-pill,999px)}
.ev-badge.ev-ok{color:#2e9e6b;background:color-mix(in srgb,#2e9e6b 12%,transparent);border:1px solid color-mix(in srgb,#2e9e6b 30%,transparent)}
.ev-badge.ev-no{color:var(--muted);background:color-mix(in srgb,var(--muted) 10%,transparent);border:1px solid var(--line)}

/* alpha.705 — perfil em abas (Sorteio · Dados · Endereço · Segurança · Meus pedidos) */
.prof-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0 16px;border-bottom:1px solid var(--line);padding-bottom:0}
.prof-tab{appearance:none;background:transparent;border:0;border-bottom:2px solid transparent;color:var(--muted);font:inherit;font-weight:600;font-size:14px;padding:9px 14px;border-radius:8px 8px 0 0;cursor:pointer;margin-bottom:-1px;transition:color .15s,background .15s,border-color .15s}
.prof-tab:hover{color:var(--text);background:var(--panel-2)}
.prof-tab.is-active{color:var(--accent-text,var(--accent));border-bottom-color:var(--accent)}
.prof-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.prof-pane{display:none}
.prof-pane.is-active{display:block;animation:profFade .2s ease}
@keyframes profFade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.prof-save-btn{margin-top:6px}
.prof-orders{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));margin-top:4px}
.prof-order-card{border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:12px;padding:14px 16px;background:var(--panel)}
.prof-order-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.prof-order-head strong{font-size:15px;color:var(--text)}
.prof-order-status{font-size:12px;font-weight:700;color:var(--accent-text,var(--accent));white-space:nowrap}
.prof-order-title{font-size:13px;color:var(--muted);margin-bottom:10px;line-height:1.35}
.prof-order-meta{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted)}
.prof-order-total{font-weight:700;color:var(--text)}
.prof-orders-empty{padding:24px 0;text-align:center;color:var(--muted)}
@media(max-width:560px){.prof-tabs{gap:2px}.prof-tab{padding:8px 10px;font-size:13px}.prof-orders{grid-template-columns:1fr}}

/* alpha.706 — tour dedicado do Sorteio (coach-marks auto-contidos no perfil) */
.zrt-wrap{display:none}
.zrt-wrap.on{display:block}
.zrt-back{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:10050;animation:zrtFade .2s ease}
.zrt-hi{outline:3px solid var(--accent);outline-offset:3px;border-radius:12px;transition:outline-color .15s}
.zrt-card{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);width:min(420px,calc(100vw - 24px));background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 45px rgba(0,0,0,.32);padding:18px 18px 14px;z-index:10070;animation:zrtUp .22s ease}
.zrt-step{font-size:12px;font-weight:700;color:var(--accent-text,var(--accent));letter-spacing:.4px}
.zrt-title{margin:4px 0 6px;font-size:17px;color:var(--text)}
.zrt-text{margin:0 0 14px;font-size:14px;line-height:1.5;color:var(--muted)}
.zrt-nav{display:flex;align-items:center;gap:8px}
.zrt-spacer{flex:1}
.zrt-skip{appearance:none;background:transparent;border:0;color:var(--muted);font:inherit;font-size:13px;cursor:pointer;text-decoration:underline;padding:6px 2px}
@keyframes zrtFade{from{opacity:0}to{opacity:1}}
@keyframes zrtUp{from{opacity:0;transform:translateX(-50%) translateY(12px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
@media(min-width:760px){.zrt-card{bottom:auto;top:50%;transform:translate(-50%,-50%)}@keyframes zrtUp{from{opacity:0;transform:translate(-50%,-46%)}to{opacity:1;transform:translate(-50%,-50%)}}}

/* alpha.707 — editor de Tutorial guiado (ERP) */
.te-toggles{display:flex;flex-wrap:wrap;gap:18px;margin:4px 0 14px}
.te-toggle{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14px;cursor:pointer}
.te-steps{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}
.te-step{border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:12px;padding:12px 14px;background:var(--panel-2)}
.te-step-head{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.te-step-head .te-num{font-weight:700;color:var(--accent-text,var(--accent))}
.te-step-head .te-sp{flex:1}
.te-l{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:8px}
.te-l input,.te-l textarea{width:100%;margin-top:3px;font-size:14px;font-weight:400;color:var(--text)}
.te-l textarea{resize:vertical;min-height:46px}
.te-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:560px){.te-row2{grid-template-columns:1fr}}

/* alpha.714 (Fase 4b) — Musculação: builder de exercícios × séries + histórico de força */
.str-card{padding:0;overflow:hidden}
.str-head{display:flex;align-items:center;gap:12px;padding:15px 17px;
  background:linear-gradient(120deg, color-mix(in srgb,var(--accent) 30%,#1e293b) 0%, color-mix(in srgb,var(--accent) 52%,#1e293b) 100%);color:#fff}
.str-head .str-ic{font-size:24px;width:46px;height:46px;flex:0 0 46px;border-radius:var(--r-sm);display:grid;place-items:center;background:rgba(255,255,255,.22)}
.str-head strong{display:block;font-size:15.5px;font-weight:900;color:#fff}
.str-head small{display:block;font-size:11.5px;color:#fff;opacity:.92;margin-top:1px}
.str-form{padding:15px 17px;border-top:1px solid var(--line)}
.str-form .form-grid{display:grid;grid-template-columns:1fr 110px 1fr;gap:10px;margin-bottom:12px}
@media(max-width:560px){.str-form .form-grid{grid-template-columns:1fr}}
.str-form label{display:block;font-size:12px;font-weight:600;color:var(--muted)}
.str-form label input{width:100%;margin-top:4px;font-size:14px;font-weight:400;color:var(--text)}
.str-exs{display:flex;flex-direction:column;gap:12px;margin-bottom:10px}
.str-ex{border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:12px;padding:11px 12px;background:var(--panel-2)}
.str-ex-head{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.str-ex-name{flex:1;font-size:14px;font-weight:700;color:var(--text)}
.str-ex-del,.str-set-del{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:15px;line-height:1;padding:4px 7px;border-radius:8px;flex:0 0 auto}
.str-ex-del:hover,.str-set-del:hover{background:color-mix(in srgb,var(--danger,#dc2626) 14%,transparent);color:var(--danger,#dc2626)}
.str-sets{display:flex;flex-direction:column;gap:7px;margin-bottom:8px}
.str-set{display:flex;align-items:center;gap:8px}
.str-set-n{flex:0 0 22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11.5px;font-weight:800;color:var(--accent-text,var(--accent));background:color-mix(in srgb,var(--accent) 16%,transparent)}
.str-set-reps{flex:1;min-width:0}
.str-set-w{flex:1;min-width:0}
.str-set .str-x{color:var(--muted);font-weight:700;font-size:13px}
.str-summary{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0;padding:10px 12px;border-radius:12px;background:var(--panel-2);border:1px solid var(--line)}
.str-sum-item{font-size:12.5px;color:var(--muted)}
.str-sum-item strong{color:var(--text);font-weight:800}
.str-sum-vol strong{color:var(--accent-text,var(--accent))}
.str-notes{display:block;margin-bottom:10px}
/* histórico — item de força */
.act-item-str .act-item-ic{background:color-mix(in srgb,var(--accent) 18%,transparent)}
.act-str-badge{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:2px 7px;border-radius:999px;background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent-text,var(--accent));margin-left:7px}
.act-str-details{margin-top:7px}
.act-str-details summary{cursor:pointer;font-size:12px;font-weight:700;color:var(--accent);list-style:none;display:inline-flex;align-items:center;gap:5px}
.act-str-details summary::-webkit-details-marker{display:none}
.act-str-details summary::before{content:"▸";transition:transform .15s}
.act-str-details[open] summary::before{transform:rotate(90deg)}
.str-li-wrap{display:flex;flex-direction:column;gap:9px;margin-top:9px}
.str-li-ex>strong{display:block;font-size:13px;color:var(--text);margin-bottom:4px}
.str-li-ex>strong em{font-style:normal;font-weight:700;font-size:11.5px;color:var(--accent-text,var(--accent));margin-left:6px}
.str-li-ex ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.str-li-ex li{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:3px 8px}
.str-li-n{font-weight:800;font-size:10px;color:var(--accent-text,var(--accent));background:color-mix(in srgb,var(--accent) 16%,transparent);border-radius:50%;width:16px;height:16px;display:grid;place-items:center}

/* alpha.715 (Fase 4c) — Tendências de exercício: cabeçalho + seletor de métrica + distribuição por tipo */
.act-trend-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:8px}
.act-trend-head h3{margin:0;font-size:15px;font-weight:900}
.act-trend-metrics{display:inline-flex;gap:4px;background:var(--panel-2);border:1px solid var(--line);border-radius:999px;padding:3px}
.act-trend-mt{border:0;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:700;padding:5px 11px;border-radius:999px;cursor:pointer;transition:background .15s,color .15s}
.act-trend-mt:hover{color:var(--text)}
.act-trend-mt.on{background:var(--accent);color:var(--accent-text,#fff)}
.act-trend-card .zk-trend{margin:4px 0 6px}
.act-dist-head{margin:14px 0 9px;border-top:1px solid var(--line);padding-top:12px}
.act-dist-head h4{margin:0;font-size:13.5px;font-weight:800}
.act-dist-head h4 small{font-weight:600;color:var(--muted);font-size:11.5px}
.act-dist-list{display:flex;flex-direction:column;gap:9px}
.act-dist-row{display:flex;align-items:center;gap:10px}
.act-dist-ic{font-size:18px;width:30px;height:30px;flex:0 0 30px;border-radius:9px;display:grid;place-items:center;background:var(--panel-2);border:1px solid var(--line)}
.act-dist-body{flex:1;min-width:0}
.act-dist-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:4px}
.act-dist-top strong{font-size:13px;color:var(--text);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.act-dist-top small{font-size:11.5px;color:var(--muted);flex:0 0 auto;font-variant-numeric:tabular-nums}
.act-dist-bar{height:7px;border-radius:999px;background:var(--panel-2);overflow:hidden}
.act-dist-bar>i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 65%,transparent),var(--accent));transition:width .4s ease}

/* alpha.716 (Fase 4d) — Planos de treino: lista + builder da rotina */
.wp-card{padding:0;overflow:hidden}
.wp-head{background:linear-gradient(120deg, color-mix(in srgb,var(--accent) 26%,#1e293b) 0%, color-mix(in srgb,var(--accent) 46%,#1e293b) 100%)}
.wp-list{display:flex;flex-direction:column;gap:10px;padding:14px 16px}
.wp-empty{color:var(--muted);font-size:13px;text-align:center;padding:14px 4px}
.wp-item{display:flex;align-items:flex-start;gap:12px;border:1px solid var(--line);border-radius:12px;padding:12px 13px;background:var(--panel-2)}
.wp-item-body{flex:1;min-width:0}
.wp-item-top{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.wp-item-top strong{font-size:14.5px;font-weight:800;color:var(--text)}
.wp-item-count{font-size:11px;font-weight:700;color:var(--accent-text,var(--accent));background:color-mix(in srgb,var(--accent) 15%,transparent);border-radius:999px;padding:2px 8px}
.wp-item-desc{display:block;color:var(--muted);font-size:12px;margin:3px 0 0}
.wp-item-exs{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.5}
.wp-item-actions{display:flex;flex-direction:column;gap:6px;flex:0 0 auto;align-items:stretch}
.wp-item-actions .btn{white-space:nowrap}
.wp-del{border:0;background:transparent;color:var(--muted);cursor:pointer;padding:4px 7px;border-radius:8px;align-self:center}
.wp-del:hover{background:color-mix(in srgb,var(--danger,#dc2626) 14%,transparent);color:var(--danger,#dc2626)}
@media(max-width:560px){.wp-item{flex-direction:column}.wp-item-actions{flex-direction:row;width:100%}.wp-item-actions .btn{flex:1}}
.wp-form{padding:14px 16px;border-top:1px solid var(--line)}
.wp-form .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
@media(max-width:560px){.wp-form .form-grid{grid-template-columns:1fr}}
.wp-form label{display:block;font-size:12px;font-weight:600;color:var(--muted)}
.wp-form label input{width:100%;margin-top:4px;font-size:14px;font-weight:400;color:var(--text)}
.wp-exs-head{display:grid;grid-template-columns:1fr 72px 72px 80px 30px;gap:7px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding:0 2px 5px}
.wp-exs{display:flex;flex-direction:column;gap:7px;margin-bottom:10px}
.wp-ex{display:grid;grid-template-columns:1fr 72px 72px 80px 30px;gap:7px;align-items:center}
.wp-ex input{font-size:13.5px}
.wp-ex-del{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:14px;border-radius:8px;padding:4px}
.wp-ex-del:hover{background:color-mix(in srgb,var(--danger,#dc2626) 14%,transparent);color:var(--danger,#dc2626)}
@media(max-width:560px){.wp-exs-head{display:none}.wp-ex{grid-template-columns:1fr 1fr;gap:6px}.wp-ex .wp-ex-name{grid-column:1/-1}.wp-ex-del{grid-column:2;justify-self:end}}

/* alpha.718 — FIX: .check-inline não estava definido e herdava label{display:grid}, esticando o
   checkbox nativo (88×44px). Define rótulo+checkbox em linha, com caixa de 18px. Corrige os
   toggles de "Configurações de ganho", os checkboxes "forçar" do sorteio e o "Avisar no login". */
.check-inline{display:inline-flex!important;align-items:center;gap:8px;cursor:pointer;font-weight:600;white-space:nowrap}
.check-inline > input[type=checkbox]{appearance:auto;-webkit-appearance:checkbox;width:18px!important;height:18px!important;min-width:18px;max-width:18px;flex:0 0 18px;margin:0!important;padding:0!important;accent-color:var(--accent);cursor:pointer}

/* alpha.719 — regras de ganho (peso/teto por atividade): GRID. Classe .rfl-cfg (NÃO .rfl-earn,
   que já é usada nas listas 🍀 do card do usuário). Imune ao CSS global de <table>. */
.rfl-cfg{display:grid;grid-template-columns:56px 1fr 72px 84px;gap:9px 16px;align-items:center;max-width:540px}
.rfl-cfg-h{font-size:11px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);font-weight:700}
.rfl-cfg-c{text-align:center;justify-self:center}
.rfl-cfg input[type=number]{width:100%;text-align:center}
@media(max-width:560px){.rfl-cfg{grid-template-columns:48px 1fr 58px 68px;gap:8px 10px}}

/* alpha.721 — página pública de verificação do sorteio */
.rfl-ver-link{color:var(--accent);font-weight:700;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
.rfl-ver-how{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-md,14px);padding:16px 18px;margin:0 auto 18px;max-width:760px;font-size:13.5px}
.rfl-ver-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md,14px);padding:16px 18px;margin:0 auto 14px;max-width:760px}
.rfl-ver-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}/* alpha.1019 — nome longo + badge nowrap estouravam em 320px */
.rfl-ver-top>strong{min-width:0}
.rfl-ver-top>strong{font-size:15px}
.rfl-ver-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:10px 0}
.rfl-ver-grid>div{display:flex;flex-direction:column;gap:3px}
.rfl-ver-grid span{font-size:11px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.rfl-ver-num{font-family:ui-monospace,monospace;font-size:20px;font-weight:800;letter-spacing:2px;color:var(--accent-text,var(--accent))}
.rfl-ver-seed{display:flex;flex-direction:column;gap:3px;margin-bottom:8px}
.rfl-ver-seed span{font-size:11px;text-transform:uppercase;color:var(--muted)}
.rfl-ver-seed code,.rfl-ver-card code{font-family:ui-monospace,monospace;font-size:12px;word-break:break-all;background:var(--panel-2);padding:2px 6px;border-radius:6px}
.rfl-ver-nums summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--accent)}
.rfl-ver-nums textarea{width:100%;margin-top:8px;font-family:ui-monospace,monospace;font-size:11px;background:var(--panel-2);border:1px solid var(--line);border-radius:8px;color:var(--text);padding:8px;resize:vertical}

/* alpha.721 — tutorial guiado do painel admin de Sorteio (spotlight) */
.rtour-ov{position:fixed;inset:0;z-index:10050;background:transparent}
.rtour-ring{position:fixed;border:3px solid var(--accent);border-radius:12px;box-shadow:0 0 0 9999px rgba(0,0,0,.5);pointer-events:none;transition:all .25s ease}
.rtour-tip{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);max-width:460px;width:calc(100% - 32px);background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px 14px;box-shadow:0 14px 44px rgba(0,0,0,.35)}
.rtour-tip .rtour-t{display:block;font-size:15px;margin-bottom:6px;color:var(--text)}
.rtour-tip .rtour-x{margin:0 0 12px;font-size:13.5px;color:var(--muted);line-height:1.5}
.rtour-nav{display:flex;align-items:center;gap:10px}
.rtour-cnt{font-size:12px;color:var(--muted);margin-left:auto}
.rtour-close{position:absolute;top:8px;right:10px;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:16px;line-height:1}

/* alpha.722 — POPUP GUIADO de registro de atividade (cards) */
.actlog-modal-backdrop{position:fixed;inset:0;z-index:9998;background:rgba(0,0,0,.5);display:flex;align-items:flex-end;justify-content:center}
.actlog-modal-backdrop[hidden]{display:none}
@media(min-width:620px){.actlog-modal-backdrop{align-items:center;padding:20px}}
.actlog-modal{background:var(--panel);width:100%;max-width:560px;max-height:92vh;display:flex;flex-direction:column;border-radius:18px 18px 0 0;overflow:hidden;box-shadow:0 -10px 44px rgba(0,0,0,.32)}
@media(min-width:620px){.actlog-modal{border-radius:18px;max-height:86vh}}
.actlog-head{display:flex;align-items:center;gap:10px;padding:13px 14px;border-bottom:1px solid var(--line)}
.actlog-head strong{flex:1;font-size:15px;text-align:center;color:var(--text)}
.actlog-back,.actlog-close{border:0;background:var(--panel-2);color:var(--text);width:34px;height:34px;border-radius:10px;display:grid;place-items:center;cursor:pointer;flex:0 0 34px}
.actlog-back:hover,.actlog-close:hover{background:color-mix(in srgb,var(--accent) 15%,var(--panel-2))}
.actlog-body{padding:14px 16px;overflow:auto}
.actlog-search{width:100%;margin-bottom:12px;font-size:14px}
.actlog-cats{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.actlog-cat{border:1px solid var(--line);background:var(--panel-2);color:var(--muted);font:inherit;font-size:12.5px;font-weight:700;padding:6px 13px;border-radius:999px;cursor:pointer}
.actlog-cat.on{background:var(--accent);color:var(--accent-text,#fff);border-color:transparent}
.actlog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(94px,1fr));gap:10px}
.actlog-card{display:flex;flex-direction:column;align-items:center;gap:7px;padding:13px 8px;border:1px solid var(--line);border-radius:14px;background:var(--panel-2);cursor:pointer;transition:transform .12s,border-color .12s,box-shadow .12s;text-align:center}
.actlog-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 6px 16px rgba(var(--accent-rgb),.18)}
.actlog-card-emoji{font-size:25px;line-height:1}
.actlog-card-name{font-size:12px;font-weight:700;color:var(--text);line-height:1.2}
.actlog-card-other{border-style:dashed}
#actLogStep2 > label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:13px}
#actLogStep2 [hidden],.actlog-other-wrap[hidden]{display:none!important}
#actLogStep2 > label input{width:100%;margin-top:4px;font-size:14px;font-weight:400;color:var(--text)}
.actlog-chosen{display:flex;align-items:center;gap:10px;background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:14px}
.actlog-chosen-emoji{font-size:24px;line-height:1}
.actlog-chosen strong{font-size:15px;color:var(--text)}
.actlog-fieldlbl{font-size:12px;font-weight:600;color:var(--muted);margin-bottom:6px}
.actlog-seg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:14px}
.actlog-seg button{flex:1;border:0;background:var(--panel-2);color:var(--muted);font:inherit;font-size:13px;font-weight:700;padding:9px 6px;cursor:pointer;border-right:1px solid var(--line)}
.actlog-seg button:last-child{border-right:0}
.actlog-seg button.on{background:var(--accent);color:var(--accent-text,#fff)}
.actlog-save{width:100%;margin-top:4px}

/* alpha.722 — CTAs da aba Exercícios menos volumosos (não full-width gigante) */
.act-gps-start{width:auto;min-width:200px;display:block;margin:0 auto;font-size:14px;padding:10px 24px}
.actgps-start-big{width:auto;min-width:220px;display:block;margin:8px auto 0;font-size:14px;padding:11px 24px}

/* alpha.730 — Usuários: uso & engajamento (admin) */
.usr-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:0 0 14px}
.usr-kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;text-align:center}
.usr-kpi strong{display:block;font-size:24px;font-weight:950;color:var(--text);line-height:1}
.usr-kpi span{font-size:11px;color:var(--muted);font-weight:700}
.usr-kpi.g{border-color:rgba(34,197,94,.4)} .usr-kpi.g strong{color:#16a34a}
.usr-kpi.a{border-color:rgba(245,158,11,.4)} .usr-kpi.a strong{color:#d97706}
.usr-kpi.r{border-color:rgba(239,68,68,.4)} .usr-kpi.r strong{color:#dc2626}
.usr-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.usr-search{flex:1;min-width:200px;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font-size:14px}
.usr-id{display:flex;flex-direction:column;gap:1px}
.usr-id small{font-size:11.5px}
.usr-eng{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.usr-eng-bar{width:84px;height:7px;border-radius:var(--r-pill);background:var(--panel-2);overflow:hidden;flex:0 0 auto}
.usr-eng-bar i{display:block;height:100%;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--accent-2),var(--accent))}
.usr-eng-n{font-weight:900;font-size:13px;color:var(--text);min-width:20px}
.usr-use{display:flex;flex-direction:column;gap:1px}
.usr-use-top{font-weight:800;font-size:13px;color:var(--text)}
.usr-use-meta{font-size:11px;color:var(--muted)}
.badge.amber{background:rgba(245,158,11,.14);color:#b45309}
.usage-box{max-height:92vh;display:flex;flex-direction:column}
.usage-privacy{margin:0 0 10px;font-size:11.5px;color:var(--muted);background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:7px 10px}
.usage-body{overflow:auto;flex:1;min-height:0}
.usage-loading{padding:30px;text-align:center;color:var(--muted)}
.um-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;margin-bottom:14px}
.um-kpi{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 6px;text-align:center}
.um-kpi b{display:block;font-size:16px;font-weight:950;color:var(--text);line-height:1.1}
.um-kpi span{font-size:10px;color:var(--muted);font-weight:700}
.um-sec{margin:0 0 16px}
.um-sec h4{margin:0 0 8px;font-size:13px;font-weight:900;color:var(--text)}
.um-cols{display:flex;align-items:flex-end;gap:4px;height:90px;border-bottom:1px solid var(--line);padding-bottom:2px}
.um-col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;gap:3px}
.um-col i{display:block;width:70%;max-width:22px;border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--accent-2),var(--accent));min-height:3px}
.um-col em{font-size:8.5px;color:var(--muted);font-style:normal}
.um-row{display:flex;align-items:center;gap:9px;margin:5px 0}
.um-row-lbl{flex:0 0 130px;font-size:12.5px;color:var(--text);font-weight:700}
.um-row-bar{flex:1;height:8px;border-radius:var(--r-pill);background:var(--panel-2);overflow:hidden}
.um-row-bar i{display:block;height:100%;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--accent-2),var(--accent))}
.um-row-v{flex:0 0 auto;font-size:12px;font-weight:800;color:var(--muted);min-width:40px;text-align:right}
.um-ai{margin-top:10px;background:var(--panel-2);border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));border-radius:var(--r-md);padding:13px 15px;font-size:13px;line-height:1.55;color:var(--text)}
@media(max-width:640px){.usr-table thead{display:none}.um-row-lbl{flex-basis:96px}}

/* alpha.732 — Modais: max-height em dvh (viewport DINÂMICO) para o rodapé/botões não ficarem
   cortados no mobile quando a barra do navegador aparece (vh ignora a barra e estoura a tela).
   Navegadores sem dvh ignoram esta regra e caem no max-height:vh anterior (degradação segura). */
.bmform-dialog{max-height:92dvh}
.modal-box{max-height:90dvh}
.actlog-modal{max-height:92dvh}
.rfl-modal-box{max-height:84dvh}
.act-route-card{max-height:88dvh}
.usage-box{max-height:92dvh}
.zk-bug-card{max-height:92dvh}
.dose-modal{max-height:calc(100dvh - 40px)}
.dash-customer-modal-card{max-height:calc(100dvh - 100px)}
@media(max-width:560px){.bmform-dialog{max-height:94dvh}.dose-modal{max-height:calc(100dvh - 24px)}}
@media(min-width:620px){.actlog-modal{max-height:86dvh}}
/* .modal-box: os botões de ação (.form-actions) rolavam junto e podiam sumir — fixa no rodapé */
.modal-box .form-actions{position:sticky;bottom:0;background:var(--panel);padding-top:12px;margin-top:16px;box-shadow:0 -8px 16px -8px rgba(var(--shadow-rgb),.35)}

/* alpha.733 — mascaramento de dados sensíveis (LGPD): valor mascarado + botão revelar (admin) */
.mask-field{display:inline-flex;align-items:center;gap:5px}
.mask-shown,.mask-val{font-variant-numeric:tabular-nums;letter-spacing:.4px}
.mask-val{color:var(--muted)}
.mask-reveal{appearance:none;border:1px solid var(--line);background:var(--panel-2);color:var(--muted);width:22px;height:22px;border-radius:6px;font-size:11px;line-height:1;cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.mask-reveal:hover{border-color:var(--accent);color:var(--accent)}

/* alpha.735 — modal "Unificar base" (religar órfãos + mesclar duplicatas) */
.unify-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:6px 0 0}
.unify-cell{background:var(--panel-2);border:1px solid var(--line);border-radius:10px;padding:10px 8px;text-align:center;display:flex;flex-direction:column;gap:2px}
.unify-cell strong{font-size:20px;line-height:1;color:var(--text);font-variant-numeric:tabular-nums}
.unify-cell span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.unify-cell.warn{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));background:color-mix(in srgb,var(--accent) 10%,var(--panel-2))}
.unify-cell.warn strong{color:var(--accent)}
@media (max-width:520px){.unify-grid{grid-template-columns:repeat(2,1fr)}}
.unify-review{margin-top:12px;max-height:32vh;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:8px}
.unify-review-h{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin:0 0 6px}
.unify-rgrp{border:1px solid var(--line);border-radius:8px;padding:4px;margin:0 0 6px;background:var(--panel-2)}
.unify-rgrp:last-child{margin-bottom:0}
.unify-rrow{display:flex;align-items:center;gap:8px;padding:3px 4px;font-size:12px;border-radius:6px}
.unify-rrow.keep{background:color-mix(in srgb,var(--accent) 12%,transparent)}
.unify-rk{flex:0 0 64px;font-weight:700;font-size:11px;color:var(--muted)}
.unify-rrow.keep .unify-rk{color:var(--accent)}
.unify-rn{flex:1 1 auto;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.unify-rc{flex:0 0 auto;color:var(--muted);font-variant-numeric:tabular-nums}
.unify-rc a{color:var(--accent);text-decoration:underline;margin-left:6px;font-size:11px}
.unify-flag-note{margin:10px 0 0;font-size:12.5px;background:color-mix(in srgb,var(--accent) 10%,var(--panel-2));border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));border-radius:8px;padding:8px 10px}

/* alpha.739 — Hub de Pessoas (ficha única) */
.pn-id{display:flex;align-items:center;gap:10px;min-width:0}
.pn-photo{width:34px;height:34px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:1px solid var(--line)}
.pn-photo.pn-ph{display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent) 16%,var(--panel-2));color:var(--accent);font-weight:800;font-size:14px}
.pn-id-txt{min-width:0;display:flex;flex-direction:column}
.pn-id-txt strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}
.pn-id-txt small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}

/* alpha.743 — banner de recuperação por CPF (admin: .pm-recover · público: .creg-recover) */
.pm-recover{font-size:13px}
.pm-recover-ok{color:var(--accent);font-weight:700}
.pm-recover-bad{color:#c4564a;font-weight:700}
.pm-recover-hit{background:color-mix(in srgb,var(--accent) 12%,var(--panel-2));border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:8px;padding:8px 10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pm-recover-msg{margin-top:6px;font-size:12.5px}
.pm-recover-msg .copy-link-input{width:100%;margin-top:6px}
.creg-recover{margin:-4px 0 10px;background:color-mix(in srgb,var(--accent) 14%,var(--panel,#fff));border:1.5px solid color-mix(in srgb,var(--accent) 55%,var(--line));border-radius:14px;padding:14px 16px;box-shadow:0 2px 10px color-mix(in srgb,var(--accent) 14%,transparent)}
.creg-recover-head{font-weight:900;color:var(--accent);font-size:15px}
.creg-topnote{margin:0 0 12px;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--accent) 12%,var(--panel,#fff));border:1.5px solid color-mix(in srgb,var(--accent) 50%,var(--line));font-size:13.5px;line-height:1.5}
.creg-topnote a{color:var(--accent);font-weight:800;text-decoration:underline}
.creg-recover-hint{margin:6px 0 8px;font-size:13px;color:var(--muted)}
.creg-recover-row{display:flex;gap:8px;flex-wrap:wrap}
.creg-recover-row input{flex:1 1 200px;min-width:0}
.creg-recover-msg{margin-top:8px;font-size:13px}
.creg-recover-foot{margin:8px 0 0;font-size:12.5px;color:var(--muted)}
.creg-ok{color:var(--accent);font-weight:700}
.creg-bad{color:#c4564a;font-weight:700}

/* ════════════════════════════════════════════════════════════════════════
   alpha.809 — Alinhamento fluido + ícones coloridos por FUNÇÃO (auditoria UX)
   Pedido do dono: cards alinham dinamicamente (sem colunas fixas que
   desalinham ao mudar a resolução) e cada ícone com cor pela sua função.
   CSS novo no fim do arquivo (regra do projeto). Tokens reutilizáveis.
   ════════════════════════════════════════════════════════════════════════ */

/* Paleta por FUNÇÃO — vívida e distinta, funciona em claro/escuro */
:root{
  --fn-weight:#4f6ef7;    /* pesagens — azul   */
  --fn-exercise:#f97316;  /* exercícios — laranja */
  --fn-water:#06b6d4;     /* hidratação — ciano */
  --fn-meals:#22c55e;     /* refeições — verde */
  --fn-doses:#8b5cf6;     /* doses — violeta (médico) */
  --fn-symptoms:#ef4444;  /* sintomas — vermelho (coração) */
  --fn-measures:#14b8a6;  /* medidas — teal */
}
html[data-theme="dark"]{
  --fn-weight:#7d93ff; --fn-exercise:#fb923c; --fn-water:#22d3ee;
  --fn-meals:#4ade80; --fn-doses:#a78bfa; --fn-symptoms:#f87171; --fn-measures:#2dd4bf;
}

/* ── GRIDS FLUIDOS (sem nº de colunas fixo → reflui em qualquer largura) ── */
.bwk-stats{grid-template-columns:repeat(auto-fit,minmax(76px,1fr))}
.home-grid{grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))}
.body-dash-grid{grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}
.cards-grid{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
.tool-grid{grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr))}

/* ── ÍCONES COLORIDOS POR FUNÇÃO (tiles do "Resumo semanal") ── */
.bwk-stats>div[data-fn]{--fn:var(--accent)}
.bwk-stats>div[data-fn="weight"]{--fn:var(--fn-weight)}
.bwk-stats>div[data-fn="exercise"]{--fn:var(--fn-exercise)}
.bwk-stats>div[data-fn="water"]{--fn:var(--fn-water)}
.bwk-stats>div[data-fn="meals"]{--fn:var(--fn-meals)}
.bwk-stats>div[data-fn="doses"]{--fn:var(--fn-doses)}
.bwk-stats>div[data-fn="symptoms"]{--fn:var(--fn-symptoms)}
.bwk-stats>div[data-fn="measures"]{--fn:var(--fn-measures)}
.bwk-stats>div[data-fn] span{color:var(--fn)}
.bwk-stats>div[data-fn] svg{stroke-width:2.1}
.bwk-stats>div[data-fn]{
  background:color-mix(in srgb,var(--fn) 12%, var(--panel));
  border:1px solid color-mix(in srgb,var(--fn) 24%, transparent);
}

/* ════════════════════════════════════════════════════════════════════════
   alpha.810 — Acompanhamento (#tabTrack): aplica o fluido + cor-por-função
   ao componente REAL do print (.track-week-stats) e torna o grid de cards
   (.track-grid) fluido. No 809 isso foi aplicado ao .bwk-stats (outra aba),
   por isso "não funcionava" na tela do Acompanhamento.
   ════════════════════════════════════════════════════════════════════════ */

/* Grid de cards do Acompanhamento — fluido (era repeat(2)/repeat(3) fixo) */
.track-grid{grid-template-columns:repeat(auto-fit,minmax(min(360px,100%),1fr))}

/* "Resumo semanal" do Acompanhamento — tiles fluidos + cor por função */
.track-week-stats{grid-template-columns:repeat(auto-fit,minmax(76px,1fr))}
.track-week-stats>div[data-fn]{--fn:var(--accent)}
.track-week-stats>div[data-fn="weight"]{--fn:var(--fn-weight)}
.track-week-stats>div[data-fn="exercise"]{--fn:var(--fn-exercise)}
.track-week-stats>div[data-fn="water"]{--fn:var(--fn-water)}
.track-week-stats>div[data-fn="meals"]{--fn:var(--fn-meals)}
.track-week-stats>div[data-fn="doses"]{--fn:var(--fn-doses)}
.track-week-stats>div[data-fn="symptoms"]{--fn:var(--fn-symptoms)}
.track-week-stats>div[data-fn="measures"]{--fn:var(--fn-measures)}
.track-week-stats>div[data-fn] span{color:var(--fn)}
.track-week-stats>div[data-fn] svg{stroke-width:2.1}
.track-week-stats>div[data-fn]{
  background:color-mix(in srgb,var(--fn) 12%, var(--panel));
  border:1px solid color-mix(in srgb,var(--fn) 24%, transparent);
}

/* ════════════════════════════════════════════════════════════════════════
   alpha.811 — Masonry fluido nos cards do dashboard de saúde.
   Pedido do dono: "não quero esses espaços" — cards de alturas diferentes
   deixavam vãos (grid com align-items:start). Layout em colunas (multicol)
   empacota os cards sem deixar espaço sobrando; column-width = FLUIDO
   (o nº de colunas se ajusta à largura) e break-inside:avoid mantém cada
   card inteiro. Substitui o grid auto-fit nestes contêineres de cards.
   ════════════════════════════════════════════════════════════════════════ */
.track-grid, .home-grid, .body-dash-grid{
  display:block;
  column-width:340px;
  column-gap:14px;
}
.track-grid > *, .home-grid > *, .body-dash-grid > *{
  break-inside:avoid;
  -webkit-column-break-inside:avoid;
  width:100%;
  margin:0 0 14px;
}

/* ════════════════════════════════════════════════════════════════════════
   alpha.812 — Estender o alinhamento dinâmico a TODA a interface + cor por
   função nas métricas do topo da calculadora.
   GRIDS FIXOS RESTANTES → auto-fit (refluem por largura, sem colunas fixas):
   dash-cards (dashboard ERP), dm-summary/dcost-grid (resumo de dose),
   settings-quick-grid/column-config-grid (ERP), exg-grid (exercícios),
   body-results-row (resultados da calc). Forms/kanban/login NÃO entram.
   ════════════════════════════════════════════════════════════════════════ */
.dash-cards{grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))}
.dm-summary{grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr))}
.dcost-grid{grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr))}
.settings-quick-grid{grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr))}
.column-config-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.exg-grid{grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr))}
.body-results-row{grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr))}

/* Métricas do topo da calculadora — peso (azul) e doses (violeta), no mesmo
   padrão de "chip" do ícone (perdido=verde e IMC=azul já existiam). */
.body-metric-card.bm-fn-weight .bm-icon{background:color-mix(in srgb,var(--fn-weight) 14%,transparent);color:var(--fn-weight)}
.body-metric-card.bm-fn-doses .bm-icon{background:color-mix(in srgb,var(--fn-doses) 14%,transparent);color:var(--fn-doses)}

/* ════════════════════════════════════════════════════════════════════════
   alpha.813 — Barra principal da calculadora: ícone de cada grupo colorido
   por função (só quando NÃO ativo; o ativo mantém contraste sobre o accent).
   ════════════════════════════════════════════════════════════════════════ */
.calc-group-btn:not(.on)[data-group="inicio"]   svg{color:var(--accent)}
.calc-group-btn:not(.on)[data-group="calc"]     svg{color:var(--fn-doses)}
.calc-group-btn:not(.on)[data-group="medidas"]  svg{color:var(--fn-measures)}
.calc-group-btn:not(.on)[data-group="exercicio"] svg{color:var(--fn-exercise)}
.calc-group-btn:not(.on)[data-group="saude"]    svg{color:var(--fn-symptoms)}
.calc-group-btn:not(.on)[data-group="nutricao"] svg{color:var(--fn-meals)}
.calc-group-btn:not(.on)[data-group="peptideos"] svg{color:var(--fn-water)}
/* sub-aba "Dose": seringa violeta (a seta também aponta para ela) */
.calc-tab-btn:not(.active)[data-tab="dose"] svg{color:var(--fn-doses)}

/* ════════════════════════════════════════════════════════════════════════
   alpha.815 — Sub-abas da calculadora: ícone colorido por função quando
   inativo (mesmo padrão da barra principal). ATENÇÃO: espaço antes de "svg"
   (descendente) — sem ele vira seletor composto e não casa (pegadinha 814).
   ════════════════════════════════════════════════════════════════════════ */
.calc-tab-btn:not(.active)[data-tab="dose"]       svg{color:var(--fn-doses)}
.calc-tab-btn:not(.active)[data-tab="reverse"]    svg{color:var(--fn-doses)}
.calc-tab-btn:not(.active)[data-tab="proto"]      svg{color:var(--accent)}
.calc-tab-btn:not(.active)[data-tab="body"]       svg{color:var(--fn-measures)}
.calc-tab-btn:not(.active)[data-tab="conquistas"] svg{color:var(--accent)}
.calc-tab-btn:not(.active)[data-tab="exams"]      svg{color:var(--fn-weight)}
.calc-tab-btn:not(.active)[data-tab="meds"]       svg{color:var(--fn-symptoms)}
.calc-tab-btn:not(.active)[data-tab="meals"]      svg{color:var(--fn-meals)}
.calc-tab-btn:not(.active)[data-tab="track"]      svg{color:var(--fn-measures)}
.calc-tab-btn:not(.active)[data-tab="peptides"]   svg{color:var(--fn-water)}
.calc-tab-btn:not(.active)[data-tab="activity"]   svg{color:var(--fn-exercise)}

/* ════════════════════════════════════════════════════════════════════════
   alpha.816 — Dock de ações rápidas: COR POR FUNÇÃO + DINÂMICA por grupo.
   Cada ação carrega seu token --qa (por data-qa); o ícone usa essa cor sempre
   (inclusive no hover). A ação PRINCIPAL do grupo ganha pílula tonal + rótulo
   na cor. O JS (index.php ~8200) decide quais aparecem por grupo. Espaço antes
   de "svg" (descendente) — pegadinha do 814.
   ════════════════════════════════════════════════════════════════════════ */
.calc-qa[data-qa="weight"]   {--qa:var(--fn-weight)}
.calc-qa[data-qa="dose"]     {--qa:var(--fn-doses)}
.calc-qa[data-qa="exams"]    {--qa:var(--fn-measures)}
.calc-qa[data-qa="meals"]    {--qa:var(--fn-meals)}
.calc-qa[data-qa="water"]    {--qa:var(--fn-water)}
.calc-qa[data-qa="activity"] {--qa:var(--fn-exercise)}
.calc-qa svg{color:var(--qa)}
.calc-qa:hover{background:color-mix(in srgb,var(--qa) 14%,transparent);color:var(--qa)}
.calc-qa.qa-primary{background:color-mix(in srgb,var(--qa) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--qa) 55%,transparent)}
.calc-qa.qa-primary span{color:var(--qa)}

/* alpha.817 — sub-aba Análise de fotos (cor por função) */
.calc-tab-btn:not(.active)[data-tab="photos"] svg{color:var(--fn-doses)}

/* ════ alpha.818 — Fotos por parte do corpo (grade responsiva + tiles) ════ */
.bpp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:14px 0 4px}
.bpp-tile{position:relative;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--panel-2);display:flex;flex-direction:column}
.bpp-tile.bpp-ready{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
.bpp-thumb{aspect-ratio:3/4;background:#0d0f14;display:flex;align-items:center;justify-content:center;overflow:hidden}
.bpp-thumb img{width:100%;height:100%;object-fit:cover}
.bpp-ph{color:var(--muted);font-size:11px}
.bpp-info{padding:7px 9px 3px}
.bpp-name{font-weight:700;font-size:13px;line-height:1.2}
.bpp-cnt{font-size:11px;color:var(--muted);margin-top:1px}
.bpp-acts{display:flex;gap:6px;padding:6px 9px 9px;margin-top:auto}
.bpp-b{flex:1;border:1px solid var(--line);background:var(--panel);border-radius:var(--r-sm);padding:6px 0;font-size:14px;line-height:1;cursor:pointer;transition:.12s ease}
.bpp-b:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.bpp-tile.bpp-busy{opacity:.55;pointer-events:none}
@media(max-width:520px){.bpp-grid{grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px}.bpp-b{font-size:13px}}

/* ════ alpha.819 — Comparar evolução por região (slider .ba-* reusado + resultado IA) ════ */
.bppc-controls{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}
.bppc-f{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);flex:1;min-width:120px}
.bppc-empty{color:var(--muted);font-size:13px;background:var(--panel-2);border:1px dashed var(--line);border-radius:var(--r-sm);padding:14px;text-align:center;margin:12px 0}
#bppcSlider{max-width:420px;margin:10px auto}
.bppc-actions{margin:12px 0 4px;text-align:center}
.bppc-status{font-size:13px;color:var(--muted);margin:8px 0;text-align:center}
.bppc-result{margin-top:8px}
.bppc-score{font-size:13px;color:var(--muted);margin:4px 0}
.bppc-score b{font-size:24px;color:var(--accent)}
.bppc-resumo{font-size:14px;margin:6px 0;line-height:1.5}
.bppc-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;margin:5px 0}
.bppc-row>span{font-weight:700}
.bppc-row small{color:var(--muted)}
.bppc-tend{display:inline-block;padding:1px 9px;border-radius:999px;font-size:11px;font-weight:700}
.bppc-tend.pos{background:color-mix(in srgb,var(--green) 18%,transparent);color:var(--green)}
.bppc-tend.neg{background:color-mix(in srgb,var(--red) 18%,transparent);color:var(--red)}
.bppc-tend.neu{background:var(--panel-2);color:var(--muted)}
.bppc-list{margin:6px 0 6px 18px;font-size:13px;line-height:1.5}
.bppc-block{margin:8px 0}
.bppc-block ul{margin:4px 0 0 18px;font-size:13px;line-height:1.5}
.bppc-aviso{font-size:12px;color:var(--muted);margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
.bppc-raw{white-space:pre-wrap;font-size:12px;background:var(--panel-2);padding:10px;border-radius:var(--r-sm)}

/* ════ alpha.820 — clique na miniatura + análise geral (visão personal/endócrino) ════ */
.bpp-thumb{cursor:pointer}
.bpp-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0 2px}
.bpp-hint{font-size:12px;color:var(--muted)}
.bppc-lens{margin:10px 0;padding:10px 12px;border-radius:var(--r-sm);border:1px solid var(--line)}
.bppc-lens>strong{display:block;margin-bottom:4px;font-size:13px}
.bppc-lens p{margin:0 0 6px;font-size:13px;line-height:1.5}
.bppc-lens ul{margin:0 0 0 18px;font-size:13px;line-height:1.5}
.bppc-lens-t{background:color-mix(in srgb,var(--fn-exercise,#f97316) 9%,transparent);border-color:color-mix(in srgb,var(--fn-exercise,#f97316) 35%,var(--line))}
.bppc-lens-e{background:color-mix(in srgb,var(--fn-weight,#4f6ef7) 9%,transparent);border-color:color-mix(in srgb,var(--fn-weight,#4f6ef7) 35%,var(--line))}

/* alpha.835 - previsao de entrega em destaque: badge dourado + anel pulsante (is-eta) / verde no entregue (is-done) */
.track-summary-eta{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.track-summary-eta.is-eta strong,.track-summary-eta.is-done strong{display:inline-flex;align-items:center;gap:8px;font-size:18px;font-weight:950;margin-top:5px;padding:6px 14px;border-radius:var(--r-pill);text-decoration:none;line-height:1.15}
.track-summary-eta.is-eta strong{color:var(--accent);background:rgba(var(--accent-rgb),.14);border:1.5px solid rgba(var(--accent-rgb),.40)}
.track-summary-eta.is-eta strong::before{content:'';width:9px;height:9px;border-radius:50%;flex:none;background:var(--accent);animation:trackEtaPulse 1.8s ease-out infinite}
@keyframes trackEtaPulse{0%{box-shadow:0 0 0 0 rgba(var(--accent-rgb),.55)}70%{box-shadow:0 0 0 9px rgba(var(--accent-rgb),0)}100%{box-shadow:0 0 0 0 rgba(var(--accent-rgb),0)}}
.track-summary-eta.is-done strong{color:#16a34a;background:rgba(34,197,94,.14);border:1.5px solid rgba(34,197,94,.40)}
@media (prefers-reduced-motion:reduce){.track-summary-eta.is-eta strong::before{animation:none}}

/* alpha.838 (Etapa 2) — swatch da cor do filamento na linha do carrinho */
.store-cart-fil{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;color:var(--text);margin:3px 0}
.store-cart-sw{width:15px;height:15px;border-radius:50%;border:1px solid rgba(0,0,0,.28);flex:none;display:inline-block}

/* alpha.841 - cadastro de filamento: Aparencia na loja (circulo HEX + foto da cor impressa) */
.mat-appearance{border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;margin:0}
.mat-appearance>legend{font-size:13px;font-weight:900;padding:0 8px;color:var(--accent)}
.mat-appearance-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:640px){.mat-appearance-grid{grid-template-columns:1fr}}
.mat-opt{display:flex;flex-direction:column;gap:8px}
.mat-opt-h{font-size:12.5px;font-weight:900}
.mat-opt-row{display:flex;align-items:center;gap:10px}
.mat-opt-row input[type=color]{width:46px;height:40px;padding:2px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);cursor:pointer}
.mat-hex-circle{width:38px;height:38px;border-radius:50%;border:2px solid var(--line);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);flex:none}
.mat-opt-row code{font-size:12px;font-weight:800;color:var(--muted)}
.mat-presets{display:flex;flex-wrap:wrap;gap:7px}
.mat-preset{width:24px;height:24px;border-radius:50%;border:2px solid var(--line);cursor:pointer;padding:0;transition:.12s}
.mat-preset:hover{transform:scale(1.14);border-color:var(--accent)}
.mat-photo-prev{width:58px;height:58px;border-radius:var(--r-sm);border:1px dashed var(--line);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;flex:none}
.mat-photo-ph{font-size:9px;font-weight:800;color:var(--muted);text-transform:uppercase;text-align:center;line-height:1.2}

/* alpha.843 - filamento bi/tricolor: contador de cores + inputs Cor 1/2/3 (circulo conic = previa) */
.mat-count{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;width:fit-content}
.mat-count-b{border:0;border-right:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:12px;font-weight:800;padding:7px 13px;cursor:pointer;transition:.12s}
.mat-count-b:last-of-type{border-right:0}
.mat-count-b.on{background:var(--accent);color:var(--accent-text,#1a1207)}
.mat-hex-inputs{display:flex;gap:12px;align-items:flex-end}
.mat-hexin{display:flex;flex-direction:column;align-items:center;gap:3px}
.mat-hexin small{font-size:10px;font-weight:800;color:var(--muted)}

/* alpha.885 — tooltip global [data-zk-tip]: botao de ajuda (?) + balao escuro (igual nos 2 temas). Desktop hover/foco, mobile toque. */
.zk-tip-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;min-width:16px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink-soft,var(--muted));font-weight:850;font-size:10px;line-height:1;cursor:help;padding:0;flex:0 0 auto;transition:background .12s,color .12s,border-color .12s}
.zk-tip-btn::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:32px;height:32px} /* alpha.885 — area de toque >=WCAG 24px sem inchar o visual */
.pz-ds-head .zk-tip-btn{margin-left:auto}
.zk-tip-btn:hover,.zk-tip-btn:focus-visible{background:var(--accent,#B5713A);color:#fff;border-color:transparent;outline:none}
.zk-tip-btn:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#B5713A) 30%,transparent)}
[data-zk-tip]{cursor:help}
.zk-tip-pop{position:absolute;z-index:2147483000;max-width:260px;background:#2a2622;color:#fff;font-size:12.5px;font-weight:600;line-height:1.42;padding:8px 11px;border-radius:9px;box-shadow:0 10px 30px rgba(0,0,0,.28);pointer-events:none}
.zk-tip-pop[hidden]{display:none}
.zk-tip-pop::after{content:"";position:absolute;left:var(--zk-tip-ax,50%);transform:translateX(-50%);border:6px solid transparent;border-top-color:#2a2622;bottom:-11px}
.zk-tip-pop.below::after{bottom:auto;top:-11px;border-top-color:transparent;border-bottom-color:#2a2622}
.mat-hexin input[type=color]{width:42px;height:38px;padding:2px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);cursor:pointer}

/* ───────────────────────────────────────────────────────────────────────────
   alpha.903 — BOTÕES MENOS ARREDONDADOS (pedido do dono: "mesma estética em todos
   os botões"). Abas/chips/botões de ação que eram pílula (--r-pill = 999px) viram
   12px (--r-sm), igual aos demais botões/cards. MANTIDOS redondos de propósito:
   badges/pílulas de STATUS, dots/indicadores, thumbs de switch (mg/mcg incluso),
   scrollbars, avatares, barras de progresso, selos ::after, códigos. Override no
   fim do arquivo: mesmos seletores → vence por ordem de cascata.
   (Classificação: revisão dedicada dos ~106 usos de --r-pill no style.css.)
   ─────────────────────────────────────────────────────────────────────────── */
.topnav a,.nav-group .nav-trigger,.pub-nav a,.calc-next-btn,.calc-chip,.pep-calc-chip,.med-chip,.med-log-btn,.cb-act-btn,.cb-add,.track-share-btn,.zk-bug-fab,.store-cat,.pub-user-chip,.bf7-sex,.body-tag-chip span,.color-chip,.status-menu-trigger,.act-trend-metrics,.act-trend-mt,.actlog-cat{border-radius:var(--r-sm)}
.act-hist-pdf.btn,.act-hist-pdf.btn.small,#actGoalsEditBtn.btn,#actGoalsEditBtn.btn.ghost,#actGoalsEditBtn.btn.small{border-radius:var(--r-sm)!important} /* usavam 999px !important */
@media(max-width:768px){.settings-side-nav a{border-radius:var(--r-sm)!important}} /* pílula só no mobile, com !important */
/* alpha.938 — MOTION UNIFICADO (Fase 2): todo controle/menu usa a MESMA transição (var(--transition) = 140ms + ease-standard).
   Antes cada um tinha .12/.13/.14/.15/.16s soltos → "feel" diferente por superfície. Vence por cascata (fim do arquivo).
   NÃO toca em @keyframes/loaders/pulses (esses são animation, não transition). */
.btn,.btn.small,.icon-btn,.calc-chip,.pep-calc-chip,.med-chip,.calc-group-btn,.calc-tab-btn,
.calc-qa,.calc-next-btn,.store-cat,.cb-act-btn,.cb-add,.color-chip,.status-menu-trigger,
.pn-viewtoggle a,.track-share-btn,.topnav a,.nav-group .nav-trigger,.pub-nav a,
.sidenav-tree-trigger,.sidenav-tree-item,.sidenav-tree-subitem,.dropdown-panel a{transition:var(--transition)}
/* alpha.939 — MENUS unificados (Fase 3): UM hover (--hover-tint, 8% accent) em vez de 5/7/10/12% soltos,
   e o menu PRIMÁRIO público (top nav) com estado ativo PREENCHIDO dourado — igual ao .calc-group-btn.on
   da calc (o dono já aprovou esse "ativo dourado" no alpha.934). Vence por cascata. */
.pub-nav a:hover,.topnav a:hover,.nav-group:hover .nav-trigger,.nav-group:focus-within .nav-trigger,
.nav-group.active .nav-trigger,.sidenav-tree-trigger:hover,.sidenav-tree-item:hover,
.sidenav-tree-subitem:hover,.dropdown-panel a:hover{background:var(--hover-tint)}
.pub-nav a.pub-active{background:var(--accent);color:var(--accent-text,#1a1207);border-color:var(--accent);font-weight:850}
/* alpha.945 — seletor de método de pagamento no checkout (Pix × Cartão/Checkout Pro) */
.co-paymethod{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0}
.co-pm{flex:1 1 160px;display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;cursor:pointer;font-weight:800;color:var(--text);transition:var(--transition)}
.co-pm:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.co-pm:has(input:checked){border-color:var(--accent);background:var(--hover-tint)}
.co-pm input{accent-color:var(--accent);width:auto}
.co-pm-ic{font-size:18px}
/* alpha.951 — formulário de cartão transparente (Efí) no checkout */
.co-cardform{display:grid;gap:10px;margin:4px 0 6px;padding:14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--hover-tint)}
.co-cardform label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:700;color:var(--text)}
.co-cardform input,.co-cardform select{font-weight:500}
.co-card-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.co-card-sec{font-size:11px;margin:2px 0 0}
/* alpha.966 — campos seguros (iframes) do MP.js: o div recebe o iframe do MP; estiliza como input */
.co-cardform .mp-field{width:100%;min-height:44px;border:1px solid var(--line);border-radius:var(--r-sm);padding:0 12px;display:flex;align-items:center;background:var(--panel)}/* alpha.1020 — era #fff (pílula branca no checkout dark); o texto do iframe recebe --text via fldStyle no JS */
.co-cardform .mp-field iframe{width:100%;height:24px;border:0}

/* alpha.906 — barra de abas das SEÇÕES das Configurações (renderizada pelo initSettingsHashRouter). Antes vários
   painéis (ex.: "Arquiteto da Calculadora") não tinham aba clicável — só via hash na URL. Agora todos têm aba. */
.cfg-panel-nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch;padding:2px 0 12px;margin:0 0 6px;border-bottom:1px solid var(--line)}
.cfg-panel-nav-btn{white-space:nowrap;padding:8px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);color:var(--muted);font:inherit;font-weight:800;font-size:13px;cursor:pointer;transition:.14s ease;flex:0 0 auto}
.cfg-panel-nav-btn:hover{color:var(--text);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.cfg-panel-nav-btn.is-active{background:color-mix(in srgb,var(--accent) 15%,var(--panel));border-color:var(--accent);color:var(--accent)}

/* alpha.907 — hub "Saúde": cards-link das sub-categorias de configuração */
.health-hub-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))!important}
.health-hub-grid a.tool-card{display:block;text-decoration:none;color:inherit;cursor:pointer;transition:.15s ease}
.health-hub-grid a.tool-card:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));transform:translateY(-2px);box-shadow:0 8px 18px rgba(var(--accent-rgb),.13)}
.health-hub-grid a.tool-card h3{display:flex;align-items:center;gap:6px}

/* ===== alpha.929 — calc: espaçamento garantido + indicador deslizante ("se fundindo", estilo switch mg/mcg) ===== */
/* a cascata de .calc-chips/.calc-preset-grid (3 regras) deixava display:block (gap não aplica) e gap=6px → grudado. */
.calc-chips{display:flex !important;flex-wrap:wrap;gap:10px !important;align-items:center;position:relative}
.calc-preset-grid{gap:14px !important;position:relative}
@media(max-width:600px){.calc-chips{gap:9px !important}.calc-preset-grid{gap:10px !important}}
/* indicador: thumb que desliza p/ o item ativo (mesma vibe do .calc-dose-unit::before) */
.zk-pick-ind{position:absolute;left:0;top:0;z-index:0;pointer-events:none;border-radius:var(--r-pill);background:color-mix(in srgb,var(--accent) 18%,var(--panel));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 34%,transparent),0 1px 3px rgba(0,0,0,.14);opacity:0;transition:transform .26s cubic-bezier(.4,0,.2,1),width .26s cubic-bezier(.4,0,.2,1),height .26s cubic-bezier(.4,0,.2,1),opacity .18s;will-change:transform,width,height}
.calc-preset-grid .zk-pick-ind{border-radius:var(--r-md)}
.calc-chips .calc-chip-lbl,.calc-preset-grid .calc-preset-btn{position:relative;z-index:1}
/* item ativo cede o fundo p/ o thumb (evita fundo duplo) — só quando o indicador está ligado no grupo */
.zk-ind-on.calc-chips .calc-chip-lbl input:checked+.calc-chip{background:transparent;border-color:transparent;color:var(--accent)}
.zk-ind-on.calc-preset-grid .calc-preset-btn.active{background:transparent;border-color:transparent;box-shadow:none}
@media(prefers-reduced-motion:reduce){.zk-pick-ind{transition:opacity .18s}}
/* alpha.930 — CAUSA RAIZ do "grudado": a regra do wizard `.calc-step .calc-chips{display:revert!important}` (style.css ~10720, @media≥769px) virava os chips/grid em BLOCK no desktop → gap ignorado (chips colados a 0px). Reforça flex com a MESMA especificidade (0,2,0) no MESMO media → fonte posterior vence; o gap (10/14px) das regras acima passa a aplicar. */
@media (min-width: 769px){
  .calc-step .calc-chips{display:flex !important}
  .calc-step .calc-preset-grid{display:flex !important}
}

/* ===== Auditoria UI 2026 (F1–F7) — refino minimalista: hairline > sombra · número tabular · status cirúrgico ===== */
:root{ --mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; }       /* F7 — mono único (substitui 'Courier New') */
:root{ --amber:#f59e0b; --slate:#64748b; }                                                       /* F3 — tokens que faltavam (status paused/canceled) */
.card{ box-shadow:none !important; }                                                             /* F1 — hairline puro (era 0 18px 45px) */
.dash-card{ box-shadow:none !important; }                                                        /* F1 */
.card:hover, a.dash-card:hover{ box-shadow:0 2px 10px rgba(var(--shadow-rgb),.05) !important; }  /* sussurro só no hover */
.metric{ border-top-width:3px !important; }                                                      /* F2 — 4px→3px, alinha com as faixas de status */
.metric strong, .dash-card-val{ font-variant-numeric:tabular-nums; letter-spacing:-.015em; }    /* F6 — dígitos alinhados, tracking menos agressivo */
.orders-table td{ font-variant-numeric:tabular-nums; }                                           /* F6 — colunas numéricas alinhadas */
.orders-table tbody tr[class*="status-row-"]{ background:transparent; }                          /* F4 — a barra 3px é o ÚNICO sinal; fundo tingido sai */
/* ════════════════════════════════════════════════════════════════
   alpha.977 — Painel RESULTADO da calc modernizado (CSS-only override)
   Anel vira PROGRESSO real (--ring-pct vem do JS = % da seringa);
   duração = 2 tiles; detalhes = lista agrupada; frequência = segmentado.
   Nenhuma mudança de lógica/markup além da classe .calc-result-head.
   ════════════════════════════════════════════════════════════════ */

/* Header eyebrow com hairlines laterais (substitui o h3 inline antigo) */
.calc-result-head{display:flex;align-items:center;gap:12px;margin:0 0 18px;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.16em;font-weight:850;text-align:center}
.calc-result-head::before,.calc-result-head::after{content:'';flex:1;height:1px}
.calc-result-head::before{background:linear-gradient(90deg,transparent,var(--line))}
.calc-result-head::after{background:linear-gradient(90deg,var(--line),transparent)}

/* Painel: sai a borda dourada dura de 3px (alpha.13986), entra lavagem sutil no topo */
.calc-result-panel{border-top:1px solid var(--line);background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 6%,var(--panel)),var(--panel) 150px)}

/* Anel = arco de progresso (JS grava --ring-pct 0–100). @property permite animar o arco. */
@property --ring-pct{syntax:'<number>';inherits:false;initial-value:0}
.calc-result-ring{transition:--ring-pct .7s cubic-bezier(.22,1,.36,1),background .4s ease,box-shadow .4s ease}
.calc-result-ring.calc-ring-active:not(.calc-ring-overflow){
  background:conic-gradient(var(--accent) calc(var(--ring-pct,100)*3.6deg),color-mix(in srgb,var(--accent) 14%,transparent) 0);
  box-shadow:0 14px 34px -14px rgba(var(--accent-rgb),.5);
}
.calc-result-ring.calc-ring-active::before{background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--accent) 9%,var(--panel)),var(--panel) 72%)}
.calc-result-big{font-variant-numeric:tabular-nums;letter-spacing:-.04em}

/* Duração do frasco: barra única → 2 tiles de estatística */
.calc-duration{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0;margin:14px 0;background:transparent;border:none}
.calc-dur-dot{display:none}
.calc-dur-item{padding:12px 8px;gap:3px;border-radius:var(--r-md);background:color-mix(in srgb,var(--accent) 8%,var(--panel-2));border:1px solid color-mix(in srgb,var(--accent) 18%,transparent)}
.calc-dur-item strong{font-size:24px;font-variant-numeric:tabular-nums}

/* Leitura da seringa: pílula central */
.calc-syringe-readout{width:max-content;margin:0 auto;padding:5px 14px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-pill)}

/* Detalhes: 3 pílulas soltas → cartão agrupado com divisórias hairline */
.calc-details{gap:0;margin-top:16px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.calc-detail-row{background:transparent;border-radius:0;padding:11px 14px}
.calc-detail-row+.calc-detail-row{border-top:1px solid var(--line)}
.calc-detail-row strong{font-variant-numeric:tabular-nums}

/* Frequência: chips soltos → controle segmentado (escopado; NÃO afeta chips dos passos) */
.calc-freq-chips{flex-wrap:nowrap;gap:3px;padding:4px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-pill)}
.calc-freq-chips .calc-chip-lbl{flex:1;min-width:0}
.calc-freq-chips .calc-chip{width:100%;justify-content:center;min-width:0;padding:8px 4px;font-size:11.5px;background:transparent;border-color:transparent;border-radius:var(--r-pill)}
.calc-freq-chips .calc-chip:hover{color:var(--text);border-color:transparent}
/* o estado checked (fundo accent) já vence por especificidade da regra base (0,3,1) */

@media(max-width:768px){
  .calc-freq-chips .calc-chip{padding:9px 2px;font-size:11px;min-width:0}
}
/* alpha.977 — fallback i18n: it-IT ('Giornaliero','1×/sett.') não cabe em 5 segmentos de ~50px a 375px.
   Segmento nunca encolhe abaixo do texto; se a soma estourar, o grupo rola na horizontal (scrollbar oculta). */
.calc-freq-chips{overflow-x:auto;scrollbar-width:none}
.calc-freq-chips::-webkit-scrollbar{display:none}
.calc-freq-chips .calc-chip-lbl{flex:1 0 auto}

/* ── alpha.978 — Acúmulo mais claro: frase-resumo + sublabel nos KPIs + eixo X de tempo ── */
.ac-summary{margin:0 0 12px;padding:12px 14px;font-size:13.5px;line-height:1.6;font-weight:650;color:var(--text);background:color-mix(in srgb,var(--accent) 7%,var(--panel-2));border:1px solid color-mix(in srgb,var(--accent) 20%,transparent);border-radius:var(--r-md)}
.ac-summary strong{color:var(--accent);font-weight:900;font-variant-numeric:tabular-nums;white-space:nowrap}
.ac-stat .ac-sub{font-size:10px;color:var(--muted);font-weight:650;line-height:1.35}
.ac-xaxis{display:flex;justify-content:space-between;font-size:10px;font-weight:800;color:var(--muted);padding:3px 0 0}

/* alpha.981 — Acúmulo sincronizado com a calc: badge no cabeçalho + aviso */
.ac-sum-badge{display:inline-flex;align-items:center;margin-left:8px;padding:2px 9px;border-radius:var(--r-pill);font-size:11px;font-weight:800;background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent);vertical-align:middle}
.ac-sum-badge[hidden]{display:none} /* alpha.996 — restaura o guard perdido com o bloco .ct-tab (author display:inline-flex vencia o [hidden] do UA → pill vazio) */
.ac-synced{margin:0 0 12px;font-size:12px;font-weight:650;color:var(--accent);display:flex;align-items:center;gap:6px}
.ac-synced::before{content:'🔗';font-size:12px}

/* ── alpha.982 — Guia de dosagem (card colapsável na aba Dose; padrão .calc-accum) ── */
.calc-dguide{border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel);margin:14px 0 0;overflow:hidden}
.calc-dguide>summary{display:flex;align-items:center;gap:9px;padding:14px 16px;cursor:pointer;font-weight:850;font-size:14px;list-style:none}
.calc-dguide>summary::-webkit-details-marker{display:none}
.calc-dguide>summary::after{content:'';margin-left:auto;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .2s ease}
.calc-dguide[open]>summary::after{transform:rotate(-135deg)}
.dg-ico{font-size:16px}
.dg-count{margin-left:6px;padding:1px 8px;border-radius:var(--r-pill);font-size:11px;font-weight:800;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent)}
.dg-body{padding:0 16px 16px}
.dg-disc{margin:0 0 12px;padding:10px 12px;font-size:11.5px;line-height:1.5;color:var(--muted);background:color-mix(in srgb,var(--accent) 5%,var(--panel-2));border:1px solid var(--line);border-radius:var(--r-sm)}
.dg-search{width:100%;margin-bottom:8px}
.dg-taphint{margin:0 0 12px;font-size:11px;color:var(--accent);font-weight:700}
.dg-cats{display:grid;gap:16px}
.dg-cat-h{margin:0 0 8px;font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.04em;color:var(--text);display:flex;align-items:center;gap:6px}
.dg-cat-n{margin-left:auto;font-size:11px;font-weight:700;color:var(--muted)}
.dg-rows{display:grid;gap:6px}
.dg-row{display:grid;gap:3px;width:100%;text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel-2);cursor:pointer;transition:.12s ease;font:inherit}
.dg-row:hover{border-color:color-mix(in srgb,var(--accent) 45%,transparent);background:color-mix(in srgb,var(--accent) 6%,var(--panel-2))}
.dg-row-top{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.dg-name{font-size:13.5px;font-weight:850;color:var(--text)}
.dg-pres{font-size:11px;font-weight:750;color:var(--accent);font-variant-numeric:tabular-nums}
.dg-meta{font-size:11.5px;color:var(--muted);font-weight:600;display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.dg-dose{color:var(--text);font-weight:800}
.dg-sep{opacity:.4}
.dg-note{font-size:11px;color:var(--muted);line-height:1.4}
.dg-empty{font-size:12px;color:var(--muted);text-align:center;padding:12px}

/* ── alpha.984 — Guias de referência (calc: card com tabs; wiki: artigos). Fonte/estilo únicos. ── */
.calc-rguides{border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel);margin:14px 0 0;overflow:hidden}
.calc-rguides>summary{display:flex;align-items:center;gap:9px;padding:14px 16px;cursor:pointer;font-weight:850;font-size:14px;list-style:none}
.calc-rguides>summary::-webkit-details-marker{display:none}
.calc-rguides>summary::after{content:'';margin-left:auto;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .2s ease}
.calc-rguides[open]>summary::after{transform:rotate(-135deg)}
.rg-ico{font-size:16px}
.rg-body{padding:0 16px 16px}
.rg-tabs{display:flex;flex-wrap:wrap;gap:4px;padding:4px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-pill);margin-bottom:14px}
.rg-tab{flex:1;min-width:0;padding:8px 10px;border:none;background:transparent;border-radius:var(--r-pill);font:inherit;font-size:12.5px;font-weight:800;color:var(--muted);cursor:pointer;white-space:nowrap;transition:.12s ease}
.rg-tab:hover{color:var(--text)}
.rg-tab.on{background:var(--accent);color:var(--accent-text,#1a1207)}
.rg-panel{display:none}
.rg-panel.on{display:block;animation:rg-fade .25s ease}
@keyframes rg-fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
/* Blocos (compartilhados calc + wiki) */
.rg-h{margin:16px 0 6px;font-size:13px;font-weight:850;color:var(--text)}
.rg-p{margin:0 0 10px;font-size:13px;line-height:1.6;color:var(--text)}
.rg-list{margin:0 0 10px;padding-left:18px;display:grid;gap:4px}
.rg-list li{font-size:13px;line-height:1.5;color:var(--text)}
.rg-note{margin:10px 0;padding:10px 12px;font-size:12px;line-height:1.5;color:var(--text);background:color-mix(in srgb,var(--accent) 8%,var(--panel-2));border-left:3px solid var(--accent);border-radius:0 var(--r-sm) var(--r-sm) 0}
/* alpha.1058/1061 — table-layout:fixed QUEBRA linha (constrange à largura); na WIKI (860px) a tabela cabe → SEM scrollbar (a queixa do dono). overflow-x:auto de volta só como rede de segurança no CALC (painel mais estreito, ~768px): lá a tabela ainda estoura e precisa rolar DENTRO do wrap p/ não vazar do painel (sem ele, vazava ~18px). */
.rg-tblwrap{margin:0 0 10px;overflow-x:auto;min-width:0}
.rg-tbl{width:100%;min-width:0;border-collapse:collapse;font-size:12.5px;table-layout:fixed}
.rg-tbl th{text-align:left;padding:8px 10px;font-weight:850;color:var(--muted);text-transform:uppercase;font-size:10.5px;letter-spacing:.03em;border-bottom:1px solid var(--line);vertical-align:top}
.rg-tbl td{padding:8px 10px;border-bottom:1px solid var(--line);color:var(--text);line-height:1.4;vertical-align:top;overflow-wrap:anywhere}
.rg-tbl tr:last-child td{border-bottom:0}
.rg-tbl-k{font-weight:800}
/* alpha.1062 — larguras por nº de colunas (antes as regras eram fixas p/ 3-col e espremiam a tabela de 2-col da Solubilidade) */
.rg-tbl[data-cols="3"] th:first-child,.rg-tbl[data-cols="3"] td:first-child{width:22%}
.rg-tbl[data-cols="3"] th:nth-child(2),.rg-tbl[data-cols="3"] td:nth-child(2){width:18%}
.rg-tbl[data-cols="2"] th:first-child,.rg-tbl[data-cols="2"] td:first-child{width:30%}
/* Wiki: artigos */
.rg-articles{display:grid;gap:22px}
.rg-article{background:var(--panel,#fff);border:1px solid var(--line,#e6e6e6);border-radius:14px;padding:22px 24px}
.rg-article>h2{margin:0 0 12px;font-size:22px;display:flex;align-items:center;gap:8px}
.pz-guides-link{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border:1px solid var(--line,#e6e6e6);border-radius:999px;font-weight:800;font-size:13px;color:var(--accent,#B5713A);text-decoration:none;white-space:nowrap;transition:.12s ease}
.pz-guides-link:hover{background:color-mix(in srgb,var(--accent,#B5713A) 8%,transparent);border-color:var(--accent,#B5713A)}
@media(max-width:600px){.rg-tab{font-size:11.5px;padding:8px 6px}.rg-article{padding:18px 16px}}

/* alpha.990 — preenche o "buraco" da coluna esquerda: os cards colapsáveis (Blend/Acúmulo/Guia de dosagem/Guias
   de referência) foram p/ DENTRO do grid e agora ocupam a COLUNA 1 abaixo do wizard; o painel de resultado
   ocupa a COLUNA 2 (span vertical). No mobile o grid vira 1 coluna → fluxo natural (wizard → resultado → cards). */
@media (min-width: 901px) {
  #tabDose .calc-dose-grid > .calc-result-col { grid-column: 2; grid-row: 1 / 99; }
  #tabDose .calc-dose-grid > .calc-panel.calc-wizard,
  #tabDose .calc-dose-grid > .calc-tools { grid-column: 1; min-width: 0; }
  #tabDose .calc-dose-grid > script,
  #tabDose .calc-dose-grid > datalist { display: none; }
  #tabDose .calc-dose-grid > .calc-tools { margin-top: 0; } /* o gap do grid já espaça */
}

/* alpha.996 — utilitários reorganizados: Acúmulo é card próprio (details, sempre visível, no topo do bloco);
   Blend/Guia/Guias são painéis escondidos, mostrados 1 por vez pelo dropdown "Ferramentas" da barra de abas do topo. */
.calc-tools{margin:8px 0 4px;display:flex;flex-direction:column;gap:10px;min-width:0}/* alpha.1013 — min-width:0 INCONDICIONAL: .calc-tools é item do grid .calc-dose-grid; sem isso, no mobile o min-content da tabela da guia (Pureza etc.) esticava o container p/ 854px e estourava. O min-width:0 do bloco @media(min-width:901px) só valia no desktop. Agora a tabela rola dentro do .rg-tblwrap. */
#calcAccum{order:-1} /* Acúmulo sempre no topo do bloco de utilitários */
.ct-panel{display:block;border:1px solid var(--line);border-radius:var(--r-lg);background:color-mix(in srgb,var(--panel-2) 55%,var(--panel));overflow:hidden;animation:ctFade .2s ease}
.ct-panel[hidden]{display:none} /* o atributo hidden vence a classe (.ct-panel especificidade menor) */
@keyframes ctFade{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
/* alpha.1049 — pulso ao abrir um utilitário (Blend/Guia/Guias): deixa claro que o painel abriu (antes o painel abria ~1700px abaixo e parecia que "nada acontecia"). */
.ct-panel.ct-flash{animation:ctFade .2s ease, ctFlash 1.2s ease}
@keyframes ctFlash{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent)}30%{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 30%,transparent)}100%{box-shadow:0 0 0 0 transparent}}
@media (prefers-reduced-motion: reduce){.ct-panel.ct-flash{animation:none}}
/* alpha.998 — utilitários como BOTÕES DIRETOS na barra de abas (Blend/Guia/Guias), fora do dropdown. Herdam .calc-tab-btn; separador antes + estado ativo .on. */
.calc-tool-sep{align-self:center;flex:0 0 auto;width:1px;height:20px;margin:0 4px;background:var(--line)}
.calc-tool-btn[hidden]{display:none} /* botão sem painel: author .calc-tab-btn venceria o [hidden] do UA */
.calc-tool-btn.on{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:color-mix(in srgb,var(--accent) 12%,var(--panel));box-shadow:0 1px 3px rgba(var(--accent-rgb),.12)}