:root {
  --amber: #E8834A;
  --amber-light: #F5A876;
  --amber-pale: #FDF0E8;
  --sage: #5A7A65;
  --sage-light: #8FAF98;
  --sage-pale: #EDF3EF;
  --sand: #F7F2EC;
  --earth: #3D2B1F;
  --earth-mid: #6B4C3B;
  --earth-light: #A07860;
  --cream: #FDFAF6;
  --alert-red: #C0392B;
  --alert-red-pale: #FDEDEB;
  --blue: #3D7AB5;
  --blue-pale: #EBF3FB;
  --white: #FFFFFF;
  --border: rgba(61,43,31,0.10);
  --shadow: 0 2px 16px rgba(61,43,31,0.08);
  --shadow-lg: 0 8px 40px rgba(61,43,31,0.13);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'DM Sans', sans-serif; background: var(--sand); color: var(--earth); min-height: 100vh; }

/* NAV */
.nav {
  background: var(--earth);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 32px; height: 60px;
  position: sticky; top: 0; z-index: 100;
  box-shadow: 0 2px 12px rgba(0,0,0,0.18);
}
.nav-logo { font-family: 'Playfair Display', serif; font-size: 22px; color: var(--amber-light); letter-spacing: 0.5px; }
.nav-logo span { color: var(--white); }
.nav-user { display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,0.7); font-size: 13px; }
.nav-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--amber);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 13px; color: white;
  cursor: pointer;
}

/* NAV USER INFO */
.nav-user-info { display: flex; flex-direction: column; gap: 1px; position: relative; }
.nav-nome-membro { font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.92); line-height: 1.2; }
.nav-nome-assistido { font-size: 11px; color: rgba(255,255,255,0.55); line-height: 1.2; }

/* PERFIL DROPDOWN */
.nav-user { position: relative; }
.perfil-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 8px;
  background: var(--cream);
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  min-width: 180px;
  display: none;
  z-index: 1000;
  overflow: hidden;
}
.perfil-dropdown.active { display: block; }
.perfil-menu-item {
  width: 100%;
  padding: 12px 16px;
  border: none;
  background: none;
  font-size: 14px;
  color: var(--earth);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  transition: background 0.15s;
}
.perfil-menu-item:hover { background: var(--sand); }
.perfil-menu-item.logout { color: var(--alert-red); }
.perfil-icon { font-size: 16px; }

/* MODAL EDITAR PERFIL */
.modal-content { background: var(--cream); border-radius: 20px; width: 100%; max-width: 420px; }
.modal-body { padding: 20px 24px; }
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: 13px; font-weight: 600; color: var(--earth-mid); margin-bottom: 6px; }
.form-input {
  width: 100%; padding: 10px 14px; border-radius: 10px;
  border: 1.5px solid var(--border); background: var(--sand); font-family: inherit;
  font-size: 14px; color: var(--earth); outline: none; box-sizing: border-box;
}
.form-input:focus { border-color: var(--amber); }
.modal-footer { padding: 16px 24px; border-top: 1px solid var(--border); display: flex; gap: 10px; justify-content: flex-end; }
.btn-secondary {
  padding: 10px 20px; border-radius: 10px; border: 1.5px solid var(--border); background: transparent;
  font-size: 14px; font-weight: 500; color: var(--earth-mid); cursor: pointer;
}
.btn-secondary:hover { background: var(--sand); }
.btn-primary {
  padding: 10px 20px; border-radius: 10px; border: none; background: var(--amber);
  font-size: 14px; font-weight: 600; color: white; cursor: pointer;
}
.btn-primary:hover { background: var(--amber-light); }
.btn-danger { padding: 10px 20px; border-radius: 10px; border: none; background: #dc3545; font-size: 14px; font-weight: 600; color: white; cursor: pointer; }
.btn-danger:hover { background: #c82333; }

/* SELECTION SCREEN */
#tela-selecao, #tela-selecao-membro {
  min-height: calc(100vh - 60px);
  display: none;
  align-items: center; justify-content: center;
  padding: 40px 20px;
}
.selecao-box { max-width: 600px; width: 100%; }
.selecao-titulo {
  font-family: 'Playfair Display', serif;
  font-size: 28px; font-weight: 700;
  color: var(--earth); margin-bottom: 6px; text-align: center;
}
.selecao-sub { font-size: 14px; color: var(--earth-light); text-align: center; margin-bottom: 32px; }
.selecao-voltar {
  display: block; margin: 0 auto 20px;
  background: none; border: none; cursor: pointer;
  color: var(--earth-light); font-size: 13px; font-family: 'DM Sans', sans-serif;
  padding: 4px 0; transition: color 0.2s;
}
.selecao-voltar:hover { color: var(--earth); }
.assistido-cards { display: flex; flex-direction: column; gap: 12px; }
.assistido-card {
  background: var(--cream); border-radius: 16px;
  border: 1.5px solid var(--border); box-shadow: var(--shadow);
  padding: 18px 22px; display: flex; align-items: center; gap: 16px;
  cursor: pointer; transition: all 0.2s;
}
.assistido-card:hover { border-color: var(--amber); transform: translateY(-1px); box-shadow: var(--shadow-lg); }
.ac-avatar {
  width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 700; color: white;
}
.ac-info { flex: 1; min-width: 0; }
.ac-nome { font-weight: 700; font-size: 16px; }
.ac-detalhe { font-size: 12.5px; color: var(--earth-light); margin-top: 2px; }
.ac-badge { padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; background: var(--sage-pale); color: var(--sage); }
.ac-badge.inativo { background: var(--border); color: var(--earth-light); }
.selecao-loading { text-align: center; padding: 40px; color: var(--earth-light); }
.selecao-empty { text-align: center; padding: 40px; color: var(--earth-light); font-size: 14px; }
#btn-novo-assistido-container { text-align: center; margin-top: 20px; }
.btn-novo-assistido {
  display: inline-block;
  padding: 10px 24px;
  background: var(--sage);
  color: white;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s;
}
.btn-novo-assistido:hover { background: var(--sage-dark, #4a6b55); }
.limite-aviso {
  font-size: 12px;
  color: var(--earth-light);
  margin-top: 8px;
  max-width: 350px;
  margin-left: auto;
  margin-right: auto;
}

/* DASHBOARD LAYOUT */
#tela-dashboard { display: none; }
.family-layout { display: grid; grid-template-columns: 280px 1fr; min-height: calc(100vh - 60px); }
.family-sidebar {
  background: var(--cream); border-right: 1px solid var(--border);
  padding: 24px 0; position: sticky; top: 60px;
  height: calc(100vh - 60px); overflow-y: auto;
}
.sidebar-section { padding: 0 20px; margin-bottom: 24px; }
.sidebar-label { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.7px; color: var(--earth-light); margin-bottom: 8px; padding: 0 4px; }
.senior-card {
  background: var(--earth); border-radius: 14px; padding: 18px;
  margin: 0 20px 24px; color: white; position: relative; overflow: hidden; cursor: pointer;
}
.senior-card::before { content: '❤'; position: absolute; right: -8px; bottom: -10px; font-size: 80px; opacity: 0.06; }
.senior-name { font-family: 'Playfair Display', serif; font-size: 18px; font-weight: 700; color: white; }
.senior-age { font-size: 12.5px; color: rgba(255,255,255,0.6); margin-top: 2px; }
.senior-status { margin-top: 14px; display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--amber-light); font-weight: 600; }
.status-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #5EC269;
  box-shadow: 0 0 0 3px rgba(94,194,105,0.3); animation: pulse 2s infinite;
}
.status-dot.offline { background: #aaa; box-shadow: none; animation: none; }
@keyframes pulse {
  0%,100% { box-shadow: 0 0 0 3px rgba(94,194,105,0.3); }
  50% { box-shadow: 0 0 0 6px rgba(94,194,105,0.1); }
}
.senior-last { font-size: 11px; color: rgba(255,255,255,0.45); margin-top: 4px; }
.nav-item { display: flex; align-items: center; gap: 10px; padding: 9px 14px; border-radius: 8px; font-size: 13.5px; cursor: pointer; color: var(--earth-mid); transition: all 0.15s; margin-bottom: 2px; }
.nav-item:hover { background: var(--sand); color: var(--earth); }
.nav-item.active { background: var(--amber-pale); color: var(--amber); font-weight: 600; }
.nav-item-icon { font-size: 16px; width: 22px; text-align: center; }
.nav-badge { margin-left: auto; background: var(--alert-red); color: white; font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 10px; }
.nav-badge.amber { background: var(--amber); }
.familia-membro { display: flex; align-items: flex-start; gap: 10px; padding: 0 4px; margin-bottom: 10px; }
.membro-avatar { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px; color: white; flex-shrink: 0; margin-top: 1px; }
.membro-info { flex: 1; min-width: 0; }
.membro-nome { font-size: 13px; font-weight: 600; color: var(--earth); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.membro-papel { font-size: 11px; color: var(--earth-light); margin-top: 1px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.membro-role { font-size: 10.5px; font-weight: 600; padding: 1px 6px; border-radius: 8px; }
.membro-role-principal { background: var(--amber-pale); color: var(--amber); }
.membro-role-obs { background: var(--sand); color: var(--earth-light); }
.membro-notif { display: flex; gap: 5px; margin-top: 4px; flex-wrap: wrap; }
.membro-notif-pill { font-size: 10px; color: var(--earth-light); background: var(--sand); border-radius: 8px; padding: 1px 7px; border: 1px solid var(--border); }
.sb-familia-count { background: var(--amber); color: white; font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 10px; }
.plano-box { background: var(--amber-pale); border-radius: 10px; padding: 14px; font-size: 13px; }
.plano-nome { font-weight: 700; color: var(--amber); font-size: 15px; }
.plano-desc { margin-top: 10px; color: var(--earth-mid); font-size: 12px; line-height: 1.5; }

/* MAIN */
.family-main { padding: 28px 32px; background: var(--sand); min-width:0; }
.family-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 24px; }
.page-title { font-family: 'Playfair Display', serif; font-size: 28px; font-weight: 700; color: var(--earth); }
.page-subtitle { font-size: 13px; color: var(--earth-light); margin-top: 3px; }
.date-nav { display: flex; align-items: center; gap: 12px; }
.date-btn { width: 32px; height: 32px; border-radius: 8px; border: 1.5px solid var(--border); background: var(--cream); display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 14px; color: var(--earth-mid); user-select: none; transition: all 0.15s; }
.date-btn:hover { border-color: var(--amber); color: var(--amber); }
.date-btn.disabled { opacity: 0.3; cursor: default; pointer-events: none; }
.current-date { font-weight: 600; font-size: 14px; }

/* SECTIONS */
.secao { display: none; }
.secao.ativa { display: block; }

/* WEEK STRIP */
.week-strip { display: flex; gap: 8px; margin-bottom: 20px; }
.week-day { flex: 1; background: var(--cream); border-radius: 10px; padding: 12px 8px; text-align: center; border: 1px solid var(--border); cursor: pointer; transition: all 0.2s; }
.week-day:hover { border-color: var(--amber-light); }
.week-day.hoje { border-color: var(--amber); background: var(--amber-pale); }
.week-day.sem-dados { opacity: 0.45; }
.wd-name { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--earth-light); }
.wd-emoji { font-size: 18px; margin: 6px 0; }
.wd-score { font-size: 11px; font-weight: 600; color: var(--earth-mid); }
.wd-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--sage); margin: 4px auto 0; }
.wd-dot.miss { background: var(--alert-red); }
.wd-dot.none { background: var(--border); }

