/* =========================================================
   JUNTTO 2.0 — DESIGN SYSTEM COMPLETO
   Versão consolidada e sem duplicatas
   ========================================================= */

/* =========================================================
   1. VARIÁVEIS GLOBAIS
   ========================================================= */
:root{
  --primary:#28D3AF; --primary-dark:#219d85; --primary-light:#d1fae5;
  --secondary:#FF6B35; --success:#10b981; --danger:#ef4444;
  --bg:#F1F1F1; --card:#ffffff; --card-soft:#f8fafc;
  --border:#e2e8f0; --border-strong:#cbd5e1;
  --text:#1D3557; --text-dim:#475569; --text-mute:#64748b;
  --shadow-sm:0 1px 2px 0 rgba(0,0,0,.05);
  --shadow:0 4px 6px -1px rgba(0,0,0,.08),0 2px 4px -1px rgba(0,0,0,.04);
  --shadow-lg:0 10px 25px -3px rgba(0,0,0,.10),0 4px 6px -2px rgba(0,0,0,.05);
  --r-sm:8px; --r:12px; --r-lg:16px; --r-xl:22px; --r-full:999px;
  --t:.2s cubic-bezier(.2,.8,.2,1);
}

/* =========================================================
   2. RESET / BASE
   ========================================================= */
*{box-sizing:border-box;margin:0;padding:0}
html,body{
  background:var(--bg);color:var(--text);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
img{max-width:100%;display:block}

/* =========================================================
   3. SHELL / SIDEBAR / LAYOUT PRINCIPAL
   ========================================================= */

.shell{display:grid;grid-template-columns:272px 1fr;min-height:100dvh}

/* -------- SIDEBAR -------- */
.sidebar{
  position:sticky;
  top:0;
  height:100dvh;
  padding:22px 18px;
  background:var(--card);
  border-right:1px solid var(--border);
  display:flex;
  flex-direction:column;
  gap:6px;
  overflow-y:auto;
  scrollbar-width:thin;
}
.sidebar::-webkit-scrollbar{width:4px}
.sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}

/* Brand */
.sb-brand{
  display:flex;
  justify-content:center;
  padding:4px 0 18px;
  margin-bottom:4px;
}
.sb-brand img{
  width:118px;
  height:auto;
  object-fit:contain;
  transition:transform .25s cubic-bezier(.2,.8,.2,1);
}
.sb-brand:hover img{transform:scale(1.04)}

/* Botão criar plano */
.sb-create{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:11px 18px;
  border-radius:12px;
  background:var(--primary);
  color:#fff;
  font-weight:700;
  font-size:14px;
  letter-spacing:-.005em;
  box-shadow:0 6px 20px rgba(40,211,175,.35);
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  margin-bottom:14px;
}
.sb-create:hover{
  background:var(--primary-dark);
  transform:translateY(-1px);
  box-shadow:0 10px 28px rgba(40,211,175,.45);
}
.sb-create i{
  font-size:13px;
  transition:transform .2s;
}
.sb-create:hover i{transform:rotate(90deg)}

/* Nav */
.sb-nav{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.sb-section{
  display:flex;
  flex-direction:column;
  gap:2px;
  margin-bottom:14px;
}
.sb-section:last-child{margin-bottom:0}

.sb-section-label{
  display:block;
  font-size:10.5px;
  font-weight:800;
  color:var(--text-mute);
  text-transform:uppercase;
  letter-spacing:.12em;
  padding:6px 14px 6px;
  margin-bottom:2px;
  opacity:.75;
}

/* Links da sidebar */
.sb-link{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  padding:9px 12px;
  border-radius:11px;
  color:var(--text-dim);
  font-size:14px;
  font-weight:500;
  letter-spacing:-.005em;
  transition:all .16s cubic-bezier(.2,.8,.2,1);
  cursor:pointer;
  text-decoration:none;
}

.sb-link:hover{
  background:var(--card-soft);
  color:var(--text);
}
.sb-link:hover .sb-link-icon{
  color:var(--primary-dark);
  transform:scale(1.05);
}

.sb-link.is-active{
  background:linear-gradient(135deg,rgba(40,211,175,.14),rgba(40,211,175,.06));
  color:var(--primary-dark);
  font-weight:700;
}
.sb-link.is-active::before{
  content:'';
  position:absolute;
  left:-18px;
  top:50%;
  transform:translateY(-50%);
  width:3px;
  height:22px;
  border-radius:0 4px 4px 0;
  background:linear-gradient(180deg,var(--primary),var(--primary-dark));
  box-shadow:0 0 10px rgba(40,211,175,.5);
}
.sb-link.is-active .sb-link-icon{
  color:var(--primary-dark);
}

/* Ícone do link */
.sb-link-icon{
  position:relative;
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  font-size:15px;
  color:var(--text-mute);
  flex-shrink:0;
  transition:all .16s cubic-bezier(.2,.8,.2,1);
}
.sb-link-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Badges */
.sb-link-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:2px 7px;
  border-radius:99px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.03em;
  flex-shrink:0;
}
.sb-link-badge-new{
  background:linear-gradient(135deg,#3b82f6,#1d4ed8);
  color:#fff;
  text-transform:uppercase;
  font-size:9px;
  padding:3px 7px;
  letter-spacing:.06em;
}
.sb-link-badge-count{
  background:var(--primary);
  color:#fff;
  min-width:20px;
  height:20px;
  padding:0 6px;
  border-radius:99px;
  font-size:10.5px;
  box-shadow:0 2px 6px rgba(40,211,175,.35);
}

/* Ponto vermelho de notificação */
.sb-dot{
  position:absolute;
  top:-2px;
  right:-2px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#ef4444;
  box-shadow:0 0 0 2px var(--card);
  animation:pulseDot 2s infinite;
}
@keyframes pulseDot{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(1.25);opacity:.75}
}

/* Coroa de embaixador */
.sb-crown{
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border-radius:50%;
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  color:#fff;
  font-size:9px;
  flex-shrink:0;
  box-shadow:0 2px 6px rgba(251,191,36,.4);
}

/* -------- FOOTER (user chip) -------- */
.sb-footer{
  margin-top:auto;
  padding-top:14px;
  border-top:1px solid var(--border);
  display:flex;
  flex-direction:column;
  gap:4px;
}

.sb-user{
  display:flex;
  align-items:center;
  gap:11px;
  padding:10px 10px;
  border-radius:12px;
  border:1px solid transparent;
  transition:all .16s cubic-bezier(.2,.8,.2,1);
  cursor:pointer;
  text-decoration:none;
  color:inherit;
}
.sb-user:hover{
  background:var(--card-soft);
  border-color:var(--border);
}
.sb-user.is-active{
  background:var(--primary-light);
  border-color:var(--primary);
}

.sb-user-avatar{
  position:relative;
  width:36px;
  height:36px;
  flex-shrink:0;
}
.sb-user-avatar img{
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--card);
  box-shadow:0 2px 8px rgba(0,0,0,.08);
}
.sb-user-crown{
  position:absolute;
  bottom:-2px;
  right:-2px;
  width:16px;
  height:16px;
  border-radius:50%;
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:7px;
  border:2px solid var(--card);
  box-shadow:0 2px 4px rgba(251,191,36,.4);
}

.sb-user-info{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  line-height:1.25;
}
.sb-user-info b{
  font-size:13.5px;
  font-weight:700;
  color:var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  letter-spacing:-.005em;
}
.sb-user-info small{
  font-size:11.5px;
  color:var(--text-mute);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.sb-user-arrow{
  color:var(--text-mute);
  font-size:11px;
  flex-shrink:0;
  transition:transform .2s;
}
.sb-user:hover .sb-user-arrow{
  transform:translateX(2px);
  color:var(--primary-dark);
}

/* Botão sair */
.sb-logout{
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px 12px;
  border-radius:11px;
  color:var(--text-mute);
  font-size:13.5px;
  font-weight:600;
  transition:all .16s cubic-bezier(.2,.8,.2,1);
  text-decoration:none;
}
.sb-logout i{
  font-size:13px;
  width:22px;
  text-align:center;
  color:var(--text-mute);
  transition:var(--t);
}
.sb-logout:hover{
  background:#fef2f2;
  color:#b91c1c;
}
.sb-logout:hover i{
  color:#dc2626;
  transform:translateX(2px);
}

/* -------- MAIN -------- */
.main{padding:26px 30px 120px;max-width:1240px;width:100%}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.page-title{font-size:26px;font-weight:800;letter-spacing:-.02em;color:var(--text)}
.page-sub{color:var(--text-mute);font-size:14px;margin-top:2px}

/* -------- Responsivo -------- */
@media (max-width:980px){
  .sidebar{display:none}
}


/* =========================================================
   4. BOTÕES
   ========================================================= */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 20px;border-radius:99px;
  border:1px solid var(--border-strong);background:var(--card);
  font-weight:600;font-size:14px;cursor:pointer;transition:var(--t);
  text-decoration:none;white-space:nowrap;color:var(--text);
}
.btn i{font-size:13px}
.btn:hover{background:var(--card-soft);transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.btn-primary{background:var(--primary);border:none;color:#fff;box-shadow:0 6px 20px rgba(40,211,175,.35)}
.btn-primary:hover{background:var(--primary-dark);box-shadow:0 8px 24px rgba(40,211,175,.45)}
.btn-ghost{background:transparent;border-color:var(--border)}
.btn-block{width:100%}
.btn-sm{padding:8px 14px;font-size:13px}
.btn-lg{padding:14px 24px;font-size:15px}

/* =========================================================
   5. CARDS BASE
   ========================================================= */
.card{
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:20px;box-shadow:var(--shadow-sm);
  transition:var(--t);
}

/* =========================================================
   6. FORM
   ========================================================= */
.field{margin-bottom:16px}
.label{display:block;font-size:12.5px;font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;margin-bottom:7px}
.label-opt{text-transform:none;letter-spacing:0;color:var(--text-mute);font-weight:500;font-size:11.5px}
.field-hint{display:block;font-size:12px;color:var(--text-mute);margin-top:6px}
.input,select.input,textarea.input{
  width:100%;padding:13px 16px;border-radius:12px;
  border:1px solid var(--border);background:var(--card);
  color:var(--text);outline:none;transition:var(--t);font-size:15px;
}
.input:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(40,211,175,.15)}
.input::placeholder{color:var(--text-mute);opacity:.7}
textarea.input{min-height:100px;resize:vertical}

/* =========================================================
   7. CHIPS / BADGES
   ========================================================= */
.chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 14px;border-radius:99px;
  background:var(--card);border:1px solid var(--border);
  font-size:13px;color:var(--text-dim);font-weight:500;
}
.chip-icon i{color:var(--primary);font-size:12px}

.badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 10px;border-radius:99px;
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
}
.badge i{font-size:9px}
.badge-live{background:var(--primary-light);color:var(--primary-dark);border:1px solid rgba(40,211,175,.3)}
.badge-cheio{background:#fee2e2;color:#b91c1c;border:1px solid rgba(239,68,68,.2)}
.badge-secondary{background:#ffedd5;color:#c2410c;border:1px solid rgba(255,107,53,.3)}

/* =========================================================
   8. HERO
   ========================================================= */
.hero{
  position:relative;padding:32px;border-radius:var(--r-xl);margin-bottom:26px;
  background:linear-gradient(135deg,#28D3AF 0%,#219d85 100%);
  color:#fff;overflow:hidden;box-shadow:0 12px 40px rgba(40,211,175,.35);
}
.hero::after{
  content:'';position:absolute;top:-40%;right:-10%;
  width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,255,255,.25),transparent 70%);
  filter:blur(40px);pointer-events:none;
}
.hero h1{font-size:clamp(24px,4vw,38px);font-weight:800;letter-spacing:-.025em;line-height:1.15;margin-bottom:8px;position:relative}
.hero p{color:rgba(255,255,255,.9);font-size:15px;max-width:520px;position:relative}
.hero-actions{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap;position:relative}

/* Home hero */
.home-hero{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.hero-inner{position:relative;z-index:2}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 14px;border-radius:99px;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);
  color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.02em;
  margin-bottom:16px;backdrop-filter:blur(8px);
}
.hero-badge i{font-size:11px}
.home-hero h1 span{border-bottom:3px solid rgba(255,255,255,.6);padding-bottom:2px}
.home-hero .hero-art{
  font-size:120px;color:rgba(255,255,255,.14);
  position:relative;z-index:1;display:grid;place-items:center;
  pointer-events:none;transition:transform .4s cubic-bezier(.2,.8,.2,1);
}
.home-hero:hover .hero-art{transform:scale(1.06) rotate(-4deg)}

.btn-hero-primary{background:#fff;color:var(--primary-dark);border:none;font-weight:700;box-shadow:0 8px 24px rgba(0,0,0,.15);padding:13px 22px}
.btn-hero-primary:hover{background:#fff;color:var(--primary-dark);transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,0,0,.2)}
.btn-hero-ghost{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);color:#fff;padding:13px 22px}
.btn-hero-ghost:hover{background:rgba(255,255,255,.25);border-color:rgba(255,255,255,.5);transform:translateY(-2px)}

/* =========================================================
   9. QUICK ACTIONS
   ========================================================= */
.quick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:12px;margin-bottom:36px}
.quick{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  padding:22px 12px;border-radius:var(--r-lg);
  background:var(--card);border:1.5px solid var(--border);
  transition:all .2s cubic-bezier(.2,.8,.2,1);cursor:pointer;text-align:center;
}
.quick:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:0 10px 24px rgba(40,211,175,.15)}
.quick-ico{
  width:48px;height:48px;border-radius:14px;
  display:grid;place-items:center;
  background:var(--primary-light);color:var(--primary-dark);
  font-size:20px;transition:all .2s cubic-bezier(.2,.8,.2,1);
}
.quick:hover .quick-ico{background:var(--primary);color:#fff;transform:scale(1.08)}
.quick-label{font-size:13px;font-weight:600;color:var(--text);letter-spacing:-.01em}

/* =========================================================
   10. SECTION HEAD
   ========================================================= */
.section-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.section-title-wrap{display:flex;align-items:center;gap:14px}
.section-icon{
  width:42px;height:42px;border-radius:12px;
  background:var(--primary-light);color:var(--primary-dark);
  display:grid;place-items:center;font-size:18px;flex-shrink:0;
}
.section-title{font-size:19px;font-weight:800;letter-spacing:-.02em;color:var(--text);line-height:1.2}
.section-sub{font-size:13.5px;color:var(--text-mute);margin-top:2px}

/* =========================================================
   11. GRID / PLANO CARDS
   ========================================================= */
.grid{display:grid;gap:16px}
.grid-planos{grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.grid-pessoas{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}

.plano-card{
  position:relative;padding:20px;border-radius:var(--r-lg);
  background:var(--card);border:1px solid var(--border);
  box-shadow:var(--shadow-sm);transition:all .2s cubic-bezier(.2,.8,.2,1);cursor:pointer;
  overflow:hidden;display:block;
}
.plano-card::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:var(--primary);opacity:0;transition:var(--t);
}
.plano-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--primary-light)}
.plano-card:hover::before{opacity:1}

.plano-card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.plano-emoji-wrap{
  width:52px;height:52px;border-radius:14px;
  background:var(--card-soft);
  display:grid;place-items:center;
  font-size:22px;line-height:1;color:var(--primary-dark);
  transition:all .2s cubic-bezier(.2,.8,.2,1);
}
.plano-card:hover .plano-emoji-wrap{background:var(--primary-light);transform:scale(1.05) rotate(-3deg)}

.plano-title{font-size:16.5px;font-weight:700;letter-spacing:-.01em;margin-bottom:10px;color:var(--text)}
.plano-meta{display:flex;flex-direction:column;gap:6px;color:var(--text-mute);font-size:13px;margin-bottom:14px}
.plano-meta span{display:flex;align-items:center;gap:8px}
.plano-meta span i{font-size:12px;color:var(--text-mute);width:14px;text-align:center;flex-shrink:0}

.plano-foot{display:flex;align-items:center;justify-content:space-between;padding-top:14px;border-top:1px solid var(--border);margin-top:14px}
.plano-criador{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--text-mute);font-weight:600}
.plano-criador img{width:24px;height:24px;border-radius:50%;object-fit:cover;border:1.5px solid var(--border)}
.plano-count{font-size:12.5px;color:var(--text-mute);font-weight:700;display:inline-flex;align-items:center;gap:5px}
.plano-count i{font-size:12px}

/* =========================================================
   12. PESSOA CARD
   ========================================================= */
.pessoa-card{
  position:relative;padding:24px 18px;
  border-radius:var(--r-lg);background:var(--card);
  border:1.5px solid var(--border);box-shadow:var(--shadow-sm);
  text-align:center;transition:all .2s cubic-bezier(.2,.8,.2,1);
}
.pessoa-card:hover{transform:translateY(-3px);border-color:var(--primary-light);box-shadow:0 12px 30px rgba(0,0,0,.08)}

.pessoa-badge{
  position:absolute;top:12px;right:12px;
  display:inline-flex;align-items:center;gap:4px;
  padding:4px 10px;border-radius:99px;
  background:var(--primary-light);color:var(--primary-dark);
  font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;
}
.pessoa-badge i{font-size:9px}

.pessoa-avatar{
  width:76px;height:76px;border-radius:50%;
  margin:0 auto 14px;padding:3px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  transition:transform .2s cubic-bezier(.2,.8,.2,1);
}
.pessoa-card:hover .pessoa-avatar{transform:scale(1.05)}
.pessoa-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid var(--card)}

.pessoa-nome{font-size:15.5px;font-weight:700;color:var(--text);letter-spacing:-.01em;margin-bottom:3px}
.pessoa-cidade{font-size:12.5px;color:var(--text-mute);display:inline-flex;align-items:center;gap:4px;margin-bottom:12px}
.pessoa-cidade i{font-size:10px;color:var(--primary)}
.pessoa-bio{font-size:12.5px;color:var(--text-dim);line-height:1.5;margin-bottom:14px;min-height:38px}

.pessoa-cta{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 14px;border-radius:99px;
  background:var(--card-soft);border:1px solid var(--border);
  color:var(--text-dim);font-size:12px;font-weight:700;transition:var(--t);
}
.pessoa-cta:hover{background:var(--primary-light);border-color:var(--primary);color:var(--primary-dark)}
.pessoa-cta i{font-size:10px;transition:transform .2s}
.pessoa-cta:hover i{transform:translateX(2px)}

/* =========================================================
   13. EMPTY STATE
   ========================================================= */
.empty-state{
  text-align:center;padding:60px 20px;
  background:var(--card);border:1.5px dashed var(--border);
  border-radius:var(--r-lg);
}
.empty-state-icon{
  width:74px;height:74px;border-radius:50%;
  margin:0 auto 18px;background:var(--primary-light);
  color:var(--primary-dark);display:grid;place-items:center;font-size:30px;
}
.empty-state h3{font-size:18px;font-weight:800;color:var(--text);margin-bottom:6px;letter-spacing:-.01em}
.empty-state p{font-size:14px;color:var(--text-mute);max-width:340px;margin:0 auto}

/* =========================================================
   14. SEARCH BAR
   ========================================================= */
.search-bar{position:relative;margin-bottom:24px}
.search-bar-ico{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:var(--text-mute);font-size:14px;pointer-events:none}
.search-bar-input{
  width:100%;padding:14px 46px 14px 46px;border-radius:99px;
  border:1.5px solid var(--border);background:var(--card);
  font-size:15px;color:var(--text);outline:none;transition:var(--t);
}
.search-bar-input:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(40,211,175,.15)}
.search-bar-clear{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  width:28px;height:28px;border-radius:50%;
  background:var(--card-soft);color:var(--text-mute);
  display:grid;place-items:center;font-size:12px;transition:var(--t);
}
.search-bar-clear:hover{background:var(--primary-light);color:var(--primary-dark)}

.results-count{font-size:13.5px;color:var(--text-mute);margin-bottom:16px}
.results-count b{color:var(--text);font-weight:800}

/* =========================================================
   15. CREATE FORM
   ========================================================= */
.create-form{max-width:720px}

.form-card{
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:24px;margin-bottom:18px;
  box-shadow:var(--shadow-sm);
}
.form-card-head{display:flex;align-items:center;gap:14px;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.form-card-head h3{font-size:16px;font-weight:800;letter-spacing:-.01em;color:var(--text)}
.form-card-head p{font-size:13px;color:var(--text-mute);margin-top:2px}
.form-step{
  width:40px;height:40px;border-radius:12px;
  background:var(--primary);color:#fff;
  display:grid;place-items:center;font-size:15px;font-weight:800;
  flex-shrink:0;box-shadow:0 6px 16px rgba(40,211,175,.3);
}
.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-actions{margin-top:8px}

/* Icon picker */
.icon-picker{margin-top:4px}
.icon-picker-group{margin-bottom:18px}
.icon-picker-label{
  font-size:11.5px;font-weight:800;color:var(--text-mute);
  text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;
}
.icon-picker-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));
  gap:8px;
}
.icon-opt{
  width:100%;aspect-ratio:1;border-radius:12px;
  background:var(--card-soft);border:1.5px solid var(--border);
  display:grid;place-items:center;
  color:var(--text-dim);font-size:18px;
  cursor:pointer;transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.icon-opt:hover{border-color:var(--primary);color:var(--primary-dark);transform:translateY(-2px)}
.icon-opt.active{
  background:var(--primary);border-color:var(--primary);
  color:#fff;box-shadow:0 6px 16px rgba(40,211,175,.35);
  transform:scale(1.05);
}

/* Radio group */
.radio-group{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.radio-opt input{display:none}
.radio-content{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:18px 14px;border-radius:14px;
  background:var(--card);border:1.5px solid var(--border);
  cursor:pointer;transition:all .18s cubic-bezier(.2,.8,.2,1);
  text-align:center;
}
.radio-content i{font-size:20px;color:var(--text-mute);transition:var(--t)}
.radio-content b{font-size:13.5px;font-weight:700;color:var(--text)}
.radio-content small{font-size:11.5px;color:var(--text-mute)}
.radio-opt:hover .radio-content{border-color:var(--border-strong);transform:translateY(-1px)}
.radio-opt input:checked ~ .radio-content{
  border-color:var(--primary);background:var(--primary-light);
}
.radio-opt input:checked ~ .radio-content i{color:var(--primary-dark)}

/* =========================================================
   16. PLANO DETAIL
   ========================================================= */
.plano-detail-hero{
  display:flex;gap:20px;align-items:flex-start;
  padding:26px;border-radius:var(--r-xl);margin-bottom:20px;
  background:var(--card);border:1px solid var(--border);
  box-shadow:var(--shadow-sm);
}
.plano-detail-icon{
  width:74px;height:74px;border-radius:20px;
  background:linear-gradient(135deg,var(--primary-light),#fff);
  color:var(--primary-dark);
  display:grid;place-items:center;font-size:32px;
  flex-shrink:0;
  border:1.5px solid var(--primary-light);
}
.plano-detail-info{flex:1;min-width:0}
.plano-detail-info h1{font-size:24px;font-weight:800;letter-spacing:-.025em;color:var(--text);margin-bottom:10px;line-height:1.2}
.plano-detail-meta{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--text-mute);font-size:13.5px}
.plano-detail-meta span{display:inline-flex;align-items:center;gap:7px}
.plano-detail-meta span i{font-size:12px;color:var(--primary)}

.plano-descricao{color:var(--text-dim);font-size:14.5px;line-height:1.65}

.plano-actions{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap}

/* =========================================================
   17. PARTICIPANTES
   ========================================================= */
.participantes-grid{display:flex;flex-wrap:wrap;gap:10px}
.participante-chip{
  position:relative;
  display:inline-flex;align-items:center;gap:9px;
  padding:6px 14px 6px 6px;border-radius:99px;
  background:var(--card-soft);border:1px solid var(--border);
  font-size:13.5px;font-weight:600;color:var(--text);
}
.participante-chip img{width:30px;height:30px;border-radius:50%;object-fit:cover}
.participante-check{color:var(--primary);font-size:12px}

/* =========================================================
   18. CHAT
   ========================================================= */
.chat-wrap{
  display:flex;flex-direction:column;
  height:calc(100dvh - 240px);min-height:420px;
  border-radius:var(--r-lg);overflow:hidden;
  border:1px solid var(--border);background:var(--card);
  box-shadow:var(--shadow-sm);
}
.chat-head{
  padding:14px 20px;border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:12px;background:var(--card);
}
.chat-head .conversa-icon{
  width:38px;height:38px;border-radius:11px;
  background:var(--primary-light);color:var(--primary-dark);
  display:grid;place-items:center;font-size:15px;
}
.chat-body{
  flex:1;overflow-y:auto;padding:20px;
  display:flex;flex-direction:column;gap:10px;
  background:var(--card-soft);
}
.chat-empty{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;height:100%;color:var(--text-mute);
  font-size:14px;text-align:center;
}
.chat-empty i{font-size:36px;opacity:.3}

.msg{max-width:72%;padding:11px 15px;border-radius:16px;font-size:14.5px;line-height:1.5;word-wrap:break-word}
.msg .who{font-size:11.5px;font-weight:800;opacity:.75;margin-bottom:3px;display:block;letter-spacing:.01em}
.msg.them{align-self:flex-start;background:var(--card);border:1px solid var(--border);border-bottom-left-radius:6px}
.msg.me{align-self:flex-end;background:var(--primary);color:#fff;border-bottom-right-radius:6px}
.msg.me .who{color:rgba(255,255,255,.9)}
.msg .hora{font-size:10.5px;opacity:.6;margin-top:5px;display:block;text-align:right}

.chat-foot{
  padding:12px 14px;border-top:1px solid var(--border);
  display:flex;gap:8px;background:var(--card);
}
.chat-foot input{flex:1;border-radius:99px;padding:11px 18px}

.conversas-list{display:flex;flex-direction:column;gap:8px}
.conversa-item{
  display:flex;align-items:center;gap:14px;
  padding:14px 18px;border-radius:var(--r-lg);
  background:var(--card);border:1px solid var(--border);
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.conversa-item:hover{
  border-color:var(--primary-light);
  transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(0,0,0,.06);
}
.conversa-icon{
  width:46px;height:46px;border-radius:14px;
  background:var(--primary-light);color:var(--primary-dark);
  display:grid;place-items:center;font-size:18px;flex-shrink:0;
}
.conversa-body{flex:1;min-width:0}
.conversa-title{font-weight:700;font-size:14.5px;color:var(--text);margin-bottom:2px}
.conversa-preview{
  font-size:13px;color:var(--text-mute);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.conversa-time{font-size:11.5px;color:var(--text-mute);font-weight:600;flex-shrink:0}

.card-locked{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:34px 24px;border-radius:var(--r-lg);
  background:var(--card);border:1.5px dashed var(--border);
  text-align:center;color:var(--text-mute);
}
.card-locked i{font-size:28px;color:var(--primary);margin-bottom:4px}
.card-locked b{color:var(--text);font-size:15px}
.card-locked small{font-size:13px}

/* =========================================================
   19. PERFIL
   ========================================================= */
.perfil-hero{
  display:flex;gap:20px;align-items:center;
  padding:26px;border-radius:var(--r-xl);margin-bottom:22px;
  background:var(--card);border:1px solid var(--border);
  box-shadow:var(--shadow-sm);
  flex-wrap:wrap;
}
.perfil-avatar{
  width:92px;height:92px;border-radius:50%;
  padding:3px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  flex-shrink:0;
}
.perfil-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid var(--card)}
.perfil-info{flex:1;min-width:220px}
.perfil-info h1{font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--text);margin-bottom:6px}
.perfil-meta{display:flex;flex-wrap:wrap;gap:12px;color:var(--text-mute);font-size:13.5px;margin-bottom:10px}
.perfil-meta span{display:inline-flex;align-items:center;gap:6px}
.perfil-meta i{font-size:12px;color:var(--primary)}
.perfil-verificado{color:var(--primary-dark);font-weight:700}
.perfil-bio{color:var(--text-dim);font-size:14px;line-height:1.55;max-width:520px}

.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:32px}
.stat-card{
  padding:22px 18px;border-radius:var(--r-lg);text-align:center;
  background:var(--card);border:1px solid var(--border);
  box-shadow:var(--shadow-sm);transition:var(--t);
}
.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--primary-light)}
.stat-icon{
  width:44px;height:44px;border-radius:12px;
  margin:0 auto 12px;
  background:var(--primary-light);color:var(--primary-dark);
  display:grid;place-items:center;font-size:18px;
}
.stat-value{font-size:28px;font-weight:800;letter-spacing:-.03em;color:var(--text);line-height:1}
.stat-label{font-size:11.5px;color:var(--text-mute);font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-top:6px}