/* DAILY SUMMARY */
.daily-summary { background: var(--cream); border-radius: 16px; border: 1px solid var(--border); box-shadow: var(--shadow); padding: 24px; margin-bottom: 20px; }
.summary-title { font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 700; margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
.health-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr)); gap: 12px; margin-bottom: 20px; }
.health-card { background: var(--sand); border-radius: 12px; padding: 16px; text-align: center; border: 1.5px solid transparent; transition: border-color 0.2s; }
.health-card:hover { border-color: var(--amber-light); }
.health-card.ok { background: var(--sage-pale); }
.health-card.warn { background: var(--amber-pale); }
.health-card.alert { background: var(--alert-red-pale); }
.hc-icon { font-size: 26px; margin-bottom: 8px; }
.hc-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--earth-light); }
.hc-label-small { font-size: 10.5px; text-transform: none; letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hc-val { font-size: 15px; font-weight: 700; margin-top: 4px; color: var(--earth); }
.hc-status { font-size: 11px; margin-top: 3px; font-weight: 600; }
.hc-ok { color: var(--sage); }
.hc-warn { color: #C0651A; }
.hc-alert { color: var(--alert-red); }
.ai-summary { background: linear-gradient(135deg, var(--earth) 0%, #5A3D2B 100%); border-radius: 12px; padding: 18px 22px; color: white; position: relative; overflow: hidden; }
.ai-summary::before { content: '✦'; position: absolute; right: 20px; top: 15px; font-size: 40px; opacity: 0.1; }
.ai-summary-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.7px; color: var(--amber-light); margin-bottom: 8px; font-weight: 600; }
.ai-summary-text { font-size: 14px; line-height: 1.6; color: rgba(255,255,255,0.88); }

/* CARD */
.card { background: var(--cream); border-radius: 14px; border: 1px solid var(--border); box-shadow: var(--shadow); overflow: hidden; margin-bottom: 20px; }
.card-header { padding: 18px 22px 12px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--border); }
.card-title { font-weight: 600; font-size: 14px; color: var(--earth); }

/* TIMELINE */
.timeline-list { padding: 8px 0; }
.timeline-item { display: flex; gap: 16px; padding: 12px 24px; transition: background 0.15s; cursor: pointer; position: relative; }
.timeline-item:hover { background: var(--sand); }
.timeline-item::after { content: ''; position: absolute; left: 36px; top: 52px; bottom: -12px; width: 2px; background: var(--border); }
.timeline-item:last-child::after { display: none; }
.tl-time { font-size: 11.5px; color: var(--earth-light); width: 45px; flex-shrink: 0; padding-top: 4px; }
.tl-dot { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0; position: relative; z-index: 1; border: 2px solid var(--cream); }
.tld-green { background: var(--sage-pale); }
.tld-amber { background: var(--amber-pale); }
.tld-red { background: var(--alert-red-pale); }
.tld-blue { background: var(--blue-pale); }
.tld-earth { background: var(--sand); }
.tl-content { flex: 1; min-width: 0; }
.tl-title { font-size: 13.5px; font-weight: 600; }
.tl-detail { font-size: 12.5px; color: var(--earth-mid); margin-top: 2px; line-height: 1.5; overflow-wrap: break-word; }
.tl-msg { margin-top: 8px; background: var(--sand); border-radius: 8px; padding: 10px 13px; font-size: 12.5px; color: var(--earth-mid); border-left: 3px solid var(--amber-light); font-style: italic; line-height: 1.5; overflow-wrap: break-word; }
.tl-msg.aurora { border-left-color: var(--sage-light); }

/* MED GRID */
.med-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
#resumo-med-grid { margin-top: 4px; }
.med-item { background: var(--cream); border-radius: 14px; border: 1px solid var(--border); padding: 18px 20px; display: flex; align-items: center; gap: 14px; box-shadow: var(--shadow); }
.med-icon { width: 46px; height: 46px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 22px; flex-shrink: 0; }
.mi-green { background: var(--sage-pale); }
.mi-amber { background: var(--amber-pale); }
.mi-red { background: var(--alert-red-pale); }
.mi-gray { background: var(--sand); }
.med-name { font-weight: 600; font-size: 14px; }
.med-dose { font-size: 12px; color: var(--earth-light); margin-top: 2px; }
.med-status { margin-top: 6px; font-size: 12px; font-weight: 600; }

/* ALERTAS */
.alert-item { display: flex; align-items: center; gap: 14px; padding: 14px 22px; border-bottom: 1px solid var(--border); cursor: pointer; transition: background 0.15s; }
.alert-item:last-child { border-bottom: none; }
.alert-item:hover { background: var(--sand); }
.alert-icon { width: 36px; height: 36px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 17px; flex-shrink: 0; }
.ai-red { background: var(--alert-red-pale); }
.ai-amber { background: var(--amber-pale); }
.ai-blue { background: var(--blue-pale); }
.ai-green { background: var(--sage-pale); }
.alert-content { flex: 1; min-width: 0; }
.alert-title { font-weight: 600; font-size: 13px; overflow-wrap: break-word; }
.alert-desc { font-size: 12px; color: var(--earth-light); margin-top: 2px; overflow-wrap: break-word; }
.alert-time { font-size: 11px; color: var(--earth-light); white-space: nowrap; flex-shrink: 0; }
.btn-resolver { padding: 5px 12px; border-radius: 6px; font-size: 12px; font-weight: 600; border: 1.5px solid var(--border); background: transparent; color: var(--sage); cursor: pointer; transition: all 0.15s; font-family: 'DM Sans', sans-serif; }
.btn-resolver:hover { background: var(--sage-pale); border-color: var(--sage); }
.alert-severidade { font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 4px; margin-left: 6px; vertical-align: middle; text-transform: uppercase; letter-spacing: 0.4px; }
.sev-baixa  { background: var(--blue-pale);        color: var(--blue); }
.sev-media  { background: var(--amber-pale);       color: #C0651A; }
.sev-alta   { background: var(--alert-red-pale);   color: var(--alert-red); }
.sev-critica { background: var(--alert-red);       color: white; }

/* EMERGENCY */
.emergency-banner { background: var(--alert-red-pale); border: 1.5px solid rgba(192,57,43,0.2); border-radius: 12px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.emergency-text { font-size: 13.5px; font-weight: 600; color: var(--alert-red); }
.emergency-sub { font-size: 12px; color: #8B2E23; margin-top: 2px; }
.btn-emergency { padding: 8px 18px; border-radius: 8px; border: none; background: var(--alert-red); color: white; font-size: 13px; font-weight: 600; cursor: pointer; font-family: 'DM Sans', sans-serif; white-space: nowrap; flex-shrink: 0; transition: background 0.15s; }
.btn-emergency:hover { background: #A93226; }

/* TESTE GRATIS BANNER */
.teste-gratis-banner { background: linear-gradient(135deg, #FFF8DC 0%, #FFE4B5 100%); border: 1.5px solid rgba(196, 154, 60, 0.3); border-radius: 12px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.teste-text { font-size: 13.5px; font-weight: 600; color: var(--amber); }
.teste-sub { font-size: 12px; color: #B8892E; margin-top: 2px; }
.btn-upgrade { padding: 8px 18px; border-radius: 8px; border: none; background: var(--amber); color: white; font-size: 13px; font-weight: 600; cursor: pointer; font-family: 'DM Sans', sans-serif; white-space: nowrap; flex-shrink: 0; transition: background 0.15s; }
.btn-upgrade:hover { background: #B8892E; }

/* CHECKLIST BANNER */
.checklist-banner { background: var(--sand); border: 1.5px solid var(--border); border-radius: 12px; padding: 16px 20px; margin-bottom: 20px; }
.checklist-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.checklist-title { font-size: 14px; font-weight: 600; color: var(--earth); }
.checklist-fechar { background: none; border: none; font-size: 16px; cursor: pointer; color: var(--earth-light); padding: 0; }
.checklist-items { display: flex; flex-direction: column; gap: 8px; }
.checklist-item { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--earth-light); }
.checklist-item.concluido { color: var(--sage); text-decoration: line-through; }
.checklist-item.concluido::before { content: '✓'; color: var(--sage); }
.checklist-item.pendente::before { content: '○'; color: var(--earth-light); }

/* MOOD CHART */
.mood-chart-wrap { padding: 20px 22px 12px; }
.mood-row { display: flex; align-items: flex-end; gap: 8px; height: 100px; }
.mood-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.mood-bar { width: 100%; border-radius: 5px 5px 0 0; min-height: 4px; }
.mood-day { font-size: 10px; color: var(--earth-light); margin-top: 4px; }
.mood-emoji { font-size: 14px; }

/* Legenda de cores do gráfico */
.mood-legenda { display: flex; gap: 16px; flex-wrap: wrap; padding: 0 22px 16px; }
.mood-leg-item { display: flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--earth-light); }
.mood-leg-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }

/* Layout de dois cards lado a lado na seção humor */
.humor-cards-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 700px) { .humor-cards-row { grid-template-columns: 1fr; } }

/* Card de tendência */
.tendencia-sem-dados { font-size: 13px; color: var(--earth-light); font-style: italic; }
.tendencia-barras { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.tendencia-barra-item { display: flex; align-items: center; gap: 8px; }
.tendencia-barra-label { font-size: 11.5px; color: var(--earth-light); width: 110px; flex-shrink: 0; }
.tendencia-barra-track { flex: 1; height: 8px; background: var(--border); border-radius: 4px; overflow: hidden; }
.tendencia-barra-fill { height: 100%; border-radius: 4px; transition: width 0.4s ease; }
.tendencia-barra-val { font-size: 11.5px; color: var(--earth-light); width: 34px; text-align: right; flex-shrink: 0; }

/* Chips de tópicos */
.topicos-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.topico-chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 5px 12px; border-radius: 20px;
  background: var(--sage-pale); color: var(--sage);
  font-size: 12.5px; font-weight: 500;
  border: 1px solid rgba(90,122,101,0.2);
}

/* Timeline de sentimentos */
.humor-tl-list { padding: 16px 22px; display: flex; flex-direction: column; gap: 0; }
.humor-tl-item { display: grid; grid-template-columns: 46px 20px 1fr; gap: 0 12px; align-items: flex-start; }
.humor-tl-hora { font-size: 11px; color: var(--earth-light); padding-top: 4px; text-align: right; }
.humor-tl-linha { display: flex; flex-direction: column; align-items: center; }
.humor-tl-linha::before { content: ''; width: 10px; height: 10px; border-radius: 50%; background: var(--border); border: 2px solid var(--earth-light); margin-top: 4px; flex-shrink: 0; }
.humor-tl-linha::after { content: ''; flex: 1; width: 2px; background: var(--border); margin-top: 4px; min-height: 20px; }
.humor-tl-item:last-child .humor-tl-linha::after { display: none; }
.humor-tl-corpo { padding-bottom: 18px; }
.humor-tl-texto { font-size: 13px; color: var(--earth-mid); margin-top: 6px; line-height: 1.5; }
.stl-chip { display: inline-flex; align-items: center; gap: 3px; padding: 3px 10px; border-radius: 12px; font-size: 11.5px; font-weight: 600; }
.stl-positivo    { background: var(--sage-pale);       color: var(--sage); }
.stl-neutro      { background: var(--sand);             color: var(--earth-light); }
.stl-negativo    { background: var(--amber-pale);       color: var(--amber); }
.stl-preocupante { background: var(--alert-red-pale);   color: var(--alert-red); }

/* Histórico mensal — grid */
.humor-mensal-loading { text-align: center; color: var(--earth-light); font-size: 13px; }
.humor-mensal-grid { display: grid; grid-template-columns: repeat(10, 1fr); gap: 6px; }
@media (max-width: 600px) { .humor-mensal-grid { grid-template-columns: repeat(6, 1fr); } }
.humor-mensal-cel {
  border-radius: 8px; padding: 6px 4px; text-align: center;
  cursor: pointer; transition: transform 0.15s, box-shadow 0.15s;
  user-select: none;
}
.humor-mensal-cel:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.hmc-emoji { font-size: 16px; line-height: 1.3; }
.hmc-label { font-size: 9px; color: var(--earth-light); margin-top: 2px; }

/* ── MEDICAMENTOS PAINEL ── */
.med-painel-layout { display: flex; gap: 24px; align-items: flex-start; }
.med-lista-col { width: 320px; flex-shrink: 0; display: flex; flex-direction: column; gap: 12px; }
.med-detalhe-col { flex: 1; min-width: 0; }
.med-lista-label { font-size: 11.5px; color: var(--earth-light); text-transform: uppercase; letter-spacing: 0.5px; font-weight: 600; margin-bottom: 2px; }
.btn-add-med-desktop { background: var(--amber); color: white; border: none; border-radius: 8px; padding: 8px 14px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.2s; }
.btn-add-med-desktop:hover { background: var(--amber-light); }

@media (max-width: 700px) {
  .btn-add-med-desktop { display: none; }
}

.med-summary-bar {
  background: var(--cream); border-radius: 16px; border: 1px solid var(--border);
  box-shadow: var(--shadow); padding: 18px 22px; margin-bottom: 20px;
}
.med-summary-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.med-summary-stats { display: flex; gap: 10px; }
.med-stat-box { border-radius: 10px; padding: 10px 16px; text-align: center; }
.med-stat-val { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 700; line-height: 1; }
.med-stat-label { font-size: 10.5px; font-weight: 600; margin-top: 3px; }
.day-prog-label { display: flex; justify-content: space-between; margin-bottom: 5px; font-size: 12px; color: var(--earth-light); }
.day-prog-bar { height: 8px; border-radius: 6px; background: var(--sand); overflow: hidden; }
.day-prog-fill { height: 100%; border-radius: 6px; background: var(--sage); transition: width 0.5s; }

.med-card {
  background: var(--cream); border-radius: 14px; padding: 16px 18px;
  cursor: pointer; transition: all 0.2s;
  border: 2px solid var(--border);
  box-shadow: 0 2px 8px rgba(61,43,31,0.06);
}
.med-card.selected { box-shadow: 0 4px 20px rgba(0,0,0,0.12); }
.med-card-top { display: flex; align-items: flex-start; gap: 12px; }
.med-card-icon { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
.med-card-info { flex: 1; min-width: 0; }
.med-card-nome { font-weight: 700; font-size: 14px; color: var(--earth); }
.med-card-dose { font-size: 12px; color: var(--earth-light); margin-top: 1px; }
.med-card-badges { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.med-badge { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 10px; }
.mb-ok { color: var(--sage); background: var(--sage-pale); }
.mb-miss { color: var(--alert-red); background: var(--alert-red-pale); }
.mb-pend { color: #C0651A; background: var(--amber-pale); }
.mb-stock { color: var(--alert-red); background: var(--alert-red-pale); }

.med-ring-wrap { position: relative; flex-shrink: 0; }
.med-ring-pct { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; }

.med-card-bottom { margin-top: 12px; }
.med-doses-label { display: flex; justify-content: space-between; margin-bottom: 5px; }
.med-doses-label span { font-size: 11px; color: var(--earth-light); }
.med-doses-bars { display: flex; gap: 4px; }
.med-dose-bar { flex: 1; height: 6px; border-radius: 4px; }

.med-add-placeholder {
  background: transparent; border-radius: 14px; border: 2px dashed var(--border);
  padding: 18px; cursor: pointer; text-align: center; color: var(--earth-light);
  transition: all 0.2s;
}
.med-add-placeholder:hover { border-color: var(--amber); color: var(--amber); }

/* ── Modal Adicionar Medicamento ── */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(30,18,10,0.45); z-index: 1000;
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.modal-box {
  background: var(--cream); border-radius: 20px; width: 100%; max-width: 540px;
  max-height: 88vh; display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(30,18,10,0.25); overflow: hidden;
  padding-bottom: 8px;
}
.modal-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 22px 24px 16px; border-bottom: 1px solid var(--border); flex-shrink: 0;
}
.modal-titulo { font-family: 'Playfair Display', serif; font-size: 20px; color: var(--earth); }
.modal-steps { display: flex; align-items: center; gap: 6px; margin-top: 5px; }
.modal-step { font-size: 12px; color: var(--earth-light); font-weight: 500; }
.modal-step.ativo { color: var(--amber); font-weight: 600; }
.modal-step-sep { font-size: 11px; color: var(--border); }
.modal-close {
  background: none; border: none; font-size: 18px; color: var(--earth-light);
  cursor: pointer; padding: 2px 6px; border-radius: 6px; line-height: 1;
}
.modal-close:hover { background: var(--sand); color: var(--earth); }
/* Etapa 1 */
#modal-etapa-1, #modal-etapa-2 { padding: 18px 24px 24px; overflow-y: auto; flex: 1; }
.modal-search-wrap { margin-bottom: 12px; }
.modal-search {
  width: 100%; box-sizing: border-box; padding: 10px 14px; border-radius: 10px;
  border: 1.5px solid var(--border); background: var(--sand); font-family: inherit;
  font-size: 14px; color: var(--earth); outline: none;
}
.modal-search:focus { border-color: var(--amber); }
.modal-cats { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 14px; }
.modal-cat-pill {
  padding: 5px 12px; border-radius: 20px; font-size: 12px; font-weight: 500;
  border: 1.5px solid var(--border); background: transparent; color: var(--earth-mid);
  cursor: pointer; transition: all 0.15s; white-space: nowrap;
}
.modal-cat-pill:hover { border-color: var(--amber-light); color: var(--amber); }
.modal-cat-pill.ativa { background: var(--amber-pale); border-color: var(--amber); color: var(--amber); font-weight: 600; }
.modal-catalog-list { display: flex; flex-direction: column; gap: 6px; }
.modal-loading { text-align: center; padding: 30px; color: var(--earth-light); font-size: 14px; }
.modal-catalog-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px; border-radius: 12px; border: 1.5px solid var(--border);
  background: var(--sand); cursor: pointer; transition: all 0.15s;
}
.modal-catalog-item:hover { border-color: var(--amber); background: var(--amber-pale); }
.modal-catalog-nome { font-size: 14px; font-weight: 600; color: var(--earth); }
.modal-catalog-detalhe { font-size: 12px; color: var(--earth-light); margin-top: 2px; }
.modal-catalog-cat { font-size: 11px; color: var(--sage); background: var(--sage-pale); padding: 2px 8px; border-radius: 10px; white-space: nowrap; }
.modal-empty { text-align: center; padding: 30px; color: var(--earth-light); font-size: 14px; }
/* Etapa 2 */
.modal-med-selecionada {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px;
  background: var(--sage-pale); border-radius: 12px; margin-bottom: 18px;
}
.modal-med-sel-nome { font-size: 15px; font-weight: 600; color: var(--sage); }
.modal-med-sel-dosagem { font-size: 12px; color: var(--earth-light); margin-top: 2px; }
.modal-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 18px; }
.modal-field { display: flex; flex-direction: column; gap: 5px; }
.modal-label { font-size: 12px; font-weight: 600; color: var(--earth-mid); text-transform: uppercase; letter-spacing: 0.4px; }
.modal-input {
  padding: 9px 12px; border-radius: 9px; border: 1.5px solid var(--border);
  background: var(--sand); font-family: inherit; font-size: 14px; color: var(--earth); outline: none;
}
.modal-input:focus { border-color: var(--amber); }
.modal-horarios-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.btn-add-horario {
  background: none; border: 1.5px solid var(--sage); color: var(--sage); font-family: inherit;
  font-size: 12px; font-weight: 600; padding: 5px 12px; border-radius: 8px; cursor: pointer; transition: all 0.15s;
}
.btn-add-horario:hover { background: var(--sage-pale); }
.modal-horarios-lista { display: flex; flex-direction: column; gap: 8px; min-height: 0; }
.modal-horario-row {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px;
  background: var(--sand); border-radius: 10px; border: 1.5px solid var(--border);
}
.modal-horario-row input[type="time"],
.modal-horario-row select {
  padding: 6px 10px; border-radius: 8px; border: 1.5px solid var(--border);
  background: var(--cream); font-family: inherit; font-size: 13px; color: var(--earth); outline: none; flex: 1;
}
.modal-horario-row input[type="time"]:focus,
.modal-horario-row select:focus { border-color: var(--amber); }
.btn-rem-horario {
  background: none; border: none; color: var(--earth-light); font-size: 16px;
  cursor: pointer; padding: 2px 6px; border-radius: 6px; line-height: 1; flex-shrink: 0;
}
.btn-rem-horario:hover { background: rgba(200,80,80,0.1); color: #C85050; }
.modal-horario-periodo {
  padding: 6px 10px; border-radius: 8px; border: 1.5px solid var(--border);
  background: var(--cream); font-family: inherit; font-size: 13px; color: var(--earth);
  min-width: 110px; text-align: center;
}
.modal-horarios-empty { font-size: 13px; color: var(--earth-light); padding: 10px 0; text-align: center; }
.modal-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 22px; padding: 18px 22px; border-top: 1px solid var(--border); margin-left: -8px; margin-right: -8px; }
.modal-btn-sec {
  background: none; border: 1.5px solid var(--border); color: var(--earth-mid); font-family: inherit;
  font-size: 14px; font-weight: 500; padding: 10px 18px; border-radius: 10px; cursor: pointer; transition: all 0.15s;
}
.modal-btn-sec:hover { border-color: var(--earth-mid); }
.modal-btn-pri {
  background: var(--amber); border: none; color: #fff; font-family: inherit;
  font-size: 14px; font-weight: 600; padding: 10px 22px; border-radius: 10px; cursor: pointer; transition: all 0.15s;
}
.modal-btn-pri:hover { background: var(--amber-light); }
.modal-btn-pri:disabled { opacity: 0.6; cursor: not-allowed; }

/* Botões de ação nas dose-rows */
.btn-confirmar-dose, .btn-reenviar {
  padding: 6px 14px; border-radius: 8px; font-size: 12px; font-weight: 600;
  cursor: pointer; font-family: inherit; white-space: nowrap; transition: all 0.15s;
}
.btn-confirmar-dose {
  background: var(--sage); border: none; color: #fff;
}
.btn-confirmar-dose:hover { background: var(--sage-light); }
.btn-confirmar-dose:disabled { opacity: 0.6; cursor: not-allowed; }
.btn-reenviar {
  background: transparent; border: 1.5px solid var(--border); color: var(--earth-mid);
}
.btn-reenviar:hover { border-color: var(--amber-light); color: var(--amber); }
.btn-notificar-familia {
  background: var(--alert-red); border: none; color: #fff;
}
.btn-notificar-familia:hover { opacity: 0.88; }
.btn-notificar-familia:disabled { opacity: 0.6; cursor: not-allowed; }

/* Botão voltar (master→detail no mobile) */
.med-voltar-btn {
  display: none;
  align-items: center; gap: 6px;
  background: none; border: none; cursor: pointer;
  font-family: 'DM Sans', sans-serif; font-size: 14px; font-weight: 600;
  color: var(--amber); padding: 0 0 14px 0; transition: opacity 0.15s;
}
.med-voltar-btn:hover { opacity: 0.75; }


/* Detail panel */
.med-detail-empty { display: flex; align-items: center; justify-content: center; height: 300px; color: var(--earth-light); font-size: 15px; }

.med-detail-header {
  background: var(--cream); border-radius: 16px; border: 1px solid var(--border);
  padding: 22px 24px; margin-bottom: 16px; box-shadow: 0 2px 12px rgba(61,43,31,0.07);
}
.med-detail-header-top { display: flex; align-items: center; gap: 16px; }
.med-detail-big-icon { width: 56px; height: 56px; border-radius: 16px; display: flex; align-items: center; justify-content: center; font-size: 28px; flex-shrink: 0; }
.med-detail-nome { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 700; color: var(--earth); }
.med-detail-sub { font-size: 13px; color: var(--earth-light); margin-top: 3px; }
.med-detail-instrucoes { margin-top: 16px; padding: 12px 14px; background: var(--sand); border-radius: 10px; font-size: 13px; color: var(--earth-mid); border-left: 3px solid var(--amber-light); }

.med-section-card {
  background: var(--cream); border-radius: 16px; border: 1px solid var(--border);
  margin-bottom: 16px; box-shadow: 0 2px 12px rgba(61,43,31,0.07); overflow: hidden;
}
.med-section-header { padding: 16px 22px 12px; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }
.med-section-title { font-weight: 600; font-size: 14px; }

.dose-row {
  display: flex; align-items: center; gap: 16px; padding: 14px 22px;
  border-bottom: 1px solid var(--border);
}
.dose-row:last-child { border-bottom: none; }
.dose-circle { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; border: 2px solid var(--border); }
.dose-info { flex: 1; }
.dose-time { font-weight: 600; font-size: 14px; }
.dose-status { font-size: 12px; margin-top: 2px; }
.dose-msg { margin-top: 8px; background: var(--sand); border-radius: 8px; padding: 8px 12px; font-size: 12.5px; color: var(--earth-mid); border-left: 3px solid var(--amber-light); font-style: italic; }

.stock-bar-wrap { padding: 16px 22px; }
.stock-numbers { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: 13px; color: var(--earth-mid); }
.stock-bar { height: 10px; border-radius: 6px; background: var(--sand); overflow: hidden; border: 1px solid var(--border); }
.stock-bar-fill { height: 100%; border-radius: 6px; transition: width 0.5s; }
.stock-pct-row { display: flex; justify-content: space-between; margin-top: 6px; font-size: 11px; color: var(--earth-light); }

.week-cal { padding: 16px 22px; }
.week-cal-grid { display: flex; gap: 6px; }
.week-cal-day { flex: 1; text-align: center; }
.week-cal-label { font-size: 10.5px; color: var(--earth-light); margin-bottom: 6px; }
.week-cal-cell { aspect-ratio: 1; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 14px; border: 2px solid transparent; }
.week-cal-legend { margin-top: 14px; display: flex; gap: 16px; font-size: 11.5px; color: var(--earth-light); }
.week-cal-legend span { display: flex; align-items: center; gap: 5px; }
.week-legend-dot { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.streak-card {
  background: linear-gradient(135deg, var(--earth) 0%, #5A3D2B 100%);
  border-radius: 14px; padding: 18px 22px; color: white;
  margin-bottom: 16px; position: relative; overflow: hidden;
}
.streak-card::before { content: '🔥'; position: absolute; right: 16px; top: 10px; font-size: 60px; opacity: 0.08; }
.streak-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.7px; color: var(--amber-light); margin-bottom: 6px; font-weight: 600; }
.streak-text { font-size: 14px; color: rgba(255,255,255,0.88); line-height: 1.6; }

/* RELATÓRIO */
.relatorio-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.relatorio-stat { background: var(--sand); border-radius: 12px; padding: 18px 20px; border: 1px solid var(--border); }
.rs-val { font-family: 'Playfair Display', serif; font-size: 32px; font-weight: 700; color: var(--earth); }
.rs-label { font-size: 12px; color: var(--earth-light); margin-top: 4px; }
.rs-bar { height: 6px; border-radius: 6px; background: var(--border); overflow: hidden; margin-top: 12px; }
.rs-bar-fill { height: 100%; border-radius: 6px; background: var(--amber); }

/* BADGE */
.badge { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 20px; font-size: 11.5px; font-weight: 600; }
.badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.badge-green { background: var(--sage-pale); color: var(--sage); }
.badge-amber { background: var(--amber-pale); color: #C0651A; }
.badge-red { background: var(--alert-red-pale); color: var(--alert-red); }
.badge-gray { background: var(--sand); color: var(--earth-light); }

/* LOADING */
.loading-overlay { display: none; position: fixed; inset: 0; background: rgba(253,250,246,0.85); z-index: 200; align-items: center; justify-content: center; flex-direction: column; gap: 12px; }
.loading-overlay.ativo { display: flex; }
.spinner { width: 40px; height: 40px; border: 3px solid var(--border); border-top-color: var(--amber); border-radius: 50%; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* EMPTY STATE */
.empty-state { padding: 40px; text-align: center; color: var(--earth-light); font-size: 14px; }
.empty-icon { font-size: 32px; margin-bottom: 12px; }

/* SCROLL */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 5px; }

/* ── HAMBURGER (oculto no desktop e nas telas de seleção) ── */
.nav-hamburger {
  display: none;
  background: none; border: none; cursor: pointer;
  padding: 6px; border-radius: 8px; color: rgba(255,255,255,0.8);
  font-size: 20px; line-height: 1; transition: background 0.15s;
  flex-shrink: 0;
  /* touch target mínimo */
  min-width: 44px; min-height: 44px;
  align-items: center; justify-content: center;
}
.nav-hamburger:hover { background: rgba(255,255,255,0.1); }

/* ── BOTTOM NAVIGATION (mobile only) ── */
.bottom-nav {
  display: none; /* JS mostra quando dashboard está ativo */
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 90;
  background: var(--cream);
  border-top: 1px solid var(--border);
  box-shadow: 0 -2px 16px rgba(61,43,31,0.10);
  /* safe area para iPhones com Home Indicator */
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
/* só renderiza em mobile */
@media (min-width: 701px) {
  .bottom-nav { display: none !important; }
}
@media (max-width: 700px) {
  .bottom-nav { display: flex; } /* JS pode sobrescrever com display:none antes do login */
}
.bnav-item {
  flex: 1;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 3px;
  padding: 10px 4px;
  border: none; background: none;
  cursor: pointer;
  position: relative;
  min-height: 56px;
  font-family: 'DM Sans', sans-serif;
  color: var(--earth-light);
  transition: color 0.15s;
  -webkit-tap-highlight-color: transparent;
}
.bnav-item.active { color: var(--amber); }
.bnav-item.active .bnav-icon { transform: scale(1.08); }
.bnav-icon { font-size: 22px; line-height: 1; transition: transform 0.15s; }
.bnav-label {
  font-size: 10px; font-weight: 600;
  letter-spacing: 0.2px; line-height: 1;
}
.bnav-badge {
  position: absolute;
  top: 7px; left: 50%;
  transform: translateX(4px);
  background: var(--alert-red);
  color: white;
  font-size: 9px; font-weight: 700;
  padding: 1px 5px; border-radius: 10px;
  min-width: 16px; text-align: center; line-height: 1.5;
  pointer-events: none;
}
.bnav-badge:empty { display: none; }

/* ── SIDEBAR BACKDROP ── */
.sidebar-backdrop {
  display: none; position: fixed; inset: 0; z-index: 49;
  background: rgba(30,18,10,0.45);
}
.sidebar-backdrop.ativo { display: block; }

/* ── TABLET (até 1024px) ── */
@media (max-width: 1024px) {
  .family-layout { grid-template-columns: 220px 1fr; }
  .family-main { padding: 20px 20px; }
  .med-painel-layout { flex-direction: column; }
  .med-lista-col { width: 100%; }
  .relatorio-grid { grid-template-columns: 1fr 1fr; }
}

/* ── MOBILE (até 700px) ── */
@media (max-width: 700px) {
  /* Nav */
  .nav { padding: 0 14px; gap: 0; }
  .nav-hamburger { display: flex; align-items: center; justify-content: center; margin-right: 8px; }
  .nav-logo { font-size: 18px; flex: 1; }
  .nav-nome-assistido { display: none; }

  /* Selection screens */
  .selecao-titulo { font-size: 22px; }
  #tela-selecao, #tela-selecao-membro { padding: 24px 16px; align-items: flex-start; padding-top: 32px; }
  .assistido-card { padding: 14px 16px; gap: 12px; }
  .ac-avatar { width: 42px; height: 42px; font-size: 16px; }

  /* Layout: sidebar vira drawer */
  .family-layout { grid-template-columns: 1fr; }
  .family-sidebar {
    position: fixed; left: 0; top: 60px;
    height: calc(100vh - 60px);
    width: 280px; z-index: 50;
    transform: translateX(-100%);
    transition: transform 0.28s cubic-bezier(0.4,0,0.2,1);
    box-shadow: 4px 0 24px rgba(30,18,10,0.18);
  }
  .family-sidebar.aberta { transform: translateX(0); }
  /* Espaço extra para o bottom nav (56px fixo + safe area) */
  .family-main {
    padding: 16px;
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
  }

  /* Header */
  .family-header { flex-direction: column; gap: 10px; align-items: flex-start; }
  .page-title { font-size: 22px; }
  .page-subtitle { font-size: 12px; }

  /* Date nav — touch target mínimo */
  .date-btn { min-width: 44px; min-height: 44px; }

  /* Date nav */
  .date-nav { align-self: flex-end; }

  /* Week strip */
  .week-strip { overflow-x: auto; padding-bottom: 6px; -webkit-overflow-scrolling: touch; }
  .week-day { min-width: 0; flex-shrink: 0; padding: 10px 6px; }
  .week-day.sem-dados .wd-score { display: none}
  .wd-emoji { font-size: 16px; }

  /* Grids */
  .health-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .med-grid { grid-template-columns: 1fr; }
  .relatorio-grid { grid-template-columns: 1fr; }
  .med-summary-top { flex-direction: column; align-items: flex-start; gap: 10px; }
  .med-summary-stats { gap: 6px; flex-wrap: wrap; }
  .med-stat-box { padding: 8px 10px; }
  .med-stat-val { font-size: 18px; }

  /* Med painel — navegação master/detail */
  .med-painel-layout { flex-direction: column; }
  .med-lista-col { width: 100%; }
  #med-detalhe-col { display: none; }
  .med-voltar-btn { display: none; }

  /* Emergency banner */
  .emergency-banner { flex-direction: column; gap: 10px; align-items: flex-start; }
  .btn-emergency { width: 100%; text-align: center; }

  /* Containment: garante que nenhum filho ultrapasse a largura da tela */
  .family-main { max-width: 100%; }
  .secao.ativa { max-width: 100%; overflow-x: hidden; }

  /* Page title */
  .page-title { overflow-wrap: break-word; }
  .page-subtitle { overflow-wrap: break-word; }

  /* Daily summary */
  .daily-summary { padding: 16px; }
  .summary-title { font-size: 17px; }

  /* Cards */
  .card-header { padding: 14px 16px 10px; }
  .timeline-item { padding: 10px 16px; gap: 12px; }
  .timeline-item::after { left: 28px; }
  .dose-row { padding: 12px 16px; gap: 12px; flex-wrap: wrap; }
  .dose-row .btn-confirmar-dose,
  .dose-row .btn-reenviar,
  .dose-row .btn-notificar-familia { font-size: 11px; padding: 5px 10px; }

  /* AI summary */
  .ai-summary { padding: 14px 16px; }
  .ai-summary-text { font-size: 13px; }

  /* Modal */
  .modal-overlay { padding: 0; align-items: flex-end; }
  .modal-box { border-radius: 20px 20px 0 0; max-height: 92vh; padding-bottom: 12px; }
  .modal-form-grid { grid-template-columns: 1fr; }

  /* Med painel mobile: lista ocupa tela toda, sem coluna de detalhe */
  #med-detalhe-col { display: none !important; }
  .med-voltar-btn { display: none !important; }
}

/* ── Bottom Sheet: Detalhe do Medicamento ── */
.med-bs-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(30,18,10,0.45); z-index: 200;
}
.med-bs-overlay.ativo { display: block; }

.med-bottom-sheet {
  position: fixed; bottom: 0; left: 0; right: 0;
  background: var(--cream); border-radius: 20px 20px 0 0;
  box-shadow: 0 -8px 40px rgba(30,18,10,0.2);
  z-index: 201; max-height: 90vh; overflow-y: auto;
  transform: translateY(100%);
  transition: transform 0.32s cubic-bezier(0.4,0,0.2,1);
  -webkit-overflow-scrolling: touch;
}
.med-bottom-sheet.ativo { transform: translateY(0); }

.med-bs-handle-wrap {
  position: relative; padding: 10px 0 2px; text-align: center; flex-shrink: 0;
}
.med-bs-fechar-btn {
  position: absolute; top: 8px; right: 14px;
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--border); border: none; cursor: pointer;
  font-size: 14px; color: var(--earth-mid); transition: background 0.15s;
}
.med-bs-fechar-btn:hover { background: var(--amber-pale); color: var(--amber); }
.med-bs-handle {
  display: inline-block; width: 40px; height: 4px;
  background: var(--border); border-radius: 2px;
}
.med-bs-content { padding: 4px 16px 40px; }

/* Em desktop, nunca mostrar o bottom sheet */
@media (min-width: 701px) {
  .med-bs-overlay,
  .med-bottom-sheet { display: none !important; }
}

/* ── Histórico de Resumos (Relatório) ── */
.historico-resumo-item {
  padding: 16px 22px; border-bottom: 1px solid var(--border);
}
.historico-resumo-item:last-of-type { border-bottom: none; }
.historico-resumo-data {
  font-size: 12px; color: var(--earth-light); margin-bottom: 8px; font-weight: 600;
}
.historico-resumo-texto {
  font-size: 14px; line-height: 1.7; color: var(--earth-mid); margin-bottom: 10px;
}
.historico-resumo-badges { display: flex; gap: 8px; flex-wrap: wrap; }

/* ── Botão "Carregar mais" (genérico, Conversas e Relatório) ── */
.btn-load-more {
  display: block; width: 100%; margin: 12px 0;
  padding: 11px 16px; border-radius: 10px;
  border: 1.5px dashed var(--border);
  background: transparent; color: var(--earth-light);
  font-size: 13px; font-weight: 600; font-family: 'DM Sans', sans-serif;
  text-align: center; cursor: pointer; transition: all 0.18s;
}
.btn-load-more:hover { border-color: var(--amber); color: var(--amber); background: var(--amber-pale); }

/* ═══════════════════════════════════════════════════════════════
   AGENDAMENTOS
   ═══════════════════════════════════════════════════════════════ */

/* Barra de filtros */
.agend-filtros-bar {
  display: flex; flex-direction: column; gap: 10px;
  background: var(--cream); border-radius: 14px;
  border: 1px solid var(--border); padding: 14px 16px;
  margin-bottom: 16px; box-shadow: var(--shadow);
}
.agend-tabs { display: flex; gap: 4px; }
.agend-tab {
  padding: 7px 18px; border-radius: 20px; border: none; cursor: pointer;
  font-size: 13px; font-weight: 600; font-family: 'DM Sans', sans-serif;
  background: transparent; color: var(--earth-light); transition: all 0.18s;
}
.agend-tab.ativo { background: var(--earth); color: var(--cream); }
.agend-tab:not(.ativo):hover { background: var(--sand); color: var(--earth); }

.agend-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.agend-tipo-chip {
  padding: 5px 14px; border-radius: 20px; border: 1.5px solid var(--border);
  cursor: pointer; font-size: 12px; font-weight: 600; font-family: 'DM Sans', sans-serif;
  background: transparent; color: var(--earth-light); transition: all 0.18s;
}
.agend-tipo-chip.ativo { background: var(--amber-pale); border-color: var(--amber); color: #C0651A; }
.agend-tipo-chip:not(.ativo):hover { background: var(--sand); color: var(--earth); }

/* Card de agendamento */
.agend-card {
  background: var(--cream); border-radius: 14px;
  border: 1.5px solid var(--border); box-shadow: 0 2px 8px rgba(61,43,31,0.06);
  padding: 14px 16px; margin-bottom: 10px;
  display: flex; align-items: center; gap: 14px;
  cursor: pointer; transition: all 0.18s;
}
.agend-card:hover { border-color: var(--amber); transform: translateY(-1px); box-shadow: var(--shadow); }
.agend-card.selecionado { border-color: var(--amber); box-shadow: 0 4px 20px rgba(232,131,74,0.18); }

.agend-card-icon {
  width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 22px;
  background: var(--amber-pale);
}
.agend-card-info { flex: 1; min-width: 0; }
.agend-card-nome { font-weight: 700; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.agend-card-sub { font-size: 12px; color: var(--earth-light); margin-top: 3px; }
.agend-card-data { text-align: right; flex-shrink: 0; }
.agend-card-data-txt { font-size: 12px; font-weight: 600; color: var(--earth-mid); white-space: nowrap; }

/* Badge de status */
.agend-badge {
  display: inline-block; padding: 3px 9px; border-radius: 20px;
  font-size: 11px; font-weight: 600; margin-top: 5px;
}
.agend-badge-agendado  { background: var(--amber-pale); color: #C0651A; }
.agend-badge-confirmado { background: var(--blue-pale); color: var(--blue); }
.agend-badge-realizado  { background: var(--sage-pale); color: var(--sage); }
.agend-badge-cancelado  { background: var(--sand); color: var(--earth-light); }
.agend-badge-remarcado  { background: var(--amber-pale); color: #C0651A; }

/* Painel de detalhe (desktop, inline na coluna) */
.agend-detalhe-col {
  flex: 1; min-width: 0;
  background: var(--cream); border-radius: 14px;
  border: 1px solid var(--border); box-shadow: var(--shadow);
  padding: 22px; overflow-y: auto;
}
.agend-detalhe-empty { text-align: center; padding: 60px 20px; color: var(--earth-light); font-size: 14px; }
.agend-painel-layout { display: flex; gap: 20px; align-items: flex-start; }
.agend-lista-col { width: 360px; flex-shrink: 0; }

.agend-detalhe-header { margin-bottom: 18px; }
.agend-detalhe-titulo { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 700; }
.agend-detalhe-sub { font-size: 13px; color: var(--earth-light); margin-top: 4px; }
.agend-detalhe-campo { margin-bottom: 12px; }
.agend-detalhe-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.6px; color: var(--earth-light); margin-bottom: 4px; }
.agend-detalhe-val { font-size: 14px; font-weight: 500; }
.agend-detalhe-acoes { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border); }
.agend-btn-acao {
  padding: 9px 16px; border-radius: 10px; border: none; cursor: pointer;
  font-size: 13px; font-weight: 600; font-family: 'DM Sans', sans-serif; transition: all 0.18s;
}
.agend-btn-confirmar { background: var(--blue-pale); color: var(--blue); }
.agend-btn-confirmar:hover { background: var(--blue); color: white; }
.agend-btn-realizar { background: var(--sage-pale); color: var(--sage); }
.agend-btn-realizar:hover { background: var(--sage); color: white; }
.agend-btn-cancelar { background: var(--alert-red-pale); color: var(--alert-red); }
.agend-btn-cancelar:hover { background: var(--alert-red); color: white; }

/* Botão adicionar */
.agend-add-placeholder {
  border: 2px dashed var(--border); border-radius: 14px;
  padding: 22px; text-align: center; cursor: pointer;
  color: var(--earth-light); margin-top: 12px; transition: all 0.2s;
}
.agend-add-placeholder:hover { border-color: var(--amber); color: var(--amber); background: var(--amber-pale); }

/* Bottom Sheet: Agendamentos */
.agend-bs-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(30,18,10,0.45); z-index: 200;
}
.agend-bs-overlay.ativo { display: block; }

.agend-bottom-sheet {
  position: fixed; bottom: 0; left: 0; right: 0;
  background: var(--cream); border-radius: 20px 20px 0 0;
  box-shadow: 0 -8px 40px rgba(30,18,10,0.2);
  z-index: 201; max-height: 90vh; overflow-y: auto;
  transform: translateY(100%);
  transition: transform 0.32s cubic-bezier(0.4,0,0.2,1);
  -webkit-overflow-scrolling: touch;
}
.agend-bottom-sheet.ativo { transform: translateY(0); }
.agend-bs-content { padding: 4px 16px 40px; }

/* Desktop: esconder bottom sheet de agendamentos */
@media (min-width: 701px) {
  .agend-bs-overlay,
  .agend-bottom-sheet { display: none !important; }
  .agend-lista-col { width: 320px; }
}

/* Mobile: ajustes */
@media (max-width: 700px) {
  .agend-painel-layout { flex-direction: column; }
  .agend-lista-col { width: 100%; }
  .agend-detalhe-col { display: none; }
  .agend-add-placeholder { margin-bottom: 80px; }
}

/* ── Widget de agendamentos no dashboard (resumo) ─────────────────────────── */
#agend-widget {
  margin-top: 16px;
}
.agend-widget-titulo {
  font-size: 13px;
  font-weight: 600;
  color: var(--earth-light);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 8px;
}
.agend-widget-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: var(--sand);
  border-radius: 10px;
  margin-bottom: 8px;
  cursor: pointer;
  transition: background 0.15s;
}
.agend-widget-card:last-child { margin-bottom: 0; }
.agend-widget-card:hover { background: var(--border); }
.agend-widget-icon { font-size: 20px; flex-shrink: 0; }
.agend-widget-info { min-width: 0; }
.agend-widget-nome {
  font-size: 14px;
  font-weight: 500;
  color: var(--earth);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.agend-widget-data {
  font-size: 12px;
  color: var(--earth-light);
  margin-top: 2px;
}

/* ═══════════════════════════════════════════════════════════════
   SINAIS VITAIS
   ═══════════════════════════════════════════════════════════════ */

/* Grid de cards de resumo por tipo */
.sv-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

.sv-card {
  background: var(--cream);
  border-radius: 16px;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  padding: 18px 16px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
  transition: all 0.18s;
}
.sv-card:hover { border-color: var(--amber-light); transform: translateY(-1px); }
.sv-card.alerta { border-color: var(--alert-red); background: var(--alert-red-pale); }

.sv-card-header { display: flex; align-items: center; justify-content: space-between; }
.sv-card-icon { font-size: 22px; }
.sv-card-tipo {
  font-size: 10.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.5px; color: var(--earth-light);
}
.sv-card-valor {
  font-family: 'Playfair Display', serif;
  font-size: 36px; font-weight: 700; color: var(--earth);
  line-height: 1.1;
}
.sv-card-unidade { font-size: 12px; color: var(--earth-light); }
.sv-card-variacao {
  font-size: 11px; font-weight: 600; display: flex; align-items: center; gap: 4px;
}
.sv-var-alta { color: var(--alert-red); }
.sv-var-baixa { color: var(--sage); }
.sv-var-igual { color: var(--earth-light); }
.sv-card-vazio { color: var(--earth-light); font-size: 13px; padding: 6px 0; }

/* Mini gráfico de linha (CSS puro) */
.sv-mini-grafico {
  margin-top: 8px;
  height: 32px;
  display: flex;
  align-items: flex-end;
  gap: 3px;
}
.sv-mini-barra {
  flex: 1;
  border-radius: 3px 3px 0 0;
  min-height: 4px;
  background: var(--amber-light);
  opacity: 0.6;
  transition: opacity 0.15s;
}
.sv-mini-barra:last-child { opacity: 1; }
.sv-card.alerta .sv-mini-barra { background: var(--alert-red); }

/* Barra de filtros */
.sv-filtros-bar {
  background: var(--cream); border-radius: 14px;
  border: 1px solid var(--border); padding: 14px 16px;
  margin-bottom: 16px; box-shadow: var(--shadow);
  display: flex; flex-direction: column; gap: 10px;
}
.sv-filtros-tipos { display: flex; gap: 6px; flex-wrap: wrap; }
.sv-tipo-chip {
  padding: 5px 14px; border-radius: 20px; border: 1.5px solid var(--border);
  cursor: pointer; font-size: 12px; font-weight: 600; font-family: 'DM Sans', sans-serif;
  background: transparent; color: var(--earth-light); transition: all 0.18s;
}
.sv-tipo-chip.ativo { background: var(--amber-pale); border-color: var(--amber); color: #C0651A; }
.sv-tipo-chip:not(.ativo):hover { background: var(--sand); color: var(--earth); }

.sv-filtros-data {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.sv-data-label { font-size: 12px; color: var(--earth-light); font-weight: 600; }
.sv-data-input { padding: 6px 10px !important; font-size: 13px !important; width: auto; }

/* Linha de registro */
.sv-item {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 22px; border-bottom: 1px solid var(--border);
  transition: background 0.15s;
}
.sv-item:last-child { border-bottom: none; }
.sv-item:hover { background: var(--sand); }
.sv-item-icon {
  width: 38px; height: 38px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; flex-shrink: 0;
  background: var(--amber-pale);
}
.sv-item-info { flex: 1; min-width: 0; }
.sv-item-tipo {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.5px; color: var(--earth-light); margin-bottom: 2px;
}
.sv-item-valor { font-size: 15px; font-weight: 700; color: var(--earth); }
.sv-item-obs { font-size: 12px; color: var(--earth-light); margin-top: 2px; }
.sv-item-meta {
  text-align: right; flex-shrink: 0;
  display: flex; flex-direction: column; align-items: flex-end; gap: 6px;
}
.sv-item-data { font-size: 11px; color: var(--earth-light); }
.sv-item-via {
  font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 10px;
  background: var(--sand); color: var(--earth-light);
}
.sv-item-via.whatsapp { background: var(--sage-pale); color: var(--sage); }
.sv-btn-del {
  background: none; border: none; color: var(--earth-light); font-size: 14px;
  cursor: pointer; padding: 4px 6px; border-radius: 6px; transition: all 0.15s;
}
.sv-btn-del:hover { background: var(--alert-red-pale); color: var(--alert-red); }

/* Botão adicionar */
.sv-add-placeholder {
  background: transparent; border-radius: 14px; border: 2px dashed var(--border);
  padding: 22px; cursor: pointer; text-align: center; color: var(--earth-light);
  transition: all 0.2s; margin-top: 12px;
}
.sv-add-placeholder:hover { border-color: var(--amber); color: var(--amber); background: var(--amber-pale); }

/* Modal de adicionar sinal */
.sv-chips-modal {
  display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 4px;
}

/* Mobile */
@media (max-width: 700px) {
  .sv-cards-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .sv-card-valor { font-size: 22px; }
  .sv-item { padding: 10px 16px; gap: 10px; }
  .sv-filtros-data { flex-direction: column; align-items: flex-start; }
}

/* ═══════════════════════════════════════════════════════════════════
   RESUMO DO DIA — NOVA VERSÃO
   ═══════════════════════════════════════════════════════════════════ */

/* Aurora Summary Card */
.resumo-aurora {
  background: linear-gradient(135deg, var(--earth) 0%, #5A3D2B 100%);
  border-radius: 16px; padding: 22px 26px; color: white;
  position: relative; overflow: hidden; margin-bottom: 20px;
  box-shadow: 0 4px 24px rgba(61,43,31,0.18);
}
.resumo-aurora::before {
  content: '✦'; position: absolute; right: 24px; top: 16px;
  font-size: 72px; opacity: 0.07; pointer-events: none;
}
.resumo-aurora-meta {
  display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap;
}
.resumo-aurora-tag {
  font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.8px;
  color: var(--amber-light); font-weight: 700;
  background: rgba(232,131,74,0.18); padding: 3px 10px; border-radius: 20px;
}
.resumo-aurora-nome {
  font-family: 'Playfair Display', serif; font-size: 16px;
  color: rgba(255,255,255,0.85); font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;
}
.resumo-aurora-texto {
  font-size: 14px; line-height: 1.75; color: rgba(255,255,255,0.82);
  overflow-wrap: break-word;
}

/* Stats Row */
.resumo-stats-row {
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 12px; margin-bottom: 20px;
}
.rstat {
  background: var(--cream); border-radius: 14px; padding: 14px 16px;
  border: 1.5px solid var(--border); box-shadow: var(--shadow);
  display: flex; align-items: center; gap: 12px; transition: all 0.2s;
  cursor: pointer;
}
#rstat-agendamentos-card {
    min-width: 0; 
    width: 100%;
    box-sizing: border-box;
}
.rstat.rstat-ok    { background: var(--sage-pale);      border-color: rgba(90,122,101,0.25); }
.rstat.rstat-warn  { background: var(--amber-pale);     border-color: rgba(232,131,74,0.25); }
.rstat.rstat-alert { background: var(--alert-red-pale); border-color: rgba(192,57,43,0.25); }
.rstat-icon { font-size: 28px; flex-shrink: 0; line-height: 1; }
.rstat-info { flex: 1; min-width: 0;  }
.rstat-label {
  font-size: 10px; text-transform: uppercase; letter-spacing: 0.6px;
  color: var(--earth-light); font-weight: 600;
}
.rstat-val {
  font-size: 14px; font-weight: 700; margin-top: 3px; color: var(--earth);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
      white-space: normal !important;
    word-break: break-word;
}

/* Content Grid */
.resumo-grid {
  display: grid; grid-template-columns: 2fr 1fr;
  gap: 20px; align-items: start;
}
.resumo-col-main,
.resumo-col-side { display: flex; flex-direction: column; gap: 20px; }

/* Link button */
.resumo-link-btn {
  background: none; border: none; font-size: 12px; font-weight: 600;
  color: var(--earth-light); cursor: pointer; font-family: 'DM Sans', sans-serif;
  padding: 4px 10px; border-radius: 8px; transition: all 0.15s; white-space: nowrap;
}
.resumo-link-btn:hover { color: var(--amber); background: var(--amber-pale); }

/* Medications list in resumo */
.resumo-med-item {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 22px; border-bottom: 1px solid var(--border);
  transition: background 0.15s;
}
.resumo-med-item:last-child { border-bottom: none; }
.resumo-med-item:hover { background: var(--sand); }
.resumo-med-info { flex: 1; min-width: 0; }
.resumo-med-nome { font-size: 14px; font-weight: 600; color: var(--earth); }
.resumo-med-dose { font-size: 12px; color: var(--earth-light); margin-top: 1px; }
.resumo-med-doses { margin-top: 7px; display: flex; flex-wrap: wrap; gap: 5px; }
.rdose-pill {
  font-size: 11px; font-weight: 600; padding: 2px 9px; border-radius: 10px; white-space: nowrap;
}
.rdose-ok    { background: var(--sage-pale);      color: var(--sage); }
.rdose-alert { background: var(--alert-red-pale); color: var(--alert-red); }
.rdose-pend  { background: var(--amber-pale);     color: #C0651A; }

/* Humor in resumo */
.resumo-humor-body { padding: 18px 22px 4px; }
.rhumor-main { display: flex; align-items: flex-start; gap: 16px; }
.rhumor-emoji { font-size: 48px; line-height: 1; flex-shrink: 0; }
.rhumor-info { flex: 1; min-width: 0; }
.rhumor-texto { font-size: 20px; font-weight: 700; color: var(--earth); margin-top: 2px; }
.rhumor-status { font-size: 12.5px; font-weight: 600; margin-top: 3px; }
.rhumor-score-bar {
  height: 5px; border-radius: 4px; background: var(--border); overflow: hidden; margin-top: 10px;
}
.rhumor-score-fill { height: 100%; border-radius: 4px; transition: width 0.5s ease; }
.rhumor-score-label { font-size: 11px; color: var(--earth-light); margin-top: 4px; }

/* Mini chart */
.resumo-mini-chart {
  padding: 12px 22px 16px;
  border-top: 1px solid var(--border);
}
.rhumor-chart-label {
  font-size: 10px; color: var(--earth-light);
  text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 10px;
}
.rhumor-chart { display: flex; align-items: flex-end; gap: 5px; height: 68px; }
.rhumor-bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; }
.rhumor-bar-col.ativo .rhumor-bar { box-shadow: 0 0 0 2px var(--amber); }
.rhumor-bar-emoji { font-size: 11px; line-height: 1; min-height: 14px; }
.rhumor-bar { width: 100%; border-radius: 3px 3px 0 0; min-height: 4px; transition: height 0.3s ease; }
.rhumor-bar-day { font-size: 8.5px; color: var(--earth-light); text-transform: uppercase; margin-top: 2px; }

/* Sinais vitais compact in resumo */
.resumo-sv-lista { padding: 4px 0; }
.resumo-sv-loading {
  padding: 18px 22px; font-size: 13px; color: var(--earth-light); text-align: center;
}
.resumo-sv-item {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 22px; border-bottom: 1px solid var(--border); transition: background 0.15s;
}
.resumo-sv-item:last-child { border-bottom: none; }
.resumo-sv-item:hover { background: var(--sand); }
.resumo-sv-item.rsv-alert { background: var(--alert-red-pale); }
.resumo-sv-item.rsv-warn  { background: var(--amber-pale); }
.resumo-sv-icon { font-size: 22px; flex-shrink: 0; width: 30px; text-align: center; }
.resumo-sv-info { flex: 1; min-width: 0; }
.resumo-sv-tipo {
  font-size: 10.5px; color: var(--earth-light); text-transform: uppercase; letter-spacing: 0.4px;
}
.resumo-sv-valor { font-size: 16px; font-weight: 700; color: var(--earth); margin-top: 1px; }
.resumo-sv-unidade { font-size: 11px; font-weight: 400; color: var(--earth-light); }
.resumo-sv-data { font-size: 11px; color: var(--earth-light); text-align: right; flex-shrink: 0; }

/* Agendamentos widget items (new style) */
.agend-widget-item {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 22px; border-bottom: 1px solid var(--border);
  cursor: pointer; transition: background 0.15s;
}
.agend-widget-item:last-child { border-bottom: none; }
.agend-widget-item:hover { background: var(--sand); }

/* Empty state */
.resumo-vazio {
  padding: 20px 22px; font-size: 13px; color: var(--earth-light);
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 960px) {
  .resumo-stats-row { grid-template-columns: repeat(2, 1fr); }
  .resumo-grid { grid-template-columns: 1fr; }
}

/* WIZARD BANNER */
.wizard-banner {
  display: flex; align-items: center; gap: 16px;
  background: linear-gradient(135deg, var(--amber-pale) 0%, #FFF5E6 100%);
  border: 1.5px solid var(--amber);
  border-radius: 16px;
  padding: 20px 24px;
  margin-bottom: 24px;
}
.wizard-banner-icon { font-size: 32px; }
.wizard-banner-content { flex: 1; }
.wizard-banner-title { font-size: 16px; font-weight: 600; color: var(--earth); margin-bottom: 4px; }
.wizard-banner-sub { font-size: 13px; color: var(--earth-light); }
.wizard-banner-btn {
  background: var(--amber); color: white; border: none;
  padding: 10px 20px; border-radius: 10px;
  font-weight: 600; font-size: 14px; cursor: pointer;
  transition: all 0.2s;
}
.wizard-banner-btn:hover { background: var(--earth); }

/* CIRCULO */
.horarios-config { display: flex; gap: 24px; flex-wrap: wrap; padding: 16px 20px; }
.horario-item { display: flex; flex-direction: column; gap: 8px;}
.horario-item label { font-size: 13px; color: var(--earth-light); font-weight: 500; }
.horario-item input { padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 8px; font-size: 14px;  font-family: 'DM Sans', sans-serif;  }

.membro-card { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-bottom: 1px solid var(--border); }
.membro-card:last-child { border-bottom: none; }
.membro-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--sage-pale); display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 14px; color: var(--sage); }
.membro-info { flex: 1; min-width: 0; }
.membro-nome { font-weight: 600; font-size: 14px; color: var(--earth); }
.membro-papel { font-size: 12px; color: var(--earth-light); }
.membro-actions { display: flex; gap: 8px; }
.membro-action-btn { background: none; border: none; cursor: pointer; font-size: 16px; opacity: 0.5; }
.membro-action-btn:hover { opacity: 1; }

.necessidade-item { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-bottom: 1px solid var(--border); }
.necessidade-item:last-child { border-bottom: none; }
.necessidade-emoji { font-size: 24px; }
.necessidade-info { flex: 1; min-width: 0; }
.necessidade-tipo { font-weight: 600; font-size: 14px; color: var(--earth); text-transform: capitalize; }
.necessidade-desc { font-size: 12px; color: var(--earth-light); margin-top: 2px; }

@media (max-width: 480px) {
  .resumo-stats-row { gap: 8px; }
  .rstat { padding: 12px; gap: 8px; }
  .rstat-icon { font-size: 22px; }
  .resumo-aurora { padding: 18px 20px; }
  /* último card ímpar vira full-width para não ficar órfão */
  .resumo-stats-row .rstat:last-child:nth-child(odd) { grid-column: 1 / -1; }
  /* Wizard banner: quebra em coluna no mobile pequeno */
  .wizard-banner { flex-wrap: wrap; padding: 16px 18px; gap: 12px; }
  .wizard-banner-btn { width: 100%; text-align: center; }
  /* Alertas: padding menor */
  .alert-item { padding: 12px 14px; gap: 10px; }
  /* Timeline: padding menor */
  .timeline-item { padding: 10px 14px; gap: 10px; }

  .resumo-col-main, .resumo-col-side, .resumo-grid { gap: 0px; }
}

/* ── TOUCH TARGETS (mínimo 44×44 px em mobile) ── */
@media (max-width: 700px) {
  .nav-avatar { width: 44px; height: 44px; font-size: 15px; }
  .date-btn { width: 44px; height: 44px; border-radius: 10px; }
  .btn-resolver { padding: 10px 16px; font-size: 12px; }
  .btn-load-more { padding: 14px 16px; }
  .modal-close { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; }
  .checklist-fechar { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; }
  .agend-btn-acao { padding: 12px 18px; }
  .perfil-menu-item { padding: 14px 16px; }
  /* Chips e filtros: facilita toque */
  .sv-tipo-chip, .agend-tipo-chip, .agend-tab { padding: 9px 14px; }
}

.nec-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

.nec-card {
  background: var(--cream); border-radius: 14px; padding: 16px 18px;
  border: 2px solid var(--border);
  box-shadow: 0 2px 8px rgba(61,43,31,0.06);
  display: flex; align-items: center; gap: 14px;
}

.nec-card-icon {
  width: 42px; height: 42px; border-radius: 12px;
  background: var(--sand); display: flex; align-items: center; justify-content: center;
  font-size: 20px; flex-shrink: 0;
}

.nec-card-info { flex: 1; min-width: 0; }

.nec-card-nome {
  font-weight: 700; font-size: 14px; color: var(--earth);
}

.nec-add-card {
  background: var(--sand); border-radius: 14px; padding: 24px;
  border: 2px dashed var(--border);
  text-align: center; cursor: pointer; transition: all 0.2s;
}

.nec-add-card:hover { border-color: var(--sage); background: var(--sand-light); }

/* CONFIG CARDS */
.config-card {
  background: var(--cream); border-radius: 14px; border: 1px solid var(--border);
  padding: 16px 20px; margin-bottom: 12px;
  display: flex; align-items: center; gap: 14px;
  cursor: pointer; transition: all 0.2s;
}
.config-card:hover { border-color: var(--sage); background: var(--sand-light); }
.config-icon { font-size: 24px; }
.config-content { flex: 1; min-width: 0; }
.config-title { font-weight: 600; font-size: 15px; color: var(--earth); }
.config-sub { font-size: 13px; color: var(--earth-light); margin-top: 2px; }
.config-arrow { font-size: 20px; color: var(--border); }