.interesses-chips{display:flex;flex-wrap:wrap;gap:8px}

.quick-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.quick-link{
  display:flex;align-items:center;gap:14px;
  padding:16px 18px;border-radius:var(--r-lg);
  background:var(--card);border:1px solid var(--border);
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.quick-link:hover{border-color:var(--primary-light);transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,0,0,.05)}
.quick-link > i:first-child{
  width:40px;height:40px;border-radius:12px;
  background:var(--primary-light);color:var(--primary-dark);
  display:grid;place-items:center;font-size:16px;flex-shrink:0;
}
.quick-link > div{flex:1;min-width:0}
.quick-link b{display:block;font-size:14px;font-weight:700;color:var(--text);margin-bottom:2px}
.quick-link small{font-size:12.5px;color:var(--text-mute)}
.quick-link > i:last-child{color:var(--text-mute);font-size:12px}
.quick-link-danger > i:first-child{background:#fee2e2;color:#b91c1c}

.avatar-editor{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.avatar-editor img{
  width:96px;height:96px;border-radius:50%;
  object-fit:cover;border:3px solid var(--primary-light);
  box-shadow:0 8px 20px rgba(0,0,0,.08);
}

/* =========================================================
   20. ONBOARDING
   ========================================================= */
.onb-body{background:var(--bg);min-height:100dvh}
.onb-page{min-height:100dvh;display:grid;grid-template-rows:auto 1fr;max-width:920px;margin:0 auto;background:var(--bg)}
.onb-header{padding:20px 28px 16px;border-bottom:1px solid var(--border);background:var(--card);position:sticky;top:0;z-index:10}
.onb-header-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.onb-header-brand{display:flex;align-items:center;gap:10px}
.onb-header-brand img{width:34px;height:34px;object-fit:contain}
.onb-header-brand span{font-weight:800;font-size:15px;color:var(--text)}
.onb-step{font-size:12px;color:var(--text-mute);font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.onb-progress{height:5px;background:var(--border);border-radius:99px;overflow:hidden}
.onb-progress-fill{height:100%;width:50%;background:linear-gradient(90deg,var(--primary),var(--primary-dark));border-radius:99px;transition:width .6s cubic-bezier(.2,.8,.2,1)}
.onb-page[data-step="2"] .onb-progress-fill{width:100%}
.onb-main{padding:40px 28px 40px}
.onb-intro{max-width:600px;margin-bottom:32px}
.onb-intro-center{margin-left:auto;margin-right:auto;text-align:center}
.onb-intro-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;border-radius:99px;background:var(--primary-light);color:var(--primary-dark);font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:16px}
.onb-intro h1{font-size:clamp(26px,3.6vw,36px);font-weight:800;letter-spacing:-.025em;line-height:1.15;color:var(--text);margin-bottom:12px}
.onb-intro p{font-size:15.5px;color:var(--text-mute);line-height:1.6}
.onb-intro p b{color:var(--text);font-weight:700}
.onb-filters{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:26px;scrollbar-width:none}
.onb-filters::-webkit-scrollbar{display:none}
.onb-filter{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:99px;background:var(--card);border:1px solid var(--border);color:var(--text-dim);font-size:13.5px;font-weight:600;cursor:pointer;transition:var(--t);white-space:nowrap;flex:0 0 auto}
.onb-filter:hover{border-color:var(--border-strong);color:var(--text)}
.onb-filter.active{background:var(--text);color:#fff;border-color:var(--text)}
.onb-filter i{font-size:12px}
.onb-cat-group{margin-bottom:34px}
.onb-cat-group[hidden]{display:none}
.onb-cat-title{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:800;color:var(--text-mute);text-transform:uppercase;letter-spacing:.1em;margin-bottom:14px}
.onb-cat-title i{font-size:14px;color:var(--primary)}
.onb-cat-title::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--border),transparent)}
.onb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.onb-item{position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;background:var(--card);border:1.5px solid var(--border);cursor:pointer;transition:all .18s cubic-bezier(.2,.8,.2,1);user-select:none;min-height:64px}
.onb-item:hover{border-color:var(--border-strong);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.05)}
.onb-item input{position:absolute;opacity:0;pointer-events:none}
.onb-item-icon{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--card-soft);color:var(--text-dim);font-size:16px;transition:all .18s cubic-bezier(.2,.8,.2,1);flex-shrink:0}
.onb-item-label{font-size:14px;font-weight:600;color:var(--text);line-height:1.25}
.onb-item-check{position:absolute;top:10px;right:10px;width:20px;height:20px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-size:9px;opacity:0;transform:scale(.5);transition:all .2s cubic-bezier(.2,.8,.2,1)}
.onb-item input:checked ~ .onb-item-icon{background:var(--primary);color:#fff}
.onb-item:has(input:checked){border-color:var(--primary);background:linear-gradient(135deg,rgba(40,211,175,.06),rgba(40,211,175,.02))}
.onb-item input:checked ~ .onb-item-check{opacity:1;transform:scale(1)}
.onb-item:active{transform:scale(.98)}
.onb-footer{position:sticky;bottom:0;background:rgba(255,255,255,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--border);padding:16px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px;z-index:10;margin:40px -28px -40px}
.onb-counter-box{display:flex;align-items:center;gap:12px}
.onb-counter-circle{width:46px;height:46px;border-radius:50%;background:var(--card-soft);border:2px solid var(--border);display:grid;place-items:center;font-weight:800;font-size:16px;color:var(--text-mute);transition:var(--t)}
.onb-counter-box.ready .onb-counter-circle{background:var(--primary-light);border-color:var(--primary);color:var(--primary-dark)}
.onb-counter-text{display:flex;flex-direction:column;line-height:1.25}
.onb-counter-text b{font-size:14px;font-weight:700;color:var(--text)}
.onb-counter-text small{font-size:12px;color:var(--text-mute)}
.onb-cta{padding:14px 28px;font-size:15px;border-radius:99px;display:inline-flex;align-items:center;gap:10px;min-width:190px;justify-content:center}
.onb-cta i{transition:transform .2s}
.onb-cta:hover i{transform:translateX(3px)}
.onb-loc-wrap{max-width:560px;margin:0 auto}
.onb-loc-card{padding:32px 28px;border-radius:22px;background:var(--card);border:1px solid var(--border);box-shadow:0 10px 40px rgba(0,0,0,.06)}
.onb-loc-icon-header{display:flex;justify-content:center;margin-bottom:24px}
.onb-loc-icon-header .icon-circle{width:74px;height:74px;border-radius:22px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;display:grid;place-items:center;font-size:28px;box-shadow:0 14px 32px rgba(40,211,175,.32)}
.onb-geo-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:15px;border-radius:14px;background:var(--primary-light);border:1.5px dashed var(--primary);color:var(--primary-dark);font-weight:700;font-size:14px;cursor:pointer;transition:var(--t);margin-bottom:20px}
.onb-geo-btn:hover{background:var(--primary);color:#fff;border-style:solid}
.onb-geo-btn.loading{opacity:.7;cursor:wait}
.onb-divider{display:flex;align-items:center;gap:12px;color:var(--text-mute);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin:6px 0 22px}
.onb-divider::before,.onb-divider::after{content:'';flex:1;height:1px;background:var(--border)}
.onb-loc-submit{padding:14px 20px;font-size:15px;margin-top:8px}
.onb-loc-secure{text-align:center;margin-top:18px;font-size:12.5px;color:var(--text-mute)}
.onb-loc-secure i{margin-right:5px}

/* =========================================================
   21. AUTH
   ========================================================= */
.auth-shell{min-height:100dvh;display:grid;place-items:center;padding:24px;background:var(--bg)}
.auth-card{width:100%;max-width:460px;padding:40px 36px;border-radius:var(--r-xl);background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-lg)}
.auth-logo-wrap{display:flex;justify-content:center;align-items:center;margin:0 auto 26px;width:100%}
.auth-logo-img{width:180px;height:180px;object-fit:contain;display:block;transition:var(--t)}
.auth-logo-img:hover{transform:scale(1.03)}
.auth-logo-img.sm{width:110px;height:110px}
.auth-card h1{font-size:26px;font-weight:800;letter-spacing:-.02em;margin-bottom:6px;color:var(--text);text-align:center}
.auth-card p.sub{color:var(--text-mute);font-size:14px;margin-bottom:26px;text-align:center}
.auth-foot{margin-top:20px;text-align:center;color:var(--text-mute);font-size:13.5px}
.auth-foot a{color:var(--primary-dark);font-weight:600}

/* =========================================================
   22. FLASH
   ========================================================= */
.flashes{position:fixed;top:18px;right:18px;z-index:999;display:flex;flex-direction:column;gap:10px;max-width:340px}
.flash{padding:13px 16px;border-radius:12px;font-size:14px;font-weight:500;border:1px solid;box-shadow:var(--shadow);animation:slideIn .35s cubic-bezier(.2,.8,.2,1)}
.flash.ok{background:#ecfdf5;border-color:#a7f3d0;color:#065f46}
.flash.erro{background:#fef2f2;border-color:#fecaca;color:#991b1b}
@keyframes slideIn{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}

/* =========================================================
   23. MOBILE / BOTTOM NAV
   ========================================================= */
.bottomnav{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:50;
  background:var(--card);border-top:1px solid var(--border);
  box-shadow:0 -4px 12px rgba(0,0,0,.04);
  padding:8px 6px calc(8px + env(safe-area-inset-bottom));
}
.bottomnav ul{display:flex;justify-content:space-around;list-style:none;align-items:flex-end}
.bottomnav a{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 10px;font-size:10.5px;color:var(--text-mute);font-weight:700;border-radius:12px;transition:var(--t)}
.bottomnav a.active{color:var(--primary-dark)}
.bottomnav .ico{font-size:19px;padding:5px 10px;border-radius:10px;transition:all .18s cubic-bezier(.2,.8,.2,1);display:grid;place-items:center}
.bottomnav a.active .ico{background:var(--primary-light);color:var(--primary-dark)}
.bottomnav .nav-create .ico-create{
  width:52px;height:52px;border-radius:16px;
  background:var(--primary);color:#fff;
  display:grid;place-items:center;font-size:20px;
  box-shadow:0 8px 24px rgba(40,211,175,.4);
  transform:translateY(-14px);
  transition:all .2s cubic-bezier(.2,.8,.2,1);
}
.bottomnav .nav-create:active .ico-create{transform:translateY(-14px) scale(.92)}

.mobile-top{
  display:none;align-items:center;justify-content:space-between;gap:12px;
  position:sticky;top:0;z-index:40;padding:14px 18px;margin:-26px -30px 18px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
}
.mobile-top-brand img{width:100px;height:auto;object-fit:contain}
.mobile-top-cta{
  width:38px;height:38px;border-radius:50%;
  background:var(--primary);color:#fff;
  display:grid;place-items:center;font-size:15px;
  box-shadow:0 6px 16px rgba(40,211,175,.35);
  transition:var(--t);
}
.mobile-top-cta:active{transform:scale(.94)}

/* =========================================================
   24. VERIFICAÇÃO DE E-MAIL
   ========================================================= */
.codigo-input-wrap{
  display:flex;
  justify-content:center;
  margin:20px 0 22px;
}
.codigo-input{
  width:100%;
  max-width:280px;
  padding:18px 12px;
  font-family:'SF Mono',Menlo,Consolas,monospace;
  font-size:34px;
  font-weight:800;
  letter-spacing:14px;
  text-align:center;
  color:var(--text);
  background:var(--card);
  border:2px solid var(--border);
  border-radius:16px;
  outline:none;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
}
.codigo-input:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 5px rgba(40,211,175,.15);
  background:#fafffd;
}
.codigo-input::placeholder{
  color:var(--text-mute);
  opacity:.35;
  letter-spacing:14px;
}

.verificar-footer{
  margin-top:22px;
  text-align:center;
  font-size:13.5px;
  color:var(--text-mute);
}
.verificar-footer p{margin-bottom:6px}
.btn-link{
  background:none;
  border:none;
  color:var(--primary-dark);
  font-weight:700;
  font-size:13.5px;
  cursor:pointer;
  padding:0;
  text-decoration:underline;
  text-underline-offset:3px;
}
.btn-link:hover{color:var(--primary)}

.auth-foot-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--text-mute);
  font-size:13px;
  transition:var(--t);
}
.auth-foot-link:hover{color:var(--primary-dark)}
.auth-foot-link i{font-size:11px}

/* =========================================================
   25. CHECKBOXES CUSTOMIZADOS
   ========================================================= */
.checkbox-inline{
  display:inline-flex;align-items:center;gap:10px;
  cursor:pointer;font-size:13.5px;
  color:var(--text-dim);font-weight:500;
  user-select:none;
}
.checkbox-inline input{display:none}
.checkbox-inline-box{
  width:20px;height:20px;border-radius:6px;
  border:2px solid var(--border-strong);
  display:grid;place-items:center;
  font-size:11px;color:#fff;
  transition:var(--t);
  flex-shrink:0;
}
.checkbox-inline input:checked ~ .checkbox-inline-box{
  background:var(--primary);
  border-color:var(--primary);
}

.checkbox-card{
  display:flex;align-items:center;gap:14px;
  padding:14px 18px;
  border:1.5px solid var(--border);
  border-radius:14px;
  background:var(--card);
  cursor:pointer;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.checkbox-card:hover{
  border-color:var(--border-strong);
  background:var(--card-soft);
}
.checkbox-card input{display:none}
.checkbox-card > div{flex:1;min-width:0}
.checkbox-card b{
  display:block;font-size:14px;font-weight:700;
  color:var(--text);margin-bottom:3px;
}
.checkbox-card small{
  display:block;font-size:12.5px;
  color:var(--text-mute);line-height:1.45;
}
.checkbox-check{
  width:22px;height:22px;
  border-radius:7px;
  border:2px solid var(--border-strong);
  display:grid;place-items:center;
  font-size:11px;color:#fff;
  transition:var(--t);
  flex-shrink:0;
}
.checkbox-card input:checked ~ .checkbox-check{
  background:var(--primary);
  border-color:var(--primary);
}
.checkbox-card:has(input:checked){
  border-color:var(--primary);
  background:linear-gradient(135deg,rgba(40,211,175,.06),rgba(40,211,175,.02));
}

/* =========================================================
   26. TROCA DE SENHA — Input com olho + força
   ========================================================= */
.input-pass{
  position:relative;
  display:flex;align-items:center;
}
.input-pass .input{
  padding-right:48px;
}
.pass-toggle{
  position:absolute;right:6px;top:50%;transform:translateY(-50%);
  width:36px;height:36px;
  border-radius:9px;
  background:transparent;
  border:none;
  color:var(--text-mute);
  cursor:pointer;
  display:grid;place-items:center;
  font-size:14px;
  transition:var(--t);
}
.pass-toggle:hover{
  background:var(--card-soft);
  color:var(--primary-dark);
}

.senha-strength{margin-top:10px;margin-bottom:14px}
.senha-strength-bars{
  display:flex;gap:5px;margin-bottom:8px;
}
.senha-strength-bars .bar{
  flex:1;height:5px;border-radius:99px;
  background:var(--border);
  transition:background .25s cubic-bezier(.2,.8,.2,1);
}
.senha-strength-text{
  font-size:12.5px;font-weight:700;
  color:var(--text-mute);
  letter-spacing:-.01em;
}

.senha-rules{
  display:grid;grid-template-columns:1fr 1fr;gap:8px;
  margin-top:6px;
  padding:12px 14px;
  background:var(--card-soft);
  border:1px solid var(--border);
  border-radius:12px;
}
.senha-rule{
  display:flex;align-items:center;gap:8px;
  font-size:12.5px;color:var(--text-mute);
  font-weight:500;transition:var(--t);
}
.senha-rule i{
  font-size:12px;color:var(--text-mute);
  transition:var(--t);
}
.senha-rule.ok{
  color:var(--primary-dark);
  font-weight:700;
}
.senha-rule.ok i{color:var(--primary)}

/* =========================================================
   27. NOTIFICAÇÕES
   ========================================================= */
.notif-push-card{
  display:flex;align-items:center;gap:16px;
  padding:20px 24px;
  border-radius:var(--r-lg);
  background:linear-gradient(135deg,rgba(40,211,175,.08),rgba(40,211,175,.02));
  border:1.5px solid var(--primary-light);
  margin-bottom:20px;
  flex-wrap:wrap;
}
.notif-push-card.ativo{
  background:var(--primary-light);
  border-color:var(--primary);
}
.notif-push-icon{
  width:52px;height:52px;border-radius:14px;
  background:var(--primary);color:#fff;
  display:grid;place-items:center;
  font-size:22px;flex-shrink:0;
  box-shadow:0 8px 24px rgba(40,211,175,.35);
}
.notif-push-body{flex:1;min-width:200px}
.notif-push-body h3{font-size:15px;font-weight:800;color:var(--text);margin-bottom:3px;letter-spacing:-.01em}
.notif-push-body p{font-size:13px;color:var(--text-mute)}

.notif-form{max-width:720px}
.notif-list{display:flex;flex-direction:column;gap:2px}

.notif-item{
  display:flex;align-items:center;gap:16px;
  padding:16px 4px;
  border-bottom:1px solid var(--border);
  cursor:pointer;
  transition:var(--t);
}
.notif-item:last-child{border-bottom:none}
.notif-item:hover{background:rgba(40,211,175,.03);border-radius:8px;padding-left:12px;padding-right:12px}
.notif-item > div:first-child{flex:1;min-width:0}
.notif-item b{display:block;font-size:14px;font-weight:700;color:var(--text);margin-bottom:3px}
.notif-item small{display:block;font-size:12.5px;color:var(--text-mute);line-height:1.4}

.notif-item input[type="checkbox"]{display:none}

.notif-toggle{
  position:relative;
  width:48px;height:28px;border-radius:99px;
  background:var(--border);
  transition:var(--t);flex-shrink:0;
  cursor:pointer;
}
.notif-toggle::before{
  content:'';position:absolute;
  top:3px;left:3px;
  width:22px;height:22px;border-radius:50%;
  background:#fff;
  transition:var(--t);
  box-shadow:0 2px 4px rgba(0,0,0,.15);
}
.notif-item input:checked ~ .notif-toggle{
  background:var(--primary);
}
.notif-item input:checked ~ .notif-toggle::before{
  transform:translateX(20px);
}

.notif-list-view{display:flex;flex-direction:column;gap:8px}
.notif-row{
  display:flex;align-items:center;gap:14px;
  padding:14px 18px;border-radius:var(--r);
  background:var(--card);border:1px solid var(--border);
  transition:var(--t);
}
.notif-row:hover{border-color:var(--primary-light);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.05)}
.notif-row.nao-lida{
  background:linear-gradient(90deg,var(--primary-light),var(--card));
  border-color:var(--primary-light);
}
.notif-row-icon{
  width:40px;height:40px;border-radius:11px;
  background:var(--primary-light);color:var(--primary-dark);
  display:grid;place-items:center;font-size:16px;flex-shrink:0;
}
.notif-row.nao-lida .notif-row-icon{background:var(--primary);color:#fff}
.notif-row-body{flex:1;min-width:0}
.notif-row-body b{display:block;font-size:14px;font-weight:700;color:var(--text);margin-bottom:2px}
.notif-row-body small{font-size:12px;color:var(--text-mute)}

/* =========================================================
   28. TOGGLE MAPA / LISTA
   ========================================================= */
.view-toggle{
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:99px;
  padding:4px;
}
.view-toggle-btn{
  display:inline-flex;align-items:center;gap:7px;
  padding:8px 16px;border-radius:99px;
  font-size:13px;font-weight:700;
  color:var(--text-mute);
  background:transparent;
  border:none;cursor:pointer;
  transition:var(--t);
}
.view-toggle-btn i{font-size:12px}
.view-toggle-btn:hover{color:var(--text)}
.view-toggle-btn.active{
  background:var(--primary);color:#fff;
  box-shadow:0 4px 12px rgba(40,211,175,.35);
}

/* =========================================================
   29. MAPA — Layout + Lista lateral + Pinos + Popup
   ========================================================= */

/* Layout: mapa + lista lateral */
.mapa-wrap{
  display:grid;
  grid-template-columns:1fr 340px;
  gap:16px;
  align-items:start;
}
#mapaPlanos{
  height:600px;
  border-radius:22px;
  border:1px solid var(--border);
  overflow:hidden;
  box-shadow:0 6px 28px rgba(0,0,0,.07);
  background:var(--card);
}

/* Lista lateral */
.mapa-cards{
  display:flex;flex-direction:column;gap:10px;
  max-height:600px;overflow-y:auto;
  padding-right:4px;
}
.mapa-cards::-webkit-scrollbar{width:6px;height:6px}
.mapa-cards::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:99px}

.mapa-card{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;border-radius:16px;
  background:var(--card);border:1.5px solid var(--border);
  cursor:pointer;text-align:left;font-family:inherit;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  width:100%;
}
.mapa-card:hover{
  border-color:var(--primary);
  transform:translateX(3px);
  box-shadow:0 6px 18px rgba(40,211,175,.15);
}
.mapa-card.active{
  border-color:var(--primary);
  background:linear-gradient(135deg,rgba(40,211,175,.06),rgba(40,211,175,.02));
  box-shadow:0 8px 22px rgba(40,211,175,.2);
}

.mapa-card-icon{
  width:44px;height:44px;border-radius:12px;
  background:var(--primary-light);color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:18px;flex-shrink:0;
}
.mapa-card-icon .emoji{font-size:22px;line-height:1}

.mapa-card-body{flex:1;min-width:0}
.mapa-card-title{
  font-size:13.5px;font-weight:700;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  margin-bottom:4px;
}
.mapa-card-meta{
  display:flex;flex-direction:column;gap:2px;
  font-size:11.5px;color:var(--text-mute);
  margin-bottom:5px;
}
.mapa-card-meta span{display:flex;align-items:center;gap:5px}
.mapa-card-meta i{font-size:10px;width:11px;text-align:center;flex-shrink:0}

.mapa-card-criador{
  display:flex;align-items:center;gap:6px;
  font-size:11px;color:var(--text-mute);
  font-weight:600;
}
.mapa-card-criador img{
  width:18px;height:18px;border-radius:50%;
  object-fit:cover;border:1.5px solid var(--border);
}

.mapa-card-badge{
  padding:4px 9px;border-radius:99px;
  font-size:10.5px;font-weight:800;
  text-transform:uppercase;letter-spacing:.04em;
  flex-shrink:0;
}
.mapa-card-badge.ok{
  background:var(--primary-light);color:var(--primary-dark);
}
.mapa-card-badge.cheio{
  background:#fee2e2;color:#b91c1c;
}

.mapa-cards-empty{
  padding:40px 24px;text-align:center;
  background:var(--card);border:1.5px dashed var(--border);
  border-radius:16px;color:var(--text-mute);
}
.mapa-cards-empty i{
  display:block;font-size:36px;margin-bottom:12px;
  color:var(--primary);opacity:.6;
}
.mapa-cards-empty b{
  display:block;font-size:14px;color:var(--text);
  margin-bottom:4px;font-weight:700;
}
.mapa-cards-empty small{
  display:block;font-size:12.5px;line-height:1.5;
}

/* Pino personalizado */
.map-plan-marker{background:transparent;border:none}
.map-plan-marker .map-pin{
  position:relative;
  width:56px;height:72px;
  display:flex;flex-direction:column;align-items:center;
  pointer-events:auto;
}

.map-plan-marker .map-pin-bubble{
  width:52px;height:52px;border-radius:16px;
  background:linear-gradient(135deg,#28D3AF,#219d85);
  color:#fff;
  display:grid;place-items:center;
  font-size:22px;
  box-shadow:0 6px 20px rgba(40,211,175,.5), 0 0 0 3px #fff;
  position:relative;
  transition:transform .2s cubic-bezier(.2,.8,.2,1);
}
.map-plan-marker .map-pin-bubble .emoji{font-size:26px;line-height:1}

.map-plan-marker .map-pin-avatar{
  position:absolute;
  right:-6px;bottom:-6px;
  width:26px;height:26px;border-radius:50%;
  object-fit:cover;
  border:2.5px solid #fff;
  box-shadow:0 2px 6px rgba(0,0,0,.2);
  background:#fff;
}

.map-plan-marker .map-pin-tail{
  width:0;height:0;
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-top:12px solid #219d85;
  margin-top:-3px;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.15));
}

.map-plan-marker:hover .map-pin-bubble{
  transform:scale(1.1) rotate(-3deg);
}

/* Marcador do usuário */
.map-user-marker{background:transparent;border:none;position:relative}
.map-user-marker .user-dot{
  width:24px;height:24px;border-radius:50%;
  background:#3b82f6;
  border:4px solid #fff;
  box-shadow:0 0 0 4px rgba(59,130,246,.25), 0 4px 12px rgba(0,0,0,.2);
  animation:pulseUser 2s infinite;
}
.map-user-marker .user-label{
  position:absolute;
  top:32px;left:50%;transform:translateX(-50%);
  background:#1D3557;color:#fff;
  font-size:10px;font-weight:800;
  padding:3px 8px;border-radius:99px;
  white-space:nowrap;letter-spacing:.03em;
}
@keyframes pulseUser{
  0%,100%{box-shadow:0 0 0 4px rgba(59,130,246,.25), 0 4px 12px rgba(0,0,0,.2)}
  50%{box-shadow:0 0 0 10px rgba(59,130,246,.1), 0 4px 12px rgba(0,0,0,.2)}
}

/* Leaflet base */
.leaflet-container{
  font-family:'Inter',system-ui,sans-serif;
  border-radius:22px;
}
.leaflet-popup-content-wrapper{
  border-radius:18px;
  box-shadow:0 16px 40px rgba(0,0,0,.18);
  padding:0;
  overflow:hidden;
}
.leaflet-popup-content{
  margin:0;
  width:auto !important;
  min-width:280px;
}
.leaflet-popup-tip{
  box-shadow:0 4px 12px rgba(0,0,0,.1);
}
.leaflet-popup-close-button{
  width:30px !important;height:30px !important;
  font-size:20px !important;
  color:#fff !important;
  background:rgba(0,0,0,.25) !important;
  border-radius:50% !important;
  top:10px !important;right:10px !important;
  display:grid !important;place-items:center !important;
  line-height:1 !important;
  transition:var(--t);
}
.leaflet-popup-close-button:hover{
  background:rgba(0,0,0,.5) !important;
}

/* Popup — Card completo */
.popup-plan{padding:18px}
.popup-top{
  display:flex;align-items:center;gap:10px;
  margin-bottom:14px;
}

.popup-icon{
  width:44px;height:44px;border-radius:12px;
  background:var(--primary-light);color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:18px;flex-shrink:0;
}
.popup-icon span{font-size:22px;line-height:1}

.popup-criador{
  display:flex;align-items:center;gap:8px;
  flex:1;min-width:0;
}
.popup-criador img{
  width:34px;height:34px;border-radius:50%;
  object-fit:cover;border:2px solid var(--primary-light);
  flex-shrink:0;
}
.popup-criador > div{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.popup-criador small{
  font-size:10px;color:var(--text-mute);
  text-transform:uppercase;letter-spacing:.06em;font-weight:700;
}
.popup-criador b{
  font-size:13px;font-weight:700;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

.popup-badge{
  padding:4px 10px;border-radius:99px;
  font-size:10px;font-weight:800;
  text-transform:uppercase;letter-spacing:.04em;
  flex-shrink:0;
}
.popup-badge.ok{background:var(--primary-light);color:var(--primary-dark)}
.popup-badge.cheio{background:#fee2e2;color:#b91c1c}

.popup-title{
  font-size:16px;font-weight:800;color:var(--text);
  letter-spacing:-.015em;line-height:1.25;
  margin-bottom:12px;
}

.popup-meta{
  display:flex;flex-direction:column;gap:6px;
  margin-bottom:16px;
}
.popup-meta span{
  display:flex;align-items:center;gap:8px;
  font-size:12.5px;color:var(--text-mute);
}
.popup-meta i{
  font-size:11px;width:14px;text-align:center;
  color:var(--primary);flex-shrink:0;
}

.popup-cta{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;padding:11px 18px;border-radius:99px;
  background:var(--primary);color:#fff;
  font-size:13.5px;font-weight:800;
  text-decoration:none;
  transition:var(--t);
  box-shadow:0 6px 16px rgba(40,211,175,.35);
}
.popup-cta:hover{
  background:var(--primary-dark);
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(40,211,175,.45);
}
.popup-cta i{font-size:11px;transition:transform .2s}
.popup-cta:hover i{transform:translateX(3px)}

/* =========================================================
   30. ADMIN — Painel com sidebar escura
   ========================================================= */
:root{
  --admin-bg:         #0f1117;
  --admin-surface:    #171a23;
  --admin-surface-2:  #1e2230;
  --admin-border:     #262b38;
  --admin-border-soft:#1e2230;
  --admin-text:       #e6e8ee;
  --admin-text-dim:   #9ba1b3;
  --admin-text-mute:  #6b7285;
  --admin-primary:    #28D3AF;
}

.admin-body{
  background:var(--admin-bg);
  color:var(--admin-text);
  min-height:100dvh;
}

.admin-shell{
  display:grid;
  grid-template-columns:260px 1fr;
  min-height:100dvh;
}

.admin-sidebar{
  position:sticky;top:0;height:100dvh;
  background:var(--admin-surface);
  border-right:1px solid var(--admin-border);
  padding:24px 16px;
  display:flex;flex-direction:column;
}

.admin-sidebar-brand{
  display:flex;align-items:center;gap:12px;
  padding:8px 8px 24px;
  border-bottom:1px solid var(--admin-border);
  margin-bottom:20px;
}
.admin-logo{
  width:42px;height:42px;border-radius:12px;
  background:linear-gradient(135deg,#28D3AF,#219d85);
  color:#fff;
  display:grid;place-items:center;
  font-size:18px;font-weight:800;
  box-shadow:0 8px 24px rgba(40,211,175,.35);
}
.admin-brand-title{font-size:15px;font-weight:800;color:#fff;letter-spacing:-.01em}
.admin-brand-sub{font-size:11.5px;color:var(--admin-text-mute);font-weight:600;letter-spacing:.04em;text-transform:uppercase;margin-top:1px}

.admin-nav{flex:1;display:flex;flex-direction:column;gap:3px}
.admin-nav-section{
  font-size:10.5px;font-weight:800;
  color:var(--admin-text-mute);
  text-transform:uppercase;letter-spacing:.12em;
  padding:14px 12px 6px;
}

.admin-nav-item{
  display:flex;align-items:center;gap:12px;
  padding:11px 14px;
  border-radius:10px;
  color:var(--admin-text-dim);
  font-size:14px;font-weight:500;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.admin-nav-item i{font-size:14px;width:18px;text-align:center;opacity:.85}
.admin-nav-item:hover{background:var(--admin-surface-2);color:var(--admin-text)}
.admin-nav-item.active{
  background:rgba(40,211,175,.12);
  color:var(--admin-primary);
  font-weight:700;
}
.admin-nav-item.active i{opacity:1}
.admin-nav-danger{color:#f87171 !important;margin-top:auto}
.admin-nav-danger:hover{background:rgba(239,68,68,.1) !important;color:#fca5a5 !important}

.admin-sidebar-footer{
  margin-top:auto;
  border-top:1px solid var(--admin-border);
  padding-top:16px;
  display:flex;align-items:center;gap:10px;
}
.admin-sidebar-footer img{
  width:36px;height:36px;border-radius:50%;
  object-fit:cover;border:2px solid var(--admin-border);
}
.admin-user-meta{flex:1;min-width:0;line-height:1.25}
.admin-user-meta b{display:block;font-size:13px;font-weight:700;color:var(--admin-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-user-meta small{font-size:11px;color:var(--admin-primary);font-weight:600;text-transform:uppercase;letter-spacing:.05em}

.admin-main{
  padding:26px 32px 60px;
  max-width:1400px;
  width:100%;
}

.admin-topbar{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;margin-bottom:28px;flex-wrap:wrap;
}
.admin-page-title{
  font-size:24px;font-weight:800;
  letter-spacing:-.02em;color:#fff;
  line-height:1.15;
}
.admin-page-crumb{
  font-size:12.5px;color:var(--admin-text-mute);
  margin-top:3px;display:flex;align-items:center;gap:6px;
}
.admin-page-crumb i{color:var(--admin-primary)}

.admin-topbar-right .btn{
  background:transparent;
  border:1px solid var(--admin-border);
  color:var(--admin-text-dim);
}
.admin-topbar-right .btn:hover{
  background:var(--admin-surface);
  color:var(--admin-text);
  border-color:var(--admin-primary);
}

/* KPI Grid */
.admin-kpi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;margin-bottom:20px;
}
.admin-kpi{
  background:var(--admin-surface);
  border:1px solid var(--admin-border);
  border-radius:16px;
  padding:22px;
  display:flex;gap:16px;align-items:flex-start;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
}
.admin-kpi:hover{
  border-color:rgba(40,211,175,.4);
  transform:translateY(-2px);
}
.admin-kpi-icon{
  width:48px;height:48px;border-radius:12px;
  display:grid;place-items:center;
  font-size:19px;flex-shrink:0;
}
.admin-kpi-body{flex:1;min-width:0}
.admin-kpi-value{
  font-size:26px;font-weight:800;
  letter-spacing:-.03em;color:#fff;
  line-height:1;
}
.admin-kpi-label{
  font-size:12.5px;color:var(--admin-text-dim);
  margin-top:6px;font-weight:600;
}
.admin-kpi-delta{
  font-size:11.5px;color:var(--admin-text-mute);
  margin-top:10px;
  display:inline-flex;align-items:center;gap:5px;
}
.admin-kpi-delta i{font-size:10px;color:var(--admin-primary)}

.admin-kpi-mini-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:12px;margin-bottom:26px;
}
.admin-kpi-mini{
  background:var(--admin-surface);
  border:1px solid var(--admin-border);
  border-radius:12px;
  padding:14px 16px;
  display:flex;align-items:center;gap:12px;
}
.admin-kpi-mini > i{
  width:36px;height:36px;border-radius:9px;
  background:var(--admin-surface-2);
  color:var(--admin-primary);
  display:grid;place-items:center;
  font-size:14px;flex-shrink:0;
}
.admin-kpi-mini b{display:block;font-size:15px;font-weight:800;color:#fff;line-height:1}
.admin-kpi-mini small{display:block;font-size:11.5px;color:var(--admin-text-mute);margin-top:3px}

.admin-card{
  background:var(--admin-surface);
  border:1px solid var(--admin-border);
  border-radius:16px;
  padding:22px;
  margin-bottom:18px;
}
.admin-card-table{padding:0;overflow:hidden}

.admin-card-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;margin-bottom:18px;flex-wrap:wrap;
}
.admin-card-head h2{
  font-size:15px;font-weight:800;color:#fff;
  letter-spacing:-.01em;
  display:flex;align-items:center;gap:9px;
}
.admin-card-head h2 i{color:var(--admin-primary);font-size:14px}
.admin-card-link{
  font-size:12.5px;font-weight:700;
  color:var(--admin-primary);
  transition:var(--t);
}
.admin-card-link:hover{color:#fff}

/* Charts */
.admin-charts-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;margin-bottom:24px;
}
.admin-chart{
  display:flex;align-items:flex-end;
  gap:6px;height:160px;
  padding-top:20px;
}
.admin-chart-bar{
  flex:1;
  display:flex;flex-direction:column;
  justify-content:flex-end;align-items:center;
  height:100%;position:relative;
}
.admin-chart-bar-fill{
  width:100%;max-width:34px;
  background:linear-gradient(180deg,#28D3AF,#219d85);
  border-radius:6px 6px 2px 2px;
  min-height:4px;
  position:relative;
  transition:all .3s cubic-bezier(.2,.8,.2,1);
  display:flex;align-items:flex-start;justify-content:center;
}
.admin-chart-bar:hover .admin-chart-bar-fill{
  background:linear-gradient(180deg,#3ae4c0,#219d85);
  transform:scaleY(1.04);
}
.admin-chart-value{
  position:absolute;top:-18px;
  font-size:10.5px;font-weight:800;
  color:var(--admin-primary);
}
.admin-chart-label{
  font-size:9.5px;font-weight:700;
  color:var(--admin-text-mute);
  margin-top:6px;letter-spacing:.02em;
}

/* Listas */
.admin-list{list-style:none;padding:0;margin:0}
.admin-list-item{
  display:flex;align-items:center;gap:12px;
  padding:11px 0;
  border-bottom:1px solid var(--admin-border-soft);
}
.admin-list-item:last-child{border-bottom:none}
.admin-list-item img{width:34px;height:34px;border-radius:50%;object-fit:cover;flex-shrink:0}
.admin-list-icon{
  width:34px;height:34px;border-radius:9px;
  background:var(--admin-surface-2);
  color:var(--admin-primary);
  display:grid;place-items:center;
  font-size:14px;flex-shrink:0;
}
.admin-list-icon-danger{background:rgba(239,68,68,.14);color:#f87171}
.admin-list-body{flex:1;min-width:0}
.admin-list-title{
  font-size:13.5px;font-weight:700;color:var(--admin-text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  display:flex;align-items:center;gap:5px;
}
a.admin-list-title:hover{color:var(--admin-primary)}
.admin-list-sub{
  font-size:12px;color:var(--admin-text-mute);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  margin-top:1px;
}
.admin-list-time{
  font-size:11px;color:var(--admin-text-mute);
  font-weight:600;flex-shrink:0;
  white-space:nowrap;
}
.admin-verif-badge{color:var(--admin-primary);font-size:11px}

.admin-grid-3{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:16px;
}

.admin-empty{
  text-align:center;
  padding:36px 20px;
  color:var(--admin-text-mute);
  font-size:13.5px;
}
.admin-empty i{display:block;font-size:34px;margin-bottom:10px;opacity:.5}
.admin-empty b{display:block;font-size:15px;color:var(--admin-text-dim);margin-bottom:4px;font-weight:700}
.admin-empty small{display:block;font-size:12.5px;margin-top:4px}
.admin-empty-ok{color:var(--admin-primary)}
.admin-empty-ok i{color:var(--admin-primary);opacity:.9}

.admin-filter-bar{
  display:flex;gap:10px;align-items:center;flex-wrap:wrap;
  margin-bottom:18px;
  background:var(--admin-surface);
  border:1px solid var(--admin-border);
  border-radius:14px;
  padding:12px 16px;
}
.admin-search{
  flex:1;min-width:220px;
  position:relative;
  display:flex;align-items:center;
}
.admin-search i{
  position:absolute;left:14px;
  color:var(--admin-text-mute);font-size:13px;
  pointer-events:none;
}
.admin-search input{
  width:100%;
  padding:10px 14px 10px 38px;
  background:var(--admin-bg);
  border:1px solid var(--admin-border);
  border-radius:9px;
  color:var(--admin-text);
  font-size:13.5px;
  outline:none;
  transition:var(--t);
}
.admin-search input:focus{
  border-color:var(--admin-primary);
  box-shadow:0 0 0 3px rgba(40,211,175,.15);
}
.admin-search input::placeholder{color:var(--admin-text-mute)}

.admin-select{
  padding:10px 32px 10px 14px;
  background:var(--admin-bg);
  border:1px solid var(--admin-border);
  border-radius:9px;
  color:var(--admin-text);
  font-size:13.5px;
  outline:none;
  cursor:pointer;
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236b7285' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
}
.admin-select:focus{border-color:var(--admin-primary)}

.admin-filter-info{
  font-size:12.5px;color:var(--admin-text-dim);
  margin-left:auto;
}
.admin-filter-info b{color:#fff;font-weight:800}

.admin-filter-bar .btn-primary{
  background:var(--admin-primary);
  border-color:var(--admin-primary);
  color:#0f1117;
  font-weight:700;
  box-shadow:none;
}
.admin-filter-bar .btn-primary:hover{background:#3ae4c0}
.admin-filter-bar .btn-ghost{
  background:transparent;
  border-color:var(--admin-border);
  color:var(--admin-text-dim);
}
.admin-filter-bar .btn-ghost:hover{background:var(--admin-surface-2);color:var(--admin-text)}

.admin-tab{
  padding:8px 16px;border-radius:9px;
  font-size:13px;font-weight:700;
  color:var(--admin-text-dim);
  border:1px solid transparent;
  transition:var(--t);
}
.admin-tab:hover{color:#fff;background:var(--admin-surface-2)}
.admin-tab.active{
  background:rgba(40,211,175,.14);
  color:var(--admin-primary);
  border-color:rgba(40,211,175,.3);
}

.admin-table{
  width:100%;
  border-collapse:collapse;
  font-size:13.5px;
}
.admin-table thead{
  background:var(--admin-surface-2);
}
.admin-table th{
  padding:14px 18px;
  text-align:left;
  font-size:11px;font-weight:800;
  color:var(--admin-text-mute);
  text-transform:uppercase;letter-spacing:.08em;
}
.admin-table td{
  padding:14px 18px;
  color:var(--admin-text);
  border-top:1px solid var(--admin-border-soft);
  vertical-align:middle;
}
.admin-table tr:hover td{background:rgba(255,255,255,.02)}

.admin-table-user{display:flex;align-items:center;gap:12px}
.admin-table-user img{width:36px;height:36px;border-radius:50%;object-fit:cover;flex-shrink:0}
.admin-table-name{
  font-weight:700;font-size:13.5px;color:#fff;
  display:inline-flex;align-items:center;gap:6px;
}
a.admin-table-name:hover{color:var(--admin-primary)}
.admin-table-email{font-size:12px;color:var(--admin-text-mute);margin-top:2px}
.admin-table-time{font-size:12px;color:var(--admin-text-mute);white-space:nowrap}
.admin-table-plan{display:flex;align-items:center;gap:10px;font-weight:600}
.admin-table-plan-icon{
  width:30px;height:30px;border-radius:8px;
  background:var(--admin-surface-2);
  color:var(--admin-primary);
  display:grid;place-items:center;
  font-size:14px;flex-shrink:0;
}
.admin-table-actions{display:flex;gap:6px}
.admin-icon-btn{
  width:32px;height:32px;border-radius:8px;
  border:1px solid var(--admin-border);
  background:transparent;
  color:var(--admin-text-dim);
  display:grid;place-items:center;
  font-size:12px;cursor:pointer;
  transition:var(--t);
}
.admin-icon-btn:hover{background:var(--admin-surface-2);color:#fff}
.admin-icon-btn-warn:hover{background:rgba(245,158,11,.15);color:#fbbf24;border-color:rgba(245,158,11,.3)}
.admin-icon-btn-danger:hover{background:rgba(239,68,68,.15);color:#f87171;border-color:rgba(239,68,68,.3)}

.admin-tag{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:6px;
  font-size:10.5px;font-weight:800;
  text-transform:uppercase;letter-spacing:.06em;
  background:var(--admin-surface-2);
  color:var(--admin-text-dim);
}
.admin-tag i{font-size:9px}
.admin-tag-ok{background:rgba(16,185,129,.14);color:#34d399}
.admin-tag-warn{background:rgba(245,158,11,.15);color:#fbbf24}
.admin-tag-danger{background:rgba(239,68,68,.15);color:#f87171}
.admin-tag-info{background:rgba(59,130,246,.15);color:#60a5fa}
.admin-tag-admin{background:rgba(168,85,247,.15);color:#c084fc}

.admin-pagination{
  display:flex;align-items:center;justify-content:center;gap:14px;
  padding:18px;border-top:1px solid var(--admin-border-soft);
}
.admin-page-btn{
  width:34px;height:34px;border-radius:9px;
  background:var(--admin-surface-2);
  color:var(--admin-text-dim);
  display:grid;place-items:center;
  font-size:12px;transition:var(--t);
}
.admin-page-btn:hover{background:var(--admin-primary);color:#0f1117}
.admin-page-info{font-size:12.5px;color:var(--admin-text-dim)}
.admin-page-info b{color:#fff;font-weight:800}

/* User detail */
.admin-user-hero{
  display:flex;justify-content:space-between;align-items:center;
  gap:20px;flex-wrap:wrap;
}
.admin-user-hero-left{display:flex;align-items:center;gap:18px}
.admin-user-avatar{
  width:72px;height:72px;border-radius:50%;
  object-fit:cover;
  border:3px solid var(--admin-border);
  padding:2px;
  background:linear-gradient(135deg,#28D3AF,#219d85);
}
.admin-user-name{
  font-size:20px;font-weight:800;
  color:#fff;letter-spacing:-.02em;
  display:flex;align-items:center;gap:8px;margin-bottom:4px;
}
.admin-user-email{font-size:13.5px;color:var(--admin-text-dim)}
.admin-user-meta{
  display:flex;gap:14px;flex-wrap:wrap;
  font-size:12px;color:var(--admin-text-mute);
  margin-top:8px;
}
.admin-user-meta span{display:inline-flex;align-items:center;gap:5px}
.admin-user-meta i{font-size:11px;color:var(--admin-primary)}
.admin-user-badges{display:flex;gap:8px;flex-wrap:wrap}

.admin-actions-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:12px;margin-bottom:20px;
}
.admin-action{
  width:100%;
  background:var(--admin-surface);
  border:1px solid var(--admin-border);
  border-radius:12px;
  padding:16px 18px;
  display:flex;flex-direction:column;align-items:flex-start;
  gap:5px;
  cursor:pointer;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
  text-align:left;
  color:var(--admin-text);
  font-family:inherit;
}
.admin-action:hover{transform:translateY(-2px)}
.admin-action i{font-size:16px;margin-bottom:4px}
.admin-action b{font-size:14px;font-weight:800;letter-spacing:-.01em}
.admin-action small{font-size:11.5px;color:var(--admin-text-mute);line-height:1.4}
.admin-action-ok{border-color:rgba(16,185,129,.3)}
.admin-action-ok:hover{background:rgba(16,185,129,.1);border-color:rgba(16,185,129,.5)}
.admin-action-ok i{color:#34d399}
.admin-action-warn{border-color:rgba(245,158,11,.3)}
.admin-action-warn:hover{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.5)}
.admin-action-warn i{color:#fbbf24}
.admin-action-danger{border-color:rgba(239,68,68,.3)}
.admin-action-danger:hover{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.5)}
.admin-action-danger i{color:#f87171}
.admin-action-info{border-color:rgba(59,130,246,.3)}
.admin-action-info:hover{background:rgba(59,130,246,.1);border-color:rgba(59,130,246,.5)}
.admin-action-info i{color:#60a5fa}

.admin-chips{display:flex;flex-wrap:wrap;gap:8px}
.admin-chip{
  display:inline-flex;align-items:center;gap:7px;
  padding:7px 14px;border-radius:9px;
  background:var(--admin-surface-2);
  border:1px solid var(--admin-border);
  font-size:12.5px;font-weight:600;
  color:var(--admin-text-dim);
}
.admin-chip i{color:var(--admin-primary);font-size:12px}

.admin-denuncias-list{display:flex;flex-direction:column;gap:12px}
.admin-denuncia{
  padding:20px;margin:0;
  transition:var(--t);
}
.admin-denuncia-aberta{
  border-color:rgba(239,68,68,.3);
  box-shadow:0 0 0 1px rgba(239,68,68,.1);
}
.admin-denuncia-head{
  display:flex;justify-content:space-between;align-items:flex-start;
  gap:16px;margin-bottom:16px;padding-bottom:16px;
  border-bottom:1px solid var(--admin-border-soft);
  flex-wrap:wrap;
}
.admin-denuncia-motivo{
  font-size:15px;font-weight:800;color:#fff;
  display:flex;align-items:center;gap:9px;margin-bottom:5px;
}
.admin-denuncia-motivo i{color:#f87171;font-size:14px}
.admin-denuncia-meta{
  font-size:12px;color:var(--admin-text-mute);
  display:flex;gap:8px;align-items:center;flex-wrap:wrap;
}
.admin-denuncia-meta b{color:var(--admin-text-dim);font-weight:700}
.admin-denuncia-body{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.admin-denuncia-alvo{font-size:13px}
.admin-denuncia-alvo-label{
  display:block;
  font-size:11px;font-weight:800;color:var(--admin-text-mute);
  text-transform:uppercase;letter-spacing:.06em;
  margin-bottom:5px;
}
.admin-denuncia-alvo-link{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:9px;
  background:var(--admin-surface-2);
  color:var(--admin-text);
  font-size:13px;font-weight:600;
  transition:var(--t);
}
.admin-denuncia-alvo-link:hover{background:rgba(40,211,175,.15);color:var(--admin-primary)}
.admin-denuncia-alvo-link i{font-size:12px}
.admin-denuncia-alvo-link small{color:var(--admin-text-mute);font-weight:500;font-size:11.5px;margin-left:2px}
.admin-denuncia-detalhe{
  background:var(--admin-bg);
  border:1px solid var(--admin-border);
  border-radius:10px;
  padding:14px 16px;
}
.admin-denuncia-detalhe-label{
  font-size:11px;font-weight:800;color:var(--admin-text-mute);
  text-transform:uppercase;letter-spacing:.06em;
  margin-bottom:6px;
}
.admin-denuncia-detalhe p{
  font-size:13px;color:var(--admin-text-dim);
  line-height:1.6;margin:0;
}
.admin-denuncia-actions{
  display:flex;gap:10px;justify-content:flex-end;
  padding-top:14px;
  border-top:1px solid var(--admin-border-soft);
  flex-wrap:wrap;
}
.admin-denuncia-actions .btn-ghost{
  background:transparent;
  border-color:var(--admin-border);
  color:var(--admin-text-dim);
}
.admin-denuncia-actions .btn-ghost:hover{background:var(--admin-surface-2);color:#fff}
.admin-denuncia-actions .btn-primary{
  background:var(--admin-primary);
  border-color:var(--admin-primary);
  color:#0f1117;
  font-weight:700;
}
.admin-denuncia-actions .btn-primary:hover{background:#3ae4c0}

/* =========================================================
   31. RESPONSIVE GLOBAL
   ========================================================= */

/* Tablet (980px) */
@media (max-width:980px){
  /* App */
  .shell{grid-template-columns:1fr}
  .sidebar{display:none}
  .main{padding:20px 18px 130px}
  .bottomnav{display:block}
  .mobile-top{display:flex}
  .home-hero{grid-template-columns:1fr}
  .home-hero .hero-art{display:none}
  .page-title{font-size:22px}

  /* Mapa */
  .mapa-wrap{grid-template-columns:1fr}
  #mapaPlanos{height:420px}
  .mapa-cards{max-height:none;flex-direction:row;overflow-x:auto;padding-bottom:6px}
  .mapa-card{min-width:280px;flex-shrink:0}

  /* Admin */
  .admin-shell{grid-template-columns:1fr}
  .admin-sidebar{display:none}
  .admin-main{padding:20px 18px 100px}
  .admin-charts-grid{grid-template-columns:1fr}
  .admin-grid-3{grid-template-columns:1fr}
  .admin-table{font-size:12.5px}
  .admin-table th,
  .admin-table td{padding:12px 12px}
  .admin-filter-bar{padding:10px 12px}
  .admin-filter-info{margin-left:0;width:100%}
}

/* Mobile grande (640px) */
@media (max-width:640px){
  /* Onboarding */
  .onb-header{padding:16px 18px 14px}
  .onb-main{padding:28px 18px 32px}
  .onb-footer{padding:12px 18px;margin:32px -18px -32px}
  .onb-counter-text{display:none}
  .onb-counter-circle{width:40px;height:40px;font-size:15px}
  .onb-cta{flex:1;min-width:auto;padding:13px 20px}
  .onb-grid{grid-template-columns:1fr 1fr;gap:8px}
  .onb-item{padding:12px;gap:10px;min-height:58px}
  .onb-item-icon{width:34px;height:34px;font-size:14px;border-radius:10px}
  .onb-item-label{font-size:13px}
  .onb-item-check{top:6px;right:6px;width:16px;height:16px;font-size:7px}
  .onb-loc-card{padding:24px 20px}

  /* Form */
  .form-row-2{grid-template-columns:1fr}
  .radio-group{grid-template-columns:1fr}

  /* Plano */
  .plano-detail-hero{flex-direction:column;gap:14px;padding:20px}
  .plano-detail-icon{width:64px;height:64px;font-size:26px;border-radius:16px}
  .plano-detail-info h1{font-size:20px}

  /* Perfil */
  .perfil-hero{padding:20px;flex-direction:column;text-align:center;align-items:center}
  .perfil-avatar{width:80px;height:80px}
  .perfil-info{text-align:center}
  .perfil-meta{justify-content:center}

  /* Admin */
  .admin-kpi-grid{grid-template-columns:1fr}
  .admin-user-hero-left{flex-direction:column;text-align:center}
  .admin-user-badges{justify-content:center;width:100%}
  .admin-table thead{display:none}
  .admin-table, .admin-table tbody, .admin-table tr, .admin-table td{display:block}
  .admin-table tr{
    padding:14px;
    border-top:1px solid var(--admin-border-soft);
  }
  .admin-table td{border:none;padding:6px 0}
}

/* Mobile pequeno (520px) */
@media (max-width:520px){
  /* App */
  .main{padding:16px 14px 120px}
  .grid-planos{grid-template-columns:1fr}
  .grid-pessoas{grid-template-columns:1fr 1fr}
  .quick-grid{grid-template-columns:repeat(4,1fr);gap:8px}
  .quick{padding:14px 6px;gap:8px}
  .quick-ico{width:40px;height:40px;font-size:17px;border-radius:11px}
  .quick-label{font-size:11px}
  .section-icon{width:38px;height:38px;font-size:16px;border-radius:11px}
  .section-title{font-size:16.5px}
  .section-sub{font-size:12.5px}

  /* Auth */
  .auth-card{padding:30px 22px}
  .auth-logo-img{width:140px;height:140px}
  .auth-logo-img.sm{width:96px;height:96px}

  /* Mapa */
  #mapaPlanos{height:380px}
  .leaflet-popup-content{min-width:240px}
  .popup-plan{padding:14px}
  .popup-title{font-size:15px}
  .view-toggle{width:100%;justify-content:center}

  /* Senha */
  .senha-rules{grid-template-columns:1fr}
}

/* =========================================================
   32. SCROLLBAR
   ========================================================= */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:var(--text-mute)}

/* =========================================================
   33. FIX MOBILE — Zoom em inputs + Grid responsivo
   ========================================================= */

/* ---------------------------------------------------------
   33.1 — Evita zoom automático em iOS ao focar inputs
   ---------------------------------------------------------
   O iOS Safari dá zoom quando font-size < 16px em inputs.
   Forçamos 16px apenas em telas pequenas (< 768px) para não
   alterar o design do desktop.
   --------------------------------------------------------- */
@media (max-width:768px){
  /* Inputs, selects e textareas: 16px mínimo */
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="tel"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="search"],
  input[type="url"],
  select,
  textarea,
  .input,
  .search-bar-input,
  .codigo-input,
  .admin-search input,
  .admin-select{
    font-size:16px !important;
  }

  /* Corrige autofill do Chrome mobile que aplica cor estranha */
  input:-webkit-autofill,
  input:-webkit-autofill:hover,
  input:-webkit-autofill:focus{
    -webkit-text-fill-color: var(--text) !important;
    transition: background-color 9999s ease-in-out 0s;
  }

  /* Evita que o body "salte" ao focar input perto do rodapé */
  html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }

  /* Chips e botões de filtro NÃO devem ter 16px (são botões) */
  .onb-filter,
  .view-toggle-btn,
  .btn,
  .btn-sm{
    font-size:inherit;
  }
}

/* ---------------------------------------------------------
   33.2 — Grid do onboarding: 1 coluna em telas muito pequenas
   ---------------------------------------------------------
   Abaixo de 480px: cards em largura total, mais confortáveis
   para o toque e melhor legibilidade.
   --------------------------------------------------------- */
@media (max-width:480px){
  /* Grid: 1 coluna no mobile pequeno */
  .onb-grid{
    grid-template-columns:1fr !important;
    gap:10px;
  }

  /* Card mais compacto, altura confortável para o toque */
  .onb-item{
    padding:14px 16px !important;
    gap:12px !important;
    min-height:62px !important;
    border-radius:14px;
  }

  .onb-item-icon{
    width:38px !important;
    height:38px !important;
    font-size:16px !important;
    border-radius:11px;
  }

  .onb-item-label{
    font-size:14px !important;
    line-height:1.3;
  }

  .onb-item-check{
    top:50% !important;
    right:16px !important;
    transform:translateY(-50%) scale(.5) !important;
    width:22px !important;
    height:22px !important;
    font-size:10px !important;
  }
  .onb-item input:checked ~ .onb-item-check{
    transform:translateY(-50%) scale(1) !important;
  }

  /* Container principal um pouco mais enxuto */
  .onb-main{padding:24px 16px 32px}
  .onb-header{padding:14px 16px 12px}

  /* Footer do onboarding */
  .onb-footer{
    padding:12px 16px !important;
    margin:32px -16px -32px !important;
  }
  .onb-cta{
    padding:13px 20px !important;
    font-size:15px;
  }

  /* Categorias com espaçamento menor */
  .onb-cat-group{margin-bottom:24px}
  .onb-cat-title{font-size:11.5px;margin-bottom:10px}
}

/* ---------------------------------------------------------
   33.3 — Grid de pessoas no mobile (evita 2 colunas apertadas)
   --------------------------------------------------------- */
@media (max-width:420px){
  .grid-pessoas{
    grid-template-columns:1fr !important;
  }
  .pessoa-card{padding:20px 16px}
}

/* ---------------------------------------------------------
   33.4 — Botões e chips no mobile não devem quebrar layout
   --------------------------------------------------------- */
@media (max-width:520px){
  .section-head{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }
  .section-head .btn,
  .section-head .view-toggle{
    width:100%;
    justify-content:center;
  }

  .page-head{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }
  .page-head .btn{width:100%}
}

/* ---------------------------------------------------------
   33.5 — Modais e popups no mobile
   --------------------------------------------------------- */
@media (max-width:520px){
  .leaflet-popup-content{ min-width:auto !important; width:calc(100vw - 60px) !important; }
  .popup-plan{padding:14px}
  .popup-top{flex-wrap:wrap;gap:8px}
  .popup-criador{width:100%}
  .popup-badge{margin-left:auto}

  /* Chat: altura confortável */
  .chat-wrap{height:calc(100dvh - 200px)}

  /* Modais */
  .modal{padding:24px 20px;border-radius:20px}
  .modal-actions{flex-direction:column}
  .modal-actions .btn{width:100%}
}

/* ---------------------------------------------------------
   33.6 — Ajuste geral para evitar "salto" horizontal
   --------------------------------------------------------- */
@media (max-width:768px){
  html, body{
    max-width:100vw;
    overflow-x:hidden;
  }
  /* Impede que imagens/shadow causem scroll lateral */
  img{max-width:100%;height:auto}
  .hero, .cta-final{overflow:hidden}
}

/* =========================================================
   34. ONBOARDING — Ajuste fino do grid mobile
   ========================================================= */

/* Tablet (768px): 2 colunas */
@media (max-width:768px) and (min-width:481px){
  .onb-grid{
    grid-template-columns:repeat(2, 1fr) !important;
    gap:10px;
  }
  .onb-item{
    padding:13px 14px !important;
    min-height:60px;
  }
  .onb-item-icon{
    width:36px !important;
    height:36px !important;
    font-size:15px !important;
  }
  .onb-item-label{font-size:13.5px !important}
}

/* Mobile pequeno (≤480px): 1 coluna ocupando toda a largura */
@media (max-width:480px){
  .onb-grid{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  .onb-item{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    padding:14px 52px 14px 16px !important; /* deixa espaço pro check à direita */
    min-height:60px !important;
    border-radius:14px !important;
    gap:14px !important;
    position:relative;
  }

  .onb-item-icon{
    width:40px !important;
    height:40px !important;
    font-size:16px !important;
    border-radius:12px !important;
    flex-shrink:0;
  }

  .onb-item-label{
    font-size:14.5px !important;
    font-weight:600;
    line-height:1.3;
    flex:1;
    text-align:left;
  }

  /* Check à direita, verticalmente centralizado */
  .onb-item-check{
    position:absolute !important;
    top:50% !important;
    right:14px !important;
    left:auto !important;
    transform:translateY(-50%) scale(.5) !important;
    width:24px !important;
    height:24px !important;
    font-size:11px !important;
    margin:0 !important;
  }

  .onb-item input:checked ~ .onb-item-check{
    transform:translateY(-50%) scale(1) !important;
  }

  /* Categoria mais compacta */
  .onb-cat-title{
    font-size:11px !important;
    letter-spacing:.08em !important;
    margin-bottom:10px !important;
  }

  .onb-cat-group{margin-bottom:22px !important}

  /* Main com padding enxuto */
  .onb-main{padding:22px 14px 28px !important}
  .onb-header{padding:14px 14px 12px !important}
}

/* Shake no contador quando tenta continuar com menos de 3 */
@keyframes onbShake{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-6px)}
  75%{transform:translateX(6px)}
}
.onb-counter-box.shake{
  animation:onbShake .35s ease-in-out 1;
}

/* =========================================================
   35. LOGIN — Linha "Lembrar + Esqueci a senha"
   ========================================================= */

.login-options{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:6px 0 20px;
  flex-wrap:wrap;
}

.login-forgot{
  font-size:13.5px;
  font-weight:600;
  color:var(--primary-dark);
  text-decoration:none;
  transition:var(--t);
  white-space:nowrap;
}
.login-forgot:hover{
  color:var(--primary);
  text-decoration:underline;
  text-underline-offset:3px;
}

@media (max-width:420px){
  .login-options{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }
  .login-forgot{
    margin-left:30px; /* alinha com o texto do checkbox */
  }
}

/* =========================================================
   36. COMPARTILHAR PLANO
   ========================================================= */

/* Botão de compartilhar dentro do footer do card */
.plano-foot-right{
  display:flex;
  align-items:center;
  gap:8px;
}

.share-btn-icon{
  width:32px;height:32px;
  border-radius:9px;
  background:var(--card-soft);
  border:1px solid var(--border);
  color:var(--text-mute);
  display:grid;place-items:center;
  font-size:12px;
  cursor:pointer;
  transition:var(--t);
  flex-shrink:0;
}
.share-btn-icon:hover{
  background:var(--primary-light);
  border-color:var(--primary);
  color:var(--primary-dark);
  transform:scale(1.05);
}
.share-btn-icon:active{transform:scale(.95)}

/* Link do card: cobre a área do card, exceto o footer */
.plano-card-link{
  display:block;
  text-decoration:none;
  color:inherit;
}

/* Botão de compartilhar grande (na página de detalhe) */
.btn-share{
  border-color:var(--border);
}
.btn-share:hover{
  background:var(--primary-light);
  border-color:var(--primary);
  color:var(--primary-dark);
}
.btn-share i{font-size:13px}

/* =========================================================
   37. PREVIEW PÚBLICO — Página sem login
   ========================================================= */

.publico-body{
  background:var(--bg);
  min-height:100dvh;
  display:flex;
  flex-direction:column;
}

.publico-nav{
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  padding:12px 20px;
  position:sticky;top:0;z-index:50;
}
.publico-nav-wrap{
  max-width:1000px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.publico-brand{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:var(--text);
}
.publico-brand img{
  width:38px;height:38px;
  border-radius:11px;
  object-fit:contain;
}
.publico-brand span{
  font-size:17px;
  font-weight:800;
  letter-spacing:-.01em;
}
.publico-nav-actions{
  display:flex;
  gap:8px;
  align-items:center;
}

.publico-main{
  flex:1;
  padding:32px 20px 60px;
}

.preview-wrap{
  max-width:640px;
  margin:0 auto;
}

.preview-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 14px;
  border-radius:99px;
  background:var(--primary-light);
  color:var(--primary-dark);
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.02em;
  margin:0 auto 20px;
  display:flex;
  justify-content:center;
  width:fit-content;
}
.preview-badge i{font-size:11px}

.preview-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:24px;
  padding:36px 32px;
  box-shadow:0 12px 40px rgba(0,0,0,.08);
  text-align:center;
  margin-bottom:24px;
}

.preview-icon{
  width:88px;height:88px;
  border-radius:24px;
  background:linear-gradient(135deg,var(--primary-light),#fff);
  border:1.5px solid var(--primary-light);
  color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:38px;
  margin:0 auto 22px;
  box-shadow:0 8px 24px rgba(40,211,175,.15);
}
.preview-icon span{font-size:44px;line-height:1}

.preview-title{
  font-size:clamp(22px,4vw,28px);
  font-weight:800;
  letter-spacing:-.025em;
  line-height:1.2;
  color:var(--text);
  margin-bottom:26px;
}

.preview-meta{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px;
  margin-bottom:24px;
  text-align:left;
}
.preview-meta-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  background:var(--card-soft);
  border:1px solid var(--border);
  border-radius:14px;
}
.preview-meta-item > i{
  width:34px;height:34px;
  border-radius:10px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:14px;
  flex-shrink:0;
}
.preview-meta-item > div{
  display:flex;
  flex-direction:column;
  line-height:1.25;
  min-width:0;
}
.preview-meta-item span{
  font-size:11px;
  color:var(--text-mute);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:700;
}
.preview-meta-item b{
  font-size:13.5px;
  color:var(--text);
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.preview-descricao{
  padding:18px 20px;
  background:var(--card-soft);
  border-left:3px solid var(--primary);
  border-radius:10px;
  color:var(--text-dim);
  font-size:14.5px;
  line-height:1.6;
  text-align:left;
  margin-bottom:22px;
}

.preview-criador{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 18px;
  background:var(--card-soft);
  border-radius:14px;
  margin-bottom:24px;
  text-align:left;
}
.preview-criador img{
  width:44px;height:44px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--primary-light);
  flex-shrink:0;
}
.preview-criador > div{
  display:flex;
  flex-direction:column;
  line-height:1.3;
}
.preview-criador span{
  font-size:11.5px;
  color:var(--text-mute);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:700;
}
.preview-criador b{
  font-size:15px;
  color:var(--text);
  font-weight:700;
}

.preview-cta{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.preview-foot-note{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  margin-top:20px;
  font-size:12.5px;
  color:var(--text-mute);
}
.preview-foot-note i{
  color:var(--primary);
  font-size:12px;
}

.preview-sobre{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:20px;
  padding:28px 24px;
  text-align:center;
}
.preview-sobre h2{
  font-size:18px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
  margin-bottom:10px;
}
.preview-sobre > p{
  font-size:14.5px;
  color:var(--text-mute);
  line-height:1.6;
  max-width:480px;
  margin:0 auto 22px;
}
.preview-sobre-features{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
}
.preview-sobre-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  background:var(--card-soft);
  border-radius:12px;
  font-size:13px;
  color:var(--text-dim);
  font-weight:500;
  text-align:left;
}
.preview-sobre-item i{
  color:var(--primary);
  font-size:14px;
  flex-shrink:0;
}

.publico-footer{
  padding:36px 20px 32px;
  border-top:1px solid var(--border);
  margin-top:auto;
}
.publico-footer-wrap{
  max-width:1000px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.publico-footer-brand img{
  width:90px;
  object-fit:contain;
}
.publico-footer-copy{
  font-size:13px;
  color:var(--text-mute);
  line-height:1.6;
  text-align:right;
}
.publico-footer-copy small{
  font-size:11.5px;
  color:var(--text-mute);
  opacity:.75;
}

/* Responsivo */
@media (max-width:640px){
  .publico-nav{padding:10px 16px}
  .publico-brand img{width:32px;height:32px}
  .publico-brand span{font-size:15px}
  .publico-nav-actions .btn{font-size:12.5px;padding:8px 14px}
  .publico-main{padding:24px 16px 48px}
  .preview-card{padding:26px 20px;border-radius:20px}
  .preview-icon{width:72px;height:72px;font-size:32px;border-radius:20px}
  .preview-icon span{font-size:36px}
  .preview-meta{grid-template-columns:1fr}
  .preview-sobre{padding:22px 18px;border-radius:16px}
  .preview-sobre h2{font-size:16px}
  .preview-sobre-features{grid-template-columns:1fr}
  .publico-footer-wrap{flex-direction:column;text-align:center}
  .publico-footer-copy{text-align:center}
}

/* =========================================================
   38. PLANO INDISPONÍVEL + NOTIFICAÇÕES refinadas
   ========================================================= */

/* Info do plano indisponível */
.indisponivel-info{
  text-align:left;
  background:var(--card-soft);
  border:1px solid var(--border);
  border-radius:14px;
  padding:18px 20px;
  margin-top:6px;
}
.indisponivel-info > p{
  font-size:13.5px;
  color:var(--text-mute);
  margin-bottom:10px;
  font-weight:600;
}
.indisponivel-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.indisponivel-list li{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:var(--text-dim);
  line-height:1.5;
}
.indisponivel-list li i{
  font-size:11px;
  color:var(--primary);
  flex-shrink:0;
  width:14px;
  text-align:center;
}

/* Notificações — seta indicadora */
.notif-row-arrow{
  color:var(--text-mute);
  font-size:12px;
  flex-shrink:0;
  transition:transform .2s;
}
.notif-row:hover .notif-row-arrow{
  transform:translateX(3px);
  color:var(--primary-dark);
}

/* Ícone de notificação com cor própria */
.notif-row-icon{
  color:var(--primary);
}
.notif-row-icon i{
  font-size:16px;
}

/* =========================================================
   39. CONVITES + EMBAIXADORES
   ========================================================= */

/* -------- Badges de embaixador -------- */
.nav-crown{
  position:absolute;
  top:-2px;right:-2px;
  width:14px;height:14px;
  border-radius:50%;
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  color:#fff;
  display:grid;place-items:center;
  font-size:7px;
  box-shadow:0 0 0 2px var(--card);
}
.user-crown-inline{
  color:#f59e0b;
  font-size:11px;
  margin-left:4px;
}

/* -------- Página pública de convite -------- */
.convite-wrap{
  max-width:640px;
  margin:0 auto;
}

.convite-badge{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:fit-content;
  margin:0 auto 20px;
  padding:7px 16px;
  border-radius:99px;
  background:linear-gradient(135deg,#fef3c7,#fde68a);
  color:#92400e;
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.02em;
  box-shadow:0 6px 20px rgba(251,191,36,.25);
}
.convite-badge i{font-size:11px;color:#d97706}

.convite-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:26px;
  padding:40px 32px 34px;
  box-shadow:0 12px 40px rgba(0,0,0,.08);
  text-align:center;
  margin-bottom:24px;
}

.convite-avatar-wrap{
  position:relative;
  width:100px;
  height:100px;
  margin:0 auto 22px;
}
.convite-avatar-wrap img{
  width:100%;height:100%;
  border-radius:50%;
  object-fit:cover;
  border:4px solid var(--primary-light);
  box-shadow:0 10px 28px rgba(40,211,175,.25);
}
.convite-embaixador-badge{
  position:absolute;
  bottom:0;right:0;
  width:32px;height:32px;
  border-radius:50%;
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  color:#fff;
  display:grid;place-items:center;
  font-size:13px;
  border:3px solid var(--card);
  box-shadow:0 4px 12px rgba(251,191,36,.4);
}

.convite-titulo{
  font-size:clamp(20px,3.6vw,26px);
  font-weight:800;
  letter-spacing:-.025em;
  line-height:1.25;
  color:var(--text);
  margin-bottom:10px;
}
.convite-titulo b{
  color:var(--primary-dark);
}

.convite-cidade{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13.5px;
  color:var(--text-mute);
  margin-bottom:12px;
  font-weight:600;
}
.convite-cidade i{font-size:12px;color:var(--primary)}

.convite-bio{
  font-size:14.5px;
  color:var(--text-dim);
  font-style:italic;
  line-height:1.6;
  max-width:420px;
  margin:0 auto 24px;
  padding:0 8px;
}

.convite-divider{
  display:flex;
  align-items:center;
  gap:14px;
  margin:26px 0 22px;
  color:var(--text-mute);
  font-size:11.5px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.convite-divider::before,
.convite-divider::after{
  content:'';
  flex:1;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--border),transparent);
}

.convite-features{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:28px;
}
.convite-feature{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 16px;
  background:var(--card-soft);
  border-radius:12px;
  font-size:13.5px;
  color:var(--text-dim);
  font-weight:500;
  text-align:left;
}
.convite-feature i{
  width:30px;height:30px;
  border-radius:9px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:13px;
  flex-shrink:0;
}

.convite-cta{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.convite-foot-note{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  margin-top:20px;
  font-size:12.5px;
  color:var(--text-mute);
}
.convite-foot-note i{color:var(--primary);font-size:12px}

/* Como funciona */
.convite-como{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:20px;
  padding:28px 24px;
  text-align:center;
}
.convite-como h2{
  font-size:17px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
  margin-bottom:20px;
}
.convite-passos{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.convite-passo{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  padding:16px 10px;
  background:var(--card-soft);
  border-radius:14px;
}
.convite-passo-num{
  width:32px;height:32px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff;
  display:grid;place-items:center;
  font-size:14px;font-weight:800;
  margin-bottom:4px;
  box-shadow:0 6px 16px rgba(40,211,175,.3);
}
.convite-passo b{
  font-size:13px;
  font-weight:700;
  color:var(--text);
  line-height:1.3;
}
.convite-passo small{
  font-size:11.5px;
  color:var(--text-mute);
  line-height:1.4;
}

/* -------- Painel de convites -------- */

.convite-hero-embaixador{
  display:flex;
  align-items:center;
  gap:20px;
  padding:24px 26px;
  border-radius:20px;
  background:linear-gradient(135deg,#fef3c7,#fde68a 50%,#fcd34d);
  border:1px solid rgba(251,191,36,.4);
  margin-bottom:22px;
  box-shadow:0 8px 24px rgba(251,191,36,.2);
}
.convite-hero-crown{
  width:64px;height:64px;
  border-radius:20px;
  background:#fff;
  color:#d97706;
  display:grid;place-items:center;
  font-size:28px;
  flex-shrink:0;
  box-shadow:0 6px 16px rgba(251,191,36,.3);
}
.convite-hero-embaixador h2{
  font-size:19px;
  font-weight:800;
  letter-spacing:-.02em;
  color:#78350f;
  margin-bottom:4px;
}
.convite-hero-embaixador p{
  font-size:13.5px;
  color:#92400e;
  line-height:1.5;
}

.convite-link-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:20px;
  padding:24px;
  box-shadow:var(--shadow-sm);
}

.convite-link-head{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:20px;
}
.convite-link-icon{
  width:46px;height:46px;
  border-radius:14px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff;
  display:grid;place-items:center;
  font-size:18px;
  flex-shrink:0;
  box-shadow:0 6px 16px rgba(40,211,175,.3);
}
.convite-link-head h3{
  font-size:15px;
  font-weight:800;
  color:var(--text);
  letter-spacing:-.01em;
  margin-bottom:2px;
}
.convite-link-head p{
  font-size:12.5px;
  color:var(--text-mute);
}

.convite-link-box{
  display:flex;
  gap:8px;
  margin-bottom:14px;
}
.convite-link-box input{
  flex:1;
  padding:13px 16px;
  border-radius:12px;
  border:1.5px solid var(--border);
  background:var(--card-soft);
  font-family:'SF Mono',Menlo,Consolas,monospace;
  font-size:13px;
  color:var(--text);
  outline:none;
  cursor:pointer;
  transition:var(--t);
  min-width:0;
}
.convite-link-box input:focus{
  border-color:var(--primary);
  background:var(--card);
  box-shadow:0 0 0 4px rgba(40,211,175,.12);
}
.convite-link-copy{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:13px 18px;
  border-radius:12px;
  background:var(--primary);
  color:#fff;
  font-weight:700;
  font-size:13.5px;
  border:none;
  cursor:pointer;
  transition:var(--t);
  white-space:nowrap;
  flex-shrink:0;
}
.convite-link-copy:hover{
  background:var(--primary-dark);
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(40,211,175,.35);
}

.convite-link-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.convite-link-actions .btn{flex:1;min-width:200px}

.convite-progress{
  margin-top:22px;
  padding-top:20px;
  border-top:1px solid var(--border);
}
.convite-progress-head{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  margin-bottom:10px;
  gap:12px;
  flex-wrap:wrap;
}
.convite-progress-head b{
  font-size:13.5px;
  font-weight:700;
  color:var(--text);
}
.convite-progress-head b span{
  color:var(--primary-dark);
  font-weight:800;
}
.convite-progress-head small{
  font-size:12.5px;
  color:var(--text-mute);
  font-weight:700;
  font-variant-numeric:tabular-nums;
}
.convite-progress-bar{
  height:10px;
  background:var(--border);
  border-radius:99px;
  overflow:hidden;
}
.convite-progress-fill{
  height:100%;
  border-radius:99px;
  background:linear-gradient(90deg,var(--primary),var(--primary-dark));
  transition:width .6s cubic-bezier(.2,.8,.2,1);
}

/* Lista de convidados */
.convidados-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:10px;
}
.convidado-card{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 18px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
  text-decoration:none;
  color:inherit;
}
.convidado-card:hover{
  border-color:var(--primary-light);
  transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(0,0,0,.05);
}
.convidado-avatar{
  width:44px;height:44px;
  border-radius:50%;
  padding:2px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  flex-shrink:0;
}
.convidado-avatar img{
  width:100%;height:100%;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--card);
}
.convidado-info{
  flex:1;
  min-width:0;
}
.convidado-info b{
  display:block;
  font-size:14px;
  font-weight:700;
  color:var(--text);
  margin-bottom:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.convidado-info small{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:12px;
  color:var(--text-mute);
}
.convidado-info small i{font-size:10px;color:var(--primary)}
.convidado-arrow{
  font-size:11px;
  color:var(--text-mute);
  transition:transform .2s;
}
.convidado-card:hover .convidado-arrow{
  transform:translateX(3px);
  color:var(--primary-dark);
}

/* Responsivo */
@media (max-width:640px){
  .convite-card{padding:30px 22px 26px;border-radius:22px}
  .convite-avatar-wrap{width:86px;height:86px}
  .convite-features{margin-bottom:22px}
  .convite-como{padding:22px 18px}
  .convite-passos{grid-template-columns:1fr;gap:10px}
  .convite-passo{flex-direction:row;justify-content:flex-start;text-align:left;padding:14px}
  .convite-passo-num{margin-bottom:0}
  .convite-hero-embaixador{padding:20px;gap:14px;flex-direction:column;text-align:center}
  .convite-hero-crown{width:56px;height:56px;font-size:24px}
  .convite-link-card{padding:20px}
  .convite-link-box{flex-direction:column}
  .convite-link-copy{justify-content:center}
  .convite-link-actions{flex-direction:column}
  .convidados-grid{grid-template-columns:1fr}
}

/* =========================================================
   40. RATE LIMIT — Feedback visual
   ========================================================= */

/* Botão com cooldown */
.btn-cooldown{
  opacity:.6;
  cursor:wait;
  pointer-events:none;
}

.btn-link:disabled{
  opacity:.5;
  cursor:wait;
  text-decoration:none;
  color:var(--text-mute);
}

/* Aviso de bloqueio em card */
.rate-warning{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 16px;
  border-radius:12px;
  background:#fef3c7;
  border:1px solid #fbbf24;
  color:#92400e;
  font-size:13.5px;
  line-height:1.5;
  margin-bottom:16px;
}
.rate-warning i{
  color:#d97706;
  font-size:15px;
  margin-top:1px;
  flex-shrink:0;
}
.rate-warning b{
  display:block;
  font-weight:800;
  margin-bottom:2px;
}

/* =========================================================
   41. DROPDOWN GENÉRICO (menu de contexto)
   ========================================================= */

.dropdown{
  position:relative;
  display:inline-block;
}

.btn-icon-only{
  width:52px;
  height:52px;
  padding:0;
  border-radius:50%;
  display:grid;
  place-items:center;
}
.btn-icon-only i{font-size:16px}

.dropdown-menu{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  min-width:220px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  padding:6px;
  box-shadow:0 20px 40px -10px rgba(0,0,0,.2);
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:all .18s cubic-bezier(.2,.8,.2,1);
  z-index:90;
}
.dropdown-menu.on{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

.dropdown-item{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  padding:10px 14px;
  border:none;
  background:transparent;
  color:var(--text);
  font-size:13.5px;
  font-weight:600;
  font-family:inherit;
  text-align:left;
  border-radius:9px;
  cursor:pointer;
  transition:var(--t);
}
.dropdown-item i{
  font-size:13px;
  width:16px;
  text-align:center;
  color:var(--text-mute);
}
.dropdown-item:hover{
  background:var(--card-soft);
}
.dropdown-item-danger{
  color:#b91c1c;
}
.dropdown-item-danger i{color:#ef4444}
.dropdown-item-danger:hover{
  background:#fef2f2;
}


/* =========================================================
   43. TRIPS (viagens)
   ========================================================= */

/* -------- Grid de trips -------- */
.grid-trips{
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  display:grid;
  gap:16px;
}

.trip-card{
  position:relative;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:20px;
  overflow:hidden;
  transition:all .25s cubic-bezier(.2,.8,.2,1);
  text-decoration:none;
  color:inherit;
  display:block;
}
.trip-card:hover{
  transform:translateY(-4px);
  border-color:var(--primary-light);
  box-shadow:0 20px 40px -15px rgba(40,211,175,.25);
}

.trip-card-bg{
  position:absolute;
  top:-30px;right:-30px;
  width:140px;height:140px;
  display:grid;place-items:center;
  font-size:100px;
  color:var(--primary-light);
  opacity:.4;
  transform:rotate(-15deg);
  pointer-events:none;
  transition:transform .4s cubic-bezier(.2,.8,.2,1);
}
.trip-card:hover .trip-card-bg{
  transform:rotate(-25deg) scale(1.1);
  opacity:.55;
}

.trip-card-body{
  position:relative;
  z-index:1;
  padding:22px;
}

.trip-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:14px;
  min-height:24px;
}

.trip-card-icon{
  width:44px;height:44px;
  border-radius:12px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:18px;
  margin-bottom:12px;
  transition:transform .2s cubic-bezier(.2,.8,.2,1);
}
.trip-card:hover .trip-card-icon{
  transform:scale(1.1);
  background:var(--primary);
  color:#fff;
}

.trip-card-cidade{
  font-size:22px;
  font-weight:800;
  letter-spacing:-.025em;
  line-height:1.15;
  color:var(--text);
  margin-bottom:2px;
}
.trip-card-local{
  font-size:12px;
  color:var(--text-mute);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:14px;
}

.trip-card-titulo{
  font-size:14.5px;
  font-weight:700;
  color:var(--text-dim);
  margin-bottom:10px;
  line-height:1.3;
}

.trip-card-datas{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12.5px;
  color:var(--text-mute);
  margin-bottom:14px;
  flex-wrap:wrap;
}
.trip-card-datas i{font-size:11px;color:var(--primary)}

.trip-card-dias{
  color:var(--primary-dark);
  font-weight:700;
}

.trip-card-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:14px;
  border-top:1px solid var(--border);
}

.trip-card-stats{
  display:flex;
  gap:14px;
  align-items:center;
}
.trip-card-stats span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:12.5px;
  font-weight:700;
  color:var(--text-mute);
}
.trip-card-stats i{font-size:11px}

.trip-card-avatar{
  width:32px;height:32px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--primary-light);
}

/* -------- Filtros da busca -------- */
.trip-filtros{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:24px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:18px;
  padding:16px;
}

.trip-filtro-cidade{
  flex:1;
  min-width:220px;
  position:relative;
  display:flex;
  align-items:center;
}
.trip-filtro-cidade i{
  position:absolute;
  left:14px;
  color:var(--primary);
  font-size:14px;
  pointer-events:none;
}
.trip-filtro-cidade input{
  width:100%;
  padding:13px 14px 13px 40px;
  background:var(--card-soft);
  border:1.5px solid var(--border);
  border-radius:12px;
  color:var(--text);
  font-size:14px;
  outline:none;
  transition:var(--t);
}
.trip-filtro-cidade input:focus{
  border-color:var(--primary);
  background:var(--card);
  box-shadow:0 0 0 4px rgba(40,211,175,.12);
}

.trip-filtro-datas{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.trip-filtro-data{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.trip-filtro-data label{
  font-size:10.5px;
  font-weight:800;
  color:var(--text-mute);
  text-transform:uppercase;
  letter-spacing:.08em;
  padding-left:6px;
}
.trip-filtro-data input{
  padding:12px 14px;
  background:var(--card-soft);
  border:1.5px solid var(--border);
  border-radius:12px;
  color:var(--text);
  font-size:13.5px;
  outline:none;
  transition:var(--t);
}
.trip-filtro-data input:focus{
  border-color:var(--primary);
  background:var(--card);
}

.trip-filtro-periodo{
  display:inline-flex;
  gap:4px;
  background:var(--card-soft);
  border:1.5px solid var(--border);
  border-radius:12px;
  padding:4px;
}
.trip-filtro-periodo button{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:9px 14px;
  border-radius:9px;
  border:none;
  background:transparent;
  color:var(--text-mute);
  font-size:12.5px;
  font-weight:700;
  cursor:pointer;
  transition:var(--t);
  font-family:inherit;
}
.trip-filtro-periodo button i{font-size:11px}
.trip-filtro-periodo button:hover{color:var(--text)}
.trip-filtro-periodo button.active{
  background:var(--primary);
  color:#fff;
  box-shadow:0 4px 12px rgba(40,211,175,.3);
}

.trip-filtro-buscar{
  padding:13px 24px !important;
  align-self:flex-end;
}

/* -------- Hero da trip (show) -------- */
.trip-hero{
  position:relative;
  border-radius:26px;
  overflow:hidden;
  margin-bottom:24px;
  background:linear-gradient(135deg,#28D3AF 0%,#219d85 100%);
  color:#fff;
  box-shadow:0 12px 40px rgba(40,211,175,.3);
}

.trip-hero-bg{
  position:absolute;
  top:-40px;right:-40px;
  width:280px;height:280px;
  display:grid;place-items:center;
  font-size:240px;
  color:rgba(255,255,255,.1);
  transform:rotate(-15deg);
  pointer-events:none;
}

.trip-hero-content{
  position:relative;
  z-index:1;
  padding:36px 32px;
}

.trip-hero-badge{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:6px 14px;
  border-radius:99px;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.28);
  color:#fff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:16px;
  backdrop-filter:blur(8px);
}
.trip-hero-badge i{font-size:11px}

.trip-hero h1{
  font-size:clamp(24px,4vw,34px);
  font-weight:800;
  letter-spacing:-.025em;
  line-height:1.15;
  margin-bottom:24px;
}

.trip-hero-meta{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-bottom:24px;
}
.trip-hero-meta-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.2);
  border-radius:14px;
  backdrop-filter:blur(8px);
}
.trip-hero-meta-item > i{
  width:36px;height:36px;
  border-radius:10px;
  background:rgba(255,255,255,.2);
  display:grid;place-items:center;
  font-size:14px;
  flex-shrink:0;
}
.trip-hero-meta-item > div{
  display:flex;
  flex-direction:column;
  line-height:1.25;
  min-width:0;
}
.trip-hero-meta-item span{
  font-size:10.5px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  opacity:.85;
}
.trip-hero-meta-item b{
  font-size:13.5px;
  font-weight:700;
}

.trip-hero-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.trip-hero-actions .btn-primary{
  background:#fff;
  color:var(--primary-dark);
  border:none;
}
.trip-hero-actions .btn-primary:hover{
  background:#fff;
  color:var(--primary-dark);
  transform:translateY(-2px);
}
.trip-hero-actions .btn-ghost{
  background:rgba(255,255,255,.15);
  border-color:rgba(255,255,255,.3);
  color:#fff;
}
.trip-hero-actions .btn-ghost:hover{
  background:rgba(255,255,255,.25);
}
.trip-hero-actions .badge-live{
  background:rgba(255,255,255,.2) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.3) !important;
}
.trip-hero-actions .badge-secondary{
  background:rgba(255,255,255,.15) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.3) !important;
}
.trip-hero-actions .badge-cheio{
  background:rgba(0,0,0,.25) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.2) !important;
}

/* Chip de participante na trip */
.trip-participante{
  text-decoration:none;
  color:inherit;
  transition:var(--t);
}
.trip-participante:hover{
  background:var(--primary-light);
  border-color:var(--primary);
}
.trip-participante-crown{
  color:#f59e0b;
  font-size:12px;
}

/* -------- Responsivo -------- */
@media (max-width:640px){
  .grid-trips{grid-template-columns:1fr}
  .trip-hero-content{padding:26px 22px}
  .trip-hero-meta{grid-template-columns:1fr 1fr;gap:8px}
  .trip-hero-meta-item{padding:12px 12px}
  .trip-hero-meta-item > i{width:30px;height:30px;font-size:12px}
  .trip-hero-meta-item span{font-size:9.5px}
  .trip-hero-meta-item b{font-size:12px}
  .trip-hero-actions{flex-direction:column;align-items:stretch}
  .trip-hero-actions .btn,
  .trip-hero-actions form,
  .trip-hero-actions form button{width:100%}
  .trip-hero-actions .badge{text-align:center;justify-content:center}

  .trip-filtros{padding:12px;gap:8px}
  .trip-filtro-cidade{min-width:100%}
  .trip-filtro-datas{width:100%}
  .trip-filtro-data{flex:1;min-width:0}
  .trip-filtro-data input{width:100%;font-size:16px !important}
  .trip-filtro-cidade input{font-size:16px !important}
  .trip-filtro-periodo{width:100%;justify-content:center}
  .trip-filtro-buscar{width:100%;justify-content:center}
}

/* =========================================================
   44. TRIPS — Parte 2 (sugestões, quem vai, criar plano)
   ========================================================= */

/* -------- Banner "plano vinculado" no criar_plano -------- */
.plano-trip-banner{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 20px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(59,130,246,.08),rgba(59,130,246,.02));
  border:1.5px solid rgba(59,130,246,.25);
  margin-bottom:20px;
}
.plano-trip-banner-icon{
  width:44px;height:44px;
  border-radius:12px;
  background:#3b82f6;
  color:#fff;
  display:grid;place-items:center;
  font-size:18px;
  flex-shrink:0;
  box-shadow:0 6px 16px rgba(59,130,246,.3);
}
.plano-trip-banner b{
  display:block;
  font-size:14px;
  font-weight:800;
  color:var(--text);
  margin-bottom:3px;
}
.plano-trip-banner small{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12.5px;
  color:var(--text-mute);
}
.plano-trip-banner small i{font-size:11px;color:#3b82f6}

/* -------- Quem mais vai estar lá -------- */
.quemvai-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:12px;
}
.quemvai-card{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  text-decoration:none;
  color:inherit;
}
.quemvai-card:hover{
  border-color:#3b82f6;
  background:linear-gradient(135deg,rgba(59,130,246,.06),var(--card));
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(59,130,246,.15);
}

.quemvai-avatar{
  width:44px;height:44px;
  border-radius:50%;
  padding:2px;
  background:linear-gradient(135deg,#3b82f6,#1e40af);
  flex-shrink:0;
}
.quemvai-avatar img{
  width:100%;height:100%;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--card);
}

.quemvai-body{flex:1;min-width:0}
.quemvai-body b{
  display:block;
  font-size:14px;
  font-weight:700;
  color:var(--text);
  margin-bottom:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.quemvai-body small{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:11.5px;
  color:var(--text-mute);
  margin-bottom:6px;
}
.quemvai-body small i{font-size:10px;color:#3b82f6}
.quemvai-datas{
  font-size:11.5px;
  font-weight:700;
  color:#1e40af;
  margin-bottom:2px;
}
.quemvai-titulo{
  font-size:11.5px;
  color:var(--text-mute);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* -------- Roteiro colaborativo (sugestões) -------- */
.sugestao-form{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.sugestao-input-row{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.sugestao-input{flex:1;min-width:200px}
.sugestao-select{
  width:auto;
  min-width:160px;
  flex-shrink:0;
}

.sugestoes-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.sugestao-item{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:14px 18px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.sugestao-item:hover{
  border-color:var(--border-strong);
  box-shadow:0 4px 12px rgba(0,0,0,.04);
}

.sugestao-voto{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  padding:6px 10px;
  border-radius:10px;
  background:var(--card-soft);
  border:1.5px solid var(--border);
  color:var(--text-mute);
  cursor:pointer;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
  font-family:inherit;
  flex-shrink:0;
  min-width:44px;
}
.sugestao-voto i{font-size:11px}
.sugestao-voto-count{font-size:13px;font-weight:800;line-height:1}
.sugestao-voto:hover{
  border-color:var(--primary);
  color:var(--primary-dark);
}
.sugestao-voto.votou{
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
  box-shadow:0 4px 12px rgba(40,211,175,.3);
}
.sugestao-voto:disabled{opacity:.6;cursor:wait}

.sugestao-body{flex:1;min-width:0}
.sugestao-titulo{
  font-size:14.5px;
  font-weight:700;
  color:var(--text);
  margin-bottom:4px;
  line-height:1.3;
}
.sugestao-desc{
  font-size:13px;
  color:var(--text-dim);
  line-height:1.5;
  margin-bottom:8px;
}
.sugestao-autor{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:11.5px;
  color:var(--text-mute);
  font-weight:600;
}
.sugestao-autor img{
  width:18px;height:18px;
  border-radius:50%;
  object-fit:cover;
  border:1px solid var(--border);
}

/* -------- Preview público de trip -------- */
.preview-trip-destino{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:6px 14px;
  border-radius:99px;
  background:var(--primary-light);
  color:var(--primary-dark);
  font-size:13px;
  font-weight:700;
  margin-bottom:22px;
}
.preview-trip-destino i{font-size:12px}

/* -------- Responsivo -------- */
@media (max-width:640px){
  .sugestao-input-row{flex-direction:column}
  .sugestao-input,.sugestao-select{width:100%;min-width:0}
  .sugestao-item{padding:12px 14px;gap:10px}
  .sugestao-voto{min-width:40px;padding:5px 8px}
  .sugestao-titulo{font-size:13.5px}
  .quemvai-grid{grid-template-columns:1fr}
  .plano-trip-banner{padding:14px 16px}
  .plano-trip-banner-icon{width:38px;height:38px;font-size:15px}
}

/* =========================================================
   45. BLOQUEIOS + HISTÓRICO DE VIAGENS
   ========================================================= */

/* -------- Bloqueados -------- */
.bloqueado-card{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 18px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  transition:var(--t);
}
.bloqueado-card:hover{
  border-color:var(--border-strong);
  box-shadow:0 4px 12px rgba(0,0,0,.04);
}
.bloqueado-avatar{
  width:44px;height:44px;
  border-radius:50%;
  padding:2px;
  background:linear-gradient(135deg,#64748b,#334155);
  flex-shrink:0;
}
.bloqueado-avatar img{
  width:100%;height:100%;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--card);
  filter:grayscale(40%);
}
.bloqueado-info{
  flex:1;
  min-width:0;
}
.bloqueado-info b{
  display:block;
  font-size:14px;
  font-weight:700;
  color:var(--text);
  margin-bottom:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.bloqueado-info small{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:12px;
  color:var(--text-mute);
}
.bloqueado-info small i{font-size:10px;color:var(--primary)}

/* -------- Histórico de viagens no perfil -------- */
.perfil-viagens-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:10px;
  margin-bottom:32px;
}
.perfil-viagem-card{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  text-decoration:none;
  color:inherit;
}
.perfil-viagem-card:hover{
  border-color:var(--primary-light);
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,.05);
}
.perfil-viagem-icon{
  width:44px;height:44px;
  border-radius:12px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:16px;
  flex-shrink:0;
  transition:var(--t);
}
.perfil-viagem-card:hover .perfil-viagem-icon{
  background:var(--primary);
  color:#fff;
}
.perfil-viagem-body{flex:1;min-width:0}
.perfil-viagem-body b{
  display:block;
  font-size:14px;
  font-weight:800;
  color:var(--text);
  margin-bottom:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.perfil-viagem-body small{
  display:block;
  font-size:11.5px;
  color:var(--text-mute);
  margin-bottom:3px;
}
.perfil-viagem-titulo{
  font-size:11.5px;
  color:var(--text-dim);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media (max-width:640px){
  .perfil-viagens-grid{grid-template-columns:1fr}
}

/* =========================================================
   46. EMPRESAS
   ========================================================= */

/* -------- Filtros -------- */
.emp-filtros{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:24px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:18px;
  padding:14px;
}
.emp-filtro-busca,
.emp-filtro-cidade{
  flex:1;
  min-width:180px;
  position:relative;
  display:flex;
  align-items:center;
}
.emp-filtro-busca i,
.emp-filtro-cidade i{
  position:absolute;
  left:14px;
  color:var(--primary);
  font-size:13px;
  pointer-events:none;
}
.emp-filtro-busca input,
.emp-filtro-cidade input{
  width:100%;
  padding:12px 14px 12px 38px;
  background:var(--card-soft);
  border:1.5px solid var(--border);
  border-radius:12px;
  color:var(--text);
  font-size:14px;
  outline:none;
  transition:var(--t);
}
.emp-filtro-busca input:focus,
.emp-filtro-cidade input:focus{
  border-color:var(--primary);
  background:var(--card);
  box-shadow:0 0 0 4px rgba(40,211,175,.12);
}
.emp-filtro-categoria{
  padding:12px 32px 12px 14px;
  background:var(--card-soft);
  border:1.5px solid var(--border);
  border-radius:12px;
  color:var(--text);
  font-size:14px;
  outline:none;
  cursor:pointer;
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236b7285' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
}
.emp-filtro-btn{
  padding:12px 20px !important;
  align-self:stretch;
}

/* -------- Grid de empresas -------- */
.grid-empresas{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:16px;
}

.emp-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:20px;
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  display:flex;
  flex-direction:column;
}
.emp-card:hover{
  transform:translateY(-3px);
  border-color:var(--primary-light);
  box-shadow:0 18px 40px -15px rgba(40,211,175,.25);
}

.emp-card-capa{
  position:relative;
  height:96px;
  overflow:hidden;
  background:var(--card-soft);
}
.emp-card-capa img{
  width:100%;height:100%;object-fit:cover;
}
.emp-card-capa-grad{
  width:100%;height:100%;
  background:linear-gradient(135deg,#28D3AF,#219d85);
  opacity:.85;
}

.emp-badge-destaque{
  position:absolute;
  top:12px;right:12px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:4px 10px;
  border-radius:99px;
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  color:#fff;
  font-size:10.5px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
  box-shadow:0 4px 12px rgba(251,191,36,.4);
}
.emp-badge-destaque i{font-size:9px}

.emp-card-body{
  padding:0 20px 18px;
  margin-top:-30px;
  position:relative;
  flex:1;
  display:flex;
  flex-direction:column;
}

.emp-card-logo{
  width:60px;height:60px;
  border-radius:16px;
  background:var(--card);
  border:3px solid var(--card);
  box-shadow:0 4px 16px rgba(0,0,0,.1);
  display:grid;place-items:center;
  font-size:24px;color:var(--primary-dark);
  overflow:hidden;
  margin-bottom:12px;
}
.emp-card-logo img{width:100%;height:100%;object-fit:cover}

.emp-card-nome{
  font-size:16.5px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
  line-height:1.25;
  margin-bottom:4px;
  display:flex;
  align-items:center;
  gap:6px;
}
.emp-verificado{
  color:var(--primary);
  font-size:13px;
  flex-shrink:0;
}

.emp-card-categoria{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:11.5px;
  color:var(--primary-dark);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:10px;
}
.emp-card-categoria i{font-size:11px}

.emp-card-desc{
  font-size:13px;
  color:var(--text-mute);
  line-height:1.5;
  margin-bottom:14px;
  flex:1;
}

.emp-card-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:12px;
  border-top:1px solid var(--border);
  font-size:12.5px;
  color:var(--text-mute);
  gap:10px;
}
.emp-card-cidade,
.emp-card-exp{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-weight:600;
}
.emp-card-cidade i,
.emp-card-exp i{font-size:11px;color:var(--primary)}

/* -------- Cadastro: aviso -------- */
.emp-cadastro-aviso{
  display:flex;
  align-items:center;
  gap:16px;
  padding:18px 22px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(40,211,175,.08),rgba(40,211,175,.02));
  border:1.5px solid var(--primary-light);
  margin-bottom:22px;
}
.emp-cadastro-aviso-icon{
  width:48px;height:48px;
  border-radius:14px;
  background:var(--primary);
  color:#fff;
  display:grid;place-items:center;
  font-size:20px;
  flex-shrink:0;
  box-shadow:0 8px 24px rgba(40,211,175,.35);
}
.emp-cadastro-aviso b{
  display:block;
  font-size:15px;
  font-weight:800;
  color:var(--text);
  margin-bottom:3px;
}
.emp-cadastro-aviso p{
  font-size:13.5px;
  color:var(--text-mute);
  line-height:1.5;
}

/* -------- Status da empresa -------- */
.emp-status{
  display:flex;
  align-items:center;
  gap:16px;
  padding:18px 22px;
  border-radius:18px;
  margin-bottom:22px;
  border:1.5px solid;
}
.emp-status.pendente{
  background:#fef3c7;
  border-color:#fbbf24;
}
.emp-status.ativo{
  background:linear-gradient(135deg,rgba(40,211,175,.1),rgba(40,211,175,.03));
  border-color:var(--primary);
}
.emp-status.suspenso{
  background:#fef2f2;
  border-color:#fca5a5;
}
.emp-status-icon{
  width:52px;height:52px;
  border-radius:16px;
  background:#fff;
  color:#d97706;
  display:grid;place-items:center;
  font-size:22px;
  flex-shrink:0;
  box-shadow:0 4px 12px rgba(0,0,0,.08);
}
.emp-status-icon.emp-status-ok{color:var(--primary-dark)}
.emp-status-icon.emp-status-danger{color:#dc2626}
.emp-status b{
  display:block;
  font-size:16px;
  font-weight:800;
  color:var(--text);
  margin-bottom:4px;
  letter-spacing:-.01em;
}
.emp-status p{
  font-size:13.5px;
  color:var(--text-dim);
  line-height:1.5;
}

/* -------- Painel: perfil resumido -------- */
.emp-painel-info{
  display:flex;
  align-items:center;
  gap:18px;
}
.emp-painel-logo{
  width:72px;height:72px;
  border-radius:20px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:28px;
  flex-shrink:0;
  overflow:hidden;
  border:2px solid var(--primary-light);
}
.emp-painel-logo img{width:100%;height:100%;object-fit:cover}
.emp-painel-info h2{
  font-size:20px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
  margin-bottom:6px;
}
.emp-painel-meta{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  font-size:13px;
  color:var(--text-mute);
}
.emp-painel-meta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.emp-painel-meta i{font-size:11px;color:var(--primary)}

/* -------- Hero da empresa (show) -------- */
.emp-hero{
  position:relative;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:22px;
  overflow:hidden;
  margin-bottom:24px;
  box-shadow:var(--shadow-sm);
}
.emp-hero-capa{
  height:160px;
  overflow:hidden;
  background:var(--card-soft);
}
.emp-hero-capa img{width:100%;height:100%;object-fit:cover}
.emp-hero-grad{
  width:100%;height:100%;
  background:linear-gradient(135deg,#28D3AF,#219d85);
  position:relative;
}
.emp-hero-grad::after{
  content:'';
  position:absolute;top:-50%;right:-10%;
  width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,255,255,.2),transparent 70%);
  filter:blur(40px);
}

.emp-hero-body{
  padding:0 32px 28px;
  margin-top:-48px;
  position:relative;
  display:flex;
  gap:22px;
  align-items:flex-start;
  flex-wrap:wrap;
}

.emp-hero-logo{
  width:110px;height:110px;
  border-radius:24px;
  background:var(--card);
  border:4px solid var(--card);
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  display:grid;place-items:center;
  font-size:44px;color:var(--primary-dark);
  overflow:hidden;
  flex-shrink:0;
}
.emp-hero-logo img{width:100%;height:100%;object-fit:cover}

.emp-hero-info{
  flex:1;
  min-width:240px;
  padding-top:56px;
}
.emp-hero-info h1{
  font-size:26px;
  font-weight:800;
  letter-spacing:-.025em;
  color:var(--text);
  margin-bottom:8px;
  line-height:1.15;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.emp-badge-destaque-inline{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:4px 10px;
  border-radius:99px;
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  color:#fff;
  font-size:10.5px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.emp-badge-destaque-inline i{font-size:9px}

.emp-hero-meta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  font-size:13.5px;
  color:var(--text-mute);
  margin-bottom:12px;
}
.emp-hero-meta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.emp-hero-meta i{font-size:12px;color:var(--primary)}

.emp-hero-desc{
  font-size:14.5px;
  color:var(--text-dim);
  line-height:1.6;
  max-width:640px;
  margin-bottom:16px;
}

.emp-hero-contatos{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.emp-contato{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 14px;
  border-radius:99px;
  background:var(--card-soft);
  border:1px solid var(--border);
  font-size:13px;
  font-weight:600;
  color:var(--text-dim);
  text-decoration:none;
  transition:var(--t);
}
.emp-contato:hover{
  background:var(--primary-light);
  border-color:var(--primary);
  color:var(--primary-dark);
}
.emp-contato i{font-size:12px}

.emp-hero-actions{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding-top:56px;
  flex-shrink:0;
}

/* Endereço */
.emp-endereco{
  display:flex;
  align-items:flex-start;
  gap:16px;
}
.emp-endereco-icon{
  width:48px;height:48px;
  border-radius:14px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:20px;
  flex-shrink:0;
}
.emp-endereco b{
  display:block;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:800;
  color:var(--text-mute);
  margin-bottom:5px;
}
.emp-endereco p{
  font-size:14.5px;
  color:var(--text);
  line-height:1.5;
}

/* Preço em experiência */
.emp-preco{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:13px;
  font-weight:800;
  color:var(--primary-dark);
}
.emp-preco i{font-size:11px}

/* -------- Editar imagens -------- */
.emp-edit-images{
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:20px;
}
.emp-edit-image{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.emp-edit-image > label:first-child{
  font-size:12.5px;
  font-weight:700;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:.06em;
}
.emp-edit-logo-preview,
.emp-edit-logo-empty{
  width:110px;height:110px;
  border-radius:20px;
  background:var(--card-soft);
  border:2px dashed var(--border-strong);
  display:grid;place-items:center;
  overflow:hidden;
  color:var(--text-mute);
  font-size:30px;
}
.emp-edit-logo-preview img{width:100%;height:100%;object-fit:cover}

.emp-edit-capa-preview,
.emp-edit-capa-empty{
  width:100%;
  aspect-ratio:16/6;
  border-radius:16px;
  background:var(--card-soft);
  border:2px dashed var(--border-strong);
  display:grid;place-items:center;
  overflow:hidden;
  color:var(--text-mute);
  font-size:30px;
}
.emp-edit-capa-preview img{width:100%;height:100%;object-fit:cover}

/* -------- Responsivo -------- */
@media (max-width:640px){
  .grid-empresas{grid-template-columns:1fr}
  .emp-filtros{padding:12px;gap:8px}
  .emp-filtro-busca,
  .emp-filtro-cidade{min-width:100%}
  .emp-filtro-busca input,
  .emp-filtro-cidade input,
  .emp-filtro-categoria{font-size:16px !important}
  .emp-filtro-categoria{width:100%}
  .emp-filtro-btn{width:100%;justify-content:center}

  .emp-hero-capa{height:120px}
  .emp-hero-body{padding:0 18px 22px;gap:14px}
  .emp-hero-logo{width:86px;height:86px;font-size:34px;border-radius:20px}
  .emp-hero-info{padding-top:38px;min-width:100%}
  .emp-hero-info h1{font-size:22px}
  .emp-hero-actions{padding-top:0;width:100%;flex-direction:row;flex-wrap:wrap}
  .emp-hero-actions .btn{flex:1}

  .emp-painel-info{flex-direction:column;align-items:flex-start;gap:12px}
  .emp-painel-logo{width:60px;height:60px;font-size:24px}

  .emp-edit-images{grid-template-columns:1fr}
  .emp-cadastro-aviso{padding:14px 16px}
  .emp-cadastro-aviso-icon{width:40px;height:40px;font-size:16px}
  .emp-status{padding:14px 16px}
  .emp-status-icon{width:42px;height:42px;font-size:18px}
  .emp-status b{font-size:14.5px}
}

/* =========================================================
   47. ADMIN — Alertas do dashboard
   ========================================================= */

.admin-alerts-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:12px;
  margin-bottom:24px;
}

.admin-alert{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  border-radius:14px;
  border:1.5px solid;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  text-decoration:none;
  color:inherit;
}
.admin-alert:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,0,0,.2);
}

.admin-alert-danger{
  background:linear-gradient(135deg,rgba(239,68,68,.12),rgba(239,68,68,.04));
  border-color:rgba(239,68,68,.35);
}
.admin-alert-danger .admin-alert-icon{
  background:#ef4444;
  color:#fff;
  box-shadow:0 6px 18px rgba(239,68,68,.35);
}

.admin-alert-warn{
  background:linear-gradient(135deg,rgba(251,191,36,.12),rgba(251,191,36,.04));
  border-color:rgba(251,191,36,.35);
}
.admin-alert-warn .admin-alert-icon{
  background:#f59e0b;
  color:#fff;
  box-shadow:0 6px 18px rgba(251,191,36,.35);
}

.admin-alert-icon{
  width:44px;height:44px;
  border-radius:12px;
  display:grid;place-items:center;
  font-size:18px;
  flex-shrink:0;
}

.admin-alert-body{flex:1;min-width:0}
.admin-alert-body b{
  display:block;
  font-size:14px;
  font-weight:800;
  color:#fff;
  letter-spacing:-.01em;
  margin-bottom:3px;
}
.admin-alert-body small{
  display:block;
  font-size:12px;
  color:var(--admin-text-mute);
}

.admin-alert-arrow{
  color:var(--admin-text-mute);
  font-size:12px;
  transition:transform .2s;
}
.admin-alert:hover .admin-alert-arrow{
  transform:translateX(3px);
  color:#fff;
}

/* =========================================================
   48. EXPERIÊNCIAS
   ========================================================= */

/* -------- Card de experiência -------- */
.exp-card{
  display:flex;
  flex-direction:column;
  background:var(--card);
  border:1.5px solid var(--border);
  border-radius:20px;
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  transition:all .22s cubic-bezier(.2,.8,.2,1);
}
.exp-card:hover{
  transform:translateY(-3px);
  border-color:var(--primary-light);
  box-shadow:0 18px 40px -15px rgba(40,211,175,.25);
}

.exp-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 18px;
  background:linear-gradient(135deg,rgba(40,211,175,.06),rgba(40,211,175,.02));
  border-bottom:1px solid var(--border);
  gap:10px;
}
.exp-card-empresa{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.exp-card-empresa-logo{
  width:36px;height:36px;
  border-radius:10px;
  background:var(--card);
  display:grid;place-items:center;
  font-size:14px;color:var(--primary-dark);
  overflow:hidden;
  flex-shrink:0;
  border:1px solid var(--border);
}
.exp-card-empresa-logo img{width:100%;height:100%;object-fit:cover}
.exp-card-empresa b{
  display:block;
  font-size:13px;
  font-weight:700;
  color:var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  letter-spacing:-.01em;
}
.exp-card-empresa small{
  display:block;
  font-size:10px;
  color:var(--text-mute);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:700;
}

.exp-card-body{
  padding:18px;
  flex:1;
  display:flex;
  flex-direction:column;
}
.exp-card-icon{
  width:52px;height:52px;
  border-radius:14px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;place-items:center;
  font-size:22px;
  margin-bottom:14px;
  transition:transform .2s cubic-bezier(.2,.8,.2,1);
}
.exp-card:hover .exp-card-icon{
  transform:scale(1.08) rotate(-3deg);
  background:var(--primary);
  color:#fff;
}
.exp-card-titulo{
  font-size:16.5px;
  font-weight:800;
  letter-spacing:-.015em;
  line-height:1.25;
  color:var(--text);
  margin-bottom:10px;
}
.exp-card-meta{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:13px;
  color:var(--text-mute);
  margin-bottom:14px;
}
.exp-card-meta span{
  display:flex;
  align-items:center;
  gap:7px;
}
.exp-card-meta i{font-size:11px;color:var(--text-mute);width:14px;text-align:center}

.exp-card-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 18px;
  border-top:1px solid var(--border);
  gap:10px;
}
.exp-card-preco{
  font-size:14px;
  font-weight:800;
  color:var(--primary-dark);
}
.exp-card-vagas{
  font-size:12.5px;
}
.exp-vagas-count{
  font-weight:700;
  color:var(--text-mute);
}

/* -------- Hero da experiência (show) -------- */
.exp-hero{
  position:relative;
  border-radius:24px;
  overflow:hidden;
  margin-bottom:24px;
  background:linear-gradient(135deg,#28D3AF,#219d85);
  color:#fff;
  box-shadow:0 12px 40px rgba(40,211,175,.3);
}
.exp-hero-grad{
  position:absolute;
  top:-60px;right:-60px;
  width:340px;height:340px;
  display:grid;place-items:center;
  font-size:280px;
  color:rgba(255,255,255,.1);
  transform:rotate(-12deg);
  pointer-events:none;
}

.exp-hero-body{
  position:relative;
  z-index:1;
  padding:32px;
}

.exp-hero-empresa{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:22px;
}
.exp-hero-empresa-logo{
  width:54px;height:54px;
  border-radius:16px;
  background:rgba(255,255,255,.2);
  border:1.5px solid rgba(255,255,255,.3);
  display:grid;place-items:center;
  font-size:22px;
  overflow:hidden;
  flex-shrink:0;
  backdrop-filter:blur(8px);
}
.exp-hero-empresa-logo img{width:100%;height:100%;object-fit:cover}
.exp-hero-empresa b{
  display:block;
  font-size:15px;
  font-weight:800;
  color:#fff;
  letter-spacing:-.01em;
  margin-bottom:2px;
}
.exp-hero-empresa-link{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:12px;
  color:rgba(255,255,255,.85);
  font-weight:600;
  text-decoration:none;
  transition:var(--t);
}
.exp-hero-empresa-link:hover{color:#fff}
.exp-hero-empresa-link i{font-size:10px}

.exp-hero-icon{
  width:72px;height:72px;
  border-radius:20px;
  background:rgba(255,255,255,.18);
  border:1.5px solid rgba(255,255,255,.3);
  display:grid;place-items:center;
  font-size:32px;
  color:#fff;
  margin-bottom:18px;
  backdrop-filter:blur(10px);
}

.exp-hero h1{
  font-size:clamp(24px,4vw,34px);
  font-weight:800;
  letter-spacing:-.025em;
  line-height:1.15;
  margin-bottom:22px;
}

.exp-hero-meta{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-bottom:24px;
}
.exp-hero-meta-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.2);
  border-radius:14px;
  backdrop-filter:blur(8px);
}
.exp-hero-meta-item > i{
  width:36px;height:36px;
  border-radius:10px;
  background:rgba(255,255,255,.2);
  display:grid;place-items:center;
  font-size:14px;
  flex-shrink:0;
}
.exp-hero-meta-item > div{
  display:flex;
  flex-direction:column;
  line-height:1.25;
  min-width:0;
}
.exp-hero-meta-item span{
  font-size:10.5px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  opacity:.85;
}
.exp-hero-meta-item b{
  font-size:13.5px;
  font-weight:700;
}
.exp-hero-preco b{
  font-size:16px;
  color:#fff;
}

.exp-hero-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.exp-hero-actions .btn-primary{
  background:#fff;
  color:var(--primary-dark);
  border:none;
}
.exp-hero-actions .btn-primary:hover{
  background:#fff;
  color:var(--primary-dark);
  transform:translateY(-2px);
}
.exp-hero-actions .btn-ghost{
  background:rgba(255,255,255,.15);
  border-color:rgba(255,255,255,.3);
  color:#fff;
}
.exp-hero-actions .btn-ghost:hover{
  background:rgba(255,255,255,.25);
}
.exp-hero-actions .badge-live{
  background:rgba(255,255,255,.22) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.35) !important;
}
.exp-hero-actions .badge-secondary{
  background:rgba(255,255,255,.15) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.3) !important;
}
.exp-hero-actions .badge-cheio{
  background:rgba(0,0,0,.25) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.2) !important;
}

/* -------- Lista de participantes (empresa) -------- */
.exp-participantes-list{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.exp-participante-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 4px;
  border-bottom:1px solid var(--border);
  transition:var(--t);
}
.exp-participante-item:last-child{border-bottom:none}
.exp-participante-item:hover{
  background:rgba(40,211,175,.03);
  border-radius:12px;
  padding-left:12px;
  padding-right:12px;
}

.exp-participante-info{
  display:flex;
  align-items:center;
  gap:12px;
  flex:1;
  min-width:0;
  text-decoration:none;
  color:inherit;
}
.exp-participante-info img{
  width:44px;height:44px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--primary-light);
  flex-shrink:0;
}
.exp-participante-info > div{
  min-width:0;
}
.exp-participante-info b{
  display:block;
  font-size:14px;
  font-weight:700;
  color:var(--text);
  margin-bottom:3px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.exp-participante-info small{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:11.5px;
  color:var(--text-mute);
  flex-wrap:wrap;
}
.exp-participante-info small i{font-size:10px;color:var(--primary)}

.exp-participante-status{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:3px;
  flex-shrink:0;
}
.exp-participante-status small{
  font-size:10.5px;
  color:var(--text-mute);
  font-weight:600;
}

/* -------- Responsivo -------- */
@media (max-width:640px){
  .exp-hero-body{padding:22px 18px}
  .exp-hero-meta{grid-template-columns:1fr 1fr;gap:8px}
  .exp-hero-meta-item{padding:12px 12px}
  .exp-hero-meta-item > i{width:30px;height:30px;font-size:12px}
  .exp-hero-meta-item span{font-size:9.5px}
  .exp-hero-meta-item b{font-size:12px}
  .exp-hero-actions{flex-direction:column;align-items:stretch}
  .exp-hero-actions .btn,
  .exp-hero-actions form,
  .exp-hero-actions form button{width:100%}
  .exp-hero-actions .badge{text-align:center;justify-content:center}
  .exp-hero-empresa-logo{width:44px;height:44px;font-size:18px}
  .exp-hero-icon{width:60px;height:60px;font-size:26px}
  .exp-card-body{padding:14px}
  .exp-card-foot{padding:12px 14px}
}

/* =========================================================
   49. DARK MODE
   ========================================================= */

[data-theme="dark"]{
  --bg:             #0a0e1a;
  --card:           #131826;
  --card-soft:      #1a2032;
  --border:         #232a3d;
  --border-strong:  #2f384f;
  --text:           #e6ebf5;
  --text-dim:       #a8b0c5;
  --text-mute:      #7a8399;
  --primary-light:  rgba(40,211,175,.15);

  --shadow-sm:0 1px 2px 0 rgba(0,0,0,.3);
  --shadow:0 4px 6px -1px rgba(0,0,0,.4),0 2px 4px -1px rgba(0,0,0,.2);
  --shadow-lg:0 10px 25px -3px rgba(0,0,0,.5),0 4px 6px -2px rgba(0,0,0,.3);
}

/* Ajustes finos para o dark */
[data-theme="dark"] body{
  background:var(--bg);
  color:var(--text);
}

[data-theme="dark"] .hero,
[data-theme="dark"] .trip-hero,
[data-theme="dark"] .exp-hero{
  box-shadow:0 12px 40px rgba(40,211,175,.15);
}

[data-theme="dark"] .plano-card:hover,
[data-theme="dark"] .trip-card:hover,
[data-theme="dark"] .emp-card:hover,
[data-theme="dark"] .exp-card:hover{
  box-shadow:0 18px 40px -15px rgba(40,211,175,.15);
}

[data-theme="dark"] .msg.them{
  background:var(--card-soft);
}

[data-theme="dark"] .chat-body{
  background:var(--bg);
}

[data-theme="dark"] .mobile-top,
[data-theme="dark"] .publico-nav{
  background:rgba(19,24,38,.92);
}

[data-theme="dark"] .onb-header,
[data-theme="dark"] .onb-footer{
  background:rgba(19,24,38,.92);
}

[data-theme="dark"] input:-webkit-autofill,
[data-theme="dark"] input:-webkit-autofill:hover,
[data-theme="dark"] input:-webkit-autofill:focus{
  -webkit-text-fill-color: var(--text) !important;
  -webkit-box-shadow: 0 0 0 30px var(--card) inset !important;
  box-shadow: 0 0 0 30px var(--card) inset !important;
}

[data-theme="dark"] .flash.ok{
  background:rgba(34,197,94,.15);
  border-color:rgba(34,197,94,.3);
  color:#a7f3d0;
}
[data-theme="dark"] .flash.erro{
  background:rgba(239,68,68,.15);
  border-color:rgba(239,68,68,.3);
  color:#fecaca;
}

[data-theme="dark"] .leaflet-popup-content-wrapper,
[data-theme="dark"] .leaflet-popup-tip{
  background:var(--card);
  color:var(--text);
}

[data-theme="dark"] .leaflet-tile{
  filter:brightness(0.85) contrast(1.1) hue-rotate(180deg) invert(1);
}

/* =========================================================
   50. BADGES — Estilo
   ========================================================= */

.badge-progress-hero{
  display:flex;
  align-items:center;
  gap:28px;
  padding:28px;
  border-radius:24px;
  background:linear-gradient(135deg,rgba(40,211,175,.1),rgba(40,211,175,.02));
  border:1.5px solid var(--primary-light);
  margin-bottom:24px;
  flex-wrap:wrap;
}

.badge-progress-circle{
  position:relative;
  width:120px;height:120px;
  flex-shrink:0;
}
.badge-progress-circle svg{
  position:absolute;
  inset:0;
  transform:rotate(0deg);
}
.badge-progress-number{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-size:24px;
  font-weight:900;
  letter-spacing:-.03em;
  color:var(--primary-dark);
}

.badge-progress-info{flex:1;min-width:240px}
.badge-progress-info h2{
  font-size:22px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
  margin-bottom:6px;
}
.badge-progress-info p{
  font-size:14px;
  color:var(--text-mute);
  margin-bottom:14px;
}
.badge-progress-info p b{
  color:var(--primary-dark);
  font-weight:800;
}
.badge-progress-stats{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.badge-progress-stats span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:600;
  color:var(--text-dim);
}
.badge-progress-stats i{font-size:12px;color:var(--primary)}

.badges-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:12px;
}

.badge-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  padding:18px 12px;
  border-radius:16px;
  background:var(--card);
  border:1.5px solid var(--border);
  text-align:center;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  cursor:help;
}
.badge-item:hover{
  transform:translateY(-3px);
  border-color:var(--primary);
  box-shadow:0 12px 28px -10px rgba(40,211,175,.25);
}

.badge-item-ok{
  border-color:var(--primary-light);
}
.badge-item-ok:hover{
  border-color:var(--primary);
}

.badge-item-locked{
  opacity:.45;
  filter:grayscale(.8);
}
.badge-item-locked:hover{
  filter:grayscale(.2);
  opacity:.7;
}

.badge-item-icon{
  position:relative;
  width:60px;height:60px;
  border-radius:18px;
  background:var(--card-soft);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:24px;
  margin-bottom:4px;
  transition:transform .2s cubic-bezier(.2,.8,.2,1);
  box-shadow:0 6px 18px rgba(40,211,175,.2);
}
.badge-item:hover .badge-item-icon{
  transform:scale(1.08) rotate(-4deg);
}
.badge-item-locked .badge-item-icon{
  background:var(--card-soft);
  color:var(--text-mute);
  box-shadow:none;
}

.badge-item-lock{
  position:absolute;
  bottom:-4px;right:-4px;
  width:22px;height:22px;
  border-radius:50%;
  background:var(--card);
  border:2px solid var(--border);
  display:grid;
  place-items:center;
  font-size:9px;
  color:var(--text-mute);
}

.badge-item-nome{
  font-size:12.5px;
  font-weight:800;
  color:var(--text);
  letter-spacing:-.01em;
  line-height:1.2;
}
.badge-item-desc{
  font-size:11px;
  color:var(--text-mute);
  line-height:1.35;
}

/* =========================================================
   51. TEMA — Seletor
   ========================================================= */

.tema-picker{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px;
  margin-bottom:14px;
}

.tema-opt{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  padding:16px;
  border-radius:16px;
  background:var(--card);
  border:2px solid var(--border);
  cursor:pointer;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.tema-opt input{display:none}
.tema-opt:hover{
  border-color:var(--border-strong);
  transform:translateY(-2px);
}
.tema-opt.is-active{
  border-color:var(--primary);
  background:linear-gradient(135deg,rgba(40,211,175,.06),rgba(40,211,175,.02));
}
.tema-opt b{
  font-size:13.5px;
  font-weight:700;
  color:var(--text);
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.tema-opt b i{font-size:13px;color:var(--primary-dark)}

.tema-preview{
  width:100%;
  aspect-ratio:16/10;
  border-radius:10px;
  overflow:hidden;
  border:1px solid var(--border);
  display:flex;
  flex-direction:column;
}
.tema-preview-bar{
  height:22%;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.tema-preview-content{
  flex:1;
  background:linear-gradient(135deg,rgba(40,211,175,.08),transparent);
}

.tema-preview-light{background:#f1f1f1}
.tema-preview-light .tema-preview-bar{background:#fff}

.tema-preview-dark{background:#0a0e1a}
.tema-preview-dark .tema-preview-bar{background:#131826;border-color:rgba(255,255,255,.08)}
.tema-preview-dark .tema-preview-content{background:linear-gradient(135deg,rgba(40,211,175,.15),transparent)}

.tema-preview-auto{
  background:linear-gradient(135deg,#f1f1f1 50%,#0a0e1a 50%);
}
.tema-preview-auto .tema-preview-bar{
  background:linear-gradient(135deg,#fff 50%,#131826 50%);
}

@media (max-width:520px){
  .badge-progress-hero{padding:20px;gap:18px}
  .badge-progress-circle{width:90px;height:90px}
  .badge-progress-circle svg{width:90px;height:90px}
  .badge-progress-number{font-size:18px}
  .badge-progress-info h2{font-size:18px}
  .badges-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
  .badge-item-icon{width:48px;height:48px;font-size:20px;border-radius:14px}
  .tema-picker{grid-template-columns:1fr}
}

/* =========================================================
   52. MODAL DE DENÚNCIA
   ========================================================= */

/* ---------- Modal base (overlay) ---------- */
.modal-overlay{
  position:fixed;
  inset:0;
  z-index:999;
  background:rgba(10,14,26,.6);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  animation:fadeIn .22s cubic-bezier(.2,.8,.2,1);
}
.modal-overlay.on{display:flex}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.modal{
  background:var(--card);
  border-radius:24px;
  padding:32px;
  max-width:520px;
  width:100%;
  box-shadow:
    0 30px 60px -20px rgba(0,0,0,.35),
    0 0 0 1px rgba(0,0,0,.04);
  animation:modalIn .3s cubic-bezier(.2,.8,.2,1);
  position:relative;
  max-height:calc(100dvh - 40px);
  overflow-y:auto;
}
@keyframes modalIn{
  from{opacity:0;transform:scale(.94) translateY(10px)}
  to{opacity:1;transform:none}
}

/* ---------- Modal específico de denúncia ---------- */
.modal-denuncia{
  text-align:center;
}

.modal-close{
  position:absolute;
  top:16px;
  right:16px;
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--card-soft);
  color:var(--text-mute);
  border:none;
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:15px;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  z-index:2;
}
.modal-close:hover{
  background:var(--border);
  color:var(--text);
  transform:rotate(90deg);
}
.modal-close:active{transform:rotate(90deg) scale(.94)}

/* Ícone central */
.modal-icon{
  width:68px;
  height:68px;
  border-radius:22px;
  display:grid;
  place-items:center;
  font-size:28px;
  margin:0 auto 18px;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  transition:transform .3s cubic-bezier(.2,.8,.2,1);
}
.modal:hover .modal-icon{transform:scale(1.05) rotate(-4deg)}

.modal-icon-danger{
  background:linear-gradient(135deg,#fee2e2,#fecaca);
  color:#b91c1c;
}

/* Título e subtítulo */
.modal h3{
  font-size:20px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
  margin-bottom:8px;
  line-height:1.25;
}

.modal p{
  color:var(--text-mute);
  font-size:14px;
  line-height:1.55;
  margin-bottom:22px;
  max-width:380px;
  margin-left:auto;
  margin-right:auto;
}

/* ---------- Lista de motivos ---------- */
.den-motivos{
  display:flex;
  flex-direction:column;
  gap:6px;
  text-align:left;
}

.den-motivo{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  border-radius:14px;
  background:var(--card);
  border:1.5px solid var(--border);
  cursor:pointer;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
  font-size:14px;
  font-weight:500;
  color:var(--text-dim);
  user-select:none;
  position:relative;
}
.den-motivo:hover{
  border-color:var(--border-strong);
  background:var(--card-soft);
  transform:translateX(2px);
}
.den-motivo:active{transform:translateX(2px) scale(.99)}
.den-motivo input{display:none}

/* Círculo do radio */
.den-motivo-radio{
  width:20px;
  height:20px;
  border-radius:50%;
  border:2px solid var(--border-strong);
  display:grid;
  place-items:center;
  flex-shrink:0;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  position:relative;
  background:#fff;
}
.den-motivo-radio::after{
  content:'';
  width:9px;
  height:9px;
  border-radius:50%;
  background:#ef4444;
  transform:scale(0);
  transition:transform .22s cubic-bezier(.2,.8,.2,1);
}

.den-motivo-label{
  flex:1;
  line-height:1.35;
}

/* Estado marcado */
.den-motivo:has(input:checked){
  border-color:#ef4444;
  background:linear-gradient(135deg,#fef2f2,rgba(254,242,242,.5));
  color:#b91c1c;
  font-weight:700;
  box-shadow:0 4px 12px rgba(239,68,68,.12);
}
.den-motivo input:checked ~ .den-motivo-radio{
  border-color:#ef4444;
  background:#fef2f2;
}
.den-motivo input:checked ~ .den-motivo-radio::after{
  transform:scale(1);
}

/* ---------- Textarea de detalhes ---------- */
.modal-denuncia .field{
  text-align:left;
  margin-bottom:0;
}

.modal-denuncia .label{
  display:block;
  font-size:12.5px;
  font-weight:600;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:.04em;
  margin-bottom:7px;
}
.modal-denuncia .label-opt{
  text-transform:none;
  letter-spacing:0;
  color:var(--text-mute);
  font-weight:500;
  font-size:11.5px;
}

.modal-denuncia textarea.input{
  width:100%;
  padding:13px 16px;
  border-radius:12px;
  border:1.5px solid var(--border);
  background:var(--card);
  color:var(--text);
  outline:none;
  transition:var(--t);
  font-size:15px;
  font-family:inherit;
  resize:vertical;
  min-height:80px;
  line-height:1.5;
}
.modal-denuncia textarea.input:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(40,211,175,.15);
}
.modal-denuncia textarea.input::placeholder{
  color:var(--text-mute);
  opacity:.7;
}

.modal-denuncia .field-hint{
  display:block;
  font-size:12px;
  color:var(--text-mute);
  margin-top:6px;
  text-align:right;
  font-variant-numeric:tabular-nums;
}

/* ---------- Botões ---------- */
.modal-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
  margin-top:22px;
  padding-top:20px;
  border-top:1px solid var(--border);
}
.modal-actions .btn{
  padding:12px 22px;
  font-size:14px;
  font-weight:700;
  border-radius:99px;
}

/* Botão de perigo */
.btn-danger{
  background:#ef4444;
  border:none;
  color:#fff;
  box-shadow:0 6px 20px rgba(239,68,68,.3);
  transition:all .2s cubic-bezier(.2,.8,.2,1);
}
.btn-danger:hover:not(:disabled){
  background:#dc2626;
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(239,68,68,.4);
}
.btn-danger:active:not(:disabled){
  transform:translateY(0);
}
.btn-danger:disabled{
  opacity:.5;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
}

/* ---------- Responsivo ---------- */
@media (max-width:520px){
  .modal{
    padding:26px 20px;
    border-radius:20px;
    max-height:calc(100dvh - 24px);
  }
  .modal-icon{
    width:58px;
    height:58px;
    font-size:24px;
    border-radius:18px;
  }
  .modal h3{font-size:18px}
  .modal p{font-size:13.5px;margin-bottom:18px}
  .modal-close{top:12px;right:12px;width:32px;height:32px;font-size:14px}

  .den-motivo{
    padding:12px 14px;
    gap:12px;
    font-size:13.5px;
  }
  .den-motivo-radio{width:18px;height:18px}
  .den-motivo-radio::after{width:8px;height:8px}

  .modal-actions{
    flex-direction:column-reverse;
    gap:8px;
    padding-top:16px;
    margin-top:18px;
  }
  .modal-actions .btn{width:100%}
}

/* ---------- Dark mode ---------- */
[data-theme="dark"] .modal-overlay{
  background:rgba(0,0,0,.7);
}
[data-theme="dark"] .modal{
  box-shadow:
    0 30px 60px -20px rgba(0,0,0,.7),
    0 0 0 1px rgba(255,255,255,.05);
}
[data-theme="dark"] .modal-icon-danger{
  background:rgba(239,68,68,.15);
  color:#f87171;
}
[data-theme="dark"] .den-motivo-radio{
  background:var(--bg);
}
[data-theme="dark"] .den-motivo:has(input:checked){
  background:rgba(239,68,68,.12);
  color:#fca5a5;
}
[data-theme="dark"] .den-motivo input:checked ~ .den-motivo-radio{
  background:rgba(239,68,68,.2);
}

/* =========================================================
   53. MENÇÕES NO CHAT
   ========================================================= */

.chat-mention{
  display:inline-block;
  padding:1px 6px;
  margin:0 1px;
  border-radius:6px;
  background:rgba(40,211,175,.15);
  color:var(--primary-dark);
  font-weight:700;
  font-size:inherit;
  line-height:1.3;
}
.msg.me .chat-mention{
  background:rgba(255,255,255,.25);
  color:#fff;
}
[data-theme="dark"] .chat-mention{
  background:rgba(40,211,175,.2);
  color:#5eead4;
}

/* =========================================================
   54. JUNTTO WRAPPED
   ========================================================= */

.wrapped-wrap{
  max-width:720px;
  margin:0 auto;
}

.wrapped-hero{
  position:relative;
  padding:48px 32px;
  border-radius:28px;
  overflow:hidden;
  background:linear-gradient(135deg,#1D3557 0%,#219d85 50%,#28D3AF 100%);
  color:#fff;
  text-align:center;
  margin-bottom:24px;
  box-shadow:0 20px 60px -20px rgba(40,211,175,.5);
}
.wrapped-hero::before{
  content:'';
  position:absolute;
  top:-40%;left:-20%;
  width:500px;height:500px;
  background:radial-gradient(circle,rgba(255,255,255,.15),transparent 70%);
  filter:blur(50px);
  pointer-events:none;
}
.wrapped-hero::after{
  content:'';
  position:absolute;
  bottom:-30%;right:-10%;
  width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,92,122,.2),transparent 70%);
  filter:blur(60px);
  pointer-events:none;
}

.wrapped-hero-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 18px;
  border-radius:99px;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.25);
  color:#fff;
  font-size:12.5px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
  margin-bottom:24px;
  backdrop-filter:blur(10px);
  position:relative;
  z-index:1;
}
.wrapped-hero-badge i{font-size:12px}

.wrapped-hero h1{
  font-size:clamp(36px,6vw,56px);
  font-weight:900;
  letter-spacing:-.04em;
  line-height:1.05;
  margin-bottom:16px;
  position:relative;
  z-index:1;
}
.wrapped-hero h1 span{
  background:linear-gradient(135deg,#fff,#a7f3d0);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.wrapped-hero p{
  font-size:17px;
  opacity:.92;
  max-width:520px;
  margin:0 auto 28px;
  line-height:1.55;
  position:relative;
  z-index:1;
}

.wrapped-hero-actions{
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
  position:relative;
  z-index:1;
}
.wrapped-hero-actions .btn-primary{
  background:#fff;
  color:var(--primary-dark);
  border:none;
}
.wrapped-hero-actions .btn-primary:hover{
  background:#fff;
  color:var(--primary-dark);
}

/* Grid de estatísticas */
.wrapped-grid-2{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:14px;
  margin-bottom:24px;
}

.wrapped-stat{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:20px;
  padding:26px 22px;
  text-align:center;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
}
.wrapped-stat:hover{
  transform:translateY(-3px);
  border-color:var(--primary-light);
  box-shadow:0 16px 36px -15px rgba(40,211,175,.2);
}

.wrapped-stat-primary{
  background:linear-gradient(135deg,rgba(40,211,175,.08),rgba(40,211,175,.02));
  border-color:var(--primary-light);
}

.wrapped-stat-icon{
  width:52px;height:52px;
  border-radius:16px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;
  place-items:center;
  font-size:22px;
  margin:0 auto 16px;
}

.wrapped-stat-number{
  font-size:42px;
  font-weight:900;
  letter-spacing:-.04em;
  line-height:1;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  margin-bottom:8px;
}

.wrapped-stat-label{
  font-size:13px;
  color:var(--text-mute);
  font-weight:600;
  letter-spacing:-.005em;
}

/* Blocos */
.wrapped-block{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:24px;
  padding:28px;
  margin-bottom:20px;
}

.wrapped-block-highlight{
  display:flex;
  align-items:center;
  gap:20px;
  background:linear-gradient(135deg,rgba(255,107,53,.08),rgba(255,107,53,.02));
  border-color:rgba(255,107,53,.25);
}

.wrapped-block-head{
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:20px;
}
.wrapped-block-head > i{
  width:48px;height:48px;
  border-radius:14px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;
  place-items:center;
  font-size:20px;
  flex-shrink:0;
}
.wrapped-block-head h2{
  font-size:18px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
  margin-bottom:4px;
}
.wrapped-block-head p{
  font-size:13.5px;
  color:var(--text-mute);
}

/* Cidades */
.wrapped-cidades{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.wrapped-cidade{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border-radius:99px;
  background:var(--card-soft);
  border:1px solid var(--border);
  font-size:13.5px;
  font-weight:600;
  color:var(--text-dim);
}
.wrapped-cidade i{font-size:11px;color:var(--primary)}
.wrapped-cidade-more{
  background:var(--primary-light);
  border-color:var(--primary);
  color:var(--primary-dark);
  font-weight:800;
}

/* Mês top */
.wrapped-mes-icon{
  width:72px;height:72px;
  border-radius:22px;
  background:linear-gradient(135deg,#FF6B35,#c2410c);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:30px;
  flex-shrink:0;
  box-shadow:0 10px 28px rgba(255,107,53,.35);
}
.wrapped-mes-label{
  font-size:12px;
  font-weight:800;
  color:#c2410c;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:4px;
}
.wrapped-mes-nome{
  font-size:28px;
  font-weight:900;
  letter-spacing:-.03em;
  color:var(--text);
  line-height:1.1;
  margin-bottom:2px;
}
.wrapped-mes-sub{
  font-size:13.5px;
  color:var(--text-mute);
}

/* Interesses */
.wrapped-interesses{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.wrapped-interesse{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 18px;
  border-radius:14px;
  background:var(--card-soft);
  border:1px solid var(--border);
  font-size:14px;
  font-weight:600;
  color:var(--text);
}
.wrapped-interesse i{font-size:14px;color:var(--primary)}

/* Plano top */
.wrapped-plano-top{
  display:flex;
  align-items:center;
  gap:16px;
  padding:16px 20px;
  border-radius:16px;
  background:var(--card-soft);
  border:1px solid var(--border);
  text-decoration:none;
  color:inherit;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.wrapped-plano-top:hover{
  border-color:var(--primary);
  background:var(--primary-light);
  transform:translateX(3px);
}
.wrapped-plano-emoji{
  width:52px;height:52px;
  border-radius:16px;
  background:var(--card);
  display:grid;
  place-items:center;
  font-size:22px;
  color:var(--primary-dark);
  flex-shrink:0;
  border:1px solid var(--border);
}
.wrapped-plano-top > div{flex:1;min-width:0}
.wrapped-plano-top b{
  display:block;
  font-size:15px;
  font-weight:800;
  color:var(--text);
  margin-bottom:2px;
}
.wrapped-plano-top small{
  display:block;
  font-size:12.5px;
  color:var(--text-mute);
}
.wrapped-plano-top > i{
  color:var(--text-mute);
  font-size:14px;
}

/* Badges */
.wrapped-badges{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
  gap:10px;
}
.wrapped-badge{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  padding:16px 10px;
  border-radius:14px;
  border:1.5px solid;
  text-align:center;
}
.wrapped-badge-icon{
  width:44px;height:44px;
  border-radius:14px;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:18px;
}
.wrapped-badge-nome{
  font-size:12px;
  font-weight:700;
  color:var(--text);
  line-height:1.2;
}

/* CTA final */
.wrapped-final{
  text-align:center;
  padding:40px 24px;
  border-radius:24px;
  background:linear-gradient(135deg,rgba(40,211,175,.1),rgba(40,211,175,.02));
  border:1.5px solid var(--primary-light);
  margin-top:12px;
}
.wrapped-final h2{
  font-size:24px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
  margin-bottom:8px;
}
.wrapped-final p{
  color:var(--text-mute);
  font-size:15px;
  margin-bottom:22px;
}
.wrapped-final-actions{
  display:flex;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
}

/* =========================================================
   55. QR CODE DE CHECK-IN
   ========================================================= */

.qr-wrap{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  max-width:900px;
  margin:0 auto;
}
@media (max-width:820px){
  .qr-wrap{grid-template-columns:1fr}
}

.qr-card{
  background:var(--card);
  border:2px solid var(--border);
  border-radius:24px;
  padding:32px;
  text-align:center;
  box-shadow:0 12px 40px rgba(0,0,0,.08);
}

.qr-card-head{margin-bottom:26px}
.qr-card-icon{
  width:64px;height:64px;
  border-radius:18px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;
  place-items:center;
  font-size:26px;
  margin:0 auto 14px;
}
.qr-card-head h2{
  font-size:20px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
  margin-bottom:6px;
  line-height:1.25;
}
.qr-card-head p{
  font-size:13.5px;
  color:var(--text-mute);
}
.qr-card-head p i{color:var(--primary);margin-right:4px}

.qr-code-area{
  display:flex;
  justify-content:center;
  padding:20px;
  background:#fff;
  border-radius:20px;
  margin-bottom:20px;
  border:1px solid var(--border);
}
.qr-code-area img,
.qr-code-area canvas{
  border-radius:8px;
  display:block;
}

.qr-code-info{
  padding:16px;
  border-radius:14px;
  background:var(--card-soft);
  margin-bottom:20px;
}
.qr-code-label{
  font-size:11px;
  font-weight:800;
  color:var(--text-mute);
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:6px;
}
.qr-code-number{
  font-family:monospace;
  font-size:32px;
  font-weight:800;
  letter-spacing:10px;
  color:var(--primary-dark);
  margin-bottom:8px;
}
.qr-code-info p{
  font-size:12.5px;
  color:var(--text-mute);
  line-height:1.5;
}

.qr-card-foot{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:13px;
  color:var(--text-mute);
  padding-top:16px;
  border-top:1px solid var(--border);
}
.qr-card-foot i{color:var(--primary)}

.qr-instrucoes{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:20px;
  padding:24px 28px;
}
.qr-instrucoes h3{
  font-size:15px;
  font-weight:800;
  color:var(--text);
  margin-bottom:14px;
}
.qr-instrucoes ol{
  padding-left:20px;
  color:var(--text-dim);
  font-size:14px;
  line-height:1.85;
}
.qr-instrucoes li{margin-bottom:6px}

/* Print */
@media print{
  .sidebar, .mobile-top, .bottomnav, .flashes,
  .page-head .btn, .qr-instrucoes, a.btn{
    display:none !important;
  }
  .qr-card{box-shadow:none;border-color:#ccc}
  body{background:#fff}
}

/* =========================================================
   56. MENÇÕES — Input + Menu
   ========================================================= */

.chat-input-wrap{
  flex:1;
  position:relative;
  display:flex;
  align-items:center;
}
.chat-input-wrap .input{
  padding-right:44px;
  width:100%;
}
.chat-mention-btn{
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  border-radius:50%;
  background:transparent;
  border:none;
  color:var(--text-mute);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:15px;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.chat-mention-btn:hover{
  background:var(--primary-light);
  color:var(--primary-dark);
}
.chat-mention-btn:active{transform:translateY(-50%) scale(.94)}

.mention-menu{
  position:fixed;
  bottom:90px;
  left:50%;
  transform:translateX(-50%);
  width:320px;
  max-width:calc(100vw - 32px);
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:0 20px 50px -15px rgba(0,0,0,.3);
  z-index:100;
  overflow:hidden;
  animation:mentionIn .2s cubic-bezier(.2,.8,.2,1);
}
@keyframes mentionIn{
  from{opacity:0;transform:translate(-50%,10px)}
  to{opacity:1;transform:translate(-50%,0)}
}
.mention-menu-head{
  padding:12px 16px;
  font-size:11px;
  font-weight:800;
  color:var(--text-mute);
  text-transform:uppercase;
  letter-spacing:.08em;
  border-bottom:1px solid var(--border);
  background:var(--card-soft);
}
.mention-menu-list{
  max-height:240px;
  overflow-y:auto;
}
.mention-item{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  padding:10px 16px;
  border:none;
  background:transparent;
  color:var(--text);
  font-size:14px;
  font-weight:600;
  text-align:left;
  cursor:pointer;
  transition:var(--t);
  font-family:inherit;
}
.mention-item:hover{
  background:var(--primary-light);
  color:var(--primary-dark);
}
.mention-avatar{
  width:28px;
  height:28px;
  border-radius:50%;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;
  place-items:center;
  font-size:12px;
  flex-shrink:0;
}

/* Cabeçalho do chat com avatar (1:1) */
.chat-head-avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  overflow:hidden;
  flex-shrink:0;
}
.chat-head-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  border:2px solid var(--primary-light);
}
.chat-head-title{
  font-weight:700;
  font-size:15px;
  color:var(--text);
  text-decoration:none;
  display:block;
}
.chat-head-title:hover{color:var(--primary-dark)}
.chat-head-sub{
  font-size:12px;
  color:var(--text-mute);
}

/* =========================================================
   57. ONBOARDING INTERESSES — Redesign performático
   ========================================================= */

/* ---------- Page wrapper ---------- */
.onb-page[data-step="1"]{
  grid-template-rows:auto 1fr auto;
}

.onb-main-interesses{
  padding-bottom:100px !important; /* espaço pro footer fixo */
}

/* ---------- Filters (chips horizontais) ---------- */
.int-filters{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:4px 0 14px;
  margin-bottom:20px;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
}
.int-filters::-webkit-scrollbar{display:none}

.int-filter{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:10px 16px;
  border-radius:99px;
  background:var(--card);
  border:1.5px solid var(--border);
  color:var(--text-dim);
  font-size:13.5px;
  font-weight:700;
  font-family:inherit;
  cursor:pointer;
  white-space:nowrap;
  flex:0 0 auto;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.int-filter i{
  font-size:12px;
  color:var(--text-mute);
  transition:color .15s ease;
}
.int-filter:hover{
  border-color:var(--border-strong);
  color:var(--text);
}
.int-filter.active{
  background:var(--primary);
  color:#fff;
  border-color:var(--primary);
}
.int-filter.active i{color:#fff}

/* ---------- Grid de grupos ---------- */
.int-list{
  display:flex;
  flex-direction:column;
  gap:28px;
}

.int-group[hidden]{display:none}

.int-group-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
  font-size:12.5px;
  font-weight:800;
  color:var(--text-mute);
  text-transform:uppercase;
  letter-spacing:.08em;
}
.int-group-title i{
  color:var(--primary);
  font-size:14px;
}
.int-group-title::after{
  content:'';
  flex:1;
  height:1px;
  background:var(--border);
  margin-left:4px;
}
.int-group-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:22px;
  height:20px;
  padding:0 7px;
  border-radius:99px;
  background:var(--card-soft);
  border:1px solid var(--border);
  color:var(--text-mute);
  font-size:11px;
  font-weight:800;
  order:3;
}

/* ---------- Grid de interesses ---------- */
.int-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}

/* ---------- Item ---------- */
.int-item{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:14px;
  background:var(--card);
  border:1.5px solid var(--border);
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  transition:background .12s ease, border-color .12s ease;
  /* Otimização: não anima transform/shadow pra evitar reflow */
  min-height:58px;
  will-change:background-color;
}

.int-item input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.int-item-icon{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:10px;
  background:var(--card-soft);
  color:var(--text-mute);
  font-size:14px;
  flex-shrink:0;
  transition:background .12s ease, color .12s ease;
}

.int-item-label{
  flex:1;
  min-width:0;
  font-size:13.5px;
  font-weight:600;
  color:var(--text);
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}

.int-item-check{
  position:absolute;
  top:8px;
  right:8px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--primary);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:8px;
  opacity:0;
  transform:scale(.6);
  transition:opacity .15s ease, transform .15s ease;
}

/* Estado selecionado */
.int-item input:checked ~ .int-item-icon{
  background:var(--primary);
  color:#fff;
}

.int-item:has(input:checked){
  /* Fallback pra navegadores sem :has — o visual ainda fica bom */
}

.int-item:focus-within{
  border-color:var(--primary);
  outline:none;
}

/* Fallback elegante pra navegadores sem :has() */
.int-item input:checked ~ .int-item-label{
  color:var(--primary-dark);
  font-weight:700;
}
.int-item input:checked ~ .int-item-check{
  opacity:1;
  transform:scale(1);
}

/* Aplicar fundo e borda selecionada — via JS classlist (mais rápido) */
.int-item.is-selected{
  border-color:var(--primary);
  background:rgba(40,211,175,.06);
}
.int-item.is-selected .int-item-icon{
  background:var(--primary);
  color:#fff;
}

/* ---------- Empty state ---------- */
.int-empty{
  text-align:center;
  padding:40px 20px;
  color:var(--text-mute);
}
.int-empty i{
  font-size:36px;
  color:var(--primary);
  opacity:.4;
  margin-bottom:12px;
  display:block;
}
.int-empty p{font-size:14px}

/* ---------- Footer fixo (mais leve que sticky) ---------- */
.onb-page[data-step="1"] .onb-footer{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  z-index:20;
  margin:0 !important;
  background:rgba(255,255,255,.96);
  border-top:1px solid var(--border);
  padding:12px 20px calc(12px + env(safe-area-inset-bottom));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  /* Sem backdrop-filter pesado */
}

/* ---------- Shake leve do contador ---------- */
@keyframes onbShakeLight{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-5px)}
  75%{transform:translateX(5px)}
}
.onb-counter-box.shake{
  animation:onbShakeLight .3s ease-in-out;
}

/* =========================================================
   Responsivo
   ========================================================= */

/* Mobile grande (≥481px): 2 colunas mantidas, ícones maiores */
@media (min-width:481px){
  .int-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
  }
  .int-item{
    padding:14px 16px;
    min-height:62px;
    gap:12px;
  }
  .int-item-icon{
    width:38px;
    height:38px;
    font-size:15px;
  }
  .int-item-label{font-size:14px}
}

/* Mobile pequeno (≤480px): compacto, ideal pra toque */
@media (max-width:480px){
  .onb-main-interesses{
    padding:22px 16px 100px !important;
  }

  .int-filters{
    padding:4px 0 12px;
    margin-bottom:16px;
    /* Esconde scrollbar mas mantém o gesto */
    scroll-snap-type:x proximity;
  }
  .int-filter{
    padding:9px 14px;
    font-size:13px;
    scroll-snap-align:start;
  }
  .int-filter i{font-size:11px}

  .int-list{gap:24px}

  .int-group-title{
    font-size:11.5px;
    margin-bottom:10px;
  }

  .int-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:8px;
  }

  .int-item{
    padding:11px 12px;
    border-radius:12px;
    gap:9px;
    min-height:56px;
  }
  .int-item-icon{
    width:32px;
    height:32px;
    font-size:13px;
    border-radius:9px;
  }
  .int-item-label{
    font-size:12.5px;
    line-height:1.25;
  }
  .int-item-check{
    width:16px;
    height:16px;
    font-size:7px;
    top:6px;
    right:6px;
  }

  /* Footer compacto */
  .onb-page[data-step="1"] .onb-footer{
    padding:10px 16px calc(10px + env(safe-area-inset-bottom));
    gap:12px;
  }
  .onb-counter-box{gap:10px}
  .onb-counter-circle{
    width:42px;
    height:42px;
    font-size:15px;
  }
  .onb-counter-text b{font-size:13px}
  .onb-counter-text small{font-size:11.5px}
  .onb-cta{
    padding:12px 20px;
    font-size:14px;
    min-width:0;
    flex:1;
    justify-content:center;
  }
}

/* Mobile muito pequeno (≤360px): 1 coluna quando o texto for longo */
@media (max-width:360px){
  .int-grid{grid-template-columns:1fr}

  .int-item{
    padding:12px 14px;
    min-height:52px;
  }
  .int-item-label{font-size:13px}
}

/* =========================================================
   Dark mode
   ========================================================= */
[data-theme="dark"] .onb-page[data-step="1"] .onb-footer{
  background:rgba(19,24,38,.96);
}
[data-theme="dark"] .int-item.is-selected{
  background:rgba(40,211,175,.12);
}
[data-theme="dark"] .int-item-icon{
  background:rgba(255,255,255,.04);
}

/* =========================================================
   58. ADMIN DASHBOARD 2.0 — Health, KPIs grandes, Rankings
   ========================================================= */

/* ---------- HEALTH BAR ---------- */
.admin-health{
  display:flex;
  align-items:center;
  gap:16px;
  padding:18px 22px;
  border-radius:16px;
  margin-bottom:22px;
  border:1.5px solid;
  background:var(--admin-surface);
}
.admin-health-ok{
  background:linear-gradient(135deg,rgba(40,211,175,.12),rgba(40,211,175,.03));
  border-color:rgba(40,211,175,.35);
}
.admin-health-warn{
  background:linear-gradient(135deg,rgba(251,191,36,.12),rgba(251,191,36,.03));
  border-color:rgba(251,191,36,.35);
}
.admin-health-danger{
  background:linear-gradient(135deg,rgba(239,68,68,.12),rgba(239,68,68,.03));
  border-color:rgba(239,68,68,.35);
}

.admin-health-icon{
  width:48px;height:48px;
  border-radius:14px;
  display:grid;place-items:center;
  font-size:22px;
  flex-shrink:0;
}
.admin-health-ok .admin-health-icon{
  background:var(--admin-primary);
  color:#0f1117;
  box-shadow:0 6px 20px rgba(40,211,175,.4);
}
.admin-health-warn .admin-health-icon{
  background:#f59e0b;color:#fff;
  box-shadow:0 6px 20px rgba(251,191,36,.4);
}
.admin-health-danger .admin-health-icon{
  background:#ef4444;color:#fff;
  box-shadow:0 6px 20px rgba(239,68,68,.4);
}

.admin-health-body{flex:1;min-width:0}
.admin-health-body > b{
  display:block;
  font-size:15px;
  font-weight:800;
  color:#fff;
  margin-bottom:6px;
  letter-spacing:-.01em;
}
.admin-health-items{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.admin-health-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 12px;
  border-radius:99px;
  font-size:12px;
  font-weight:600;
  background:rgba(255,255,255,.06);
  color:var(--admin-text-dim);
  border:1px solid rgba(255,255,255,.08);
}
.admin-health-item-warn{
  background:rgba(251,191,36,.15);
  color:#fde68a;
  border-color:rgba(251,191,36,.3);
}
.admin-health-item-danger{
  background:rgba(239,68,68,.15);
  color:#fca5a5;
  border-color:rgba(239,68,68,.3);
}
.admin-health-item-ok{
  background:rgba(40,211,175,.12);
  color:#5eead4;
  border-color:rgba(40,211,175,.25);
}
.admin-health-time{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12.5px;
  color:var(--admin-text-mute);
  font-weight:600;
  flex-shrink:0;
}

/* ---------- KPIs GRANDES (6 cards) ---------- */
.admin-kpi-grid-lg{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:14px;
  margin-bottom:16px;
}

.admin-kpi-lg{
  background:var(--admin-surface);
  border:1px solid var(--admin-border);
  border-radius:16px;
  padding:20px;
  display:flex;
  gap:14px;
  align-items:flex-start;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
}
.admin-kpi-lg:hover{
  border-color:rgba(40,211,175,.4);
  transform:translateY(-2px);
}

.admin-kpi-lg-icon{
  width:44px;height:44px;
  border-radius:12px;
  display:grid;place-items:center;
  font-size:17px;
  flex-shrink:0;
}

.admin-kpi-lg-body{flex:1;min-width:0}
.admin-kpi-lg-label{
  font-size:11.5px;
  font-weight:700;
  color:var(--admin-text-mute);
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:4px;
}
.admin-kpi-lg-value{
  font-size:28px;
  font-weight:900;
  letter-spacing:-.03em;
  color:#fff;
  line-height:1;
  margin-bottom:8px;
}
.admin-kpi-lg-foot{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.admin-kpi-lg-sub{
  font-size:11.5px;
  color:var(--admin-text-mute);
  font-weight:600;
}

.admin-delta{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:2px 8px;
  border-radius:99px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
}
.admin-delta i{font-size:9px}
.admin-delta-up{background:rgba(40,211,175,.15);color:#5eead4}
.admin-delta-down{background:rgba(239,68,68,.15);color:#fca5a5}
.admin-delta-flat{background:rgba(255,255,255,.06);color:var(--admin-text-mute)}

/* ---------- SEÇÃO HEAD ---------- */
.admin-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:28px 0 14px;
}
.admin-section-head h2{
  font-size:15px;
  font-weight:800;
  color:#fff;
  letter-spacing:-.01em;
  display:flex;
  align-items:center;
  gap:9px;
}
.admin-section-head h2 i{
  color:var(--admin-primary);
  font-size:14px;
}

/* ---------- ATIVIDADE EM TEMPO REAL ---------- */
.admin-activity-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
  gap:16px;
  margin-bottom:18px;
}

/* ---------- GRÁFICOS 3 COLUNAS ---------- */
.admin-charts-grid-3{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:16px;
  margin-bottom:20px;
}

/* ---------- BAR ROWS (distribuição) ---------- */
.admin-bar-row{
  display:flex;
  align-items:center;
  gap:12px;
  padding:9px 0;
}
.admin-bar-row:not(:last-child){
  border-bottom:1px solid var(--admin-border-soft);
}

.admin-bar-rank{
  width:22px;
  height:22px;
  border-radius:50%;
  background:var(--admin-surface-2);
  color:var(--admin-text-mute);
  display:grid;place-items:center;
  font-size:11px;
  font-weight:800;
  flex-shrink:0;
}

.admin-bar-body{flex:1;min-width:0}
.admin-bar-label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:6px;
}
.admin-bar-label b{
  font-size:13px;
  font-weight:700;
  color:var(--admin-text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.admin-bar-label span{
  font-size:12px;
  font-weight:800;
  color:var(--admin-primary);
  font-variant-numeric:tabular-nums;
}

.admin-bar-track{
  height:6px;
  background:var(--admin-surface-2);
  border-radius:99px;
  overflow:hidden;
}
.admin-bar-fill{
  height:100%;
  border-radius:99px;
  background:linear-gradient(90deg,var(--admin-primary),#219d85);
  transition:width .4s cubic-bezier(.2,.8,.2,1);
}
.admin-bar-fill-amber{
  background:linear-gradient(90deg,#fbbf24,#f59e0b);
}

/* ---------- RANKINGS ---------- */
.admin-ranking-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.admin-ranking-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 0;
}
.admin-ranking-item:not(:last-child){
  border-bottom:1px solid var(--admin-border-soft);
}

.admin-ranking-pos{
  width:28px;height:28px;
  border-radius:50%;
  display:grid;place-items:center;
  font-size:13px;
  font-weight:800;
  background:var(--admin-surface-2);
  color:var(--admin-text-mute);
  flex-shrink:0;
}
.admin-ranking-pos-top1{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;font-size:15px}
.admin-ranking-pos-top2{background:linear-gradient(135deg,#94a3b8,#64748b);color:#fff;font-size:15px}
.admin-ranking-pos-top3{background:linear-gradient(135deg,#d97706,#92400e);color:#fff;font-size:15px}
.admin-ranking-pos-gold{
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  color:#fff;
  font-size:12px;
  box-shadow:0 4px 12px rgba(251,191,36,.35);
}

.admin-ranking-avatar{
  width:36px;height:36px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--admin-border);
  flex-shrink:0;
}

.admin-ranking-body{flex:1;min-width:0}
.admin-ranking-name{
  display:block;
  font-size:13.5px;
  font-weight:700;
  color:var(--admin-text);
  text-decoration:none;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  margin-bottom:2px;
}
.admin-ranking-name:hover{color:var(--admin-primary)}
.admin-ranking-body small{
  display:block;
  font-size:11.5px;
  color:var(--admin-text-mute);
}

.admin-ranking-value{
  text-align:right;
  font-size:15px;
  font-weight:900;
  color:var(--admin-primary);
  font-variant-numeric:tabular-nums;
  line-height:1.1;
  flex-shrink:0;
}
.admin-ranking-value small{
  display:block;
  font-size:10px;
  font-weight:600;
  color:var(--admin-text-mute);
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-top:2px;
}
.admin-ranking-value-gold{color:#fbbf24}

/* ---------- Responsivo ---------- */
@media (max-width:1100px){
  .admin-charts-grid-3{grid-template-columns:1fr}
  .admin-activity-grid{grid-template-columns:1fr}
}

@media (max-width:640px){
  .admin-health{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
    padding:16px 18px;
  }
  .admin-health-icon{width:40px;height:40px;font-size:18px}
  .admin-health-body > b{font-size:14px}
  .admin-health-time{align-self:flex-end}

  .admin-kpi-grid-lg{grid-template-columns:1fr}

  .admin-kpi-lg{padding:16px}
  .admin-kpi-lg-value{font-size:24px}

  .admin-section-head h2{font-size:14px}
}

/* =========================================================
   59. ADMIN — Toggle de tema + TEMA CLARO
   ========================================================= */

/* ---------- Toggle de tema ---------- */
.admin-theme-toggle{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  width:64px;
  height:34px;
  padding:0 6px;
  border-radius:99px;
  background:var(--admin-surface-2);
  border:1px solid var(--admin-border);
  cursor:pointer;
  transition:all .25s cubic-bezier(.2,.8,.2,1);
  flex-shrink:0;
}
.admin-theme-toggle:hover{
  border-color:var(--admin-primary);
}

.admin-theme-toggle-thumb{
  position:absolute;
  top:3px;
  left:3px;
  width:26px;
  height:26px;
  border-radius:50%;
  background:var(--admin-primary);
  box-shadow:0 3px 10px rgba(40,211,175,.4);
  transition:transform .3s cubic-bezier(.2,.8,.2,1);
  z-index:1;
}

.admin-theme-toggle-icon{
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  font-size:12px;
  transition:color .25s ease;
}
.admin-theme-toggle-sun{color:var(--admin-primary)}
.admin-theme-toggle-moon{color:var(--admin-text-mute)}

/* Quando está em modo claro, o thumb vai pra direita e os ícones trocam */
[data-theme="light"] .admin-theme-toggle-thumb{
  transform:translateX(30px);
  background:#f59e0b;
  box-shadow:0 3px 10px rgba(245,158,11,.4);
}
[data-theme="light"] .admin-theme-toggle-sun{color:var(--admin-text-mute)}
[data-theme="light"] .admin-theme-toggle-moon{color:#fff}

/* ---------- TEMA CLARO DO ADMIN ---------- */
[data-theme="light"]{
  --admin-bg:         #F1F1F1;
  --admin-surface:    #ffffff;
  --admin-surface-2:  #f8fafc;
  --admin-border:     #e2e8f0;
  --admin-border-soft:#eef2f7;
  --admin-text:       #1D3557;
  --admin-text-dim:   #475569;
  --admin-text-mute:  #64748b;
  --admin-primary:    #219d85;
}

[data-theme="light"] body.admin-body{
  background:var(--admin-bg);
  color:var(--admin-text);
}

/* Sidebar clara */
[data-theme="light"] .admin-sidebar{
  background:var(--admin-surface);
  border-right-color:var(--admin-border);
}
[data-theme="light"] .admin-brand-title{color:var(--admin-text)}
[data-theme="light"] .admin-nav-item{
  color:var(--admin-text-dim);
}
[data-theme="light"] .admin-nav-item:hover{
  background:var(--admin-surface-2);
  color:var(--admin-text);
}
[data-theme="light"] .admin-nav-item.active{
  background:rgba(33,157,133,.1);
  color:var(--admin-primary);
}
[data-theme="light"] .admin-sidebar-footer img{
  border-color:var(--admin-border);
}
[data-theme="light"] .admin-user-meta b{color:var(--admin-text)}
[data-theme="light"] .admin-logo{
  background:linear-gradient(135deg,#28D3AF,#219d85);
  box-shadow:0 8px 24px rgba(40,211,175,.28);
}

/* Topbar clara */
[data-theme="light"] .admin-page-title{color:var(--admin-text)}
[data-theme="light"] .admin-page-crumb{color:var(--admin-text-mute)}
[data-theme="light"] .admin-page-crumb i{color:var(--admin-primary)}
[data-theme="light"] .admin-topbar-right .btn{
  background:transparent;
  border-color:var(--admin-border);
  color:var(--admin-text-dim);
}
[data-theme="light"] .admin-topbar-right .btn:hover{
  background:var(--admin-surface-2);
  color:var(--admin-text);
  border-color:var(--admin-primary);
}

/* Cards claros */
[data-theme="light"] .admin-card{
  background:var(--admin-surface);
  border-color:var(--admin-border);
}
[data-theme="light"] .admin-card-head h2{color:var(--admin-text)}
[data-theme="light"] .admin-card-head h2 i{color:var(--admin-primary)}

/* KPI grande */
[data-theme="light"] .admin-kpi-lg{
  background:var(--admin-surface);
  border-color:var(--admin-border);
}
[data-theme="light"] .admin-kpi-lg-label{color:var(--admin-text-mute)}
[data-theme="light"] .admin-kpi-lg-value{color:var(--admin-text)}
[data-theme="light"] .admin-kpi-lg-sub{color:var(--admin-text-mute)}
[data-theme="light"] .admin-kpi-lg:hover{
  border-color:var(--admin-primary);
  box-shadow:0 6px 20px rgba(33,157,133,.1);
}

/* KPI mini */
[data-theme="light"] .admin-kpi-mini{
  background:var(--admin-surface);
  border-color:var(--admin-border);
}
[data-theme="light"] .admin-kpi-mini > i{
  background:var(--admin-surface-2);
  color:var(--admin-primary);
}
[data-theme="light"] .admin-kpi-mini b{color:var(--admin-text)}
[data-theme="light"] .admin-kpi-mini small{color:var(--admin-text-mute)}

/* Health bar clara */
[data-theme="light"] .admin-health{
  background:var(--admin-surface);
  border-color:var(--admin-border);
}
[data-theme="light"] .admin-health-ok{
  background:linear-gradient(135deg,rgba(33,157,133,.08),rgba(33,157,133,.02));
  border-color:rgba(33,157,133,.3);
}
[data-theme="light"] .admin-health-warn{
  background:linear-gradient(135deg,rgba(251,191,36,.1),rgba(251,191,36,.02));
  border-color:rgba(251,191,36,.3);
}
[data-theme="light"] .admin-health-danger{
  background:linear-gradient(135deg,rgba(239,68,68,.08),rgba(239,68,68,.02));
  border-color:rgba(239,68,68,.3);
}
[data-theme="light"] .admin-health-body > b{color:var(--admin-text)}
[data-theme="light"] .admin-health-item{
  background:rgba(0,0,0,.04);
  color:var(--admin-text-dim);
  border-color:rgba(0,0,0,.06);
}
[data-theme="light"] .admin-health-item-ok{
  background:rgba(33,157,133,.12);
  color:#0f766e;
  border-color:rgba(33,157,133,.25);
}
[data-theme="light"] .admin-health-item-warn{
  background:rgba(251,191,36,.18);
  color:#92400e;
  border-color:rgba(251,191,36,.35);
}
[data-theme="light"] .admin-health-item-danger{
  background:rgba(239,68,68,.12);
  color:#991b1b;
  border-color:rgba(239,68,68,.25);
}
[data-theme="light"] .admin-health-time{color:var(--admin-text-mute)}

/* Alertas */
[data-theme="light"] .admin-alert-danger{
  background:linear-gradient(135deg,rgba(239,68,68,.08),rgba(239,68,68,.02));
  border-color:rgba(239,68,68,.3);
}
[data-theme="light"] .admin-alert-warn{
  background:linear-gradient(135deg,rgba(251,191,36,.1),rgba(251,191,36,.02));
  border-color:rgba(251,191,36,.35);
}
[data-theme="light"] .admin-alert-body b{color:var(--admin-text)}
[data-theme="light"] .admin-alert-body small{color:var(--admin-text-mute)}
[data-theme="light"] .admin-alert:hover .admin-alert-arrow{color:var(--admin-text)}

/* Gráficos */
[data-theme="light"] .admin-chart-value{color:var(--admin-primary)}
[data-theme="light"] .admin-chart-label{color:var(--admin-text-mute)}
[data-theme="light"] .admin-chart-bar-fill{
  background:linear-gradient(180deg,var(--admin-primary),#0f766e);
}

/* Listas */
[data-theme="light"] .admin-list-item{border-bottom-color:var(--admin-border-soft)}
[data-theme="light"] .admin-list-item img{border-color:var(--admin-border)}
[data-theme="light"] .admin-list-icon{
  background:var(--admin-surface-2);
  color:var(--admin-primary);
}
[data-theme="light"] .admin-list-icon-danger{
  background:rgba(239,68,68,.1);
  color:#dc2626;
}
[data-theme="light"] .admin-list-title{color:var(--admin-text)}
[data-theme="light"] .admin-list-title b{color:var(--admin-text)}
[data-theme="light"] .admin-list-sub{color:var(--admin-text-mute)}
[data-theme="light"] .admin-list-time{color:var(--admin-text-mute)}
[data-theme="light"] .admin-verif-badge{color:var(--admin-primary)}

/* Empresas pendentes (dashboard) */
[data-theme="light"] .admin-list-icon[style*="rgba(251,191,36"]{
  background:rgba(251,191,36,.2) !important;
  color:#b45309 !important;
}

/* Empty state */
[data-theme="light"] .admin-empty{color:var(--admin-text-mute)}
[data-theme="light"] .admin-empty i{opacity:.4}
[data-theme="light"] .admin-empty b{color:var(--admin-text-dim)}
[data-theme="light"] .admin-empty-ok{color:var(--admin-primary)}
[data-theme="light"] .admin-empty-ok i{color:var(--admin-primary)}

/* Section head */
[data-theme="light"] .admin-section-head h2{color:var(--admin-text)}
[data-theme="light"] .admin-section-head h2 i{color:var(--admin-primary)}

/* Barras de distribuição */
[data-theme="light"] .admin-bar-rank{
  background:var(--admin-surface-2);
  color:var(--admin-text-mute);
}
[data-theme="light"] .admin-bar-label b{color:var(--admin-text)}
[data-theme="light"] .admin-bar-label span{color:var(--admin-primary)}
[data-theme="light"] .admin-bar-track{background:var(--admin-surface-2)}
[data-theme="light"] .admin-bar-fill{
  background:linear-gradient(90deg,var(--admin-primary),#0f766e);
}

/* Rankings */
[data-theme="light"] .admin-ranking-item{border-bottom-color:var(--admin-border-soft)}
[data-theme="light"] .admin-ranking-pos{
  background:var(--admin-surface-2);
  color:var(--admin-text-mute);
}
[data-theme="light"] .admin-ranking-pos-top1{
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  color:#fff;
}
[data-theme="light"] .admin-ranking-pos-top2{
  background:linear-gradient(135deg,#94a3b8,#64748b);
  color:#fff;
}
[data-theme="light"] .admin-ranking-pos-top3{
  background:linear-gradient(135deg,#d97706,#92400e);
  color:#fff;
}
[data-theme="light"] .admin-ranking-avatar{border-color:var(--admin-border)}
[data-theme="light"] .admin-ranking-name{color:var(--admin-text)}
[data-theme="light"] .admin-ranking-name:hover{color:var(--admin-primary)}
[data-theme="light"] .admin-ranking-body small{color:var(--admin-text-mute)}
[data-theme="light"] .admin-ranking-value{color:var(--admin-primary)}
[data-theme="light"] .admin-ranking-value small{color:var(--admin-text-mute)}
[data-theme="light"] .admin-ranking-value-gold{color:#d97706}

/* Tags */
[data-theme="light"] .admin-tag{
  background:var(--admin-surface-2);
  color:var(--admin-text-dim);
}
[data-theme="light"] .admin-tag-ok{
  background:rgba(16,185,129,.12);
  color:#047857;
}
[data-theme="light"] .admin-tag-warn{
  background:rgba(245,158,11,.15);
  color:#92400e;
}
[data-theme="light"] .admin-tag-danger{
  background:rgba(239,68,68,.12);
  color:#991b1b;
}
[data-theme="light"] .admin-tag-info{
  background:rgba(59,130,246,.12);
  color:#1e40af;
}
[data-theme="light"] .admin-tag-admin{
  background:rgba(168,85,247,.12);
  color:#6b21a8;
}

/* Botões dentro de filtro admin */
[data-theme="light"] .admin-filter-bar{
  background:var(--admin-surface);
  border-color:var(--admin-border);
}
[data-theme="light"] .admin-search input,
[data-theme="light"] .admin-select{
  background:var(--admin-bg);
  border-color:var(--admin-border);
  color:var(--admin-text);
}
[data-theme="light"] .admin-search input::placeholder{color:var(--admin-text-mute)}
[data-theme="light"] .admin-filter-info{color:var(--admin-text-dim)}
[data-theme="light"] .admin-filter-info b{color:var(--admin-text)}

/* Tabelas */
[data-theme="light"] .admin-table{color:var(--admin-text)}
[data-theme="light"] .admin-table thead{background:var(--admin-surface-2)}
[data-theme="light"] .admin-table th{color:var(--admin-text-mute)}
[data-theme="light"] .admin-table td{
  color:var(--admin-text);
  border-top-color:var(--admin-border-soft);
}
[data-theme="light"] .admin-table tr:hover td{background:rgba(0,0,0,.02)}
[data-theme="light"] .admin-table-name{color:var(--admin-text)}
[data-theme="light"] .admin-table-email{color:var(--admin-text-mute)}
[data-theme="light"] .admin-table-time{color:var(--admin-text-mute)}
[data-theme="light"] .admin-table-plan-icon{
  background:var(--admin-surface-2);
  color:var(--admin-primary);
}
[data-theme="light"] .admin-icon-btn{
  border-color:var(--admin-border);
  color:var(--admin-text-dim);
}
[data-theme="light"] .admin-icon-btn:hover{
  background:var(--admin-surface-2);
  color:var(--admin-text);
}

/* User hero (detalhe) */
[data-theme="light"] .admin-user-name{color:var(--admin-text)}
[data-theme="light"] .admin-user-email{color:var(--admin-text-dim)}
[data-theme="light"] .admin-user-meta{color:var(--admin-text-mute)}
[data-theme="light"] .admin-user-meta i{color:var(--admin-primary)}

/* Ações (detalhe usuário) */
[data-theme="light"] .admin-action{
  background:var(--admin-surface);
  border-color:var(--admin-border);
  color:var(--admin-text);
}
[data-theme="light"] .admin-action small{color:var(--admin-text-mute)}

/* Chips admin */
[data-theme="light"] .admin-chip{
  background:var(--admin-surface-2);
  border-color:var(--admin-border);
  color:var(--admin-text-dim);
}
[data-theme="light"] .admin-chip i{color:var(--admin-primary)}

/* Denúncias */
[data-theme="light"] .admin-denuncia-motivo{color:var(--admin-text)}
[data-theme="light"] .admin-denuncia-meta{color:var(--admin-text-mute)}
[data-theme="light"] .admin-denuncia-meta b{color:var(--admin-text-dim)}
[data-theme="light"] .admin-denuncia-alvo-link{
  background:var(--admin-surface-2);
  color:var(--admin-text);
}
[data-theme="light"] .admin-denuncia-detalhe{
  background:var(--admin-bg);
  border-color:var(--admin-border);
}
[data-theme="light"] .admin-denuncia-detalhe p{color:var(--admin-text-dim)}

/* Paginação */
[data-theme="light"] .admin-page-btn{
  background:var(--admin-surface-2);
  color:var(--admin-text-dim);
}
[data-theme="light"] .admin-page-info{color:var(--admin-text-dim)}
[data-theme="light"] .admin-page-info b{color:var(--admin-text)}

/* Topbar direita */
[data-theme="light"] .admin-topbar-right .btn{
  color:var(--admin-text-dim);
}

/* Toast / flash */
[data-theme="light"] .flash.ok{
  background:#ecfdf5;
  border-color:#a7f3d0;
  color:#065f46;
}
[data-theme="light"] .flash.erro{
  background:#fef2f2;
  border-color:#fecaca;
  color:#991b1b;
}

/* Ajuste da barra de rolagem em modo claro */
[data-theme="light"] ::-webkit-scrollbar-thumb{
  background:rgba(0,0,0,.15);
}
[data-theme="light"] ::-webkit-scrollbar-thumb:hover{
  background:rgba(0,0,0,.25);
}

/* ---------- Responsivo ---------- */
@media (max-width:640px){
  .admin-theme-toggle{
    width:56px;
    height:30px;
  }
  .admin-theme-toggle-thumb{
    width:22px;
    height:22px;
  }
  [data-theme="light"] .admin-theme-toggle-thumb{
    transform:translateX(26px);
  }
  .admin-theme-toggle-icon{
    width:20px;
    height:20px;
    font-size:11px;
  }
}

/* =========================================================
   60. PERFIL — Menu completo
   ========================================================= */

.perfil-menu-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:10px;
  margin-bottom:8px;
}

.perfil-menu-item{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  text-decoration:none;
  color:inherit;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.perfil-menu-item:hover{
  border-color:var(--primary-light);
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,.05);
}
.perfil-menu-item:active{
  transform:translateY(0);
}

.perfil-menu-icon{
  width:44px;
  height:44px;
  border-radius:12px;
  display:grid;
  place-items:center;
  font-size:18px;
  flex-shrink:0;
}

.perfil-menu-body{
  flex:1;
  min-width:0;
}
.perfil-menu-body b{
  display:block;
  font-size:14px;
  font-weight:700;
  color:var(--text);
  margin-bottom:2px;
  letter-spacing:-.01em;
}
.perfil-menu-body small{
  display:block;
  font-size:12px;
  color:var(--text-mute);
  line-height:1.4;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.perfil-menu-arrow{
  color:var(--text-mute);
  font-size:12px;
  flex-shrink:0;
  transition:transform .2s;
}
.perfil-menu-item:hover .perfil-menu-arrow{
  transform:translateX(3px);
  color:var(--primary-dark);
}

.perfil-menu-item-danger:hover{
  border-color:#fecaca;
  background:#fef2f2;
}
.perfil-menu-item-danger:hover .perfil-menu-body b{
  color:#b91c1c;
}
.perfil-menu-item-danger:hover .perfil-menu-arrow{
  color:#b91c1c;
}

@media (max-width:640px){
  .perfil-menu-grid{
    grid-template-columns:1fr;
    gap:8px;
  }
  .perfil-menu-item{
    padding:12px 14px;
  }
  .perfil-menu-icon{
    width:40px;
    height:40px;
    font-size:16px;
    border-radius:11px;
  }
  .perfil-menu-body b{font-size:13.5px}
  .perfil-menu-body small{font-size:11.5px}
}

/* =========================================================
   61. ONBOARDING INTERESSES — v3 (grid vertical compacto)
   ========================================================= */

/* ---------- Filters ---------- */
.int-filters{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:4px 0 14px;
  margin-bottom:20px;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.int-filters::-webkit-scrollbar{display:none}

.int-filter{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 15px;
  border-radius:99px;
  background:var(--card);
  border:1.5px solid var(--border);
  color:var(--text-dim);
  font-size:13px;
  font-weight:700;
  font-family:inherit;
  cursor:pointer;
  white-space:nowrap;
  flex:0 0 auto;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.int-filter i{
  font-size:12px;
  color:var(--text-mute);
}
.int-filter:hover{
  border-color:var(--border-strong);
  color:var(--text);
}
.int-filter.active{
  background:var(--primary);
  color:#fff;
  border-color:var(--primary);
}
.int-filter.active i{color:#fff}

/* ---------- Grupos ---------- */
.int-group{
  margin-bottom:26px;
}
.int-group[hidden]{display:none}

.int-group-title{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:12px;
  font-size:12px;
  font-weight:800;
  color:var(--text-mute);
  text-transform:uppercase;
  letter-spacing:.08em;
}
.int-group-title > i{
  color:var(--primary);
  font-size:13px;
}
.int-group-title > span:first-of-type{
  flex:1;
  overflow:hidden;
  text-overflow:ellipsis;
}
.int-group-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:22px;
  height:20px;
  padding:0 7px;
  border-radius:99px;
  background:var(--card-soft);
  border:1px solid var(--border);
  color:var(--text-mute);
  font-size:10.5px;
  font-weight:800;
}

/* ---------- Grid ---------- */
.int-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}

/* ---------- Card de interesse ---------- */
.int-item{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:16px 10px;
  min-height:104px;
  border-radius:16px;
  background:var(--card);
  border:1.5px solid var(--border);
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  text-align:center;
  transition:background .15s ease, border-color .15s ease;
}
.int-item input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.int-item-icon{
  width:42px;
  height:42px;
  border-radius:12px;
  background:var(--card-soft);
  color:var(--text-mute);
  display:grid;
  place-items:center;
  font-size:17px;
  transition:background .15s ease, color .15s ease;
}

.int-item-label{
  font-size:12.5px;
  font-weight:600;
  color:var(--text);
  line-height:1.3;
  max-width:100%;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  text-overflow:ellipsis;
  transition:color .15s ease;
}

.int-item-check{
  position:absolute;
  top:8px;
  right:8px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:var(--primary);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:9px;
  opacity:0;
  transform:scale(.4);
  transition:opacity .18s ease, transform .18s ease;
  box-shadow:0 3px 10px rgba(40,211,175,.35);
}

/* Estado selecionado (via JS class + fallback CSS) */
.int-item input:checked ~ .int-item-icon{
  background:var(--primary);
  color:#fff;
}
.int-item input:checked ~ .int-item-label{
  color:var(--primary-dark);
  font-weight:700;
}
.int-item input:checked ~ .int-item-check{
  opacity:1;
  transform:scale(1);
}
.int-item.is-selected{
  border-color:var(--primary);
  background:linear-gradient(135deg,rgba(40,211,175,.06),rgba(40,211,175,.02));
}

/* ---------- Empty state (por filtro) ---------- */
.int-empty{
  text-align:center;
  padding:40px 20px;
  color:var(--text-mute);
}
.int-empty i{
  display:block;
  font-size:36px;
  color:var(--primary);
  opacity:.4;
  margin-bottom:12px;
}
.int-empty p{
  font-size:14px;
}

/* ---------- Footer fixo ---------- */
.onb-page[data-step="1"] .onb-footer{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  z-index:20;
  margin:0 !important;
  background:var(--card);
  border-top:1px solid var(--border);
  padding:12px 20px calc(12px + env(safe-area-inset-bottom));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  box-shadow:0 -4px 20px rgba(0,0,0,.06);
}

.onb-main{
  padding-bottom:100px !important;
}

/* ---------- Shake leve ---------- */
@keyframes onbShakeLight{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-5px)}
  75%{transform:translateX(5px)}
}
.onb-counter-box.shake{
  animation:onbShakeLight .3s ease-in-out;
}

/* =========================================================
   Responsivo
   ========================================================= */

/* Mobile médio (361-480px): 2 colunas compactas */
@media (max-width:480px){
  .onb-main{padding:22px 16px 100px !important}

  .int-filters{padding:4px 0 12px;margin-bottom:16px}
  .int-filter{padding:8px 14px;font-size:12.5px}
  .int-filter i{font-size:11px}

  .int-group{margin-bottom:22px}

  .int-group-title{font-size:11.5px;margin-bottom:10px}

  .int-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:8px;
  }

  .int-item{
    padding:14px 8px;
    min-height:98px;
    border-radius:14px;
    gap:8px;
  }
  .int-item-icon{
    width:38px;
    height:38px;
    font-size:15px;
    border-radius:11px;
  }
  .int-item-label{
    font-size:12px;
    line-height:1.25;
  }
  .int-item-check{
    width:18px;
    height:18px;
    font-size:8px;
    top:7px;
    right:7px;
  }
}

/* Mobile pequeno (≤360px): 1 coluna quando o texto for longo */
@media (max-width:360px){
  .int-grid{grid-template-columns:1fr}
  .int-item{
    flex-direction:row;
    text-align:left;
    justify-content:flex-start;
    padding:12px 42px 12px 14px;
    min-height:56px;
    gap:12px;
  }
  .int-item-icon{
    width:36px;
    height:36px;
    font-size:14px;
    flex-shrink:0;
  }
  .int-item-label{
    font-size:13.5px;
    -webkit-line-clamp:1;
    text-align:left;
  }
  .int-item-check{
    top:50%;
    right:14px;
    transform:translateY(-50%) scale(.4);
  }
  .int-item input:checked ~ .int-item-check{
    transform:translateY(-50%) scale(1);
  }
}

/* Tablet (481-768px): 3 colunas */
@media (min-width:481px) and (max-width:768px){
  .int-grid{grid-template-columns:repeat(3, minmax(0, 1fr))}
  .int-item{min-height:100px;padding:14px 8px}
  .int-item-icon{width:40px;height:40px;font-size:16px}
  .int-item-label{font-size:12.5px}
}

/* Desktop (≥769px): 4 colunas */
@media (min-width:769px){
  .int-grid{grid-template-columns:repeat(4, minmax(0, 1fr))}
  .int-item{
    min-height:112px;
    padding:18px 12px;
  }
  .int-item-icon{
    width:46px;
    height:46px;
    font-size:18px;
  }
  .int-item-label{
    font-size:13.5px;
  }
}

/* =========================================================
   Dark mode
   ========================================================= */
[data-theme="dark"] .onb-page[data-step="1"] .onb-footer{
  background:var(--card);
  box-shadow:0 -4px 20px rgba(0,0,0,.3);
}
[data-theme="dark"] .int-item.is-selected{
  background:linear-gradient(135deg,rgba(40,211,175,.12),rgba(40,211,175,.04));
}
[data-theme="dark"] .int-item-icon{
  background:rgba(255,255,255,.04);
}
[data-theme="dark"] .perfil-menu-item{
  background:var(--card);
}

/* =========================================================
   62. PESSOAS — Lista + Busca
   ========================================================= */

/* ---------- Barra de busca ---------- */
.pessoas-search{
  position:relative;
  margin-bottom:20px;
}
.pessoas-search-ico{
  position:absolute;
  left:18px;
  top:50%;
  transform:translateY(-50%);
  color:var(--text-mute);
  font-size:14px;
  pointer-events:none;
}
.pessoas-search-input{
  width:100%;
  padding:14px 48px 14px 46px;
  border-radius:99px;
  border:1.5px solid var(--border);
  background:var(--card);
  font-size:15px;
  color:var(--text);
  outline:none;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  font-family:inherit;
}
.pessoas-search-input:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(40,211,175,.15);
}
.pessoas-search-input::placeholder{
  color:var(--text-mute);
  opacity:.75;
}
.pessoas-search-clear{
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  width:30px;
  height:30px;
  border-radius:50%;
  background:var(--card-soft);
  color:var(--text-mute);
  display:grid;
  place-items:center;
  font-size:12px;
  transition:var(--t);
  text-decoration:none;
}
.pessoas-search-clear:hover{
  background:var(--primary-light);
  color:var(--primary-dark);
}

/* ---------- Contador ---------- */
.pessoas-count{
  font-size:13.5px;
  color:var(--text-mute);
  margin-bottom:14px;
}
.pessoas-count b{
  color:var(--text);
  font-weight:800;
}

/* ---------- Lista ---------- */
.pessoas-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

/* ---------- Linha de pessoa ---------- */
.pessoa-row{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 18px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.pessoa-row:hover{
  border-color:var(--primary-light);
  box-shadow:0 4px 16px rgba(0,0,0,.05);
  transform:translateY(-1px);
}

/* Link principal (avatar + info) */
.pessoa-row-main{
  display:flex;
  align-items:center;
  gap:14px;
  flex:1;
  min-width:0;
  text-decoration:none;
  color:inherit;
}

/* Wrapper da linha inteira como link (minhas conexões) */
.pessoa-row-link{
  text-decoration:none;
  color:inherit;
}

/* ---------- Avatar ---------- */
.pessoa-row-avatar{
  width:52px;
  height:52px;
  border-radius:50%;
  padding:2px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  flex-shrink:0;
}
.pessoa-row-avatar img{
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:cover;
  border:2.5px solid var(--card);
}

/* ---------- Info ---------- */
.pessoa-row-info{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.pessoa-row-nome{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:15px;
  font-weight:700;
  color:var(--text);
  letter-spacing:-.01em;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.pessoa-row-verified{
  color:var(--primary);
  font-size:12px;
  flex-shrink:0;
}
.pessoa-row-cidade{
  display:flex;
  align-items:center;
  gap:5px;
  font-size:12.5px;
  color:var(--text-mute);
  font-weight:500;
}
.pessoa-row-cidade i{
  font-size:10px;
  color:var(--primary);
}
.pessoa-row-bio{
  font-size:12.5px;
  color:var(--text-dim);
  line-height:1.4;
  margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* ---------- Ações ---------- */
.pessoa-row-actions{
  flex-shrink:0;
}
.pessoa-row-actions form{
  display:inline;
  margin:0;
}
.pessoa-row-actions .btn{
  padding:9px 16px;
  font-size:13px;
}

/* ---------- Seta (minhas conexões) ---------- */
.pessoa-row-arrow{
  color:var(--text-mute);
  font-size:13px;
  flex-shrink:0;
  transition:transform .2s;
}
.pessoa-row-link:hover .pessoa-row-arrow{
  transform:translateX(3px);
  color:var(--primary-dark);
}

/* =========================================================
   Responsivo
   ========================================================= */

/* Mobile pequeno (≤520px) */
@media (max-width:520px){
  .pessoas-search{
    margin-bottom:16px;
  }
  .pessoas-search-input{
    padding:13px 44px 13px 42px;
    font-size:16px; /* evita zoom iOS */
    border-radius:14px;
  }
  .pessoas-search-ico{
    left:15px;
    font-size:13px;
  }
  .pessoas-search-clear{
    right:10px;
    width:28px;
    height:28px;
  }

  .pessoas-count{
    font-size:12.5px;
    margin-bottom:12px;
    padding-left:2px;
  }

  .pessoas-list{
    gap:8px;
  }

  .pessoa-row{
    padding:12px 14px;
    gap:12px;
    border-radius:12px;
    align-items:flex-start;
    flex-wrap:wrap;
  }

  .pessoa-row-main{
    gap:12px;
    align-items:flex-start;
    width: 100%;
  }

  .pessoa-row-avatar{
    width:46px;
    height:46px;
  }

  .pessoa-row-nome{
    font-size:14px;
  }
  .pessoa-row-cidade{
    font-size:12px;
  }
  .pessoa-row-bio{
    font-size:12px;
    -webkit-line-clamp:2;
    white-space:normal;
    overflow:hidden;
    display:-webkit-box;
    -webkit-box-orient:vertical;
  }

  /* No mobile, botão vai para a linha de baixo (abaixo do bio) */
  .pessoa-row-actions{
    width:100%;
    padding-left:58px; /* alinha com o texto */
  }
  .pessoa-row-actions form{
    display:block;
    width:100%;
  }
  .pessoa-row-actions .btn{
    width:100%;
    justify-content:center;
    padding:10px 16px;
    font-size:13px;
  }

  /* Em conexões já aceitas, esconde a seta no mobile (não faz sentido) */
  .pessoa-row-arrow{
    display:none;
  }
}

/* Mobile muito pequeno (≤380px) */
@media (max-width:380px){
  .pessoa-row-btn-text{
    display:inline; /* mantém o texto */
  }
  .pessoa-row{
    padding:12px;
  }
  .pessoa-row-avatar{
    width:42px;
    height:42px;
  }
  .pessoa-row-nome{
    font-size:13.5px;
  }
}

/* Desktop — botão compacto ao lado */
@media (min-width:521px){
  .pessoa-row-actions .btn{
    white-space:nowrap;
  }
}

/* =========================================================
   Dark mode
   ========================================================= */
[data-theme="dark"] .pessoa-row:hover{
  box-shadow:0 4px 16px rgba(0,0,0,.3);
}

/* =========================================================
   63. HOME — Conexões + Fix mobile-top
   ========================================================= */

/* ---------- Seção "Suas conexões" ---------- */
.home-conexoes-scroll{
  display:flex;
  gap:12px;
  overflow-x:auto;
  padding:4px 4px 14px;
  margin-bottom:32px;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
}
.home-conexoes-scroll::-webkit-scrollbar{display:none}

.home-conexao-card{
  flex:0 0 auto;
  width:130px;
  padding:18px 12px 14px;
  border-radius:16px;
  background:var(--card);
  border:1.5px solid var(--border);
  text-align:center;
  text-decoration:none;
  color:inherit;
  transition:all .2s cubic-bezier(.2,.8,.2,1);
  scroll-snap-align:start;
}
.home-conexao-card:hover{
  transform:translateY(-3px);
  border-color:var(--primary-light);
  box-shadow:0 12px 28px -10px rgba(40,211,175,.2);
}

.home-conexao-avatar{
  width:64px;
  height:64px;
  border-radius:50%;
  margin:0 auto 10px;
  padding:2px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
}
.home-conexao-avatar img{
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--card);
}

.home-conexao-nome{
  font-size:13.5px;
  font-weight:700;
  color:var(--text);
  letter-spacing:-.01em;
  margin-bottom:3px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.home-conexao-cidade{
  font-size:11.5px;
  color:var(--text-mute);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.home-conexao-cidade i{
  font-size:9px;
  color:var(--primary);
}

/* ---------- Seção "Próximos planos" ---------- */
.home-proximos-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:10px;
}

.home-proximo-card{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  text-decoration:none;
  color:inherit;
  transition:all .18s cubic-bezier(.2,.8,.2,1);
}
.home-proximo-card:hover{
  border-color:var(--primary-light);
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,.05);
}

.home-proximo-emoji{
  width:42px;
  height:42px;
  border-radius:12px;
  background:var(--primary-light);
  color:var(--primary-dark);
  display:grid;
  place-items:center;
  font-size:18px;
  flex-shrink:0;
}

.home-proximo-body{flex:1;min-width:0}
.home-proximo-body b{
  display:block;
  font-size:14px;
  font-weight:700;
  color:var(--text);
  margin-bottom:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.home-proximo-body small{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:var(--text-mute);
}
.home-proximo-body small i{font-size:10px;color:var(--primary)}

.home-proximo-arrow{
  color:var(--text-mute);
  font-size:12px;
  transition:transform .2s;
}
.home-proximo-card:hover .home-proximo-arrow{
  transform:translateX(3px);
  color:var(--primary-dark);
}

/* =========================================================
   FIX: mobile-top (logo saindo da tela / botão cortado)
   ========================================================= */
@media (max-width:980px){
  /* Ajusta a margem para coincidir exatamente com o padding do .main */
  .mobile-top{
    margin:-20px -18px 18px;
    padding:12px 18px;
    gap:10px;
  }

  /* Logo um pouco menor e alinhada à esquerda com respiro */
  .mobile-top-brand{
    display:flex;
    align-items:center;
    flex-shrink:0;
  }
  .mobile-top-brand img{
    width:88px;
    height:auto;
    object-fit:contain;
    display:block;
  }

  /* Botão + do lado direito, sem estourar */
  .mobile-top-cta{
    width:36px;
    height:36px;
    font-size:14px;
    flex-shrink:0;
  }
}

/* Mobile pequeno: reduz mais o gap e a logo pra não apertar */
@media (max-width:380px){
  .mobile-top{
    margin:-20px -14px 16px;
    padding:12px 14px;
    gap:8px;
  }
  .mobile-top-brand img{
    width:78px;
  }
  .mobile-top-cta{
    width:34px;
    height:34px;
    font-size:13px;
  }
}

/* Dark mode — home */
[data-theme="dark"] .home-conexao-card:hover{
  box-shadow:0 12px 28px -10px rgba(40,211,175,.15);
}
[data-theme="dark"] .home-proximo-card:hover{
  box-shadow:0 6px 18px rgba(0,0,0,.3);
}