:root {
  --bg: #f4f8fc;
  --surface: #ffffff;
  --surface-2: #f8fbff;
  --text: #10243d;
  --muted: #5f7288;
  --primary: #0e5a8a;
  --primary-strong: #0a3f63;
  --primary-soft: #d9eef9;
  --line: #d7e4ef;
  --danger: #9c2f25;
  --success: #2d6a4f;
  --shadow: 0 20px 50px rgba(16, 36, 61, .12);
  --radius: 22px;
  --radius-sm: 14px;
  --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}


html[data-theme="claro"] {
  --bg: #f7fbff;
  --surface: #ffffff;
  --surface-2: #f7fbff;
  --text: #10243d;
  --muted: #5f7288;
  --primary: #0e5a8a;
  --primary-strong: #0a3f63;
  --primary-soft: #e5f3fb;
  --line: #d7e4ef;
  --bg-orb: rgba(14, 90, 138, .10);
  --bg-start: #ffffff;
  --bg-mid: #f4f8fc;
  --bg-end: #ffffff;
}

html[data-theme="escuro"] {
  --bg: #081421;
  --surface: #111f30;
  --surface-2: #162a40;
  --text: #eef7ff;
  --muted: #a9bfd4;
  --primary: #35b6e6;
  --primary-strong: #7ad8ff;
  --primary-soft: rgba(53, 182, 230, .16);
  --line: rgba(178, 214, 238, .18);
  --danger: #ff7b70;
  --success: #62d69a;
  --shadow: 0 22px 60px rgba(0, 0, 0, .34);
  --bg-orb: rgba(53, 182, 230, .18);
  --bg-start: #07111d;
  --bg-mid: #0b1d2f;
  --bg-end: #081421;
}

html[data-theme="sepia"] {
  --bg: #f7eedf;
  --surface: #fff8ed;
  --surface-2: #fbefdD;
  --text: #382819;
  --muted: #806f5c;
  --primary: #8b5e34;
  --primary-strong: #5f3a1c;
  --primary-soft: #ead7bc;
  --line: #dfc8aa;
  --shadow: 0 20px 50px rgba(70, 43, 20, .14);
  --bg-orb: rgba(139, 94, 52, .16);
  --bg-start: #fff8ed;
  --bg-mid: #f3e2ca;
  --bg-end: #fffaf2;
}

html[data-theme="pergaminho"] {
  --bg: #efe2c8;
  --surface: #fff3dc;
  --surface-2: #f7e6c5;
  --text: #321f10;
  --muted: #7a6346;
  --primary: #76451e;
  --primary-strong: #4a2a12;
  --primary-soft: #e8cfa7;
  --line: #d7b985;
  --shadow: 0 24px 54px rgba(66, 38, 14, .17);
  --font: Georgia, "Times New Roman", serif;
  --bg-orb: rgba(118, 69, 30, .18);
  --bg-start: #f7ead0;
  --bg-mid: #ead4ad;
  --bg-end: #fff3dc;
}

html[data-theme="escuro"] {
  color-scheme: light;
}

html[data-theme="escuro"] {
  color-scheme: dark;
}


* {
  box-sizing: border-box;
}

html {
  height: 100%;
}

body {
  min-height: 100%;
  margin: 0;
  font-family: var(--font);
  color: var(--text);
  background:
    radial-gradient(circle at top left, var(--bg-orb, rgba(14, 90, 138, .14)), transparent 38rem),
    linear-gradient(135deg, var(--bg-start, #f7fbff) 0%, var(--bg-mid, #eef6fc) 45%, var(--bg-end, #ffffff) 100%);
  transition: background .28s ease, color .28s ease;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

.hidden {
  display: none !important;
}

.app-shell {
  display: grid;
  grid-template-columns: 290px minmax(0, 1fr);
  min-height: 100vh;
}

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 28px;
  padding: 24px;
  background: rgba(255, 255, 255, .92);
  border-right: 1px solid var(--line);
  backdrop-filter: blur(16px);
}

.brand,
.auth-brand {
  display: flex;
  align-items: center;
  gap: 14px;
}

.brand strong {
  display: block;
  line-height: 1.15;
}

.brand span,
.auth-brand p,
.muted,
.form-help {
  color: var(--muted);
}

.brand-mark {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  overflow: hidden;
  background: transparent;
  box-shadow: 0 10px 24px rgba(14, 90, 138, .18);
}

.brand-mark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.brand-mark.large {
  width: 82px;
  height: 82px;
  border-radius: 24px;
}

.nav {
  display: grid;
  gap: 10px;
}

.nav-link {
  width: 100%;
  padding: 13px 14px;
  border: 0;
  border-radius: 16px;
  color: var(--text);
  text-align: left;
  background: transparent;
}

.nav-link:hover,
.nav-link.active {
  color: var(--primary-strong);
  background: var(--primary-soft);
}

.sidebar-footer {
  margin-top: auto;
  display: grid;
  gap: 12px;
}

.user-mini {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface-2);
}

.user-mini span,
.user-mini small {
  display: block;
}

.user-mini small {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-top: 4px;
}

.main {
  min-width: 0;
  padding: 28px;
}

.topbar {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}

.topbar h1,
.topbar p {
  margin: 0;
}

.topbar p {
  color: var(--muted);
  margin-top: 4px;
}

.menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
}

.view {
  display: none;
}

.active-view {
  display: block;
}

.hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 24px;
  padding: 32px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, .88);
  box-shadow: var(--shadow);
}

.eyebrow {
  display: inline-flex;
  padding: 7px 10px;
  color: var(--primary-strong);
  background: var(--primary-soft);
  border-radius: 999px;
  font-size: .84rem;
  font-weight: 700;
}

.hero-card h2 {
  max-width: 720px;
  margin: 16px 0 10px;
  font-size: clamp(2rem, 4vw, 4rem);
  line-height: 1;
  letter-spacing: -.06em;
}

.hero-card p {
  max-width: 680px;
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.65;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.hero-stats {
  display: grid;
  gap: 12px;
  align-self: end;
}

.stat-card {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
}

.stat-card strong {
  display: block;
  font-size: 2rem;
}

.stat-card span {
  color: var(--muted);
}

.section-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 16px;
}

.panel,
.people-card,
.request-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 12px 32px rgba(55, 34, 18, .08);
}

.panel {
  padding: 22px;
}

.panel h2,
.panel h3 {
  margin-top: 0;
}

.toolbar {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.search-wrap {
  flex: 1;
}

input,
select,
textarea {
  width: 100%;
  min-height: 44px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--text);
  background: #fffdf9;
  outline: none;
}

textarea {
  resize: vertical;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(14, 90, 138, .12);
}

label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: .92rem;
}

.field-hint {
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.35;
}

.checkbox-card {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--text);
  background: #fffdf9;
}

.checkbox-card input {
  width: auto;
  min-height: auto;
  accent-color: var(--primary);
}

.checkbox-card span {
  font-weight: 700;
}

.death-date-field {
  animation: softShow .18s ease;
}

.life-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 6px;
  font-size: .9em;
  vertical-align: middle;
}

@keyframes softShow {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.button {
  min-height: 44px;
  padding: 11px 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--text);
  background: #fffdf9;
  font-weight: 700;
  text-decoration: none;
}

.button:hover {
  transform: translateY(-1px);
}

.button.primary {
  border-color: var(--primary);
  color: #fff;
  background: var(--primary);
}

.button.primary:hover {
  background: var(--primary-strong);
}

.button.ghost {
  background: transparent;
}

.button.danger {
  color: #fff;
  border-color: var(--danger);
  background: var(--danger);
}

.button.full {
  width: 100%;
}

.icon-button {
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  font-size: 1.6rem;
  line-height: 1;
}

.people-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 14px;
}

.people-card {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 14px;
  padding: 14px;
}

.avatar,
.profile-photo,
.tree-photo {
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #fff;
  background: linear-gradient(135deg, #0e5a8a, #18a9d8);
  font-weight: 800;
}

.avatar {
  width: 64px;
  height: 64px;
  border-radius: 20px;
}

.avatar img,
.profile-photo img,
.tree-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.people-card h3 {
  margin: 2px 0 6px;
  font-size: 1rem;
}

.people-meta {
  display: grid;
  gap: 3px;
  color: var(--muted);
  font-size: .88rem;
}

.card-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}

.card-actions .button {
  min-height: 38px;
  padding: 8px 11px;
  font-size: .88rem;
}

.alert,
.auth-message {
  padding: 14px 16px;
  margin-bottom: 16px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: #fffdf9;
}

.alert.success,
.auth-message.success {
  color: var(--success);
  border-color: rgba(45, 106, 79, .3);
  background: rgba(45, 106, 79, .08);
}

.alert.error,
.auth-message.error {
  color: var(--danger);
  border-color: rgba(156, 47, 37, .3);
  background: rgba(156, 47, 37, .08);
}

.auth-layout,
.page-not-found {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 20px;
}

.auth-card,
.center-card {
  width: min(100%, 470px);
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: rgba(255, 255, 255, .94);
  box-shadow: var(--shadow);
}

.auth-brand {
  margin-bottom: 24px;
}

.auth-brand h1 {
  margin: 0;
  line-height: 1.05;
}

.auth-brand p {
  margin: 8px 0 0;
}

.tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 6px;
  border-radius: 18px;
  background: var(--primary-soft);
  margin-bottom: 18px;
}

.tab {
  min-height: 42px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  font-weight: 800;
  color: var(--primary-strong);
}

.tab.active {
  background: #fffdf9;
}

.auth-form {
  display: none;
  gap: 14px;
}

.active-auth-form {
  display: grid;
}

.form-help {
  margin: 0;
  font-size: .9rem;
  line-height: 1.45;
}

dialog {
  width: min(760px, calc(100% - 28px));
  max-height: min(92vh, 920px);
  border: 0;
  border-radius: 28px;
  padding: 0;
  background: var(--surface);
  box-shadow: var(--shadow);
}

dialog::backdrop {
  background: rgba(38, 26, 15, .42);
  backdrop-filter: blur(4px);
}

.person-form,
.profile-dialog {
  padding: 22px;
}

.dialog-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.dialog-header h2 {
  margin: 0;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

.dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 18px;
}

.profile-content {
  display: grid;
  gap: 18px;
}

.profile-main {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.profile-photo {
  width: 110px;
  height: 110px;
  border-radius: 28px;
  font-size: 1.4rem;
}

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

.fact {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fffdf9;
}

.fact span {
  display: block;
  color: var(--muted);
  font-size: .78rem;
}

.fact strong {
  display: block;
  margin-top: 3px;
}

.tree-panel {
  min-height: 62vh;
}

.tree-controls {
  display: grid;
  max-width: 420px;
  gap: 8px;
  margin-bottom: 18px;
}

.tree-scroll {
  overflow: auto;
  min-height: 460px;
  padding: 10px;
  border: 1px dashed var(--line);
  border-radius: 20px;
  background: rgba(255, 255, 255, .48);
}

.tree-canvas {
  display: inline-block;
  min-width: 100%;
  padding: 20px;
}

.tree,
.tree ul {
  position: relative;
  display: flex;
  justify-content: center;
  padding-top: 24px;
  margin: 0;
  list-style: none;
}

.tree li {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px 8px 0;
}

.tree li::before,
.tree li::after {
  content: '';
  position: absolute;
  top: 0;
  width: 50%;
  height: 24px;
  border-top: 2px solid var(--primary-soft);
}

.tree li::before {
  right: 50%;
}

.tree li::after {
  left: 50%;
  border-left: 2px solid var(--primary-soft);
}

.tree li:only-child::before,
.tree li:only-child::after {
  display: none;
}

.tree li:first-child::before,
.tree li:last-child::after {
  border: 0;
}

.tree li:last-child::before {
  border-right: 2px solid var(--primary-soft);
  border-radius: 0 12px 0 0;
}

.tree li:first-child::after {
  border-radius: 12px 0 0 0;
}

.tree ul::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 24px;
  border-left: 2px solid var(--primary-soft);
}

.tree-node {
  width: 170px;
  min-height: 172px;
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 14px 12px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fffdf9;
  box-shadow: 0 10px 22px rgba(55, 34, 18, .08);
  text-align: center;
}

.tree-photo {
  width: 58px;
  height: 58px;
  border-radius: 18px;
}

.tree-node strong {
  font-size: .94rem;
  line-height: 1.2;
}

.tree-node span {
  color: var(--muted);
  font-size: .78rem;
}

.requests-list {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.request-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
}

.request-card h3 {
  margin: 0 0 4px;
}

.request-card p {
  margin: 0;
  color: var(--muted);
}

.request-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.empty-state {
  padding: 28px;
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  text-align: center;
  color: var(--muted);
  background: rgba(255, 255, 255, .72);
}


/* V11 — Perfil histórico */
.form-section {
  display: grid;
  gap: 14px;
  margin-top: 18px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(248, 251, 255, .76);
}

.form-section h3 {
  margin: 0;
}

.field-hint {
  color: var(--muted);
  font-size: .78rem;
}

.profile-text-section p,
.profile-source-panel p {
  line-height: 1.68;
  margin-bottom: 0;
}

.document-link a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 9px 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--primary-strong);
  background: var(--surface-2);
  font-weight: 800;
  text-decoration: none;
}

.document-link a:hover {
  background: var(--primary-soft);
}


/* V13 — Design & Experiência Visual */
.theme-picker {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: .86rem;
  font-weight: 700;
}

.theme-picker select {
  min-height: 42px;
  border-radius: 14px;
  background: var(--surface-2);
}

.auth-theme-picker {
  margin: -8px 0 18px;
}

.view.active-view {
  animation: fadeInUp .24s ease both;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.panel,
.people-card,
.request-card,
.auth-card,
.center-card,
.hero-card,
.tree-node,
.family-card,
.document-card,
.stat-card {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}

.people-card:hover,
.panel:hover,
.document-card:hover,
.family-card:hover,
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 42px rgba(16, 36, 61, .14);
}

.button,
.nav-link,
.tab {
  transition: transform .16s ease, background .16s ease, color .16s ease, border-color .16s ease;
}

.button:active,
.nav-link:active,
.tab:active {
  transform: scale(.98);
}

.topbar h1 {
  letter-spacing: -.04em;
}

.hero-card {
  position: relative;
  overflow: hidden;
}

.hero-card::after {
  content: '';
  position: absolute;
  inset: auto -10% -48% auto;
  width: min(420px, 56vw);
  height: min(420px, 56vw);
  border-radius: 999px;
  background: radial-gradient(circle, var(--primary-soft), transparent 68%);
  opacity: .75;
  pointer-events: none;
}

.hero-card > * {
  position: relative;
  z-index: 1;
}

html[data-theme="escuro"] .sidebar,
html[data-theme="escuro"] .hero-card,
html[data-theme="escuro"] .panel,
html[data-theme="escuro"] .people-card,
html[data-theme="escuro"] .request-card,
html[data-theme="escuro"] .auth-card,
html[data-theme="escuro"] .center-card,
html[data-theme="escuro"] dialog,
html[data-theme="escuro"] .stat-card,
html[data-theme="escuro"] .document-card,
html[data-theme="escuro"] .tree-node,
html[data-theme="escuro"] .family-card,
html[data-theme="escuro"] .user-mini,
html[data-theme="escuro"] .fact,
html[data-theme="escuro"] input,
html[data-theme="escuro"] select,
html[data-theme="escuro"] textarea {
  background: rgba(17, 31, 48, .94);
  color: var(--text);
}

html[data-theme="escuro"] .tree-scroll,
html[data-theme="escuro"] .poster-scroll,
html[data-theme="escuro"] .empty-state,
html[data-theme="escuro"] .form-section {
  background: rgba(22, 42, 64, .72);
}

html[data-theme="escuro"] .brand-mark,
html[data-theme="escuro"] .avatar,
html[data-theme="escuro"] .profile-photo,
html[data-theme="escuro"] .tree-photo {
  box-shadow: 0 12px 30px rgba(0, 0, 0, .3);
}

html[data-theme="escuro"] .family-card-body small,
html[data-theme="escuro"] .tree-card-button {
  color: var(--text);
}

html[data-theme="pergaminho"] body {
  background:
    radial-gradient(circle at top left, rgba(118, 69, 30, .18), transparent 38rem),
    linear-gradient(135deg, #f7ead0 0%, #ead4ad 45%, #fff3dc 100%);
}

html[data-theme="pergaminho"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .25;
  background-image:
    linear-gradient(rgba(76, 44, 18, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(76, 44, 18, .026) 1px, transparent 1px);
  background-size: 34px 34px;
  mix-blend-mode: multiply;
}

html[data-theme="pergaminho"] .brand-mark img,
html[data-theme="sepia"] .brand-mark img {
  filter: sepia(.18) saturate(.92);
}

html[data-theme="pergaminho"] .hero-card,
html[data-theme="pergaminho"] .panel,
html[data-theme="pergaminho"] .people-card,
html[data-theme="pergaminho"] .auth-card,
html[data-theme="pergaminho"] .family-card,
html[data-theme="pergaminho"] .document-card {
  border-color: rgba(118, 69, 30, .28);
}

html[data-theme="pergaminho"] .family-poster {
  background:
    radial-gradient(circle at center, rgba(118, 69, 30, .08), transparent 32rem);
}

html[data-theme="sepia"] .button.primary,
html[data-theme="pergaminho"] .button.primary {
  background: linear-gradient(135deg, var(--primary), #a46f35);
}

html[data-theme="escuro"] .button.primary {
  color: #06111d;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}


@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: fixed;
    z-index: 40;
    inset: 0 auto 0 0;
    width: min(84vw, 320px);
    transform: translateX(-105%);
    transition: transform .2s ease;
  }

  .sidebar.open {
    transform: translateX(0);
  }

  .main {
    padding: 18px;
  }

  .menu-toggle {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
  }

  .hero-card {
    grid-template-columns: 1fr;
  }

  .hero-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .section-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  body {
    background: #f4f8fc;
  }

  .topbar {
    align-items: flex-start;
  }

  .topbar h1 {
    font-size: 1.5rem;
  }

  .hero-card {
    padding: 22px;
    border-radius: 22px;
  }

  .hero-card h2 {
    font-size: 2.25rem;
  }

  .hero-stats {
    grid-template-columns: 1fr;
  }

  .toolbar {
    display: grid;
  }

  .people-list {
    grid-template-columns: 1fr;
  }

  .people-card {
    grid-template-columns: 58px minmax(0, 1fr);
  }

  .avatar {
    width: 58px;
    height: 58px;
  }

  .form-grid,
  .profile-facts,
  .profile-main {
    grid-template-columns: 1fr;
  }

  .dialog-actions,
  .request-card {
    display: grid;
  }

  .dialog-actions .button,
  .request-actions .button {
    width: 100%;
  }

  .auth-card {
    padding: 20px;
    border-radius: 24px;
  }

  .auth-brand {
    align-items: flex-start;
  }

  .tabs {
    grid-template-columns: 1fr;
  }

  .tree-scroll {
    min-height: 420px;
  }

  .tree-node {
    width: 150px;
  }
}



/* Upload de foto principal */
.photo-field {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px dashed var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, .55);
}

.photo-field input[type="file"] {
  padding: 10px;
  background: var(--surface-2);
}

.photo-preview-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.photo-preview-wrap img {
  width: 96px;
  height: 96px;
  border-radius: 22px;
  object-fit: cover;
  border: 1px solid var(--line);
  background: var(--surface-2);
}


/* V9 - Árvore em modo pôster/organograma familiar */
.poster-panel {
  overflow: hidden;
}

.tree-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}

.tree-toolbar h2 {
  margin: 0 0 4px;
}

.tree-toolbar p {
  margin: 0;
}

.tree-toolbar .tree-controls {
  min-width: min(100%, 360px);
  margin: 0;
}

.tree-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--muted);
  font-size: .9rem;
}

.tree-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, .72);
}

.poster-scroll {
  min-height: 68vh;
  background:
    linear-gradient(rgba(255, 255, 255, .78), rgba(255, 255, 255, .78)),
    radial-gradient(circle at center, rgba(14, 90, 138, .08), transparent 34rem);
  border-style: solid;
}

.poster-canvas {
  min-width: 1180px;
  padding: 28px 34px 42px;
}

.family-poster {
  position: relative;
  min-height: 620px;
  padding: 22px 22px 36px;
  overflow: visible;
  text-align: center;
}

.family-poster > h2 {
  position: relative;
  z-index: 1;
  margin: 0 0 26px;
  font-size: clamp(1.8rem, 3vw, 3rem);
  font-weight: 800;
  letter-spacing: -.04em;
}

.poster-watermark {
  position: absolute;
  inset: 8% 0 auto 50%;
  width: min(70vw, 760px);
  max-width: 760px;
  opacity: .045;
  transform: translateX(-50%);
  pointer-events: none;
  user-select: none;
  filter: grayscale(1);
}

.poster-forest {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 64px;
  min-width: max-content;
}

.poster-forest-single {
  min-width: auto;
}

.family-unit {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  min-width: 220px;
}

.couple-row {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
}

.single-row {
  gap: 0;
}

.couple-link {
  width: 42px;
  height: 2px;
  background: #1b334d;
  opacity: .75;
}

.marriage-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  margin: 8px 0 0;
  padding: 4px 10px;
  border: 1px solid rgba(14, 90, 138, .18);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, .84);
  font-size: .78rem;
  font-weight: 800;
}

.descendant-line {
  width: 2px;
  height: 30px;
  margin: 0 auto;
  background: #1b334d;
  opacity: .75;
}

.children-row {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 34px;
  padding-top: 24px;
}

.children-row::before {
  content: '';
  position: absolute;
  top: 0;
  left: 8%;
  right: 8%;
  height: 2px;
  background: #1b334d;
  opacity: .75;
}

.child-branch {
  position: relative;
  display: inline-flex;
  justify-content: center;
}

.child-branch::before {
  content: '';
  position: absolute;
  top: -24px;
  left: 50%;
  width: 2px;
  height: 24px;
  background: #1b334d;
  opacity: .75;
  transform: translateX(-50%);
}

.leaf-branch {
  align-items: flex-start;
}

/* V22 — neutralizado, migrado para family-card.css */

/* V22 — neutralizado */

/* V22 — neutralizado */

/* V22 — neutralizado */

/* V22 — neutralizado */

/* V22 — neutralizado */

/* V22 — neutralizado */

.family-card-body span {
  color: var(--muted);
  font-size: .74rem;
  line-height: 1.2;
}

.family-card-body small {
  color: var(--muted);
  font-size: .72rem;
  line-height: 1.25;
}

.tree-card-button {
  width: fit-content;
  min-height: 24px;
  margin-top: 3px;
  padding: 3px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--primary-strong);
  background: #fff;
  font-size: .7rem;
  font-weight: 800;
}

.placeholder-card {
  opacity: .62;
  border-style: dashed;
}

.compact-repeat {
  opacity: .84;
}

@media (max-width: 980px) {
  .tree-toolbar {
    display: grid;
  }

  .tree-toolbar .tree-controls {
    min-width: 0;
  }

  .poster-canvas {
    min-width: 1000px;
    padding: 20px 22px 34px;
  }

  .poster-forest {
    gap: 42px;
  }

  .family-card {
    width: 174px;
  }
}

@media (max-width: 720px) {
  .tree-legend {
    gap: 6px;
  }

  .tree-legend span {
    font-size: .78rem;
  }

  .poster-scroll {
    min-height: 72vh;
  }

  .poster-canvas {
    min-width: 920px;
  }

  .family-poster > h2 {
    font-size: 1.7rem;
  }

  .children-row {
    gap: 22px;
  }

  .family-card {
    width: 162px;
    grid-template-columns: 40px minmax(0, 1fr);
  }

  .family-photo {
    width: 40px;
    height: 40px;
  }
}

/* V10 - árvore em pôster sem duplicar casal central */
.family-poster-bridge .poster-watermark {
  opacity: .035;
}

.bridge-layout {
  position: relative;
  z-index: 1;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  min-width: max-content;
}

.bridge-parents-row {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 210px;
  min-width: 900px;
}

.bridge-parent-side {
  display: flex;
  justify-content: center;
  min-width: 360px;
}

.parent-only-unit {
  min-width: 360px;
}

.bridge-connector {
  position: relative;
  width: 680px;
  height: 62px;
  margin: 0 auto;
}

.bridge-connector::before {
  content: '';
  position: absolute;
  top: 24px;
  left: 0;
  right: 0;
  height: 2px;
  background: #1b334d;
  opacity: .72;
}

.bridge-connector::after {
  content: '';
  position: absolute;
  top: 24px;
  left: 50%;
  width: 2px;
  height: 38px;
  background: #1b334d;
  opacity: .72;
  transform: translateX(-50%);
}

.bridge-central {
  display: flex;
  justify-content: center;
}

@media (max-width: 980px) {
  .bridge-parents-row {
    gap: 120px;
    min-width: 780px;
  }

  .bridge-parent-side,
  .parent-only-unit {
    min-width: 320px;
  }

  .bridge-connector {
    width: 560px;
  }
}

@media (max-width: 720px) {
  .bridge-parents-row {
    gap: 70px;
    min-width: 700px;
  }

  .bridge-parent-side,
  .parent-only-unit {
    min-width: 290px;
  }

  .bridge-connector {
    width: 480px;
  }
}


/* V12 — Documentos por pessoa */
.document-dialog {
  width: min(760px, calc(100vw - 28px));
}

.panel-heading-row {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 14px;
}

.panel-heading-row h3,
.panel-heading-row p {
  margin-top: 0;
}

.documents-list {
  display: grid;
  gap: 12px;
}

.document-card {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface-2);
}

.document-icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 16px;
  color: #fff;
  background: var(--primary);
  font-size: .8rem;
  font-weight: 900;
  letter-spacing: .06em;
}

.document-info {
  min-width: 0;
}

.document-info strong,
.document-info span {
  display: block;
}

.document-info span {
  color: var(--muted);
  font-size: .88rem;
  margin-top: 3px;
}

.document-info p {
  color: var(--text);
  margin: 8px 0 0;
  line-height: 1.45;
}

.document-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

@media (max-width: 720px) {
  .panel-heading-row {
    display: grid;
  }

  .document-card {
    grid-template-columns: 46px minmax(0, 1fr);
  }

  .document-icon {
    width: 46px;
    height: 46px;
  }

  .document-actions {
    grid-column: 1 / -1;
    justify-content: stretch;
  }

  .document-actions .button {
    flex: 1;
  }
}


/* V13.2 — Cards Premium estáveis (CSS-only, sem travar login) */
.people-list {
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  gap: 20px;
}

.people-card {
  position: relative;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 16px;
  padding: 18px;
  border-radius: 28px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,251,255,.94)),
    radial-gradient(circle at top right, var(--primary-soft), transparent 54%);
  border-color: rgba(215, 228, 239, .92);
  box-shadow:
    0 18px 44px rgba(16, 36, 61, .10),
    inset 0 1px 0 rgba(255,255,255,.72);
}

.people-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  background: linear-gradient(90deg, var(--primary), rgba(24,169,216,.72), transparent);
}

.people-card .avatar {
  width: 92px;
  height: 92px;
  border-radius: 28px;
  border: 3px solid rgba(255,255,255,.94);
  box-shadow: 0 14px 32px rgba(16, 36, 61, .17);
}

.people-card h3 {
  margin: 4px 0 10px;
  font-size: 1.2rem;
  line-height: 1.08;
  letter-spacing: -.03em;
}

.people-meta {
  gap: 8px;
}

.people-card .people-meta span {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 28px;
  padding: 5px 10px;
  border: 1px solid rgba(215, 228, 239, .92);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.15;
}

.people-card .people-meta span:first-child {
  color: var(--primary-strong);
  font-weight: 800;
  background: var(--primary-soft);
}

.people-card .card-actions {
  position: relative;
  z-index: 1;
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px solid rgba(215, 228, 239, .72);
}

.people-card .card-actions .button {
  min-height: 40px;
  border-radius: 14px;
  padding-inline: 14px;
}

.people-card .card-actions .view-profile {
  color: #fff;
  border-color: var(--primary);
  background: linear-gradient(135deg, var(--primary), #18a9d8);
}

/* Cards da árvore com visual mais clássico e tecnológico */
/* V22 — bloco de .family-card (width:214px) neutralizado: migrado para components/family-card.css */

.family-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, var(--primary), rgba(24,169,216,.75), transparent);
}

.family-card::after {
  display: none;
}

.family-photo {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  border: 2px solid rgba(255,255,255,.95);
  box-shadow: 0 10px 24px rgba(16,36,61,.16);
}

.family-card-body {
  gap: 5px;
}

.family-card-body strong {
  font-size: .96rem;
  line-height: 1.08;
  letter-spacing: -.02em;
}

.family-card-body span {
  font-size: .78rem;
}

.family-card-body small {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.68);
  border: 1px solid rgba(215,228,239,.72);
  font-size: .72rem;
}

.tree-card-button {
  min-height: 30px;
  margin-top: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  color: #fff;
  border-color: var(--primary);
  background: linear-gradient(135deg, var(--primary), #18a9d8);
  box-shadow: 0 8px 18px rgba(14,90,138,.15);
}

html[data-theme="pergaminho"] .people-card,
html[data-theme="pergaminho"] .family-card,
html[data-theme="sepia"] .people-card,
html[data-theme="sepia"] .family-card {
  background:
    linear-gradient(180deg, rgba(255,249,238,.98), rgba(250,241,222,.94)),
    radial-gradient(circle at top right, var(--primary-soft), transparent 55%);
  border-color: rgba(118,69,30,.24);
}

html[data-theme="pergaminho"] .people-card .people-meta span,
html[data-theme="pergaminho"] .family-card-body small,
html[data-theme="sepia"] .people-card .people-meta span,
html[data-theme="sepia"] .family-card-body small {
  background: rgba(255,250,241,.72);
  border-color: rgba(118,69,30,.18);
}

html[data-theme="escuro"] .people-card,
html[data-theme="escuro"] .family-card {
  background:
    linear-gradient(180deg, rgba(17,31,48,.98), rgba(11,23,36,.96)),
    radial-gradient(circle at top right, rgba(53,182,230,.14), transparent 55%);
  border-color: rgba(178,214,238,.18);
}

html[data-theme="escuro"] .people-card .people-meta span,
html[data-theme="escuro"] .family-card-body small {
  color: var(--text);
  background: rgba(255,255,255,.05);
  border-color: rgba(178,214,238,.16);
}

html[data-theme="escuro"] .people-card .people-meta span:first-child {
  color: var(--primary-strong);
  background: rgba(53,182,230,.12);
}

@media (max-width: 720px) {
  .people-list {
    grid-template-columns: 1fr;
  }

  .people-card {
    grid-template-columns: 76px minmax(0, 1fr);
    border-radius: 24px;
  }

  .people-card .avatar {
    width: 76px;
    height: 76px;
    border-radius: 24px;
  }

  .people-card .card-actions {
    grid-column: 1 / -1;
  }

  .people-card .card-actions .button {
    flex: 1;
  }
}



/* V22 — bloco '/* V13.3 — Cards pergaminho ab' neutralizado: migrado para components/family-card.css */

/* V22 — bloco '/* V13.4 — Pergaminho real: la' neutralizado: migrado para components/family-card.css */

/* V22 — bloco '/* V13.5 — Pergaminho clicável' neutralizado: migrado para components/family-card.css */

/* V22 — bloco '/* V13.6 — Folha de pergaminho' neutralizado: migrado para components/family-card.css */

/* V22 — bloco '/* V13.7 — Pergaminho orgânico' neutralizado: migrado para components/family-card.css */

/* V22 — bloco '/* V13.8 — Painel pergaminho +' neutralizado: migrado para components/family-card.css */
/* V14.1 — separa claramente editar, detalhes, anexos e memórias */
.form-guidance,
.profile-guidance {
  border: 1px solid rgba(14, 90, 138, .18);
  background: rgba(14, 90, 138, .07);
  color: var(--text);
  border-radius: 16px;
  padding: 12px 14px;
  line-height: 1.45;
}

.form-guidance {
  margin: 0 0 16px;
}

.profile-guidance {
  margin: 10px 0 0;
  max-width: 760px;
  font-size: .9rem;
}

.profile-guidance strong,
.form-guidance strong {
  color: var(--primary-strong);
}

.profile-section-title.with-action {
  gap: 12px;
}

.profile-section-title.with-action .button {
  white-space: nowrap;
}

html[data-theme="escuro"] .form-guidance,
html[data-theme="escuro"] .profile-guidance {
  background: rgba(53, 182, 230, .10);
  border-color: rgba(178, 214, 238, .18);
}

@media (max-width: 720px) {
  .profile-section-title.with-action {
    align-items: stretch;
  }

  .profile-section-title.with-action .button {
    width: 100%;
    justify-content: center;
  }
}

/* V14.3 — Árvore legível no modo escuro: área da árvore sempre clara/pergaminho */
html[data-theme="escuro"] .poster-panel {
  background: linear-gradient(180deg, #101d29 0%, #0b1621 100%) !important;
  border-color: rgba(129, 172, 200, .22) !important;
  box-shadow: 0 22px 55px rgba(0, 0, 0, .28) !important;
}

html[data-theme="escuro"] .poster-scroll {
  background:
    radial-gradient(circle at 50% 18%, rgba(255, 255, 255, .48), transparent 24%),
    radial-gradient(circle at 86% 82%, rgba(189, 149, 86, .14), transparent 22%),
    linear-gradient(180deg, #fbf1d8 0%, #f4e4bf 54%, #ead39f 100%) !important;
  border: 1px solid rgba(196, 160, 98, .42) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.42),
    0 18px 42px rgba(0, 0, 0, .26) !important;
}

html[data-theme="escuro"] .poster-scroll::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 16px !important;
  border: 1px solid rgba(153, 113, 57, .22) !important;
  border-radius: 16px !important;
  background: none !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

html[data-theme="escuro"] .poster-scroll::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(90deg, rgba(104, 72, 24, .08), transparent 4%, transparent 96%, rgba(104, 72, 24, .08)),
    linear-gradient(180deg, rgba(104, 72, 24, .05), transparent 4%, transparent 96%, rgba(104, 72, 24, .09)) !important;
  opacity: .65 !important;
  pointer-events: none !important;
}

html[data-theme="escuro"] .family-poster > h2 {
  color: #442815 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.38) !important;
}

html[data-theme="escuro"] .poster-watermark {
  opacity: .05 !important;
  filter: sepia(.75) grayscale(.20) !important;
}

html[data-theme="escuro"] .family-card,
html[data-theme="escuro"] .placeholder-card.family-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.30), rgba(177,130,63,.06)),
    url('../img/pergaminho-card-textura.png') center/cover no-repeat !important;
  border: 1px solid rgba(157, 117, 59, .26) !important;
  box-shadow:
    0 14px 24px rgba(92, 62, 24, .16),
    inset 0 1px 0 rgba(255,255,255,.46) !important;
}

html[data-theme="escuro"] .family-card::before,
html[data-theme="escuro"] .placeholder-card.family-card::before {
  border-color: rgba(154, 115, 58, .18) !important;
  opacity: 1 !important;
}

html[data-theme="escuro"] .family-card .family-card-body strong {
  color: #382211 !important;
}

html[data-theme="escuro"] .family-card .tree-card-location,
html[data-theme="escuro"] .family-card .tree-card-extra,
html[data-theme="escuro"] .family-card .tree-card-dates,
html[data-theme="escuro"] .family-card .family-card-body span,
html[data-theme="escuro"] .family-card .family-card-body small {
  color: #614827 !important;
}

html[data-theme="escuro"] .family-card .tree-card-dates,
html[data-theme="escuro"] .family-card .family-card-body small,
html[data-theme="escuro"] .marriage-label {
  background: rgba(255, 249, 238, .90) !important;
  border-color: rgba(167, 130, 77, .24) !important;
}

html[data-theme="escuro"] .marriage-label {
  color: #6c5638 !important;
}

html[data-theme="escuro"] .couple-link,
html[data-theme="escuro"] .descendant-line,
html[data-theme="escuro"] .children-row::before,
html[data-theme="escuro"] .child-branch::before {
  background: #6b593f !important;
  opacity: .86 !important;
}

html[data-theme="escuro"] .tree-legend span {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(129, 172, 200, .18) !important;
  color: #d8e8f3 !important;
}

/* botão secundário legível em todos os temas */
.btn-secondary,
html[data-theme="escuro"] .btn-secondary {
  background: rgba(255,255,255,.94) !important;
  color: #102033 !important;
  border-color: rgba(255,255,255,.70) !important;
}

.btn-secondary:hover,
html[data-theme="escuro"] .btn-secondary:hover {
  background: #ffffff !important;
  color: #071421 !important;
}


/* V14.4 - Correção de contraste dos botões no modo escuro
   Mantém botões secundários legíveis, especialmente "Ver árvore". */
html[data-theme="escuro"] .button:not(.primary):not(.danger) {
  background: rgba(248, 250, 252, 0.96);
  color: #0f172a;
  border-color: rgba(148, 163, 184, 0.75);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

html[data-theme="escuro"] .button:not(.primary):not(.danger):hover {
  background: #ffffff;
  color: #020617;
  border-color: rgba(56, 189, 248, 0.85);
}

html[data-theme="escuro"] .button.ghost {
  background: rgba(15, 23, 42, 0.72);
  color: #e5f3ff;
  border-color: rgba(125, 211, 252, 0.55);
}

html[data-theme="escuro"] .button.ghost:hover {
  background: rgba(14, 165, 233, 0.20);
  color: #ffffff;
}


/* V14.7 — Ícones antigos por tipo de documento */
.premium-document-card {
  grid-template-columns: 64px minmax(0, 1fr) auto !important;
  border-color: rgba(139, 94, 43, .28) !important;
  background: linear-gradient(180deg, #fffdf7, #f8ecd2) !important;
  box-shadow: 0 10px 24px rgba(84, 55, 23, .08) !important;
}

.antique-document-icon {
  position: relative;
  width: 58px !important;
  height: 58px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.42) !important;
  color: #fff8e6 !important;
  background: linear-gradient(145deg, #8a5b2a, #533015) !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.13), 0 8px 18px rgba(52, 31, 13, .18) !important;
  overflow: hidden;
}

.antique-document-icon::before {
  content: '';
  position: absolute;
  inset: 4px;
  border: 1px dashed rgba(255,248,230,.42);
  border-radius: 11px;
  pointer-events: none;
}

.antique-document-icon::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 28% 18%, rgba(255,255,255,.32), transparent 28%), linear-gradient(135deg, rgba(255,255,255,.12), transparent 40%);
  pointer-events: none;
}

.document-icon-symbol {
  position: relative;
  z-index: 1;
  display: block;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.62rem;
  line-height: 1;
  font-weight: 900;
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
}

.document-icon-label {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 3px;
  font-size: .48rem;
  line-height: 1;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .92;
}

.doc-icon-death { background: linear-gradient(145deg, #77746b, #3d3a34) !important; }
.doc-icon-birth { background: linear-gradient(145deg, #4f92a9, #1f5f78) !important; }
.doc-icon-marriage { background: linear-gradient(145deg, #c49435, #815317) !important; }
.doc-icon-id { background: linear-gradient(145deg, #5c936d, #2f6040) !important; }
.doc-icon-passport { background: linear-gradient(145deg, #536aa3, #283a70) !important; }
.doc-icon-letter { background: linear-gradient(145deg, #9a744c, #5b3a20) !important; }
.doc-icon-photo { background: linear-gradient(145deg, #967354, #604226) !important; }
.doc-icon-pdf { background: linear-gradient(145deg, #a65b4b, #713427) !important; }
.doc-icon-generic { background: linear-gradient(145deg, #8a5b2a, #533015) !important; }
.doc-icon-civil { background: linear-gradient(145deg, #8f7b52, #57462a) !important; }
.doc-icon-religious { background: linear-gradient(145deg, #8d7a9f, #4c3b63) !important; }
.doc-icon-migration { background: linear-gradient(145deg, #3f8c94, #20545c) !important; }
.doc-icon-citizenship { background: linear-gradient(145deg, #b58c2f, #6d4d12) !important; }
.doc-icon-work { background: linear-gradient(145deg, #6f7d58, #3f4b2f) !important; }
.doc-icon-diploma { background: linear-gradient(145deg, #c09136, #714915) !important; }
.doc-icon-property { background: linear-gradient(145deg, #7b5f49, #493323) !important; }
.doc-icon-research { background: linear-gradient(145deg, #6b6f96, #393d63) !important; }
.doc-icon-news { background: linear-gradient(145deg, #8b7e6d, #53483a) !important; }
.doc-icon-memory { background: linear-gradient(145deg, #9a6a7b, #613344) !important; }
.doc-icon-military { background: linear-gradient(145deg, #6e7a4d, #3d4726) !important; }
.doc-icon-medical { background: linear-gradient(145deg, #7d8f76, #43543d) !important; }


@media (max-width: 720px) {
  .premium-document-card {
    grid-template-columns: 52px minmax(0, 1fr) !important;
  }
  .premium-document-card .document-actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
  .antique-document-icon {
    width: 50px !important;
    height: 50px !important;
  }
  .document-icon-symbol { font-size: 1.35rem; }
  .document-icon-label { font-size: .42rem; }
}


/* ===== V15 - Central da Família ===== */
.family-center-grid {
  display: grid;
  gap: 18px;
}

.family-identity-panel {
  overflow: hidden;
}

.family-center-hero {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  margin: 18px 0 20px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(135deg, var(--surface), var(--surface-2));
}

.family-crest-preview {
  width: 118px;
  height: 118px;
  border-radius: 28px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.52);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.family-crest-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 10px;
}

.family-center-hero h3 {
  margin: 4px 0 6px;
  font-size: clamp(1.5rem, 2vw, 2.3rem);
}

.family-center-hero p {
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}

.family-form-grid {
  margin-bottom: 16px;
}

.feature-checklist {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.feature-checklist span {
  padding: 12px 14px;
  border: 1px dashed var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface-2);
  color: var(--text);
  font-weight: 800;
}

html[data-theme="escuro"] .family-center-hero {
  background: linear-gradient(135deg, rgba(255,255,255,.04), rgba(53,182,230,.08));
}

@media (max-width: 720px) {
  .family-center-hero {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .family-crest-preview {
    margin: 0 auto;
  }
}


/* V15.2 — Administração da Família */
.admin-grid {
  display: grid;
  gap: 18px;
}

.admin-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.admin-summary-card {
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.55);
  box-shadow: var(--shadow-soft);
}

[data-theme="escuro"] .admin-summary-card {
  background: rgba(15, 23, 42, 0.78);
}

.admin-summary-card span,
.admin-user-card small,
.role-guide span,
.approval-flow span {
  color: var(--muted);
}

.admin-summary-card strong {
  display: block;
  font-size: 1.1rem;
  margin: 6px 0 2px;
}

.owner-card {
  border-color: rgba(181, 132, 53, 0.55);
}

.admin-config-form {
  margin-top: 10px;
}

.permission-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.admin-checkbox {
  justify-content: flex-start;
  gap: 10px;
}

.role-guide {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 16px;
}

.role-guide span {
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 7px 10px;
  background: rgba(255, 255, 255, 0.45);
  font-size: 0.86rem;
}

[data-theme="escuro"] .role-guide span {
  background: rgba(15, 23, 42, 0.72);
}

.admin-users-list {
  display: grid;
  gap: 12px;
}

.admin-user-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 14px;
  background: rgba(255, 255, 255, 0.58);
}

[data-theme="escuro"] .admin-user-card {
  background: rgba(15, 23, 42, 0.8);
}

.admin-user-card.inactive {
  opacity: 0.62;
}

.admin-user-main {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.admin-avatar {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, rgba(181,132,53,.95), rgba(99,56,24,.95));
  color: #fff8e7;
  font-weight: 800;
  letter-spacing: .04em;
  border: 2px solid rgba(255,255,255,.55);
}

.admin-user-main h4 {
  margin: 0 0 4px;
}

.admin-user-main p {
  margin: 0 0 3px;
  color: var(--muted);
  word-break: break-word;
}

.user-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 2px 7px;
  margin-left: 5px;
  font-size: .72rem;
  background: rgba(14, 90, 138, .12);
  color: var(--primary);
  border: 1px solid rgba(14, 90, 138, .18);
}

.user-badge.owner {
  background: rgba(181, 132, 53, .16);
  color: #8a5a12;
  border-color: rgba(181, 132, 53, .35);
}

.admin-user-actions {
  display: flex;
  align-items: end;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-user-actions label {
  min-width: 190px;
  margin: 0;
}

.approval-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
}

.approval-flow span {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.5);
}

[data-theme="escuro"] .approval-flow span {
  background: rgba(15, 23, 42, 0.76);
}

@media (max-width: 760px) {
  .admin-summary-grid {
    grid-template-columns: 1fr;
  }
  .admin-user-card,
  .admin-user-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .admin-user-actions label {
    min-width: 0;
  }
}


/* V15.3 — Perfis, sugestões e aprovações */
.approvals-guide { margin-bottom: 1rem; }
.role-approval-actions { flex-wrap: wrap; }
.approval-card h3 { margin-bottom: .25rem; }
.approval-fields {
  display: grid;
  gap: .35rem;
  margin-top: .8rem;
  font-size: .9rem;
}
.approval-fields span {
  padding: .45rem .65rem;
  border-radius: 12px;
  background: rgba(120, 80, 40, .08);
}
[data-theme="escuro"] .approval-fields span {
  background: rgba(255, 255, 255, .08);
}

/* V15.4 — Controle de Uso e Licenciamento */
.licensing-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, .8fr);
  gap: 18px;
}

.license-hero-panel,
.commercial-panel {
  grid-column: 1 / -1;
}

.license-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.license-summary-card,
.backup-grid > div {
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 16px;
  background: rgba(255, 255, 255, .55);
  box-shadow: var(--shadow-soft);
}

[data-theme="escuro"] .license-summary-card,
[data-theme="escuro"] .backup-grid > div {
  background: rgba(15, 23, 42, .55);
}

.license-summary-card span,
.backup-grid span {
  display: block;
  font-size: .78rem;
  color: var(--muted);
  margin-bottom: 8px;
}

.license-summary-card strong,
.backup-grid strong {
  display: block;
  font-size: 1.15rem;
}

.license-summary-card small {
  display: block;
  color: var(--muted);
  margin-top: 6px;
}

.license-summary-card.premium {
  border-color: rgba(180, 126, 46, .45);
  background: linear-gradient(135deg, rgba(246, 226, 170, .55), rgba(255,255,255,.35));
}

[data-theme="escuro"] .license-summary-card.premium {
  background: linear-gradient(135deg, rgba(120, 83, 25, .45), rgba(15,23,42,.55));
}

.license-form-grid {
  margin-top: 14px;
}

.usage-metrics {
  display: grid;
  gap: 14px;
  margin-top: 16px;
}

.usage-metric {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 14px;
  background: rgba(255,255,255,.45);
}

[data-theme="escuro"] .usage-metric {
  background: rgba(15, 23, 42, .45);
}

.usage-metric-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  color: var(--text);
}

.usage-metric-top span {
  color: var(--muted);
}

.usage-bar,
.storage-meter-bar {
  height: 10px;
  border-radius: 999px;
  background: rgba(148, 163, 184, .25);
  overflow: hidden;
}

.usage-bar span,
.storage-meter-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #b7791f, #f6d365);
  width: 0;
  transition: width .25s ease;
}

.storage-meter {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.storage-meter strong {
  font-size: 1.35rem;
}

.storage-meter small {
  color: var(--muted);
}

.backup-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0;
}

.backup-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.plans-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}

.plan-card {
  display: grid;
  gap: 8px;
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 16px;
  background: rgba(255,255,255,.45);
}

[data-theme="escuro"] .plan-card {
  background: rgba(15, 23, 42, .45);
}

.plan-card strong {
  font-size: 1.1rem;
}

.plan-card span {
  color: var(--muted);
}

.plan-card.featured {
  border-color: rgba(180, 126, 46, .55);
  box-shadow: var(--shadow-soft);
}

@media (max-width: 900px) {
  .licensing-grid,
  .license-summary-grid,
  .backup-grid,
  .plans-grid {
    grid-template-columns: 1fr;
  }
}

/* V15.5 — Auditoria Completa */
.audit-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0;
}

.audit-summary-card {
  border: 1px solid var(--border-color, rgba(148, 163, 184, .22));
  border-radius: 18px;
  padding: 16px;
  background: rgba(255, 255, 255, .05);
  box-shadow: var(--card-shadow, 0 10px 30px rgba(0,0,0,.12));
}

.audit-summary-card span {
  display: block;
  font-size: .82rem;
  opacity: .72;
  margin-bottom: 6px;
}

.audit-summary-card strong {
  font-size: 1.55rem;
}

.audit-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 260px) 1fr;
  gap: 14px;
  margin: 14px 0 20px;
}

.audit-list {
  display: grid;
  gap: 12px;
}

.audit-card {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 14px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid var(--border-color, rgba(148, 163, 184, .22));
  background: rgba(255, 255, 255, .055);
}

.audit-card-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  font-size: 1.45rem;
  background: linear-gradient(145deg, rgba(217, 184, 127, .28), rgba(92, 64, 39, .18));
  border: 1px solid rgba(217, 184, 127, .38);
}

.audit-card-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.audit-card-top strong {
  font-size: 1rem;
}

.audit-card-top span,
.audit-card small,
.audit-card p {
  color: var(--muted-color, #94a3b8);
}

.audit-card p {
  margin: 5px 0;
}

.audit-details {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.audit-details span {
  font-size: .82rem;
  padding: 6px 9px;
  border-radius: 999px;
  background: rgba(148, 163, 184, .12);
  border: 1px solid rgba(148, 163, 184, .18);
}

@media (max-width: 760px) {
  .audit-summary-grid,
  .audit-toolbar {
    grid-template-columns: 1fr;
  }

  .audit-card {
    grid-template-columns: 1fr;
  }

  .audit-card-top {
    flex-direction: column;
  }
}

/* V15.6 — Separação Fotos x Documentos */
.profile-section-title .add-photo,
.profile-actions-premium .add-photo {
  border-color: rgba(146, 110, 54, .35) !important;
  background: #fff8e8 !important;
  color: #7a451c !important;
}

.premium-photo-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.premium-photo-card a {
  color: inherit !important;
  text-decoration: none !important;
}

.premium-photo-card .photo-card-info strong {
  display: block !important;
  color: #3d2616 !important;
  font-weight: 900 !important;
}

.premium-photo-card .photo-card-info span,
.premium-photo-card .photo-card-info p {
  color: #7a6447 !important;
  font-size: .78rem !important;
  margin: 3px 0 0 !important;
}

.premium-photo-card .delete-photo {
  align-self: flex-start !important;
  padding: 7px 12px !important;
}

/* V15.7 — Linha do Tempo Familiar */
.timeline-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(320px, 0.8fr);
  gap: 1rem;
  align-items: start;
}

.timeline-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 240px) 1fr;
  gap: .85rem;
  margin: 1rem 0 1.25rem;
}

.timeline-list {
  position: relative;
  display: grid;
  gap: .75rem;
  padding-left: .35rem;
}

.timeline-list::before {
  content: '';
  position: absolute;
  left: 2.05rem;
  top: 2.2rem;
  bottom: .7rem;
  width: 2px;
  background: linear-gradient(180deg, rgba(146, 100, 43, .1), rgba(146, 100, 43, .55), rgba(146, 100, 43, .1));
  pointer-events: none;
}

.timeline-year {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  border: 1px solid rgba(146, 100, 43, .35);
  background: rgba(255, 246, 221, .9);
  color: #5b3414;
  font-weight: 800;
  border-radius: 999px;
  padding: .35rem .85rem;
  margin: .75rem 0 .2rem 1rem;
  box-shadow: 0 8px 22px rgba(44, 24, 8, .08);
  z-index: 1;
}

.timeline-event-card {
  position: relative;
  display: grid;
  grid-template-columns: 4.1rem 1fr;
  gap: .75rem;
  z-index: 1;
}

.timeline-dot {
  width: 3.4rem;
  height: 3.4rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 25%, #fff8dc, #d9b26c 72%);
  border: 1px solid rgba(102, 63, 20, .28);
  box-shadow: 0 10px 24px rgba(44, 24, 8, .14);
  font-size: 1.35rem;
}

.timeline-event-body {
  border: 1px solid rgba(146, 100, 43, .24);
  background: linear-gradient(135deg, rgba(255, 250, 235, .97), rgba(238, 215, 168, .72));
  color: #442713;
  border-radius: 18px;
  padding: .95rem 1rem;
  box-shadow: 0 12px 32px rgba(44, 24, 8, .09);
}

.timeline-event-top {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: flex-start;
}

.timeline-event-top strong {
  font-size: 1rem;
}

.timeline-event-top span,
.timeline-event-body small {
  color: #75512a;
  font-weight: 700;
  white-space: nowrap;
}

.timeline-event-body p {
  margin: .45rem 0 .55rem;
  color: #5f3b1b;
}

.timeline-form {
  display: grid;
  gap: .8rem;
}

[data-theme="escuro"] .timeline-event-body {
  background: linear-gradient(135deg, rgba(255, 248, 224, .98), rgba(232, 207, 157, .9));
  color: #3f2412;
}

[data-theme="escuro"] .timeline-year {
  background: #f7e4b4;
  color: #3f2412;
}

@media (max-width: 980px) {
  .timeline-layout { grid-template-columns: 1fr; }
  .timeline-toolbar { grid-template-columns: 1fr; }
  .timeline-event-card { grid-template-columns: 3.4rem 1fr; }
  .timeline-list::before { left: 1.72rem; }
  .timeline-dot { width: 2.9rem; height: 2.9rem; }
}


/* V15.8 — Mural de Memórias */
.memories-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(320px, .85fr);
  gap: 1rem;
  align-items: start;
}

.memories-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 240px) 1fr;
  gap: .85rem;
  margin: 1rem 0 1.25rem;
}

.memories-list {
  display: grid;
  gap: .85rem;
}

.memory-card {
  display: grid;
  grid-template-columns: 3.8rem 1fr;
  gap: .8rem;
  padding: .9rem;
  border-radius: 20px;
  border: 1px solid rgba(146, 100, 43, .24);
  background: linear-gradient(135deg, rgba(255, 250, 235, .97), rgba(238, 215, 168, .72));
  box-shadow: 0 12px 32px rgba(44, 24, 8, .08);
}

.memory-icon {
  width: 3.25rem;
  height: 3.25rem;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: radial-gradient(circle at 35% 25%, #fff8dc, #d9b26c 72%);
  border: 1px solid rgba(102, 63, 20, .25);
  font-size: 1.35rem;
}

.memory-content {
  display: grid;
  gap: .45rem;
}

.memory-top {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: flex-start;
}

.memory-top strong {
  color: #442713;
  font-size: 1rem;
}

.memory-top span,
.memory-top small,
.memory-footer small {
  display: block;
  color: #75512a;
  font-weight: 700;
}

.memory-content p {
  margin: .25rem 0 .35rem;
  color: #5f3b1b;
  line-height: 1.6;
}

.memory-footer {
  display: flex;
  justify-content: space-between;
  gap: .7rem;
  align-items: center;
  flex-wrap: wrap;
}

.memory-actions {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
}

.memory-link {
  color: #0e5a8a;
  font-weight: 800;
  text-decoration: none;
}

.button.mini {
  padding: .35rem .65rem;
  font-size: .78rem;
  border-radius: 999px;
}

.memory-form {
  display: grid;
  gap: .8rem;
}

[data-theme="escuro"] .memory-card {
  background: linear-gradient(135deg, rgba(255, 248, 224, .98), rgba(232, 207, 157, .9));
  color: #3f2412;
}

@media (max-width: 980px) {
  .memories-layout { grid-template-columns: 1fr; }
  .memories-toolbar { grid-template-columns: 1fr; }
  .memory-card { grid-template-columns: 3.2rem 1fr; }
  .memory-icon { width: 2.8rem; height: 2.8rem; }
}

/* V15.8.3 — Edição do Mural de Memórias */
.memory-form-actions {
  display: flex;
  gap: .65rem;
  align-items: center;
  flex-wrap: wrap;
}

.memory-actions .button.ghost.mini {
  border-color: rgba(102, 63, 20, .24);
  background: rgba(255, 248, 224, .72);
  color: #5f3b1b;
}


/* V15.9 — Mapa das Origens */
.origins-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(320px, .75fr);
  gap: 1rem;
  align-items: start;
}

.origins-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin: 1rem 0;
}

.origin-stat {
  border: 1px solid rgba(132, 85, 32, .22);
  background: linear-gradient(135deg, rgba(255, 248, 224, .96), rgba(232, 207, 157, .72));
  border-radius: 1rem;
  padding: .85rem;
  box-shadow: 0 12px 24px rgba(58, 32, 11, .08);
}

.origin-stat.wide { grid-column: span 1; }
.origin-stat strong { display: block; color: #4b2d14; font-size: 1.25rem; }
.origin-stat span { color: #75512a; font-weight: 700; font-size: .82rem; }

.origins-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 240px) 1fr;
  gap: .75rem;
  margin-bottom: 1rem;
}

.origins-list {
  display: grid;
  gap: .8rem;
}

.origin-card {
  display: grid;
  grid-template-columns: 3.8rem 1fr;
  gap: .8rem;
  border: 1px solid rgba(132, 85, 32, .22);
  background: linear-gradient(135deg, rgba(255, 248, 224, .98), rgba(232, 207, 157, .9));
  border-radius: 1.1rem;
  padding: .9rem;
  box-shadow: 0 14px 28px rgba(58, 32, 11, .08);
}

.origin-icon {
  width: 3.2rem;
  height: 3.2rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 1.5rem;
  background: rgba(102, 63, 20, .12);
  border: 1px solid rgba(102, 63, 20, .18);
}

.origin-top {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: flex-start;
}

.origin-top strong { color: #442713; font-size: 1rem; }
.origin-top span, .origin-body small { color: #75512a; font-weight: 800; }

.origin-route {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem;
  margin: .45rem 0;
  color: #5f3b1b;
  font-weight: 800;
}


.country-badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .24rem .55rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .62);
  border: 1px solid rgba(132, 85, 32, .2);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4);
}

.country-flag {
  font-size: 1.25rem;
  line-height: 1;
  filter: drop-shadow(0 1px 1px rgba(58, 32, 11, .18));
}

.origin-location {
  font-size: .86rem;
  color: #7a562e;
  font-weight: 700;
}

[data-theme="escuro"] .country-badge {
  background: rgba(255, 248, 224, .85);
  color: #3f2412;
}

.origin-body p {
  margin: .25rem 0 .35rem;
  color: #5f3b1b;
  line-height: 1.6;
}

.origin-form { display: grid; gap: .8rem; }

[data-theme="escuro"] .origin-card,
[data-theme="escuro"] .origin-stat {
  background: linear-gradient(135deg, rgba(255, 248, 224, .98), rgba(232, 207, 157, .9));
  color: #3f2412;
}

@media (max-width: 980px) {
  .origins-layout { grid-template-columns: 1fr; }
  .origins-summary { grid-template-columns: 1fr; }
  .origins-toolbar { grid-template-columns: 1fr; }
  .origin-card { grid-template-columns: 3.2rem 1fr; }
  .origin-icon { width: 2.8rem; height: 2.8rem; }
}

/* V15.9.4 — Bandeiras reais em CSS no Mapa das Origens
   Evita o problema do Windows/Edge mostrar emoji de bandeira como letras ES/BR. */
.flag-icon {
  width: 1.55rem;
  height: 1.05rem;
  display: inline-block;
  border-radius: .16rem;
  border: 1px solid rgba(85, 52, 20, .34);
  box-shadow: 0 1px 2px rgba(58, 32, 11, .22), inset 0 0 0 1px rgba(255,255,255,.18);
  overflow: hidden;
  flex: 0 0 auto;
  vertical-align: middle;
  position: relative;
}
.flag-br { background: linear-gradient(135deg, transparent 33%, #ffdf00 33% 67%, transparent 67%), #009b3a; }
.flag-br::after { content: ''; position: absolute; inset: .28rem .48rem; border-radius: 50%; background: #002776; }
.flag-es { background: linear-gradient(to bottom, #aa151b 0 25%, #f1bf00 25% 75%, #aa151b 75%); }
.flag-jp { background: radial-gradient(circle at 50% 50%, #bc002d 0 28%, transparent 29%), #fff; }
.flag-pt { background: linear-gradient(to right, #006600 0 40%, #ff0000 40%); }
.flag-it { background: linear-gradient(to right, #009246 0 33%, #fff 33% 66%, #ce2b37 66%); }
.flag-de { background: linear-gradient(to bottom, #000 0 33%, #dd0000 33% 66%, #ffce00 66%); }
.flag-fr { background: linear-gradient(to right, #0055a4 0 33%, #fff 33% 66%, #ef4135 66%); }
.flag-ar { background: linear-gradient(to bottom, #74acdf 0 33%, #fff 33% 66%, #74acdf 66%); }
.flag-py { background: linear-gradient(to bottom, #d52b1e 0 33%, #fff 33% 66%, #0038a8 66%); }
.flag-uy { background: repeating-linear-gradient(to bottom, #fff 0 12%, #0038a8 12% 24%); }
.flag-us { background: repeating-linear-gradient(to bottom, #b22234 0 7.7%, #fff 7.7% 15.4%); }
.flag-us::before { content: ''; position: absolute; left: 0; top: 0; width: 45%; height: 54%; background: #3c3b6e; }
.flag-gb { background: linear-gradient(135deg, transparent 0 42%, #fff 42% 47%, #c8102e 47% 53%, #fff 53% 58%, transparent 58%), linear-gradient(45deg, transparent 0 42%, #fff 42% 47%, #c8102e 47% 53%, #fff 53% 58%, transparent 58%), linear-gradient(to right, transparent 0 42%, #fff 42% 47%, #c8102e 47% 53%, #fff 53% 58%, transparent 58%), linear-gradient(to bottom, transparent 0 38%, #fff 38% 45%, #c8102e 45% 55%, #fff 55% 62%, transparent 62%), #012169; }
.flag-xx { border: none; box-shadow: none; font-size: 1.15rem; line-height: 1; }

.country-flag { display: none; }
.country-badge .flag-icon + span { margin-left: .15rem; }

/* V15.9.5 — Mapa das Origens com bandeiras premium */
.origin-card-premium {
  grid-template-columns: 7.4rem 1fr;
  align-items: stretch;
  gap: 1.1rem;
  padding: 1rem 1.1rem;
  border-radius: 1rem;
  background: linear-gradient(135deg, rgba(255, 252, 241, .96), rgba(245, 224, 180, .82));
  box-shadow: 0 14px 34px rgba(91, 55, 18, .12), inset 0 0 0 1px rgba(166, 112, 47, .15);
}

.origin-journey {
  min-height: 8.2rem;
  border-left: 3px solid rgba(151, 91, 28, .65);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .36rem;
  position: relative;
  padding-left: .65rem;
}

.origin-journey::before,
.origin-journey::after {
  content: '';
  position: absolute;
  left: -.48rem;
  width: .82rem;
  height: .82rem;
  border-radius: 50%;
  background: #fff7dd;
  border: 3px solid rgba(151, 91, 28, .75);
  box-shadow: 0 2px 8px rgba(91, 55, 18, .18);
}

.origin-journey::before { top: .35rem; }
.origin-journey::after { bottom: .35rem; }

.origin-big-flag {
  width: 4.8rem;
  height: 3.2rem;
  border-radius: .9rem;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(245, 224, 180, .42));
  display: grid;
  place-items: center;
  box-shadow: inset 0 0 0 1px rgba(166, 112, 47, .18), 0 8px 18px rgba(91, 55, 18, .13);
}

.origin-big-flag .flag-icon {
  width: 3.15rem;
  height: 2.08rem;
  border-radius: .28rem;
  box-shadow: 0 4px 8px rgba(58, 32, 11, .24), inset 0 0 0 1px rgba(255,255,255,.22);
}

.origin-journey-arrow {
  font-size: 1.35rem;
  line-height: 1;
  color: #8b541f;
  font-weight: 900;
}

.origin-route-premium {
  gap: .42rem;
  margin: .55rem 0 .65rem;
}

.origin-route-premium .country-badge,
.origin-location-pill,
.origin-tags span {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: .28rem .62rem;
  border-radius: 999px;
  background: rgba(255, 248, 224, .88);
  border: 1px solid rgba(166, 112, 47, .24);
  box-shadow: 0 2px 5px rgba(91, 55, 18, .06);
}

.origin-location-pill {
  color: #65421f;
  font-weight: 700;
}

.origin-route-arrow {
  width: 1.9rem;
  height: 1.9rem;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(155, 91, 28, .1);
  color: #7a4719;
  font-weight: 900;
}

.origin-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin-top: .65rem;
}

.origin-tags span {
  font-size: .82rem;
  font-weight: 800;
  color: #684019;
}

.origin-stat.wide .flag-icon {
  width: 1.75rem;
  height: 1.16rem;
  margin-right: .22rem;
}

@media (max-width: 760px) {
  .origin-card-premium {
    grid-template-columns: 1fr;
  }
  .origin-journey {
    min-height: auto;
    flex-direction: row;
    border-left: 0;
    border-top: 3px solid rgba(151, 91, 28, .55);
    padding: .7rem 0 0;
  }
  .origin-journey::before,
  .origin-journey::after { display: none; }
  .origin-journey-arrow { transform: rotate(-90deg); }
}

/* V15.9.6 — Mapa das Origens Premium (visual tipo memorial, sem alterar dados Firestore) */
body:has(#originsList) .origins-layout,
.origins-layout {
  gap: 1.35rem;
}

#originsSummary.origins-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.05rem;
  margin: 1.1rem 0 1.2rem;
}

#originsSummary .origin-stat {
  min-height: 7.1rem;
  padding: 1.25rem 1.35rem;
  border-radius: 1.25rem;
  background: linear-gradient(145deg, rgba(255, 253, 245, .96), rgba(250, 236, 205, .86));
  border: 1px solid rgba(140, 88, 32, .18);
  box-shadow: 0 18px 36px rgba(75, 45, 16, .08), inset 0 1px 0 rgba(255,255,255,.75);
  position: relative;
  overflow: hidden;
}

#originsSummary .origin-stat::before {
  content: '◉';
  position: absolute;
  left: 1.1rem;
  top: 1.1rem;
  width: 3.15rem;
  height: 3.15rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #8a551f;
  font-size: 1.55rem;
  background: radial-gradient(circle, rgba(255,255,255,.86), rgba(232,205,150,.55));
  box-shadow: inset 0 0 0 1px rgba(135, 83, 31, .12);
}

#originsSummary .origin-stat:nth-child(1)::before { content: '🌍'; }
#originsSummary .origin-stat:nth-child(2)::before { content: '📜'; }
#originsSummary .origin-stat:nth-child(3)::before { content: '📍'; }

#originsSummary .origin-stat strong,
#originsSummary .origin-stat span {
  display: block;
  margin-left: 4.25rem;
}

#originsSummary .origin-stat strong {
  font-size: 2.15rem;
  line-height: 1;
  color: #442713;
}

#originsSummary .origin-stat span {
  margin-top: .45rem;
  color: #6f4720;
  font-size: .95rem;
  line-height: 1.35;
}

#originsSummary .origin-stat.wide strong {
  font-size: 1.25rem;
  line-height: 1.28;
}

.origins-toolbar {
  grid-template-columns: minmax(220px, 280px) minmax(260px, 1fr);
  gap: 1rem;
  margin-bottom: 1.45rem;
}

.origins-toolbar input,
.origins-toolbar select {
  min-height: 3.15rem;
  border-radius: .85rem;
}

.origin-card-premium {
  grid-template-columns: 12.2rem minmax(0, 1fr);
  gap: 1.45rem;
  align-items: stretch;
  padding: 1.4rem 1.55rem;
  min-height: 13.2rem;
  border-radius: 1.35rem;
  border: 1px solid rgba(140, 88, 32, .18);
  background: linear-gradient(145deg, rgba(255, 253, 246, .98), rgba(252, 243, 224, .92));
  box-shadow: 0 20px 46px rgba(64, 38, 13, .1), inset 0 1px 0 rgba(255,255,255,.7);
  position: relative;
  overflow: hidden;
}

.origin-card-premium::after {
  content: '';
  position: absolute;
  inset: .65rem;
  border-radius: 1rem;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(142, 88, 30, .08), transparent 18%, transparent 82%, rgba(142, 88, 30, .05));
  opacity: .55;
}

.origin-journey {
  min-height: 11.2rem;
  border-left: 3px solid rgba(128, 75, 25, .75);
  padding-left: 1.35rem;
  justify-content: center;
  gap: .75rem;
  z-index: 1;
}

.origin-journey::before,
.origin-journey::after {
  left: -.55rem;
  width: .98rem;
  height: .98rem;
  border-width: 3px;
  background: #fffaf0;
}

.origin-journey::before { top: .1rem; }
.origin-journey::after { bottom: .1rem; }

.origin-big-flag {
  width: 6.9rem;
  height: 4.9rem;
  border-radius: 1.05rem;
  background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(247,229,187,.55));
  border: 1px solid rgba(140, 88, 32, .16);
  box-shadow: 0 12px 28px rgba(64, 38, 13, .12), inset 0 1px 0 rgba(255,255,255,.65);
}

.origin-big-flag .flag-icon {
  width: 5.35rem;
  height: 3.55rem;
  border-radius: .45rem;
  box-shadow: 0 8px 16px rgba(58, 32, 11, .22), inset 0 0 0 1px rgba(255,255,255,.28);
}

.origin-journey-arrow {
  font-size: 1.75rem;
  color: #87501c;
  text-shadow: 0 1px 0 rgba(255,255,255,.65);
}

.origin-body {
  z-index: 1;
  padding-top: .35rem;
}

.origin-top {
  align-items: center;
  margin-bottom: .65rem;
}

.origin-top strong {
  font-size: 1.34rem;
  line-height: 1.25;
  letter-spacing: -.01em;
}

.origin-top span {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .25rem .6rem;
  border-radius: 999px;
  background: rgba(255, 248, 224, .85);
  border: 1px solid rgba(140, 88, 32, .16);
  color: #573316;
  white-space: nowrap;
}

.origin-route-premium {
  margin: .65rem 0 .95rem;
  gap: .55rem;
}

.origin-route-premium .country-badge,
.origin-location-pill {
  min-height: 2.15rem;
  padding: .38rem .82rem;
  border-radius: .72rem;
  background: linear-gradient(145deg, rgba(255, 249, 233, .98), rgba(248, 231, 192, .8));
  border: 1px solid rgba(140, 88, 32, .16);
  font-weight: 900;
  color: #4a2b13;
}

.origin-route-premium .country-badge .flag-icon {
  width: 1.9rem;
  height: 1.25rem;
  border-radius: .22rem;
}

.origin-route-arrow {
  width: 2.25rem;
  height: 2.25rem;
  background: rgba(142, 88, 30, .08);
  border: 1px solid rgba(140, 88, 32, .12);
  font-size: 1.35rem;
}

.origin-body p {
  font-size: 1.02rem;
  line-height: 1.72;
  color: #3f2614;
  max-width: 70ch;
}

.origin-tags {
  margin-top: .9rem;
}

.origin-tags span {
  min-height: 2rem;
  padding: .38rem .82rem;
  border-radius: .72rem;
  font-size: .88rem;
  background: linear-gradient(145deg, rgba(255, 249, 233, .96), rgba(248, 231, 192, .72));
}

/* Bandeiras mais parecidas com bandeiras reais, sem emoji */
.flag-es {
  background:
    radial-gradient(circle at 23% 52%, #d9a441 0 .11rem, transparent .12rem),
    linear-gradient(to bottom, #c60b1e 0 25%, #ffc400 25% 75%, #c60b1e 75%);
}
.flag-es::before {
  content: '';
  position: absolute;
  left: 21%;
  top: 39%;
  width: 11%;
  height: 23%;
  border-radius: .06rem;
  background: linear-gradient(to bottom, #b01622 0 45%, #f5d06f 45% 70%, #b01622 70%);
  box-shadow: 0 0 0 1px rgba(90,40,15,.25);
}
.flag-br {
  background: #009739;
}
.flag-br::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 62%;
  height: 62%;
  transform: translate(-50%, -50%) rotate(45deg);
  background: #ffdf00;
}
.flag-br::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 38%;
  height: 38%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle at 52% 45%, #002776 0 58%, transparent 59%), #002776;
}

[data-theme="escuro"] .origin-card-premium,
[data-theme="escuro"] #originsSummary .origin-stat {
  background: linear-gradient(145deg, rgba(255, 253, 246, .98), rgba(252, 243, 224, .92));
  color: #3f2614;
}

@media (max-width: 1180px) {
  .origin-card-premium { grid-template-columns: 9.6rem 1fr; }
  .origin-big-flag { width: 5.6rem; height: 4rem; }
  .origin-big-flag .flag-icon { width: 4.35rem; height: 2.9rem; }
}

@media (max-width: 760px) {
  #originsSummary.origins-summary { grid-template-columns: 1fr; }
  #originsSummary .origin-stat strong,
  #originsSummary .origin-stat span { margin-left: 4rem; }
  .origin-card-premium { grid-template-columns: 1fr; }
  .origin-journey { flex-direction: row; min-height: auto; border-left: 0; border-top: 3px solid rgba(128,75,25,.62); padding: 1rem 0 0; }
  .origin-journey-arrow { transform: rotate(-90deg); }
}


/* V15.9.7 — Mapa das Origens Premium Final
   Visual mais limpo com bandeiras grandes, cards amplos e sem alterar dados já cadastrados. */
#originsSummary.origins-summary {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1.05rem !important;
  margin: 1.2rem 0 1.25rem !important;
}

#originsSummary .origin-stat {
  min-height: 7.7rem !important;
  padding: 1.35rem 1.35rem 1.25rem 6rem !important;
  border-radius: 1.35rem !important;
  background: linear-gradient(145deg, #fffdf5 0%, #fbedd0 100%) !important;
  border: 1px solid rgba(142, 88, 30, .18) !important;
  box-shadow: 0 18px 38px rgba(68, 39, 13, .09), inset 0 1px 0 rgba(255,255,255,.85) !important;
  position: relative !important;
  overflow: hidden !important;
}

#originsSummary .origin-stat::before {
  left: 1.35rem !important;
  top: 1.3rem !important;
  width: 3.45rem !important;
  height: 3.45rem !important;
  font-size: 1.75rem !important;
  background: radial-gradient(circle, #fffef8, #efd6a2) !important;
  box-shadow: inset 0 0 0 1px rgba(128, 75, 25, .12), 0 8px 18px rgba(75, 45, 16, .08) !important;
}

#originsSummary .origin-stat strong,
#originsSummary .origin-stat span {
  margin-left: 0 !important;
}

#originsSummary .origin-stat strong {
  font-size: 2.15rem !important;
  line-height: 1.02 !important;
  color: #3f2412 !important;
  display: block !important;
}

#originsSummary .origin-stat span {
  color: #684119 !important;
  font-size: .96rem !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  display: block !important;
  margin-top: .45rem !important;
}

#originsSummary .origin-stat.wide strong {
  font-size: 1.32rem !important;
  line-height: 1.25 !important;
  display: flex !important;
  align-items: center !important;
  gap: .55rem !important;
  flex-wrap: wrap !important;
}

#originsSummary .origin-stat.wide .flag-icon {
  width: 2.1rem !important;
  height: 1.38rem !important;
  border-radius: .24rem !important;
}

.origin-card-premium {
  display: grid !important;
  grid-template-columns: 13.4rem minmax(0, 1fr) !important;
  gap: 1.65rem !important;
  min-height: 14.2rem !important;
  padding: 1.55rem 1.7rem !important;
  border-radius: 1.45rem !important;
  background: linear-gradient(145deg, #fffdf6 0%, #fcf2da 100%) !important;
  border: 1px solid rgba(142, 88, 30, .18) !important;
  box-shadow: 0 20px 46px rgba(64, 38, 13, .10), inset 0 1px 0 rgba(255,255,255,.8) !important;
  overflow: hidden !important;
  position: relative !important;
}

.origin-card-premium::after {
  content: '' !important;
  position: absolute !important;
  inset: .75rem !important;
  border-radius: 1.05rem !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, rgba(142, 88, 30, .055), transparent 20%, transparent 82%, rgba(142, 88, 30, .04)) !important;
  opacity: .75 !important;
}

.origin-card-premium .origin-journey {
  min-height: 11.6rem !important;
  border-left: 3px solid rgba(128, 75, 25, .72) !important;
  padding-left: 1.45rem !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .85rem !important;
  z-index: 1 !important;
}

.origin-card-premium .origin-journey::before,
.origin-card-premium .origin-journey::after {
  width: 1rem !important;
  height: 1rem !important;
  left: -.55rem !important;
  background: #fffaf0 !important;
  border: 3px solid rgba(128, 75, 25, .78) !important;
  box-shadow: 0 2px 8px rgba(75, 45, 16, .18) !important;
}

.origin-card-premium .origin-journey::before { top: .15rem !important; }
.origin-card-premium .origin-journey::after { bottom: .15rem !important; }

.origin-card-premium .origin-big-flag {
  width: 7.45rem !important;
  height: 5.25rem !important;
  border-radius: 1.05rem !important;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(247, 229, 187, .58)) !important;
  border: 1px solid rgba(142, 88, 30, .16) !important;
  box-shadow: 0 14px 28px rgba(64, 38, 13, .12), inset 0 1px 0 rgba(255,255,255,.75) !important;
  display: grid !important;
  place-items: center !important;
}

.origin-card-premium .origin-big-flag .flag-icon {
  width: 5.85rem !important;
  height: 3.85rem !important;
  border-radius: .48rem !important;
  box-shadow: 0 9px 18px rgba(58, 32, 11, .22), inset 0 0 0 1px rgba(255,255,255,.3) !important;
}

.origin-card-premium .origin-journey-arrow {
  font-size: 1.85rem !important;
  color: #83501f !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.7) !important;
}

.origin-card-premium .origin-body {
  padding-top: .35rem !important;
  z-index: 1 !important;
}

.origin-card-premium .origin-top {
  align-items: center !important;
  margin-bottom: .8rem !important;
}

.origin-card-premium .origin-top strong {
  font-size: 1.42rem !important;
  line-height: 1.22 !important;
  color: #3d2311 !important;
  letter-spacing: -.01em !important;
}

.origin-card-premium .origin-top span {
  display: inline-flex !important;
  align-items: center !important;
  gap: .4rem !important;
  padding: .32rem .7rem !important;
  border-radius: 999px !important;
  background: rgba(255, 248, 224, .92) !important;
  border: 1px solid rgba(142, 88, 30, .16) !important;
  color: #573316 !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

.origin-route-premium {
  margin: .7rem 0 1rem !important;
  gap: .6rem !important;
}

.origin-route-premium .country-badge,
.origin-location-pill {
  min-height: 2.25rem !important;
  padding: .42rem .85rem !important;
  border-radius: .76rem !important;
  background: linear-gradient(145deg, #fff9e9, #f7e5be) !important;
  border: 1px solid rgba(142, 88, 30, .16) !important;
  font-weight: 900 !important;
  color: #432512 !important;
  box-shadow: 0 5px 10px rgba(75, 45, 16, .04), inset 0 1px 0 rgba(255,255,255,.62) !important;
}

.origin-route-premium .country-badge .flag-icon {
  width: 2rem !important;
  height: 1.32rem !important;
  border-radius: .22rem !important;
}

.origin-route-arrow {
  width: 2.3rem !important;
  height: 2.3rem !important;
  border-radius: 999px !important;
  display: inline-grid !important;
  place-items: center !important;
  background: rgba(142, 88, 30, .08) !important;
  border: 1px solid rgba(142, 88, 30, .12) !important;
  font-size: 1.35rem !important;
  font-weight: 900 !important;
  color: #704219 !important;
}

.origin-card-premium .origin-body p {
  font-size: 1.02rem !important;
  line-height: 1.72 !important;
  color: #3f2614 !important;
  max-width: 72ch !important;
}

.origin-card-premium .origin-tags {
  margin-top: .9rem !important;
  display: flex !important;
  gap: .5rem !important;
  flex-wrap: wrap !important;
}

.origin-card-premium .origin-tags span {
  min-height: 2rem !important;
  padding: .38rem .82rem !important;
  border-radius: .72rem !important;
  font-size: .88rem !important;
  background: linear-gradient(145deg, rgba(255, 249, 233, .96), rgba(248, 231, 192, .72)) !important;
  border: 1px solid rgba(142, 88, 30, .14) !important;
  color: #573316 !important;
  font-weight: 900 !important;
}

/* Bandeiras CSS finais */
.flag-icon {
  display: inline-block !important;
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(85, 52, 20, .28) !important;
  flex: 0 0 auto !important;
  vertical-align: middle !important;
}

.flag-es {
  background: linear-gradient(to bottom, #c60b1e 0 25%, #ffc400 25% 75%, #c60b1e 75%) !important;
}
.flag-es::before {
  content: '' !important;
  position: absolute !important;
  left: 21% !important;
  top: 37% !important;
  width: 12% !important;
  height: 26% !important;
  border-radius: .08rem !important;
  background: linear-gradient(to bottom, #b01622 0 42%, #f5d06f 42% 72%, #b01622 72%) !important;
  box-shadow: 0 0 0 1px rgba(90,40,15,.22) !important;
}
.flag-es::after {
  content: '' !important;
  position: absolute !important;
  left: 23.5% !important;
  top: 49% !important;
  width: 7% !important;
  height: 7% !important;
  border-radius: 50% !important;
  background: #7b4b19 !important;
}

.flag-br {
  background: #009739 !important;
}
.flag-br::before {
  content: '' !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 63% !important;
  height: 63% !important;
  transform: translate(-50%, -50%) rotate(45deg) !important;
  background: #ffdf00 !important;
}
.flag-br::after {
  content: '' !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 38% !important;
  height: 38% !important;
  transform: translate(-50%, -50%) !important;
  border-radius: 50% !important;
  background: #002776 !important;
}

@media (max-width: 1180px) {
  .origin-card-premium { grid-template-columns: 11rem minmax(0, 1fr) !important; }
  .origin-card-premium .origin-big-flag { width: 6.4rem !important; height: 4.55rem !important; }
  .origin-card-premium .origin-big-flag .flag-icon { width: 5rem !important; height: 3.3rem !important; }
}

@media (max-width: 760px) {
  #originsSummary.origins-summary { grid-template-columns: 1fr !important; }
  .origin-card-premium { grid-template-columns: 1fr !important; }
  .origin-card-premium .origin-journey {
    flex-direction: row !important;
    min-height: auto !important;
    border-left: 0 !important;
    border-top: 3px solid rgba(128,75,25,.62) !important;
    padding: 1rem 0 0 !important;
  }
  .origin-card-premium .origin-journey::before,
  .origin-card-premium .origin-journey::after { display: none !important; }
  .origin-card-premium .origin-journey-arrow { transform: rotate(-90deg) !important; }
}

/* V16.0.3 — Mapa das Origens: bandeiras ao vento + ações editar/excluir */
.flag-br,
.flag-es,
.flag-jp {
  background-size: 100% 100% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
.flag-br { background-image: url('../img/flags/br-wave.svg') !important; }
.flag-es { background-image: url('../img/flags/es-wave.svg') !important; }
.flag-jp { background-image: url('../img/flags/jp-wave.svg') !important; }
.flag-br::before,
.flag-br::after,
.flag-es::before,
.flag-es::after,
.flag-jp::before,
.flag-jp::after { display: none !important; content: none !important; }
.origin-big-flag-wave {
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(247,229,187,.52)) !important;
  border-radius: 1rem !important;
}
.origin-big-flag-wave .flag-icon {
  border-radius: .45rem !important;
  transform: perspective(500px) rotateY(-7deg) skewY(-1.5deg) !important;
  filter: drop-shadow(0 10px 12px rgba(55,31,12,.18)) !important;
}
.origin-big-flag-wave::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(100deg, rgba(255,255,255,.22), transparent 38%, rgba(0,0,0,.08) 57%, transparent 72%);
}
.origin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin-top: .75rem;
  justify-content: flex-end;
}
.origin-actions .button.mini {
  min-height: 2rem;
  padding: .32rem .7rem;
  border-radius: .7rem;
  font-size: .82rem;
}

.timeline-actions {
  display: flex;
  gap: .45rem;
  flex-wrap: wrap;
  margin-top: .7rem;
}

.form-actions-inline {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
  align-items: center;
}

.hidden {
  display: none !important;
}

/* V16.1 — Dashboard Inteligente do Memorial da Família */
.memorial-dashboard {
  display: grid;
  gap: 18px;
}

.memorial-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 24px;
  align-items: center;
  padding: 30px;
  border: 1px solid rgba(119, 78, 38, .22);
  border-radius: 28px;
  background:
    radial-gradient(circle at top left, rgba(245, 211, 139, .35), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(250, 240, 216, .9));
  box-shadow: 0 18px 45px rgba(63, 42, 18, .12);
  overflow: hidden;
  position: relative;
}

.memorial-hero-card::after {
  content: '';
  position: absolute;
  inset: auto -50px -90px auto;
  width: 220px;
  height: 220px;
  border-radius: 999px;
  background: rgba(150, 98, 44, .08);
}

.memorial-hero-content,
.memorial-crest-box {
  position: relative;
  z-index: 1;
}

.memorial-hero-card h2 {
  margin: 16px 0 8px;
  font-size: clamp(2.25rem, 5vw, 4.8rem);
  line-height: .96;
  letter-spacing: -.07em;
}

.memorial-hero-card p {
  max-width: 760px;
  color: var(--muted);
  font-size: 1.08rem;
  line-height: 1.65;
}

.memorial-crest-box {
  display: grid;
  place-items: center;
  gap: 10px;
  padding: 18px;
  border: 1px solid rgba(119, 78, 38, .22);
  border-radius: 24px;
  background: rgba(255,255,255,.72);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.58);
  text-align: center;
  color: var(--muted);
  font-size: .88rem;
  font-weight: 700;
}

.memorial-crest-box img {
  width: 128px;
  height: 128px;
  object-fit: contain;
  filter: drop-shadow(0 10px 18px rgba(55, 34, 18, .15));
}

.dashboard-metrics-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}

.dashboard-metric-card {
  display: grid;
  gap: 6px;
  min-height: 120px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 12px 26px rgba(55, 34, 18, .07);
}

.dashboard-metric-card > span {
  font-size: 1.35rem;
}

.dashboard-metric-card strong {
  font-size: 2rem;
  line-height: 1;
}

.dashboard-metric-card small {
  color: var(--muted);
  font-weight: 700;
}

.dashboard-content-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.dashboard-wide-panel {
  grid-column: 1 / -1;
}

.dashboard-panel {
  min-height: 260px;
}

.compact-heading {
  margin-bottom: 16px;
}

.compact-heading h3 {
  margin: 8px 0 0;
}

.dashboard-country-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.dashboard-country-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border: 1px solid rgba(119, 78, 38, .2);
  border-radius: 999px;
  background: rgba(255,255,255,.8);
  color: var(--text);
  font-weight: 800;
}

.dashboard-country-chip strong {
  font-size: 1.45rem;
  line-height: 1;
}

.dashboard-list {
  display: grid;
  gap: 10px;
}

.dashboard-feed-item {
  width: 100%;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(119, 78, 38, .16);
  border-radius: 18px;
  background: rgba(255,255,255,.75);
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.dashboard-feed-item:hover {
  transform: translateY(-1px);
  border-color: rgba(119, 78, 38, .32);
  box-shadow: 0 10px 22px rgba(55, 34, 18, .08);
}

.dashboard-feed-item > span {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: var(--primary-soft);
  font-size: 1.3rem;
}

.dashboard-feed-item strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-feed-item small {
  color: var(--muted);
}

.today-history-card {
  padding: 18px;
  border: 1px solid rgba(119, 78, 38, .18);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.86), rgba(250, 240, 216, .78));
}

.today-history-card strong {
  display: block;
  font-size: 1.15rem;
  margin-bottom: 8px;
}

.today-history-card p {
  color: var(--muted);
  line-height: 1.6;
}

.today-history-card small {
  color: var(--primary-strong);
  font-weight: 800;
}

.compact-empty {
  padding: 14px;
  border-radius: 16px;
}

html[data-theme="escuro"] .memorial-hero-card,
html[data-theme="escuro"] .dashboard-metric-card,
html[data-theme="escuro"] .dashboard-country-chip,
html[data-theme="escuro"] .dashboard-feed-item,
html[data-theme="escuro"] .today-history-card,
html[data-theme="escuro"] .memorial-crest-box {
  background: rgba(15, 23, 42, .72);
  border-color: rgba(148, 163, 184, .24);
}

html[data-theme="pergaminho"] .memorial-hero-card,
html[data-theme="pergaminho"] .dashboard-metric-card,
html[data-theme="pergaminho"] .dashboard-country-chip,
html[data-theme="pergaminho"] .dashboard-feed-item,
html[data-theme="pergaminho"] .today-history-card,
html[data-theme="pergaminho"] .memorial-crest-box {
  background: rgba(255, 248, 229, .88);
}

@media (max-width: 1100px) {
  .dashboard-metrics-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .memorial-hero-card,
  .dashboard-content-grid {
    grid-template-columns: 1fr;
  }

  .memorial-crest-box {
    justify-self: stretch;
  }
}

@media (max-width: 620px) {
  .memorial-hero-card {
    padding: 22px;
  }

  .dashboard-metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-metric-card {
    min-height: 104px;
    padding: 14px;
  }
}

/* V16.1.1 — Dashboard com Mapa Mundi das Origens */
.dashboard-origin-map {
  margin-top: 4px;
}

.dashboard-world-map {
  position: relative;
  min-height: 330px;
  overflow: hidden;
  border: 1px solid rgba(119, 78, 38, .18);
  border-radius: 24px;
  background:
    radial-gradient(circle at 22% 28%, rgba(255,255,255,.72), transparent 25%),
    linear-gradient(180deg, rgba(201,232,235,.96), rgba(176,217,224,.88));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.38), 0 14px 32px rgba(55,34,18,.08);
}

.world-map-watermark {
  position: absolute;
  left: 18px;
  top: 14px;
  z-index: 1;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.7);
  color: rgba(77, 48, 25, .56);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.world-continents {
  position: absolute;
  inset: 0;
  opacity: .58;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.35));
}

.continent {
  position: absolute;
  display: block;
  background: linear-gradient(180deg, rgba(240,224,185,.98), rgba(207,188,143,.92));
  border: 1px solid rgba(119, 78, 38, .12);
  box-shadow: inset 0 10px 18px rgba(255,255,255,.25);
}

.continent-americas {
  left: 10%; top: 20%; width: 26%; height: 58%;
  border-radius: 58% 42% 55% 45% / 42% 55% 45% 58%;
  transform: rotate(-17deg);
  clip-path: polygon(22% 0, 70% 8%, 87% 22%, 73% 42%, 92% 61%, 57% 100%, 33% 85%, 40% 60%, 10% 45%, 20% 25%);
}

.continent-europe {
  left: 42%; top: 23%; width: 16%; height: 21%;
  border-radius: 48% 52% 42% 58% / 55% 45% 55% 45%;
  transform: rotate(-8deg);
}

.continent-africa {
  left: 45%; top: 40%; width: 17%; height: 35%;
  border-radius: 45% 55% 58% 42% / 42% 52% 48% 58%;
  transform: rotate(6deg);
  clip-path: polygon(35% 0, 78% 17%, 88% 45%, 68% 100%, 35% 84%, 12% 48%, 18% 14%);
}

.continent-asia {
  left: 56%; top: 20%; width: 36%; height: 39%;
  border-radius: 60% 40% 48% 52% / 45% 55% 50% 50%;
  transform: rotate(2deg);
  clip-path: polygon(0 15%, 24% 0, 58% 8%, 100% 31%, 86% 66%, 58% 57%, 49% 100%, 20% 68%, 4% 45%);
}

.continent-australia {
  left: 74%; top: 72%; width: 14%; height: 11%;
  border-radius: 55% 45% 58% 42% / 52% 48% 55% 45%;
  transform: rotate(-7deg);
}

.dashboard-route-layer {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.route-line {
  fill: none;
  stroke: rgba(22, 65, 91, .78);
  stroke-width: .72;
  stroke-dasharray: 3 2.2;
  stroke-linecap: round;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.5));
}

.secondary-route {
  stroke: rgba(65, 118, 138, .48);
  stroke-width: .55;
  stroke-dasharray: 2 3;
}

.map-origin-pin {
  position: absolute;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 150px;
  max-width: 210px;
  padding: 9px 11px 9px 9px;
  border: 1px solid rgba(119, 78, 38, .2);
  border-radius: 18px;
  background: rgba(255, 248, 232, .94);
  color: var(--text);
  box-shadow: 0 13px 28px rgba(55, 34, 18, .16);
  transform: translate(-50%, -50%);
  cursor: pointer;
}

.map-origin-pin::after {
  content: '';
  position: absolute;
  left: 18px;
  bottom: -10px;
  width: 14px;
  height: 14px;
  background: inherit;
  border-right: 1px solid rgba(119, 78, 38, .18);
  border-bottom: 1px solid rgba(119, 78, 38, .18);
  transform: rotate(45deg);
}

.map-origin-pin span:not(.flag-wave) {
  display: grid;
  gap: 2px;
  text-align: left;
}

.map-origin-pin strong {
  font-size: .92rem;
  line-height: 1.1;
}

.map-origin-pin small {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 750;
}

.map-legend {
  position: absolute;
  left: 18px;
  bottom: 16px;
  z-index: 5;
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.78);
  color: rgba(77,48,25,.78);
  font-size: .74rem;
  font-weight: 800;
  box-shadow: 0 8px 18px rgba(55,34,18,.08);
}

.map-legend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.map-legend i {
  width: 24px;
  height: 0;
  border-top: 2px dashed rgba(22, 65, 91, .78);
}

.map-legend i.secondary {
  border-top-color: rgba(65, 118, 138, .48);
}

.dashboard-map-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 4px 0;
}

.dashboard-map-caption strong {
  color: var(--text);
}

.dashboard-map-caption span {
  color: var(--muted);
  font-weight: 750;
}

.dashboard-country-list-under-map {
  margin-top: 12px;
}

.flag-wave {
  position: relative;
  display: inline-block;
  overflow: hidden;
  flex: 0 0 auto;
  border-radius: 6px;
  box-shadow: 0 5px 10px rgba(55,34,18,.18), inset 0 0 0 1px rgba(0,0,0,.12);
  transform: perspective(90px) rotateY(-9deg);
  background: #e9e1c7;
}

.flag-wave::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255,255,255,.28), transparent 18%, rgba(0,0,0,.12) 35%, transparent 54%, rgba(255,255,255,.22) 76%, transparent);
  mix-blend-mode: overlay;
  pointer-events: none;
}

.flag-tiny { width: 28px; height: 18px; border-radius: 4px; }
.flag-sm { width: 36px; height: 24px; }
.flag-md { width: 58px; height: 38px; border-radius: 9px; }

.flag-es {
  background: linear-gradient(180deg, #c60b1e 0 25%, #ffc400 25% 75%, #c60b1e 75% 100%);
}

.flag-es::after {
  content: '';
  position: absolute;
  left: 22%;
  top: 36%;
  width: 12%;
  height: 28%;
  border-radius: 2px;
  background: rgba(145, 69, 23, .75);
  box-shadow: 0 0 0 1px rgba(255,255,255,.25);
}

.flag-br {
  background: #139447;
}

.flag-br::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 52%;
  height: 52%;
  background: #f8d23c;
  transform: translate(-50%, -50%) rotate(45deg);
}

.flag-br::before {
  z-index: 2;
  background:
    radial-gradient(circle at 50% 50%, #1f4da1 0 30%, transparent 31%),
    linear-gradient(90deg, rgba(255,255,255,.28), transparent 18%, rgba(0,0,0,.12) 35%, transparent 54%, rgba(255,255,255,.22) 76%, transparent);
}

.flag-jp {
  background: #fff;
}

.flag-jp::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 38%;
  height: 38%;
  border-radius: 50%;
  background: #bc002d;
  transform: translate(-50%, -50%);
}

.flag-pt {
  background: linear-gradient(90deg, #006600 0 42%, #ff0000 42% 100%);
}
.flag-it { background: linear-gradient(90deg, #009246 0 33%, #fff 33% 66%, #ce2b37 66% 100%); }
.flag-de { background: linear-gradient(180deg, #000 0 33%, #dd0000 33% 66%, #ffce00 66% 100%); }
.flag-world { background: linear-gradient(135deg, #7fb5c5, #f1d39b); }

html[data-theme="escuro"] .dashboard-world-map {
  background: linear-gradient(180deg, rgba(18, 40, 53, .96), rgba(12, 30, 42, .92));
}

html[data-theme="escuro"] .map-origin-pin,
html[data-theme="escuro"] .map-legend {
  background: rgba(20, 31, 41, .9);
}

html[data-theme="escuro"] .continent {
  background: linear-gradient(180deg, rgba(84, 91, 77, .78), rgba(57, 71, 62, .72));
}

@media (max-width: 760px) {
  .dashboard-world-map { min-height: 260px; }
  .map-origin-pin { min-width: 122px; max-width: 150px; padding: 7px; gap: 7px; }
  .map-origin-pin small { display: none; }
  .flag-md { width: 42px; height: 28px; }
  .dashboard-map-caption { display: grid; }
  .map-legend { display: none; }
}

/* V16.1.2 — Dashboard: rota premium no lugar do mapa mundi esticado */
.dashboard-route-summary {
  position: relative;
  overflow: hidden;
  min-height: 260px;
  padding: 24px;
  border: 1px solid rgba(119, 78, 38, .18);
  border-radius: 24px;
  background:
    radial-gradient(circle at 18% 12%, rgba(255, 255, 255, .78), transparent 30%),
    linear-gradient(135deg, rgba(255, 250, 236, .96), rgba(245, 226, 184, .82));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.48), 0 16px 36px rgba(55,34,18,.08);
}

.dashboard-route-summary::before {
  content: '';
  position: absolute;
  inset: 18px;
  border: 1px dashed rgba(119,78,38,.16);
  border-radius: 20px;
  pointer-events: none;
}

.dashboard-route-summary::after {
  content: '✦';
  position: absolute;
  right: 22px;
  bottom: 14px;
  color: rgba(119,78,38,.16);
  font-size: 4rem;
  line-height: 1;
}

.dashboard-route-empty {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 160px;
}

.route-summary-icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 18px;
  background: rgba(255, 244, 215, .88);
  box-shadow: inset 0 0 0 1px rgba(119,78,38,.14), 0 10px 24px rgba(55,34,18,.08);
  font-size: 1.5rem;
}

.route-summary-header {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 22px;
}

.route-summary-header h3 {
  margin: 4px 0 6px;
  font-size: clamp(1.2rem, 2vw, 1.75rem);
  color: var(--text);
}

.route-summary-header p {
  margin: 0;
  color: var(--muted);
  font-weight: 750;
}

.route-date-badge {
  flex: 0 0 auto;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(119,78,38,.18);
  background: rgba(255,255,255,.7);
  color: var(--text);
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(55,34,18,.07);
}

.route-path-card {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: stretch;
  gap: 12px;
  padding: 18px;
  border-radius: 24px;
  background: rgba(255,255,255,.54);
  box-shadow: inset 0 0 0 1px rgba(119,78,38,.12);
}

.route-country-node {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(119,78,38,.18);
  border-radius: 22px;
  background: rgba(255, 248, 232, .92);
  color: var(--text);
  box-shadow: 0 14px 28px rgba(55,34,18,.10);
  cursor: pointer;
  text-align: left;
  transition: transform .18s ease, box-shadow .18s ease;
}

.route-country-node:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 34px rgba(55,34,18,.14);
}

.route-flag-frame {
  display: grid;
  place-items: center;
  width: 86px;
  height: 64px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(241,221,178,.64));
  box-shadow: inset 0 0 0 1px rgba(119,78,38,.12), 0 10px 20px rgba(55,34,18,.12);
}

.route-country-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.route-country-text small {
  color: rgba(119,78,38,.72);
  font-weight: 950;
  letter-spacing: .03em;
  text-transform: uppercase;
  font-size: .72rem;
}

.route-country-text strong {
  font-size: 1.2rem;
  line-height: 1.1;
}

.route-country-text em {
  color: var(--muted);
  font-style: normal;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.route-arrow {
  align-self: center;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: rgba(255,248,232,.92);
  border: 1px solid rgba(119,78,38,.16);
  color: rgba(119,78,38,.82);
  font-size: 1.35rem;
  font-weight: 950;
  box-shadow: 0 10px 20px rgba(55,34,18,.08);
}

.route-mini-legend {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.route-mini-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.56);
  border: 1px solid rgba(119,78,38,.12);
  color: var(--text);
  font-weight: 850;
}

.flag-lg {
  width: 66px;
  height: 44px;
  border-radius: 10px;
}

html[data-theme="escuro"] .dashboard-route-summary,
html[data-theme="escuro"] .route-path-card,
html[data-theme="escuro"] .route-country-node,
html[data-theme="escuro"] .route-arrow,
html[data-theme="escuro"] .route-date-badge,
html[data-theme="escuro"] .route-mini-legend span {
  background: rgba(15, 23, 42, .72);
  border-color: rgba(148,163,184,.24);
}

@media (max-width: 900px) {
  .route-path-card {
    display: grid;
  }

  .route-arrow {
    justify-self: center;
    transform: rotate(90deg);
  }
}

@media (max-width: 620px) {
  .dashboard-route-summary { padding: 18px; }
  .route-summary-header { display: grid; }
  .route-country-node { padding: 12px; gap: 10px; }
  .route-flag-frame { width: 70px; height: 54px; }
  .flag-lg { width: 54px; height: 36px; }
}

/* V16.2.1 — Memorial da Pessoa: layout e navegação */
.profile-dialog {
  width: min(1280px, calc(100% - 24px)) !important;
  max-height: min(96vh, 1040px) !important;
}

.person-memorial {
  display: grid !important;
  gap: 18px !important;
}

.person-memorial-hero {
  display: grid !important;
  grid-template-columns: 160px minmax(0, 1fr) 190px !important;
  gap: 22px !important;
  align-items: center !important;
  padding: 24px !important;
  border: 1px solid rgba(146, 110, 54, .22) !important;
  border-radius: 28px !important;
  background:
    radial-gradient(circle at 12% 8%, rgba(255, 255, 255, .68), transparent 34%),
    linear-gradient(135deg, rgba(255, 248, 230, .98), rgba(235, 210, 162, .88)) !important;
  box-shadow: 0 18px 40px rgba(82, 58, 24, .13) !important;
}

.person-memorial-photo-wrap {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
}

.person-memorial-photo {
  width: 150px !important;
  height: 150px !important;
  border-radius: 34px !important;
  border: 3px solid rgba(255,255,255,.72) !important;
  box-shadow: 0 18px 34px rgba(52, 36, 17, .18) !important;
  overflow: hidden !important;
  font-size: 1.8rem !important;
}

.person-memorial-photo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.memorial-photo-ribbon {
  position: absolute !important;
  left: 50% !important;
  bottom: -8px !important;
  transform: translateX(-50%) !important;
  white-space: nowrap !important;
  padding: 6px 11px !important;
  border-radius: 999px !important;
  background: #8b4f23 !important;
  color: #fff8e8 !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  box-shadow: 0 10px 20px rgba(82, 58, 24, .16) !important;
}

.memorial-photo-ribbon.live {
  background: #315c4d !important;
}

.memorial-kicker {
  display: inline-flex !important;
  width: fit-content !important;
  margin-bottom: 8px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.55) !important;
  color: #7a5930 !important;
  font-size: .74rem !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}

.person-memorial-headline h2 {
  margin: 0 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: clamp(2rem, 4vw, 3.25rem) !important;
  line-height: 1.02 !important;
  color: #3b2313 !important;
}

.memorial-route {
  margin: 8px 0 10px !important;
  color: #6b5237 !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
}

.memorial-quote {
  margin: 12px 0 0 !important;
  padding: 12px 14px !important;
  border-left: 4px solid rgba(139, 79, 35, .42) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.42) !important;
  color: #65482d !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: .98rem !important;
}

.memorial-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.memorial-badges span {
  padding: 7px 10px !important;
  border: 1px solid rgba(146, 110, 54, .20) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.70) !important;
  color: #5b3f24 !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
}

.person-memorial-actions {
  display: grid !important;
  gap: 9px !important;
}

.person-memorial-stats {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.memorial-stat {
  min-height: 74px !important;
  padding: 12px !important;
  border: 1px solid rgba(146, 110, 54, .18) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #fffdf7, #f7ead1) !important;
  box-shadow: 0 8px 18px rgba(82, 58, 24, .07) !important;
}

.memorial-stat span {
  display: block !important;
  color: #7b6548 !important;
  font-size: .74rem !important;
  font-weight: 900 !important;
}

.memorial-stat strong {
  display: block !important;
  margin-top: 5px !important;
  color: #3d2616 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: .98rem !important;
}

.person-memorial-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 9px !important;
  border: 1px solid rgba(146, 110, 54, .16) !important;
  border-radius: 20px !important;
  background: rgba(226, 203, 163, .32) !important;
}

.memorial-two-columns {
  display: grid !important;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr) !important;
  gap: 16px !important;
}

.memorial-card {
  padding: 18px !important;
  border: 1px solid rgba(146, 110, 54, .18) !important;
  border-radius: 22px !important;
  background: rgba(255,253,247,.86) !important;
  box-shadow: 0 12px 26px rgba(82, 58, 24, .08) !important;
}

.memorial-card.large {
  min-height: 260px !important;
}

.memorial-facts-compact {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* V22 — neutralizado: grid de relações redesenhado em profile-unified.css */
/* .memorial-relations-grid { grid-template-columns: repeat(4, 1fr) } */
/* .memorial-siblings-card { grid-column: span 2 } */

.person-life-timeline {
  position: relative !important;
  display: grid !important;
  gap: 12px !important;
  padding-left: 30px !important;
}

.person-life-timeline::before {
  content: '' !important;
  position: absolute !important;
  left: 13px !important;
  top: 8px !important;
  bottom: 8px !important;
  width: 2px !important;
  background: linear-gradient(#b38342, #e8d5ad) !important;
}

.person-life-event {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 14px !important;
  border: 1px solid rgba(146, 110, 54, .18) !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg, #fff9ec, #f2dfb8) !important;
}

.person-life-icon {
  width: 44px !important;
  height: 44px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  background: #fffdf7 !important;
  box-shadow: inset 0 0 0 1px rgba(146, 110, 54, .18), 0 8px 16px rgba(82, 58, 24, .08) !important;
}

.person-life-event strong,
.person-life-event span,
.person-life-event p {
  display: block !important;
  margin: 0 !important;
}

.person-life-event strong {
  color: #3d2616 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 1rem !important;
}

.person-life-event span {
  margin-top: 3px !important;
  color: #7b5d36 !important;
  font-weight: 900 !important;
}

.person-life-event p {
  margin-top: 4px !important;
  color: #6b5237 !important;
}

@media (max-width: 1050px) {
  .person-memorial-hero {
    grid-template-columns: 120px minmax(0, 1fr) !important;
  }
  .person-memorial-actions {
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .person-memorial-photo {
    width: 112px !important;
    height: 112px !important;
    border-radius: 28px !important;
  }
  .person-memorial-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .memorial-two-columns {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 720px) {
  .person-memorial-hero {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }
  .person-memorial-photo-wrap {
    justify-self: center !important;
  }
  .memorial-kicker,
  .memorial-badges {
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .person-memorial-stats,
  .premium-facts,
  .memorial-facts-compact,
  .memorial-relations-grid {
    grid-template-columns: 1fr !important;
  }
  .memorial-siblings-card {
    grid-column: auto !important;
  }
  .person-memorial-actions {
    grid-template-columns: 1fr !important;
  }
}

/* V16.2.2 — Memorial padronizado e cards de pessoas clicáveis */
.people-card.clickable-person-card {
  cursor: pointer !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.people-card.clickable-person-card:hover,
.people-card.clickable-person-card:focus-visible {
  transform: translateY(-2px) !important;
  border-color: rgba(139, 79, 35, .40) !important;
  box-shadow: 0 22px 52px rgba(82, 58, 24, .16), inset 0 1px 0 rgba(255,255,255,.75) !important;
  outline: none !important;
}

.people-card-body {
  min-width: 0 !important;
}

.people-card .icon-card-actions {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  z-index: 3 !important;
  display: flex !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.people-card .icon-button {
  width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  font-size: 1rem !important;
  line-height: 1 !important;
  background: rgba(255, 253, 247, .92) !important;
  color: #7b4d23 !important;
  border: 1px solid rgba(146, 110, 54, .22) !important;
  box-shadow: 0 8px 18px rgba(82, 58, 24, .10) !important;
}

.people-card .icon-button:hover {
  background: #8b4f23 !important;
  color: #fff8e8 !important;
}

.people-card .icon-button.danger {
  color: #9b2f2f !important;
}

.people-card .icon-button.danger:hover {
  background: #9b2f2f !important;
  color: #fff !important;
}

.person-memorial .profile-tab-panel.active {
  display: block !important;
}

.person-memorial .profile-tab-panel {
  min-height: 360px !important;
}

.person-memorial .profile-tab-panel > .memorial-card,
.person-memorial .profile-tab-panel > .memorial-two-columns,
.person-memorial .profile-tab-panel > .profile-section-title,
.person-memorial .profile-tab-panel > .profile-memory-grid,
.person-memorial .profile-tab-panel > .person-life-timeline,
.memorial-tab-standard {
  width: 100% !important;
  box-sizing: border-box !important;
}

.memorial-tab-standard,
.person-memorial .profile-tab-panel[data-profile-panel="visao"] .memorial-card,
.person-memorial .profile-tab-panel[data-profile-panel="familia"],
.person-memorial .profile-tab-panel[data-profile-panel="linha"],
.person-memorial .profile-tab-panel[data-profile-panel="memorias"] {
  min-height: 340px !important;
}

.person-memorial .profile-tab-panel[data-profile-panel="familia"],
.person-memorial .profile-tab-panel[data-profile-panel="linha"],
.person-memorial .profile-tab-panel[data-profile-panel="memorias"] {
  padding: 18px !important;
  border: 1px solid rgba(146, 110, 54, .18) !important;
  border-radius: 22px !important;
  background: rgba(255,253,247,.86) !important;
  box-shadow: 0 12px 26px rgba(82, 58, 24, .08) !important;
}

.person-memorial .profile-photo-gallery,
.person-memorial .documents-list,
.person-memorial .profile-memory-grid,
.person-memorial .person-life-timeline,
.person-memorial .profile-relations-grid {
  margin-top: 14px !important;
}

.family-crest-preview img,
.brand-logo img,
.family-cover-card img {
  object-fit: contain !important;
  object-position: center center !important;
}

@media (max-width: 720px) {
  .people-card .icon-card-actions {
    top: 10px !important;
    right: 10px !important;
  }
  .people-card .icon-button {
    width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
  }
  .person-memorial .profile-tab-panel,
  .memorial-tab-standard,
  .person-memorial .profile-tab-panel[data-profile-panel="familia"],
  .person-memorial .profile-tab-panel[data-profile-panel="linha"],
  .person-memorial .profile-tab-panel[data-profile-panel="memorias"] {
    min-height: 280px !important;
  }
}

/* V16.2.3 — Ajustes finos: ações no rodapé do card e Memorial travado */
.people-card.clickable-person-card {
  position: relative !important;
  padding-bottom: 54px !important;
}

.people-card .icon-card-actions {
  top: auto !important;
  right: auto !important;
  left: 16px !important;
  bottom: 14px !important;
  z-index: 5 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.people-card .icon-button {
  width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  border-radius: 12px !important;
  font-size: .92rem !important;
  background: rgba(255, 253, 247, .96) !important;
  backdrop-filter: blur(6px) !important;
}

.people-card .icon-button.edit-person::before {
  content: '✎';
}

.people-card .icon-button.delete-person::before {
  content: '🗑';
}

.people-card .icon-button.edit-person,
.people-card .icon-button.delete-person {
  font-size: 0 !important;
}

/* Memorial da Pessoa: mantém largura/ponto superior estáveis */
.profile-modal .modal-content,
.person-memorial-modal .modal-content,
#profileModal .modal-content,
#personProfileModal .modal-content {
  width: min(1080px, calc(100vw - 42px)) !important;
  max-width: 1080px !important;
  margin: 24px auto !important;
  align-self: flex-start !important;
}

.profile-modal,
.person-memorial-modal,
#profileModal,
#personProfileModal {
  align-items: flex-start !important;
  overflow-y: auto !important;
  padding-top: 18px !important;
}

.person-memorial {
  max-width: 1040px !important;
  margin: 0 auto !important;
}

.person-memorial-photo {
  width: 132px !important;
  height: 132px !important;
  min-width: 132px !important;
}

.person-memorial-photo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.person-memorial-hero {
  grid-template-columns: 154px minmax(0, 1fr) 170px !important;
  align-items: center !important;
}

.person-memorial-headline h2 {
  font-size: clamp(2rem, 4.1vw, 3.4rem) !important;
  line-height: .98 !important;
}

.person-memorial .profile-tab-panel {
  min-height: 380px !important;
}

.person-memorial .profile-tab-panel.active {
  display: block !important;
}

@media (max-width: 900px) {
  .profile-modal .modal-content,
  .person-memorial-modal .modal-content,
  #profileModal .modal-content,
  #personProfileModal .modal-content {
    width: min(96vw, 1080px) !important;
    margin: 12px auto !important;
  }

  .person-memorial-hero {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }

  .person-memorial-photo {
    width: 118px !important;
    height: 118px !important;
    min-width: 118px !important;
    margin: 0 auto !important;
  }

  .people-card.clickable-person-card {
    padding-bottom: 52px !important;
  }

  .people-card .icon-card-actions {
    left: 14px !important;
    bottom: 12px !important;
  }
}

/* V16.2.4 — Ícones visíveis e Memorial com altura estável */
.people-card.clickable-person-card {
  padding-bottom: 58px !important;
}

.people-card .icon-card-actions {
  left: 18px !important;
  bottom: 16px !important;
  top: auto !important;
  right: auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  z-index: 20 !important;
  pointer-events: auto !important;
}

.people-card .icon-button,
.people-card .icon-button.edit-person,
.people-card .icon-button.delete-person {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0 !important;
  line-height: 1 !important;
  background: rgba(255, 253, 247, .96) !important;
  border: 1px solid rgba(146, 110, 54, .34) !important;
  color: #7b4d23 !important;
  box-shadow: 0 8px 18px rgba(82, 58, 24, .12) !important;
}

.people-card .icon-button.edit-person::before {
  content: "✎";
  font-size: 17px !important;
  line-height: 1 !important;
  color: #7b4d23 !important;
  font-weight: 800 !important;
}

.people-card .icon-button.delete-person::before {
  content: "🗑";
  font-size: 15px !important;
  line-height: 1 !important;
  color: #ad2f2f !important;
}

.people-card .icon-button:hover {
  background: #8b4f23 !important;
  border-color: #8b4f23 !important;
  transform: translateY(-1px) !important;
}

.people-card .icon-button.edit-person:hover::before,
.people-card .icon-button.delete-person:hover::before {
  color: #fff8e8 !important;
}

.people-card .icon-button.delete-person:hover {
  background: #a73535 !important;
  border-color: #a73535 !important;
}

/* Memorial: modal sempre começa no mesmo ponto e mantém área interna previsível */
.profile-modal,
.person-memorial-modal,
#profileModal,
#personProfileModal {
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 18px !important;
  overflow-y: auto !important;
}

.profile-modal .modal-content,
.person-memorial-modal .modal-content,
#profileModal .modal-content,
#personProfileModal .modal-content {
  margin-top: 24px !important;
  margin-bottom: 34px !important;
  width: min(1080px, calc(100vw - 44px)) !important;
  max-width: 1080px !important;
  max-height: calc(100vh - 52px) !important;
  overflow-y: auto !important;
  scroll-behavior: auto !important;
}

.person-memorial {
  max-width: 980px !important;
  margin: 0 auto !important;
}

.person-memorial .profile-tab-panel {
  min-height: 385px !important;
  box-sizing: border-box !important;
}

.person-memorial .profile-tab-panel.active {
  display: block !important;
}

.person-memorial .profile-tab-panel[data-profile-panel="fotos"] .profile-photo-gallery img,
.person-memorial .profile-tab-panel[data-profile-panel="fotos"] img {
  max-height: 360px !important;
  width: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 18px !important;
}

@media (max-width: 900px) {
  .people-card .icon-card-actions {
    left: 14px !important;
    bottom: 12px !important;
  }

  .people-card .icon-button,
  .people-card .icon-button.edit-person,
  .people-card .icon-button.delete-person {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
  }

  .profile-modal .modal-content,
  .person-memorial-modal .modal-content,
  #profileModal .modal-content,
  #personProfileModal .modal-content {
    width: min(96vw, 1080px) !important;
    margin-top: 12px !important;
    max-height: calc(100vh - 26px) !important;
  }
}

/* V16.2.5 — Memorial Estático: mantém modal e abas sem pulinhos */
.profile-modal,
.person-memorial-modal,
#profileModal,
#personProfileModal {
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 18px !important;
  overflow: hidden !important;
}

.profile-modal .modal-content,
.person-memorial-modal .modal-content,
#profileModal .modal-content,
#personProfileModal .modal-content {
  width: min(1080px, calc(100vw - 44px)) !important;
  max-width: 1080px !important;
  height: calc(100vh - 56px) !important;
  max-height: calc(100vh - 56px) !important;
  margin: 24px auto 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Título do modal fica estável */
.profile-modal .modal-content > h2:first-child,
.person-memorial-modal .modal-content > h2:first-child,
#profileModal .modal-content > h2:first-child,
#personProfileModal .modal-content > h2:first-child {
  flex: 0 0 auto !important;
  min-height: 36px !important;
  margin-bottom: 12px !important;
}

.person-memorial {
  width: 100% !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  height: calc(100vh - 132px) !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: auto auto auto minmax(0, 1fr) !important;
  gap: 14px !important;
}

.person-memorial-hero {
  min-height: 214px !important;
  max-height: 214px !important;
  overflow: hidden !important;
}

.person-memorial-stats {
  min-height: 74px !important;
  max-height: 86px !important;
  overflow: hidden !important;
}

.person-memorial-tabs {
  flex: 0 0 auto !important;
  min-height: 50px !important;
  max-height: 58px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

.person-memorial .profile-tab-panel {
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
  padding-right: 4px !important;
}

.person-memorial .profile-tab-panel.active {
  display: block !important;
}

.person-memorial .profile-tab-panel[data-profile-panel="familia"],
.person-memorial .profile-tab-panel[data-profile-panel="linha"],
.person-memorial .profile-tab-panel[data-profile-panel="memorias"] {
  min-height: 0 !important;
}

.person-memorial .profile-tab-panel[data-profile-panel="fotos"] .profile-photo-gallery img,
.person-memorial .profile-tab-panel[data-profile-panel="fotos"] img {
  max-height: 300px !important;
}

@media (max-width: 1050px) {
  .profile-modal,
  .person-memorial-modal,
  #profileModal,
  #personProfileModal {
    padding-top: 8px !important;
    overflow-y: auto !important;
  }

  .profile-modal .modal-content,
  .person-memorial-modal .modal-content,
  #profileModal .modal-content,
  #personProfileModal .modal-content {
    width: min(96vw, 1080px) !important;
    height: auto !important;
    max-height: none !important;
    margin: 10px auto 24px !important;
    overflow: visible !important;
    display: block !important;
  }

  .person-memorial {
    height: auto !important;
    overflow: visible !important;
    display: grid !important;
  }

  .person-memorial-hero,
  .person-memorial-stats,
  .person-memorial-tabs,
  .person-memorial .profile-tab-panel {
    min-height: unset !important;
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
  }
}

/* V16.2.6 — Cabeçalho do Memorial Ajustado
   Ajuste fino somente visual: evita corte em nomes grandes, reduz foto e mantém ações em área fixa. */
.person-memorial-hero {
  grid-template-columns: 128px minmax(0, 1fr) 152px !important;
  gap: 20px !important;
  min-height: 248px !important;
  max-height: 248px !important;
  padding: 22px 24px !important;
  align-items: center !important;
  overflow: hidden !important;
}

.person-memorial-photo {
  width: 106px !important;
  height: 106px !important;
  min-width: 106px !important;
  border-radius: 26px !important;
}

.person-memorial-photo img {
  object-fit: cover !important;
  object-position: center center !important;
}

.person-memorial-headline {
  min-width: 0 !important;
  padding-right: 4px !important;
}

.person-memorial-headline h2 {
  max-width: 100% !important;
  font-size: clamp(2.05rem, 3.35vw, 2.75rem) !important;
  line-height: 1.04 !important;
  letter-spacing: -.02em !important;
  overflow-wrap: anywhere !important;
}

.memorial-kicker {
  margin-bottom: 7px !important;
}

.memorial-route {
  margin: 8px 0 8px !important;
}

.memorial-badges {
  gap: 7px !important;
}

.memorial-badges span {
  padding: 6px 9px !important;
  font-size: .74rem !important;
}

.memorial-quote {
  margin-top: 10px !important;
  padding: 10px 12px !important;
  font-size: .92rem !important;
  max-width: 100% !important;
}

.person-memorial-actions {
  width: 152px !important;
  min-width: 152px !important;
  align-self: center !important;
}

.person-memorial-actions .button,
.person-memorial-actions button {
  width: 100% !important;
  min-height: 38px !important;
  white-space: nowrap !important;
}

.memorial-photo-ribbon {
  bottom: -6px !important;
  padding: 5px 10px !important;
  font-size: .68rem !important;
}

@media (max-width: 1050px) {
  .person-memorial-hero {
    grid-template-columns: 112px minmax(0, 1fr) !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .person-memorial-actions {
    width: 100% !important;
    min-width: 0 !important;
  }

  .person-memorial-photo {
    width: 96px !important;
    height: 96px !important;
    min-width: 96px !important;
  }

  .person-memorial-headline h2 {
    font-size: clamp(1.9rem, 6vw, 2.5rem) !important;
  }
}

@media (max-width: 720px) {
  .person-memorial-hero {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 18px !important;
    text-align: center !important;
  }

  .person-memorial-headline h2 {
    font-size: clamp(1.75rem, 8vw, 2.25rem) !important;
  }

  .person-memorial-actions {
    grid-template-columns: 1fr !important;
  }
}

/* V16.2.7 — Galeria e Capa da Família */
.memorial-hero-card {
  position: relative !important;
  overflow: hidden !important;
}

.dashboard-family-cover-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: .18 !important;
  filter: sepia(.2) saturate(.95) contrast(.96) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

.memorial-hero-card::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(90deg, rgba(255,247,229,.94), rgba(255,247,229,.76), rgba(240,218,176,.70)) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

.memorial-hero-card > *:not(.dashboard-family-cover-img) {
  position: relative !important;
  z-index: 1 !important;
}

.family-cover-preview {
  display: grid !important;
  grid-template-columns: 220px 1fr !important;
  gap: 18px !important;
  align-items: center !important;
  margin: 16px 0 18px !important;
  padding: 12px !important;
  border: 1px solid rgba(146, 110, 54, .25) !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, #fff9eb, #f0ddb2) !important;
  box-shadow: 0 12px 24px rgba(82, 58, 24, .08) !important;
}

.family-cover-preview[hidden] {
  display: none !important;
}

.family-cover-preview img {
  width: 100% !important;
  height: 118px !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 14px !important;
  border: 1px solid rgba(146, 110, 54, .22) !important;
  background: #fff !important;
}

.family-cover-preview span,
.family-cover-preview strong {
  display: block !important;
}

.family-cover-preview span {
  color: #8a6a3d !important;
  font-size: .78rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}

.family-cover-preview strong {
  margin-top: 4px !important;
  color: #3d2616 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 1.05rem !important;
}

.person-memorial .profile-photo-gallery {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
}

.person-memorial .profile-photo-card,
.person-memorial .premium-photo-card {
  min-height: 420px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  overflow: hidden !important;
}

.person-memorial .profile-photo-card a {
  display: block !important;
  width: 100% !important;
}

.person-memorial .profile-tab-panel[data-profile-panel="fotos"] .profile-photo-gallery img,
.person-memorial .profile-tab-panel[data-profile-panel="fotos"] img {
  height: 300px !important;
  max-height: 300px !important;
  min-height: 300px !important;
  width: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 16px !important;
}

.person-memorial .photo-card-info {
  flex: 1 1 auto !important;
  padding-top: 4px !important;
}

.person-memorial .photo-placeholder-card {
  border-style: dashed !important;
  background: linear-gradient(135deg, rgba(255,253,247,.78), rgba(240,221,178,.36)) !important;
  box-shadow: none !important;
  opacity: .82 !important;
}

.photo-placeholder-visual {
  height: 300px !important;
  min-height: 300px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 16px !important;
  border: 1px dashed rgba(146, 110, 54, .28) !important;
  background: rgba(255, 255, 255, .45) !important;
  color: rgba(117, 83, 40, .48) !important;
  font-size: 2rem !important;
}

.photo-icon-delete {
  position: absolute !important;
  right: 14px !important;
  bottom: 14px !important;
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 12px !important;
  border: 1px solid rgba(152, 46, 46, .35) !important;
  background: #fff8ee !important;
  color: #a73535 !important;
  cursor: pointer !important;
  font-size: .95rem !important;
  box-shadow: 0 8px 16px rgba(82, 58, 24, .10) !important;
}

.photo-icon-delete:hover {
  background: #a73535 !important;
  color: #fff !important;
}

@media (max-width: 760px) {
  .person-memorial .profile-photo-gallery {
    grid-template-columns: 1fr !important;
  }

  .person-memorial .photo-placeholder-card {
    display: none !important;
  }

  .family-cover-preview {
    grid-template-columns: 1fr !important;
  }

  .family-cover-preview img {
    height: 160px !important;
  }
}

/* V16.3 — edição de datas históricas em anexos */
.photo-icon-edit {
  position: absolute !important;
  right: 56px !important;
  bottom: 14px !important;
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 12px !important;
  border: 1px solid rgba(142, 95, 42, .35) !important;
  background: #fff8ee !important;
  color: #8f5725 !important;
  cursor: pointer !important;
  font-size: .95rem !important;
  box-shadow: 0 8px 16px rgba(82, 58, 24, .10) !important;
}

.photo-icon-edit:hover {
  background: #9a5a27 !important;
  color: #fff !important;
}

/* V16.3.1 — Linha do Tempo Premium Histórica + narrativa das origens */
:root {
  --memorial-ink-premium: #2C1F0E;
  --memorial-gold-premium: #B8892A;
  --memorial-parchment-premium: #F5EFE0;
  --memorial-ink-light-premium: #5C4A2A;
  --memorial-border-premium: #D9CDAF;
}

.memorial-hero-card {
  background:
    radial-gradient(circle at 85% 12%, rgba(184, 137, 42, .20), transparent 28%),
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.78), transparent 34%),
    linear-gradient(135deg, rgba(255, 250, 236, .98), rgba(241, 221, 179, .80)) !important;
  border: 1px solid rgba(184, 137, 42, .28) !important;
}

.memorial-hero-content h2 {
  letter-spacing: -.035em;
}

.dashboard-route-summary {
  min-height: 300px !important;
  background:
    radial-gradient(circle at 10% 12%, rgba(255,255,255,.85), transparent 32%),
    linear-gradient(145deg, rgba(255, 251, 240, .98), rgba(244, 226, 190, .90)) !important;
}

.route-story-note {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 4px;
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(184, 137, 42, .20);
  background: rgba(255,255,255,.58);
  color: var(--memorial-ink-light-premium);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
}
.route-story-note strong {
  color: var(--memorial-ink-premium);
  font-size: .92rem;
}
.route-story-note span {
  font-size: .88rem;
  line-height: 1.45;
}

.timeline-list {
  gap: .95rem !important;
  padding-left: .5rem !important;
}

.timeline-list::before {
  left: 2.27rem !important;
  top: 2.5rem !important;
  bottom: 1rem !important;
  width: 6px !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(184,137,42,.06), rgba(184,137,42,.54), rgba(184,137,42,.12)),
    repeating-linear-gradient(180deg, rgba(92,74,42,.10) 0 10px, rgba(255,255,255,.12) 10px 18px) !important;
  box-shadow: inset 0 0 0 1px rgba(92,74,42,.14), 0 10px 24px rgba(44,31,14,.08) !important;
}

.timeline-year {
  position: relative !important;
  margin: 1.15rem 0 .35rem 1.05rem !important;
  padding: .42rem 1.1rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(184,137,42,.42) !important;
  background:
    linear-gradient(180deg, rgba(255,247,220,.98), rgba(214,170,91,.78)) !important;
  color: var(--memorial-ink-premium) !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  letter-spacing: .035em !important;
  box-shadow: 0 12px 28px rgba(44,31,14,.14), inset 0 1px 0 rgba(255,255,255,.65) !important;
}
.timeline-year::before,
.timeline-year::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 28px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(184,137,42,.54));
}
.timeline-year::before { right: 100%; transform: translateY(-50%); }
.timeline-year::after { left: 100%; transform: translateY(-50%) rotate(180deg); }

.timeline-premium-card {
  grid-template-columns: 4.45rem 1fr !important;
  gap: .85rem !important;
}

.timeline-medallion {
  position: relative !important;
  width: 3.85rem !important;
  height: 3.85rem !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at 35% 23%, #fff9dc 0 20%, #e6c073 48%, #b8892a 100%) !important;
  border: 1px solid rgba(76, 45, 12, .36) !important;
  box-shadow:
    0 15px 30px rgba(44,31,14,.18),
    inset 0 2px 0 rgba(255,255,255,.65),
    inset 0 -5px 10px rgba(92,55,14,.14) !important;
  color: #2C1F0E !important;
  font-size: 1.38rem !important;
  z-index: 2 !important;
}
.timeline-medallion::before {
  content: '';
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.52);
  box-shadow: inset 0 0 0 1px rgba(92,55,14,.10);
}
.timeline-medallion::after {
  content: '';
  position: absolute;
  top: 8px;
  left: 12px;
  width: 14px;
  height: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  transform: rotate(-22deg);
}
.timeline-medallion-icon {
  position: relative;
  z-index: 2;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.40));
}

.timeline-event-body {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(184,137,42,.28) !important;
  background:
    radial-gradient(circle at 98% 0%, rgba(184,137,42,.13), transparent 28%),
    linear-gradient(135deg, rgba(255,252,241,.98), rgba(242,224,186,.82)) !important;
  box-shadow: 0 18px 42px rgba(44,31,14,.10), inset 0 1px 0 rgba(255,255,255,.62) !important;
}
.timeline-event-body::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: var(--memorial-gold-premium);
  opacity: .75;
}
.timeline-important .timeline-event-body {
  border-color: rgba(184,137,42,.46) !important;
  box-shadow: 0 22px 48px rgba(44,31,14,.14), inset 0 1px 0 rgba(255,255,255,.70) !important;
}
.timeline-important .timeline-event-body::after {
  content: 'Evento marcante';
  position: absolute;
  right: 14px;
  bottom: 10px;
  color: rgba(92,74,42,.22);
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .68rem;
}

.timeline-title-block {
  display: grid;
  gap: 4px;
  min-width: 0;
  flex: 1; /* V22 — ocupa espaço disponível, empurra a data para a direita */
}
.timeline-date-seal {
  flex-shrink: 0; /* V22 — data nunca encolhe nem vaza para dentro do título */
}
.timeline-title-block strong {
  color: var(--memorial-ink-premium);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.03rem;
  letter-spacing: -.01em;
}
.timeline-type-pill {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(184,137,42,.22);
  background: rgba(255,255,255,.58);
  color: rgba(92,74,42,.92);
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.timeline-date-seal {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 86px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(184,137,42,.26);
  background: rgba(255,255,255,.60);
  color: var(--memorial-ink-premium) !important;
  font-weight: 950 !important;
  box-shadow: 0 8px 18px rgba(44,31,14,.06);
}

.timeline-type-birth .timeline-event-body::before { background: #c9a23d; }
.timeline-type-marriage .timeline-event-body::before { background: #b8892a; }
.timeline-type-education .timeline-event-body::before { background: #9d7432; }
.timeline-type-migration .timeline-event-body::before { background: #6e8c8c; }
.timeline-type-document .timeline-event-body::before { background: #9c8060; }
.timeline-type-photo .timeline-event-body::before { background: #7d6b50; }
.timeline-type-memory .timeline-event-body::before { background: #b08a44; }
.timeline-type-death .timeline-event-body::before { background: #82745f; }
.timeline-type-work .timeline-event-body::before { background: #7a4d21; }
.timeline-type-home .timeline-event-body::before { background: #8b6d35; }
.timeline-type-history .timeline-event-body::before { background: #b8892a; }

.timeline-actions {
  position: relative;
  z-index: 2;
}

html[data-theme="escuro"] .timeline-event-body,
html[data-theme="escuro"] .timeline-medallion,
html[data-theme="escuro"] .timeline-year {
  filter: saturate(.98);
}

@media (max-width: 760px) {
  .timeline-premium-card { grid-template-columns: 3.55rem 1fr !important; }
  .timeline-list::before { left: 1.92rem !important; width: 4px !important; }
  .timeline-medallion { width: 3.05rem !important; height: 3.05rem !important; font-size: 1.12rem !important; }
  .timeline-event-top { display: grid !important; }
  .timeline-date-seal { width: fit-content; min-width: 0; }
}

/* V16.3.2 — Home Premium Memorial
   A atualização abaixo altera apenas a experiência visual da aba Início.
   Não grava, migra, remove nem sobrescreve dados no Firebase. */
html[data-theme="escuro"] body[data-active-view="dashboard"] {
  --premium-ink: #08131a;
  --premium-ink-2: #0d1b24;
  --premium-gold: #c4953a;
  --premium-gold-2: #e0bd72;
  --premium-line: rgba(196, 149, 58, .34);
  --premium-text: #f8ead0;
  --premium-muted: rgba(248, 234, 208, .76);
  background:
    radial-gradient(circle at 64% -12%, rgba(196,149,58,.18), transparent 34rem),
    radial-gradient(circle at 18% 18%, rgba(255,244,214,.08), transparent 30rem),
    linear-gradient(135deg, #071118 0%, #0b151c 52%, #151109 100%) !important;
  color: var(--premium-text);
}

@media (min-width: 981px) {
  html[data-theme="escuro"] body[data-active-view="dashboard"] .app-shell {
    grid-template-columns: 286px minmax(0, 1fr);
  }
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .sidebar {
  background:
    radial-gradient(circle at top, rgba(196,149,58,.14), transparent 16rem),
    linear-gradient(180deg, rgba(5,15,22,.98), rgba(3,10,15,.98)) !important;
  border-right: 1px solid rgba(196,149,58,.25) !important;
  box-shadow: 16px 0 42px rgba(0,0,0,.24);
  color: #f8ead0;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .brand {
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 10px 0 18px;
  border-bottom: 1px solid rgba(196,149,58,.20);
  text-align: center;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .brand-mark {
  width: 112px;
  height: 112px;
  border-radius: 999px;
  box-shadow: 0 18px 45px rgba(0,0,0,.35), 0 0 0 1px rgba(196,149,58,.28);
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .brand strong {
  color: #f8ead0;
  font-size: 1.4rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .brand span {
  color: var(--premium-gold-2);
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: .76rem;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .nav-link {
  color: rgba(248,234,208,.86);
  border: 1px solid transparent;
  background: transparent;
  padding: 13px 14px;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .nav-link::before {
  display: inline-block;
  width: 1.4rem;
  margin-right: .35rem;
  color: var(--premium-gold);
}













html[data-theme="escuro"] body[data-active-view="dashboard"] .nav-link:hover,
html[data-theme="escuro"] body[data-active-view="dashboard"] .nav-link.active {
  color: #fff4dc;
  background: linear-gradient(135deg, rgba(196,149,58,.36), rgba(119,76,26,.18));
  border-color: rgba(196,149,58,.28);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 26px rgba(0,0,0,.22);
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .theme-picker,
html[data-theme="escuro"] body[data-active-view="dashboard"] .user-mini {
  color: rgba(248,234,208,.84);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .theme-picker select,
html[data-theme="escuro"] body[data-active-view="dashboard"] .user-mini,
html[data-theme="escuro"] body[data-active-view="dashboard"] .sidebar-footer .button {
  background: rgba(7,18,26,.72) !important;
  border-color: rgba(196,149,58,.28) !important;
  color: #f8ead0 !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .main {
  padding: 0 28px 24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 260px),
    radial-gradient(circle at 85% 0%, rgba(196,149,58,.12), transparent 28rem);
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar {
  min-height: 72px;
  margin: 0 -28px 0;
  padding: 14px 28px;
  border-bottom: 1px solid rgba(196,149,58,.18);
  background: rgba(5,14,20,.72);
  backdrop-filter: blur(18px);
  justify-content: center;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar > div {
  display: none;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar::before {
  content: '';
  margin-right: auto;
  color: #f8ead0;
  font-size: 1.05rem;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar::after {
  content: 'Pesquisar pessoas, eventos, documentos...    ⌘K';
  width: min(520px, 48vw);
  padding: 11px 18px;
  border: 1px solid rgba(196,149,58,.26);
  border-radius: 999px;
  background: rgba(0,0,0,.22);
  color: rgba(248,234,208,.62);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-dashboard {
  max-width: 1800px;
  margin: 0 auto;
  gap: 16px;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card {
  min-height: 310px;
  grid-template-columns: 1fr 230px;
  align-items: center;
  margin-top: 0;
  padding: 42px 48px;
  border-radius: 0 0 30px 30px;
  border: 1px solid rgba(196,149,58,.24) !important;
  background:
    linear-gradient(90deg, rgba(6,15,22,.96) 0%, rgba(6,15,22,.72) 45%, rgba(6,15,22,.30) 100%),
    radial-gradient(circle at 78% 22%, rgba(196,149,58,.22), transparent 36%),
    var(--premium-hero-image, linear-gradient(135deg, #16100b, #08131a)) !important;
  box-shadow: 0 22px 60px rgba(0,0,0,.28) !important;
  color: #f8ead0;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-family-cover-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .28;
  filter: sepia(.52) saturate(.8) brightness(.88);
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(5,14,20,.94), rgba(5,14,20,.52) 55%, rgba(5,14,20,.22)),
    radial-gradient(circle at 35% 12%, rgba(196,149,58,.20), transparent 28rem);
  pointer-events: none;
  z-index: 0;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,.025) 0 1px, transparent 1px 16px);
  opacity: .55;
  pointer-events: none;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-content {
  max-width: 780px;
  z-index: 2;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-content .eyebrow,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel .eyebrow {
  background: rgba(196,149,58,.16) !important;
  border: 1px solid rgba(196,149,58,.34);
  color: var(--premium-gold-2) !important;
  letter-spacing: .06em;
  text-transform: uppercase;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card h2 {
  margin: 14px 0 10px;
  color: #f8ead0;
  font-size: clamp(3.2rem, 6vw, 5.9rem);
  letter-spacing: -.05em;
  text-shadow: 0 6px 34px rgba(0,0,0,.55);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card p {
  color: rgba(248,234,208,.84);
  font-size: 1.22rem;
  max-width: 680px;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .hero-actions .button {
  border-color: rgba(196,149,58,.36);
  background: rgba(8,19,26,.58);
  color: #f8ead0;
  box-shadow: none;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .hero-actions .button.primary {
  background: linear-gradient(180deg, #c99b45, #8a5a20) !important;
  color: #fff6de !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box {
  align-self: center;
  z-index: 2;
  background:
    radial-gradient(circle at 50% 20%, rgba(196,149,58,.25), rgba(7,18,26,.74)),
    rgba(7,18,26,.72) !important;
  border: 1px solid rgba(196,149,58,.40) !important;
  color: #f8ead0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 28px 48px rgba(0,0,0,.30);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box img {
  width: 150px;
  height: 150px;
  object-fit: contain;
  filter: drop-shadow(0 18px 28px rgba(0,0,0,.45));
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-metrics-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  border: 1px solid rgba(196,149,58,.24);
  border-radius: 20px;
  overflow: hidden;
  background: rgba(5,14,20,.70);
  box-shadow: 0 18px 44px rgba(0,0,0,.24);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-metric-card {
  min-height: 92px;
  border: 0;
  border-right: 1px solid rgba(196,149,58,.18);
  border-radius: 0;
  background: rgba(9,22,30,.62) !important;
  color: #f8ead0;
  box-shadow: none;
  grid-template-columns: 42px 1fr;
  align-items: center;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-metric-card:last-child { border-right: 0; }
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-metric-card > span {
  color: var(--premium-gold);
  font-size: 1.8rem;
  grid-row: span 2;
  text-shadow: 0 0 16px rgba(196,149,58,.25);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-metric-card strong {
  color: #f8ead0;
  font-size: 2rem;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-metric-card small {
  color: rgba(248,234,208,.78);
}

/* V20.9.1 — Bloco antigo neutralizado. O grid escuro agora é definido mais
   abaixo (2 colunas, igual aos outros temas). Posicionamento manual removido. */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-wide-panel {
  grid-column: 1 / -1 !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel {
  min-height: 0;
  padding: 20px;
  border: 1px solid rgba(196,149,58,.24) !important;
  border-radius: 18px;
  background: rgba(7,18,26,.82) !important;
  color: #f8ead0;
  box-shadow: 0 18px 44px rgba(0,0,0,.22) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel {
  background: linear-gradient(180deg, rgba(255,250,236,.96), rgba(246,228,194,.94)) !important;
  color: #2C1F0E;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel h3,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel h3,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel h3 {
  color: #2C1F0E;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel h3 {
  margin-top: 8px;
  font-size: 1.55rem;
  color: inherit;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel .button.ghost {
  border-color: rgba(196,149,58,.34);
  background: rgba(196,149,58,.10);
  color: var(--premium-gold-2);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel .button.ghost,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel .button.ghost,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel .button.ghost {
  color: #8a5a20;
  background: rgba(255,255,255,.58);
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-route-summary {
  min-height: 430px !important;
  padding: 20px !important;
  border-color: rgba(196,149,58,.22) !important;
  background:
    radial-gradient(circle at 70% 65%, rgba(196,149,58,.18), transparent 42%),
    linear-gradient(180deg, rgba(255,251,240,.96), rgba(245,226,190,.82)) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-summary-header {
  margin-bottom: 16px;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-summary-header h3 {
  font-size: 1.45rem;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-path-card {
  display: grid;
  grid-template-columns: 1fr;
  padding: 0;
  gap: 12px;
  background: transparent !important;
  box-shadow: none;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-country-node {
  min-height: 118px;
  background: rgba(255,247,225,.78) !important;
  border-color: rgba(196,149,58,.24) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-arrow {
  justify-self: center;
  transform: rotate(90deg);
  background: linear-gradient(180deg, #e0bd72, #a76c24) !important;
  color: #fff6de;
  border-color: rgba(90,55,16,.30) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-story-note {
  background: rgba(255,255,255,.60) !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-country-list-under-map {
  margin-top: 12px;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-country-chip {
  background: rgba(255,255,255,.70) !important;
  border-color: rgba(196,149,58,.20) !important;
  color: #2C1F0E;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-country-chip strong {
  font-size: .95rem;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-timeline {
  position: relative;
  display: grid;
  gap: 16px;
  padding: 10px 0 4px;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-timeline::before {
  content: '';
  position: absolute;
  left: 78px;
  top: 16px;
  bottom: 16px;
  width: 3px;
  border-radius: 99px;
  background: linear-gradient(180deg, transparent, var(--premium-gold), transparent);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-event {
  position: relative;
  display: grid;
  grid-template-columns: 58px 58px 1fr;
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 0;
  border-radius: 18px;
  color: #f8ead0;
  background: rgba(255,255,255,.035);
  text-align: left;
  transition: transform .16s ease, background .16s ease;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-event:hover {
  transform: translateX(2px);
  background: rgba(196,149,58,.08);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-year {
  color: var(--premium-gold-2);
  font-weight: 900;
  font-size: .92rem;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-medal {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 999px;
  border: 1px solid rgba(196,149,58,.46);
  background: radial-gradient(circle at 35% 22%, #fff2bd, #c9993d 55%, #725017 100%);
  box-shadow: 0 10px 24px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.45);
  color: #251807;
  font-size: 1.25rem;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-copy strong {
  color: #fff3d9;
  font-size: 1rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-copy small {
  color: rgba(248,234,208,.68);
  line-height: 1.35;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-copy em {
  color: var(--premium-gold-2);
  font-style: normal;
  font-size: .78rem;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-list {
  gap: 10px;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item {
  background: rgba(255,255,255,.58) !important;
  border-color: rgba(196,149,58,.18) !important;
  color: #2C1F0E;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-memories-panel .dashboard-feed-item,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-actions-panel .dashboard-feed-item {
  background: rgba(255,255,255,.045) !important;
  color: #f8ead0;
  border-color: rgba(196,149,58,.18) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item > span {
  background: rgba(196,149,58,.18) !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-action-button {
  min-height: 92px;
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 14px 10px;
  border: 1px solid rgba(196,149,58,.22);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
  color: #f8ead0;
  text-align: center;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-action-button span {
  color: var(--premium-gold);
  font-size: 1.55rem;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-action-button strong {
  font-size: .82rem;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-panel {
  background: rgba(7,18,26,.86) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card {
  position: relative;
  min-height: 140px;
  padding: 42px 14px 14px;
  border: 1px solid rgba(196,149,58,.28);
  border-radius: 14px;
  color: #fff2d5;
  background:
    linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.62)),
    radial-gradient(circle at 20% 0%, rgba(196,149,58,.28), transparent 42%),
    rgba(255,255,255,.05);
  overflow: hidden;
  text-align: left;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card span {
  position: absolute;
  left: 12px;
  top: 10px;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: linear-gradient(180deg, #f4d38c, #9a641f);
  color: #231605;
  font-weight: 950;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card strong,
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card small {
  display: block;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card strong {
  font-size: 1rem;
  margin-bottom: 5px;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card small {
  color: rgba(248,234,208,.70);
  line-height: 1.32;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card {
  min-height: 205px;
  background:
    radial-gradient(circle at 82% 82%, rgba(196,149,58,.20), transparent 42%),
    rgba(255,255,255,.60) !important;
  color: #2C1F0E;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card strong { color: #2C1F0E; }
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card p { color: #5C4A2A; }

@media (max-width: 1320px) {
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid {
    grid-template-columns: 1fr 1fr;
  }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-timeline-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-actions-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-memories-panel {
    grid-column: auto;
    grid-row: auto;
  }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-memories-panel { grid-column: 1 / -1; }
}

@media (max-width: 980px) {
  html[data-theme="escuro"] body[data-active-view="dashboard"] .app-shell { grid-template-columns: 1fr; }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .sidebar { background: rgba(5,14,20,.96) !important; }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .main { padding: 0 14px 18px; }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar { margin: 0 -14px; }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar::before,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar::after { display: none; }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card {
    grid-template-columns: 1fr;
    padding: 28px 20px;
    border-radius: 0 0 24px 24px;
  }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box { display: none; }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-metric-card { border-bottom: 1px solid rgba(196,149,58,.18); }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid { grid-template-columns: 1fr; }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: 1fr; }
}

/* V16.3.2.1 — Home Premium Memorial refinado */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel {
  background:
    radial-gradient(circle at 82% 10%, rgba(196,149,58,.16), transparent 28%),
    radial-gradient(circle at 8% 100%, rgba(196,149,58,.10), transparent 30%),
    rgba(7,18,26,.84) !important;
  color: #f8ead0 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel h3,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel h3,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel h3,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel .eyebrow,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel .eyebrow,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel .eyebrow {
  color: #f7d79a !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel .button.ghost,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel .button.ghost,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel .button.ghost {
  color: #f8ead0;
  background: rgba(255,255,255,.04);
  border-color: rgba(196,149,58,.34);
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-route-summary {
  min-height: 430px !important;
  padding: 20px !important;
  border-color: rgba(196,149,58,.20) !important;
  background:
    radial-gradient(circle at 75% 30%, rgba(196,149,58,.12), transparent 28%),
    linear-gradient(180deg, rgba(14,29,39,.76), rgba(7,18,26,.88)) !important;
  color: #f8ead0;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-summary-header p,
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-country-text small,
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-country-text em,
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-story-note span {
  color: rgba(248,234,208,.76) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-country-node {
  min-height: 118px;
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(196,149,58,.22) !important;
  color: #f8ead0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 14px 28px rgba(0,0,0,.16);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-country-text strong {
  color: #fff2d5 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-arrow {
  justify-self: center;
  transform: rotate(90deg);
  background: linear-gradient(180deg, #e0bd72, #a76c24) !important;
  color: #fff6de;
  border-color: rgba(90,55,16,.30) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-mini-legend span,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-country-chip {
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(196,149,58,.18) !important;
  color: #f8ead0 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-story-note {
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(196,149,58,.16) !important;
  color: #fff2d5;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item {
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(196,149,58,.18) !important;
  color: #f8ead0;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item strong { color: #fff3d9; }
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item small { color: rgba(248,234,208,.72); }
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item > span {
  background: linear-gradient(180deg, rgba(196,149,58,.34), rgba(138,90,32,.26)) !important;
  color: #f8ead0;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card {
  min-height: 205px;
  padding: 16px 18px;
  border: 1px solid rgba(196,149,58,.18);
  border-radius: 16px;
  background:
    radial-gradient(circle at 84% 88%, rgba(196,149,58,.16), transparent 36%),
    rgba(255,255,255,.045) !important;
  color: #f8ead0;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card strong { color: #fff3d9; }
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card p { color: rgba(248,234,208,.78); }
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card small { color: var(--premium-gold-2); }


/* V16.3.3.1 — Ícones preservados em todos os temas */
.nav-link {
  display: flex;
  align-items: center;
  gap: 10px;
}
.nav-link::before {
  display: inline-grid;
  place-items: center;
  width: 18px;
  min-width: 18px;
  color: currentColor;
  opacity: .92;
  font-size: .94rem;
}
.nav-link[data-view="dashboard"]::before { content: '🏠'; }
.nav-link[data-view="people"]::before { content: '👥'; }
.nav-link[data-view="tree"]::before { content: '🌳'; }
.nav-link[data-view="familyCenter"]::before { content: '🏛️'; }
.nav-link[data-view="timeline"]::before { content: '📅'; }
.nav-link[data-view="memoriesWall"]::before { content: '💝'; }
.nav-link[data-view="originsMap"]::before { content: '🗺️'; }
.nav-link[data-view="requests"]::before { content: '✉️'; }
.nav-link[data-view="approvals"]::before { content: '✅'; }
.nav-link[data-view="administration"]::before { content: '⚙️'; }
.nav-link[data-view="licensing"]::before { content: '📜'; }
.nav-link[data-view="audit"]::before { content: '🔍'; }


/* V16.3.4 — Design Global Premium + Ícones Unificados */
:root {
  --icon-home: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2010.5%2012%203l9%207.5%27%2F%3E%3Cpath%20d%3D%27M5.5%209.5V20h13V9.5%27%2F%3E%3Cpath%20d%3D%27M9.5%2020v-5.5h5V20%27%2F%3E%3C%2Fsvg%3E");
  --icon-people: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M16%2021v-1.5a4.5%204.5%200%200%200-4.5-4.5h-2A4.5%204.5%200%200%200%205%2019.5V21%27%2F%3E%3Ccircle%20cx%3D%2710.5%27%20cy%3D%277%27%20r%3D%273.5%27%2F%3E%3Cpath%20d%3D%27M18%2020v-1a3.5%203.5%200%200%200-2.7-3.4%27%2F%3E%3Cpath%20d%3D%27M14.8%204.2A3.2%203.2%200%200%201%2018%207.4a3.2%203.2%200%200%201-1.4%202.6%27%2F%3E%3C%2Fsvg%3E");
  --icon-tree: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2021v-5%27%2F%3E%3Cpath%20d%3D%27M12%2010v3%27%2F%3E%3Cpath%20d%3D%27M7%2021h10%27%2F%3E%3Cpath%20d%3D%27M12%2013a4%204%200%200%200%204-4%204.8%204.8%200%200%200-.2-1.2A4.8%204.8%200%200%200%2012%203a4.8%204.8%200%200%200-3.8%204.8A4%204%200%200%200%2012%2013Z%27%2F%3E%3C%2Fsvg%3E");
  --icon-shield: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%203%205.5%205.5v5.8c0%204.2%202.7%208%206.5%209.7%203.8-1.7%206.5-5.5%206.5-9.7V5.5L12%203Z%27%2F%3E%3Cpath%20d%3D%27M9.2%2012.1%2011%2013.9l3.8-3.8%27%2F%3E%3C%2Fsvg%3E");
  --icon-clock: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%278.5%27%2F%3E%3Cpath%20d%3D%27M12%207.5V12l3%202%27%2F%3E%3C%2Fsvg%3E");
  --icon-book: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4.5%205.5h7a3%203%200%200%201%203%203V19a3%203%200%200%200-3-3h-7Z%27%2F%3E%3Cpath%20d%3D%27M19.5%205.5h-7a3%203%200%200%200-3%203V19a3%203%200%200%201%203-3h7Z%27%2F%3E%3C%2Fsvg%3E");
  --icon-map: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M8%206%203.5%207.5v11L8%2017l8%201.5%204.5-1.5V6L16%207.5%208%206Z%27%2F%3E%3Cpath%20d%3D%27M8%206v11%27%2F%3E%3Cpath%20d%3D%27M16%207.5v11%27%2F%3E%3C%2Fsvg%3E");
  --icon-mail: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%206.5h16v11H4Z%27%2F%3E%3Cpath%20d%3D%27m5%208%207%205%207-5%27%2F%3E%3C%2Fsvg%3E");
  --icon-check: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%278.5%27%2F%3E%3Cpath%20d%3D%27m8.5%2012.2%202.2%202.2%204.8-5%27%2F%3E%3C%2Fsvg%3E");
  --icon-gear: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%273.2%27%2F%3E%3Cpath%20d%3D%27M12%203.8v2.1%27%2F%3E%3Cpath%20d%3D%27M12%2018.1v2.1%27%2F%3E%3Cpath%20d%3D%27m5.9%205.9%201.5%201.5%27%2F%3E%3Cpath%20d%3D%27m16.6%2016.6%201.5%201.5%27%2F%3E%3Cpath%20d%3D%27M3.8%2012h2.1%27%2F%3E%3Cpath%20d%3D%27M18.1%2012h2.1%27%2F%3E%3Cpath%20d%3D%27m5.9%2018.1%201.5-1.5%27%2F%3E%3Cpath%20d%3D%27m16.6%207.4%201.5-1.5%27%2F%3E%3C%2Fsvg%3E");
  --icon-badge: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%203.5%205.8%206.1v4.8c0%203.8%202.5%207.2%206.2%208.8%203.7-1.6%206.2-5%206.2-8.8V6.1L12%203.5Z%27%2F%3E%3Cpath%20d%3D%27M9.2%2012.3%2011%2014l3.8-3.8%27%2F%3E%3C%2Fsvg%3E");
  --icon-audit: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M14%2014%2019%2019%27%2F%3E%3Ccircle%20cx%3D%2710%27%20cy%3D%2710%27%20r%3D%275.5%27%2F%3E%3Cpath%20d%3D%27M8.2%2010.2h3.6%27%2F%3E%3Cpath%20d%3D%27M10%208.4v3.6%27%2F%3E%3C%2Fsvg%3E");
  --icon-camera: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%208.5h3l1.4-2h7.2l1.4%202H20v9H4Z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2713%27%20r%3D%273.5%27%2F%3E%3C%2Fsvg%3E");
  --icon-calendar: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M5%206.5h14v12H5Z%27%2F%3E%3Cpath%20d%3D%27M5%2010.2h14%27%2F%3E%3Cpath%20d%3D%27M8%204.5v4%27%2F%3E%3Cpath%20d%3D%27M16%204.5v4%27%2F%3E%3C%2Fsvg%3E");
  --icon-user-plus: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%279%27%20cy%3D%278%27%20r%3D%273.2%27%2F%3E%3Cpath%20d%3D%27M3.8%2019a5.2%205.2%200%200%201%2010.4%200%27%2F%3E%3Cpath%20d%3D%27M18%208v6%27%2F%3E%3Cpath%20d%3D%27M15%2011h6%27%2F%3E%3C%2Fsvg%3E");
  --icon-document: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M7%203.8h7l3.5%203.5V20H7Z%27%2F%3E%3Cpath%20d%3D%27M14%203.8v4h4%27%2F%3E%3Cpath%20d%3D%27M9%2012h6%27%2F%3E%3Cpath%20d%3D%27M9%2015h6%27%2F%3E%3C%2Fsvg%3E");
  --icon-feather: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20%204.5c-4%200-8.3%201.6-10.9%204.2-2.4%202.4-3.6%205.6-4.1%208.3l3.1%201c2.7-.5%205.9-1.7%208.3-4.1%202.6-2.6%204.2-6.9%204.2-10.9Z%27%2F%3E%3Cpath%20d%3D%27M8.2%2015.8%2015%209%27%2F%3E%3C%2Fsvg%3E");
  --icon-pencil: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27m4%2020%204.2-1%209.4-9.4-3.2-3.2L5%2015.8%204%2020Z%27%2F%3E%3Cpath%20d%3D%27m12.8%205.2%203.2%203.2%27%2F%3E%3C%2Fsvg%3E");
  --icon-trash: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M5.5%207.2h13%27%2F%3E%3Cpath%20d%3D%27M9%207.2V5.4h6v1.8%27%2F%3E%3Cpath%20d%3D%27M7.2%207.2%208%2019h8l.8-11.8%27%2F%3E%3Cpath%20d%3D%27M10%2010.2v5.8%27%2F%3E%3Cpath%20d%3D%27M14%2010.2v5.8%27%2F%3E%3C%2Fsvg%3E");
}

html[data-theme="escuro"] { color-scheme: dark; }
html[data-theme="escuro"] body {
  --premium-ink: #08131a;
  --premium-ink-2: #0d1b24;
  --premium-gold: #c4953a;
  --premium-gold-2: #e0bd72;
  --premium-line: rgba(196,149,58,.30);
  --premium-surface: rgba(8,22,31,.88);
  --premium-surface-2: rgba(10,28,39,.92);
  --premium-text: #f8ead0;
  --premium-heading: #fff4dc;
  --premium-muted: rgba(248,234,208,.78);
  background: radial-gradient(circle at 74% -10%, rgba(196,149,58,.16), transparent 28rem), radial-gradient(circle at 14% 14%, rgba(255,255,255,.05), transparent 22rem), linear-gradient(135deg, #071118 0%, #0b151c 54%, #141007 100%) !important;
  color: var(--premium-text);
}
html[data-theme="escuro"] .sidebar { background: radial-gradient(circle at top, rgba(196,149,58,.14), transparent 16rem), linear-gradient(180deg, rgba(5,15,22,.98), rgba(3,10,15,.98)) !important; border-right: 1px solid rgba(196,149,58,.22) !important; box-shadow: 16px 0 42px rgba(0,0,0,.24); color: var(--premium-text); }
html[data-theme="escuro"] .brand { border-bottom: 1px solid rgba(196,149,58,.18); }
html[data-theme="escuro"] .brand strong { color: var(--premium-heading); }
html[data-theme="escuro"] .brand span { color: var(--premium-gold-2); }
html[data-theme="escuro"] .main { background: linear-gradient(180deg, rgba(255,255,255,.02), transparent 240px), radial-gradient(circle at 88% 0%, rgba(196,149,58,.11), transparent 28rem); }
html[data-theme="escuro"] .topbar { background: rgba(5,14,20,.72); border-bottom: 1px solid rgba(196,149,58,.18); backdrop-filter: blur(18px); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
html[data-theme="escuro"] .topbar h1, html[data-theme="escuro"] .view h2, html[data-theme="escuro"] .view h3, html[data-theme="escuro"] .view strong { color: var(--premium-heading); }
html[data-theme="escuro"] .topbar p, html[data-theme="escuro"] .muted, html[data-theme="escuro"] small, html[data-theme="escuro"] label, html[data-theme="escuro"] .field-hint, html[data-theme="escuro"] .empty-state { color: var(--premium-muted); }
html[data-theme="escuro"] .theme-picker select, html[data-theme="escuro"] .user-mini, html[data-theme="escuro"] .sidebar-footer .button, html[data-theme="escuro"] input, html[data-theme="escuro"] select, html[data-theme="escuro"] textarea { background: rgba(7,18,26,.82) !important; border-color: rgba(196,149,58,.28) !important; color: var(--premium-text) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
html[data-theme="escuro"] input::placeholder, html[data-theme="escuro"] textarea::placeholder { color: rgba(248,234,208,.46); }
html[data-theme="escuro"] .button, html[data-theme="escuro"] .button.ghost, html[data-theme="escuro"] .button.secondary { background: rgba(8,20,28,.78); border-color: rgba(196,149,58,.28); color: var(--premium-text); }
html[data-theme="escuro"] .button.primary { background: linear-gradient(135deg, rgba(203,154,72,.95), rgba(120,79,28,.92)); border-color: rgba(230,197,127,.42); color: #fff6e3; box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 12px 26px rgba(0,0,0,.22); }
html[data-theme="escuro"] .button:hover, html[data-theme="escuro"] .button.active, html[data-theme="escuro"] .button.ghost:hover, html[data-theme="escuro"] .nav-link:hover, html[data-theme="escuro"] .nav-link.active { background: linear-gradient(135deg, rgba(196,149,58,.36), rgba(119,76,26,.18)); border-color: rgba(196,149,58,.30); color: #fff4dc; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 26px rgba(0,0,0,.18); }
html[data-theme="escuro"] .panel, html[data-theme="escuro"] .people-card, html[data-theme="escuro"] .request-card, html[data-theme="escuro"] .audit-card, html[data-theme="escuro"] .origin-card, html[data-theme="escuro"] .memory-card, html[data-theme="escuro"] .document-card, html[data-theme="escuro"] .relation-card, html[data-theme="escuro"] .profile-tab-panel, html[data-theme="escuro"] .person-memorial-shell, html[data-theme="escuro"] .admin-user-card, html[data-theme="escuro"] .audit-summary-card, html[data-theme="escuro"] .route-path-card { background: linear-gradient(180deg, rgba(10,26,37,.96), rgba(7,17,24,.96)) padding-box, linear-gradient(135deg, rgba(196,149,58,.36), rgba(196,149,58,.08)) border-box !important; border: 1px solid transparent !important; box-shadow: 0 18px 40px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.03); color: var(--premium-text); }
html[data-theme="escuro"] .people-meta span, html[data-theme="escuro"] .origin-tags span, html[data-theme="escuro"] .feature-checklist span, html[data-theme="escuro"] .tree-legend span, html[data-theme="escuro"] .timeline-type-pill, html[data-theme="escuro"] .country-badge, html[data-theme="escuro"] .origin-location-pill { background: rgba(255,255,255,.04) !important; border: 1px solid rgba(196,149,58,.18) !important; color: var(--premium-text) !important; }
html[data-theme="escuro"] .people-card:hover, html[data-theme="escuro"] .origin-card:hover, html[data-theme="escuro"] .memory-card:hover, html[data-theme="escuro"] .request-card:hover, html[data-theme="escuro"] .audit-card:hover { transform: translateY(-2px); box-shadow: 0 22px 46px rgba(0,0,0,.30), 0 0 0 1px rgba(196,149,58,.18); }
html[data-theme="escuro"] .timeline-year, html[data-theme="escuro"] .origin-stat, html[data-theme="escuro"] .eyebrow { background: rgba(196,149,58,.10); border: 1px solid rgba(196,149,58,.22); color: var(--premium-gold-2); }
html[data-theme="escuro"] .timeline-list::before { background: linear-gradient(180deg, rgba(196,149,58,.38), rgba(196,149,58,.10)); }
html[data-theme="escuro"] .timeline-medallion, html[data-theme="escuro"] .dashboard-mini-medal { background: radial-gradient(circle at 30% 30%, #f0d28d, #c4953a 62%, #7c551f 100%); color: #2b1706; box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 10px 22px rgba(0,0,0,.24); }
html[data-theme="escuro"] .toolbar { margin-bottom: 18px; }
html[data-theme="escuro"] .search-wrap input { width: 100%; }
html[data-theme="escuro"] body:not([data-active-view="dashboard"]) .view { max-width: 1660px; margin: 0 auto; }
html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #peopleView, html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #familyCenterView, html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #timelineView, html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #memoriesWallView, html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #originsMapView, html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #requestsView, html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #approvalsView, html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #administrationView, html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #licensingView, html[data-theme="escuro"] body:not([data-active-view="dashboard"]) #auditView { padding-top: 8px; }
html[data-theme="escuro"] .dashboard-panel, html[data-theme="escuro"] .dashboard-feed-item, html[data-theme="escuro"] .dashboard-mini-event, html[data-theme="escuro"] .today-history-card, html[data-theme="escuro"] .dashboard-country-list, html[data-theme="escuro"] .dashboard-origin-map, html[data-theme="escuro"] .dashboard-action-button, html[data-theme="escuro"] .family-chapter-card { background: linear-gradient(180deg, rgba(10,26,37,.96), rgba(7,17,24,.96)) padding-box, linear-gradient(135deg, rgba(196,149,58,.36), rgba(196,149,58,.08)) border-box !important; border: 1px solid transparent !important; color: var(--premium-text) !important; }
html[data-theme="escuro"] .dashboard-birthday-panel, html[data-theme="escuro"] .dashboard-origins-panel, html[data-theme="escuro"] .dashboard-today-panel { background: linear-gradient(180deg, rgba(10,26,37,.98), rgba(7,17,24,.98)) padding-box, linear-gradient(135deg, rgba(196,149,58,.38), rgba(196,149,58,.10)) border-box !important; border: 1px solid transparent !important; }
html[data-theme="escuro"] .dashboard-feed-item:hover, html[data-theme="escuro"] .dashboard-mini-event:hover, html[data-theme="escuro"] .dashboard-action-button:hover, html[data-theme="escuro"] .family-chapter-card:hover { box-shadow: 0 16px 34px rgba(0,0,0,.24), 0 0 0 1px rgba(196,149,58,.18); transform: translateY(-1px); }

.nav-link { display: flex; align-items: center; gap: 10px; }
.nav-link::before, .ui-icon, .icon-button::before, .photo-icon-edit::before, .photo-icon-delete::before { content: "" !important; display: inline-block; background-color: currentColor; -webkit-mask-position: center; mask-position: center; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: contain; mask-size: contain; }
.nav-link::before { width: 18px; min-width: 18px; height: 18px; opacity: .92; -webkit-mask-image: var(--nav-icon); mask-image: var(--nav-icon); }
.nav-link[data-view="dashboard"] { --nav-icon: var(--icon-home); }
.nav-link[data-view="people"] { --nav-icon: var(--icon-people); }
.nav-link[data-view="tree"] { --nav-icon: var(--icon-tree); }
.nav-link[data-view="familyCenter"] { --nav-icon: var(--icon-shield); }
.nav-link[data-view="timeline"] { --nav-icon: var(--icon-clock); }
.nav-link[data-view="memoriesWall"] { --nav-icon: var(--icon-book); }
.nav-link[data-view="originsMap"] { --nav-icon: var(--icon-map); }
.nav-link[data-view="requests"] { --nav-icon: var(--icon-mail); }
.nav-link[data-view="approvals"] { --nav-icon: var(--icon-check); }
.nav-link[data-view="administration"] { --nav-icon: var(--icon-gear); }
.nav-link[data-view="licensing"] { --nav-icon: var(--icon-badge); }
.nav-link[data-view="audit"] { --nav-icon: var(--icon-audit); }
.ui-icon { width: 18px; height: 18px; color: currentColor; -webkit-mask-image: var(--ui-icon); mask-image: var(--ui-icon); }
.ui-icon[data-icon="people"] { --ui-icon: var(--icon-people); }
.ui-icon[data-icon="tree"] { --ui-icon: var(--icon-tree); }
.ui-icon[data-icon="camera"] { --ui-icon: var(--icon-camera); }
.ui-icon[data-icon="book"] { --ui-icon: var(--icon-book); }
.ui-icon[data-icon="map"] { --ui-icon: var(--icon-map); }
.ui-icon[data-icon="calendar"] { --ui-icon: var(--icon-calendar); }
.ui-icon[data-icon="user-plus"] { --ui-icon: var(--icon-user-plus); }
.ui-icon[data-icon="document"] { --ui-icon: var(--icon-document); }
.ui-icon[data-icon="feather"] { --ui-icon: var(--icon-feather); }
.ui-icon[data-icon="mail"] { --ui-icon: var(--icon-mail); }
.metric-icon { width: 1.45rem; height: 1.45rem; color: var(--premium-gold); }
.action-icon { width: 1.15rem; height: 1.15rem; color: var(--premium-gold); }
.dashboard-feed-icon { width: 1rem; height: 1rem; color: var(--premium-gold); }
.dashboard-action-button span.ui-icon, .dashboard-metric-card span.ui-icon { font-size: 0 !important; line-height: 1; }
.icon-button, .photo-icon-edit, .photo-icon-delete { font-size: 0 !important; line-height: 1; color: currentColor; }
.icon-button::before, .photo-icon-edit::before, .photo-icon-delete::before { width: 14px; height: 14px; }
.edit-person::before, .photo-icon-edit::before { -webkit-mask-image: var(--icon-pencil); mask-image: var(--icon-pencil); }
.delete-person::before, .photo-icon-delete::before { -webkit-mask-image: var(--icon-trash); mask-image: var(--icon-trash); }
.photo-icon-delete, .delete-person { color: #e2a6a0; }

html[data-theme="pergaminho"] .nav-link::before, html[data-theme="claro"] .nav-link::before { opacity: .88; }


/* V16.3.4.2 — Correção definitiva de tema escuro e ícones premium
   - Remove símbolos tipo baralho no menu e botões.
   - Mantém ícones SVG monoline.
   - Corrige cards-resumo do Mapa das Origens e Permissões do Sistema. */

/* Ícones SVG do menu: força máscara mesmo quando regras antigas tentam colocar texto */
.nav-link[data-view]::before {
  content: "" !important;
  display: inline-block !important;
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  opacity: .95 !important;
  background-color: currentColor !important;
  color: inherit !important;
  font-size: 0 !important;
  line-height: 0 !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
}
.nav-link[data-view="dashboard"]::before { -webkit-mask-image: var(--icon-home) !important; mask-image: var(--icon-home) !important; }
.nav-link[data-view="people"]::before { -webkit-mask-image: var(--icon-people) !important; mask-image: var(--icon-people) !important; }
.nav-link[data-view="tree"]::before { -webkit-mask-image: var(--icon-tree) !important; mask-image: var(--icon-tree) !important; }
.nav-link[data-view="familyCenter"]::before { -webkit-mask-image: var(--icon-shield) !important; mask-image: var(--icon-shield) !important; }
.nav-link[data-view="timeline"]::before { -webkit-mask-image: var(--icon-clock) !important; mask-image: var(--icon-clock) !important; }
.nav-link[data-view="memoriesWall"]::before { -webkit-mask-image: var(--icon-book) !important; mask-image: var(--icon-book) !important; }
.nav-link[data-view="originsMap"]::before { -webkit-mask-image: var(--icon-map) !important; mask-image: var(--icon-map) !important; }
.nav-link[data-view="requests"]::before { -webkit-mask-image: var(--icon-mail) !important; mask-image: var(--icon-mail) !important; }
.nav-link[data-view="approvals"]::before { -webkit-mask-image: var(--icon-check) !important; mask-image: var(--icon-check) !important; }
.nav-link[data-view="administration"]::before { -webkit-mask-image: var(--icon-gear) !important; mask-image: var(--icon-gear) !important; }
.nav-link[data-view="licensing"]::before { -webkit-mask-image: var(--icon-badge) !important; mask-image: var(--icon-badge) !important; }
.nav-link[data-view="audit"]::before { -webkit-mask-image: var(--icon-audit) !important; mask-image: var(--icon-audit) !important; }

/* Botões de editar/excluir: remove caracteres antigos ✎ / 🗑 e usa SVG */
.people-card .icon-button.edit-person::before,
.people-card .icon-button.delete-person::before,
.icon-button.edit-person::before,
.icon-button.delete-person::before,
.photo-icon-edit::before,
.photo-icon-delete::before {
  content: "" !important;
  display: inline-block !important;
  width: 15px !important;
  height: 15px !important;
  background-color: currentColor !important;
  font-size: 0 !important;
  line-height: 0 !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
}
.people-card .icon-button.edit-person::before,
.icon-button.edit-person::before,
.photo-icon-edit::before {
  -webkit-mask-image: var(--icon-pencil) !important;
  mask-image: var(--icon-pencil) !important;
}
.people-card .icon-button.delete-person::before,
.icon-button.delete-person::before,
.photo-icon-delete::before {
  -webkit-mask-image: var(--icon-trash) !important;
  mask-image: var(--icon-trash) !important;
}

/* Tema escuro: padroniza páginas internas com a Home */
html[data-theme="escuro"] body {
  --premium-ink: #071118;
  --premium-ink-2: #0b151c;
  --premium-gold: #c4953a;
  --premium-gold-2: #e0bd72;
  --premium-line: rgba(196, 149, 58, .28);
  --premium-text: #f8ead0;
  --premium-heading: #fff4dc;
  --premium-muted: rgba(248, 234, 208, .74);
  background:
    radial-gradient(circle at 76% -10%, rgba(196,149,58,.16), transparent 30rem),
    linear-gradient(135deg, #071118 0%, #0b151c 55%, #151109 100%) !important;
  color: var(--premium-text) !important;
}
html[data-theme="escuro"] .main {
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), transparent 260px),
    radial-gradient(circle at 86% 0%, rgba(196,149,58,.10), transparent 30rem) !important;
}
html[data-theme="escuro"] .topbar {
  background: rgba(5,14,20,.76) !important;
  border-bottom: 1px solid rgba(196,149,58,.18) !important;
  color: var(--premium-text) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.16) !important;
}
html[data-theme="escuro"] .topbar h1,
html[data-theme="escuro"] .view h2,
html[data-theme="escuro"] .view h3 {
  color: var(--premium-heading) !important;
}
html[data-theme="escuro"] .topbar p,
html[data-theme="escuro"] .muted,
html[data-theme="escuro"] small,
html[data-theme="escuro"] label,
html[data-theme="escuro"] .field-hint {
  color: var(--premium-muted) !important;
}

/* Botões, busca e filtros — sem azul/ciano fora da Home */
html[data-theme="escuro"] .button,
html[data-theme="escuro"] .button.ghost,
html[data-theme="escuro"] .button.secondary,
html[data-theme="escuro"] .button.mini {
  background: rgba(7,18,26,.78) !important;
  border: 1px solid rgba(196,149,58,.28) !important;
  color: var(--premium-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}
html[data-theme="escuro"] .button.primary {
  background: linear-gradient(135deg, rgba(203,154,72,.96), rgba(120,79,28,.94)) !important;
  border-color: rgba(230,197,127,.42) !important;
  color: #fff6e3 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 12px 26px rgba(0,0,0,.22) !important;
}
html[data-theme="escuro"] .button:hover,
html[data-theme="escuro"] .button.ghost:hover,
html[data-theme="escuro"] .button.secondary:hover,
html[data-theme="escuro"] .nav-link:hover,
html[data-theme="escuro"] .nav-link.active {
  background: linear-gradient(135deg, rgba(196,149,58,.34), rgba(119,76,26,.18)) !important;
  border-color: rgba(196,149,58,.34) !important;
  color: #fff4dc !important;
}
html[data-theme="escuro"] input,
html[data-theme="escuro"] select,
html[data-theme="escuro"] textarea {
  background: rgba(7,18,26,.82) !important;
  border-color: rgba(196,149,58,.25) !important;
  color: var(--premium-text) !important;
}
html[data-theme="escuro"] input::placeholder,
html[data-theme="escuro"] textarea::placeholder {
  color: rgba(248,234,208,.48) !important;
}

/* Cards e painéis internos */
html[data-theme="escuro"] .panel,
html[data-theme="escuro"] .people-card,
html[data-theme="escuro"] .request-card,
html[data-theme="escuro"] .audit-card,
html[data-theme="escuro"] .origin-card,
html[data-theme="escuro"] .memory-card,
html[data-theme="escuro"] .document-card,
html[data-theme="escuro"] .relation-card,
html[data-theme="escuro"] .profile-tab-panel,
html[data-theme="escuro"] .person-memorial-shell,
html[data-theme="escuro"] .admin-user-card,
html[data-theme="escuro"] .audit-summary-card,
html[data-theme="escuro"] .route-path-card,
html[data-theme="escuro"] .timeline-event-card {
  background:
    linear-gradient(180deg, rgba(10,26,37,.96), rgba(7,17,24,.96)) padding-box,
    linear-gradient(135deg, rgba(196,149,58,.34), rgba(196,149,58,.07)) border-box !important;
  border: 1px solid transparent !important;
  color: var(--premium-text) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.03) !important;
}
html[data-theme="escuro"] .people-card::before {
  background: linear-gradient(90deg, rgba(224,189,114,.9), rgba(196,149,58,.35), transparent) !important;
}
html[data-theme="escuro"] .people-card h3,
html[data-theme="escuro"] .people-card strong,
html[data-theme="escuro"] .origin-top strong,
html[data-theme="escuro"] .memory-card strong,
html[data-theme="escuro"] .request-card strong {
  color: var(--premium-heading) !important;
}
html[data-theme="escuro"] .people-meta span,
html[data-theme="escuro"] .origin-tags span,
html[data-theme="escuro"] .feature-checklist span,
html[data-theme="escuro"] .tree-legend span,
html[data-theme="escuro"] .timeline-type-pill,
html[data-theme="escuro"] .country-badge,
html[data-theme="escuro"] .origin-location-pill,
html[data-theme="escuro"] .role-guide span {
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(196,149,58,.18) !important;
  color: var(--premium-text) !important;
}
html[data-theme="escuro"] .people-card .icon-button {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(196,149,58,.22) !important;
  color: var(--premium-gold-2) !important;
}
html[data-theme="escuro"] .people-card .icon-button.delete-person {
  color: #e2a6a0 !important;
}

/* Mapa das Origens: cards-resumo no mesmo padrão da Home */
html[data-theme="escuro"] #originsSummary.origins-summary {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1rem !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat {
  min-height: 7rem !important;
  padding: 1.35rem 1.35rem 1.25rem 5.75rem !important;
  border-radius: 1.2rem !important;
  background:
    radial-gradient(circle at top right, rgba(214,163,74,.14), transparent 32%),
    linear-gradient(135deg, rgba(7,19,33,.98), rgba(10,30,56,.96)) !important;
  border: 1px solid rgba(194,151,77,.24) !important;
  box-shadow: 0 18px 36px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.04) !important;
  color: var(--premium-text) !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat::before {
  left: 1.2rem !important;
  top: 1.15rem !important;
  width: 3.25rem !important;
  height: 3.25rem !important;
  font-size: 1.55rem !important;
  color: #f3d188 !important;
  background: linear-gradient(135deg, rgba(26,52,84,.92), rgba(12,28,49,.98)) !important;
  border: 1px solid rgba(214,163,74,.28) !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat strong,
html[data-theme="escuro"] #originsSummary .origin-stat span {
  display: block !important;
  margin-left: 0 !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat strong {
  color: #fff4d8 !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat span {
  color: #d5b97b !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat.wide strong {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: .45rem !important;
  font-size: 1.22rem !important;
  line-height: 1.28 !important;
}

/* Administração / Permissões */
html[data-theme="escuro"] .checkbox-card.admin-checkbox,
html[data-theme="escuro"] .checkbox-card {
  min-height: 3.7rem !important;
  border-radius: 1rem !important;
  border: 1px solid rgba(194,151,77,.22) !important;
  background:
    radial-gradient(circle at right top, rgba(214,163,74,.09), transparent 30%),
    linear-gradient(135deg, rgba(7,19,33,.97), rgba(10,30,56,.95)) !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.04) !important;
  color: #f3e4ba !important;
}
html[data-theme="escuro"] .checkbox-card.admin-checkbox span,
html[data-theme="escuro"] .checkbox-card span {
  color: #f5e7c5 !important;
}
html[data-theme="escuro"] .checkbox-card.admin-checkbox input,
html[data-theme="escuro"] .checkbox-card input {
  accent-color: #d2a24b !important;
}
html[data-theme="escuro"] .admin-user-card {
  background:
    radial-gradient(circle at top right, rgba(214,163,74,.07), transparent 28%),
    linear-gradient(135deg, rgba(7,19,33,.97), rgba(10,30,56,.95)) !important;
  border-color: rgba(194,151,77,.18) !important;
}

/* Home: garante que ícones SVG não voltem aos símbolos antigos */
.dashboard-metric-card .ui-icon,
.dashboard-action-button .ui-icon,
.dashboard-feed-item .ui-icon {
  display: inline-block !important;
  background-color: currentColor !important;
  color: var(--premium-gold, #c4953a) !important;
  font-size: 0 !important;
  line-height: 0 !important;
}
.dashboard-metric-card > span:not(.ui-icon),
.dashboard-action-button > span:not(.ui-icon) {
  font-size: 0 !important;
}
@media (max-width: 980px) {
  html[data-theme="escuro"] #originsSummary.origins-summary {
    grid-template-columns: 1fr !important;
  }
}

/* V16.3.4.3 — Correção cuidadosa: tema escuro único + ícones SVG reais
   Mantém o tema Pergaminho como está e só corrige o Tema Escuro. */
html[data-theme="escuro"] body {
  --memorial-bg-0: #050b0f;
  --memorial-bg-1: #071118;
  --memorial-bg-2: #0b1720;
  --memorial-panel: rgba(7, 18, 26, .94);
  --memorial-panel-2: rgba(10, 27, 38, .94);
  --memorial-gold: #c4953a;
  --memorial-gold-soft: #e0bd72;
  --memorial-line: rgba(196, 149, 58, .30);
  --memorial-text: #f8ead0;
  --memorial-title: #fff4dc;
  --memorial-muted: rgba(248, 234, 208, .74);
  background:
    radial-gradient(circle at 74% -12%, rgba(196,149,58,.15), transparent 31rem),
    radial-gradient(circle at 18% 12%, rgba(255,244,214,.06), transparent 26rem),
    linear-gradient(135deg, var(--memorial-bg-1), var(--memorial-bg-0) 58%, #151008) !important;
  color: var(--memorial-text) !important;
}

html[data-theme="escuro"] .app-shell,
html[data-theme="escuro"] .main {
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), transparent 260px),
    radial-gradient(circle at 88% 0%, rgba(196,149,58,.10), transparent 26rem),
    linear-gradient(135deg, var(--memorial-bg-1), var(--memorial-bg-0) 60%, #151008) !important;
}

html[data-theme="escuro"] .sidebar {
  background:
    radial-gradient(circle at top, rgba(196,149,58,.14), transparent 16rem),
    linear-gradient(180deg, rgba(5,15,22,.98), rgba(3,10,15,.98)) !important;
  border-right: 1px solid rgba(196,149,58,.22) !important;
  color: var(--memorial-text) !important;
}

html[data-theme="escuro"] .topbar,
html[data-theme="escuro"] body:not([data-active-view="dashboard"]) .topbar {
  background: rgba(5,14,20,.72) !important;
  border-bottom: 1px solid rgba(196,149,58,.18) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.16) !important;
}

html[data-theme="escuro"] .topbar h1,
html[data-theme="escuro"] .view h2,
html[data-theme="escuro"] .view h3,
html[data-theme="escuro"] .panel h2,
html[data-theme="escuro"] .panel h3,
html[data-theme="escuro"] .people-card h3,
html[data-theme="escuro"] .timeline-event-top strong,
html[data-theme="escuro"] .origin-top strong,
html[data-theme="escuro"] .memory-card strong,
html[data-theme="escuro"] .request-card strong,
html[data-theme="escuro"] .audit-card strong,
html[data-theme="escuro"] .family-card .tree-card-name {
  color: var(--memorial-title) !important;
}

html[data-theme="escuro"] .topbar p,
html[data-theme="escuro"] .muted,
html[data-theme="escuro"] label,
html[data-theme="escuro"] small,
html[data-theme="escuro"] .field-hint,
html[data-theme="escuro"] .empty-state,
html[data-theme="escuro"] .timeline-event-body p,
html[data-theme="escuro"] .timeline-event-body small,
html[data-theme="escuro"] .origin-body p,
html[data-theme="escuro"] .origin-top span,
html[data-theme="escuro"] .origin-body small,
html[data-theme="escuro"] .memory-card p,
html[data-theme="escuro"] .request-card p,
html[data-theme="escuro"] .audit-card p,
html[data-theme="escuro"] .tree-card-location,
html[data-theme="escuro"] .tree-card-dates,
html[data-theme="escuro"] .tree-card-meta,
html[data-theme="escuro"] .tree-card-profession {
  color: var(--memorial-muted) !important;
}

html[data-theme="escuro"] .panel,
html[data-theme="escuro"] .people-card,
html[data-theme="escuro"] .request-card,
html[data-theme="escuro"] .audit-card,
html[data-theme="escuro"] .origin-card,
html[data-theme="escuro"] .memory-card,
html[data-theme="escuro"] .document-card,
html[data-theme="escuro"] .relation-card,
html[data-theme="escuro"] .profile-tab-panel,
html[data-theme="escuro"] .admin-user-card,
html[data-theme="escuro"] .audit-summary-card,
html[data-theme="escuro"] .route-path-card,
html[data-theme="escuro"] .timeline-event-body,
html[data-theme="escuro"] .family-card,
html[data-theme="escuro"] .memorial-card,
html[data-theme="escuro"] .memorial-stat,
html[data-theme="escuro"] .person-memorial-hero,
html[data-theme="escuro"] .person-memorial-tabs,
html[data-theme="escuro"] .person-memorial .profile-tab-panel.active {
  background:
    radial-gradient(circle at right top, rgba(196,149,58,.10), transparent 30%),
    linear-gradient(180deg, var(--memorial-panel-2), var(--memorial-panel)) padding-box,
    linear-gradient(135deg, rgba(196,149,58,.36), rgba(196,149,58,.08)) border-box !important;
  border: 1px solid transparent !important;
  color: var(--memorial-text) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.035) !important;
}

html[data-theme="escuro"] .tree-canvas,
html[data-theme="escuro"] .family-poster {
  background:
    radial-gradient(circle at 50% 0%, rgba(196,149,58,.10), transparent 34rem),
    linear-gradient(135deg, rgba(8,18,26,.96), rgba(5,11,16,.98)) !important;
  border-color: rgba(196,149,58,.22) !important;
}

html[data-theme="escuro"] .timeline-year {
  background: linear-gradient(180deg, #e8ca85, #a96c25) !important;
  border-color: rgba(255,236,181,.28) !important;
  color: #221104 !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.30) !important;
}

html[data-theme="escuro"] .timeline-list::before,
html[data-theme="escuro"] .person-life-timeline::before {
  background: linear-gradient(180deg, rgba(196,149,58,.18), rgba(224,189,114,.45), rgba(196,149,58,.15)) !important;
}

html[data-theme="escuro"] .timeline-medallion,
html[data-theme="escuro"] .timeline-dot,
html[data-theme="escuro"] .dashboard-mini-medal {
  background: radial-gradient(circle at 30% 25%, #f7e1a4, #c4953a 62%, #7b4b18 100%) !important;
  border-color: rgba(255,235,176,.28) !important;
  color: #211105 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.38), 0 12px 26px rgba(0,0,0,.25) !important;
}

html[data-theme="escuro"] input,
html[data-theme="escuro"] select,
html[data-theme="escuro"] textarea,
html[data-theme="escuro"] .theme-picker select,
html[data-theme="escuro"] .user-mini,
html[data-theme="escuro"] .sidebar-footer .button {
  background: rgba(6, 16, 23, .86) !important;
  border-color: rgba(196,149,58,.25) !important;
  color: var(--memorial-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}

html[data-theme="escuro"] input::placeholder,
html[data-theme="escuro"] textarea::placeholder {
  color: rgba(248,234,208,.45) !important;
}

html[data-theme="escuro"] .button,
html[data-theme="escuro"] .button.ghost,
html[data-theme="escuro"] .button.secondary,
html[data-theme="escuro"] .person-memorial-actions .button,
html[data-theme="escuro"] .person-memorial-actions button {
  background: rgba(7,18,26,.78) !important;
  border-color: rgba(196,149,58,.28) !important;
  color: var(--memorial-text) !important;
}

html[data-theme="escuro"] .button.primary,
html[data-theme="escuro"] .person-memorial-actions .button:first-child,
html[data-theme="escuro"] .person-memorial-actions button:first-child {
  background: linear-gradient(135deg, rgba(203,154,72,.96), rgba(122,78,27,.95)) !important;
  border-color: rgba(230,197,127,.42) !important;
  color: #fff6e3 !important;
}

html[data-theme="escuro"] .button:hover,
html[data-theme="escuro"] .button.active,
html[data-theme="escuro"] .nav-link:hover,
html[data-theme="escuro"] .nav-link.active {
  background: linear-gradient(135deg, rgba(196,149,58,.32), rgba(119,76,26,.18)) !important;
  border-color: rgba(196,149,58,.30) !important;
  color: #fff4dc !important;
}

html[data-theme="escuro"] .people-meta span,
html[data-theme="escuro"] .origin-tags span,
html[data-theme="escuro"] .feature-checklist span,
html[data-theme="escuro"] .tree-legend span,
html[data-theme="escuro"] .timeline-type-pill,
html[data-theme="escuro"] .country-badge,
html[data-theme="escuro"] .origin-location-pill,
html[data-theme="escuro"] .role-guide span,
html[data-theme="escuro"] .memorial-badges span {
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(196,149,58,.18) !important;
  color: var(--memorial-text) !important;
}
/* V22 — .tree-card-generation removido do seletor de badges globais (layout Opção 3) */

/* V22 — .tree-card-details/.tree-card-dates-row não devem ter fundo/borda própria
   (causava "caixa fantasma" sobre as linhas de data/profissão no tema escuro) */
html[data-theme="escuro"] .tree-card-details,
html[data-theme="escuro"] .tree-card-dates-row {
  background: transparent !important;
  border: 0 !important;
  color: var(--memorial-text) !important;
}

/* Mapa das Origens — os 3 cards-resumo não podem voltar para pergaminho no escuro */
html[data-theme="escuro"] #originsSummary.origins-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1rem !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat {
  min-height: 7rem !important;
  padding: 1.35rem 1.35rem 1.25rem 5.75rem !important;
  border-radius: 1.2rem !important;
  background:
    radial-gradient(circle at top right, rgba(196,149,58,.14), transparent 32%),
    linear-gradient(180deg, var(--memorial-panel-2), var(--memorial-panel)) !important;
  border: 1px solid rgba(196,149,58,.24) !important;
  box-shadow: 0 18px 36px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.04) !important;
  color: var(--memorial-text) !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat strong {
  color: var(--memorial-title) !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat span {
  color: var(--memorial-gold-soft) !important;
}
html[data-theme="escuro"] #originsSummary .origin-stat::before {
  background: linear-gradient(135deg, rgba(196,149,58,.32), rgba(7,18,26,.85)) !important;
  border: 1px solid rgba(224,189,114,.28) !important;
  color: var(--memorial-gold-soft) !important;
}

/* Administração — Permissões sem blocos brancos */
html[data-theme="escuro"] .checkbox-card,
html[data-theme="escuro"] .checkbox-card.admin-checkbox {
  min-height: 3.7rem !important;
  border-radius: 1rem !important;
  border: 1px solid rgba(196,149,58,.22) !important;
  background:
    radial-gradient(circle at right top, rgba(196,149,58,.10), transparent 30%),
    linear-gradient(180deg, var(--memorial-panel-2), var(--memorial-panel)) !important;
  color: var(--memorial-text) !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
html[data-theme="escuro"] .checkbox-card span,
html[data-theme="escuro"] .checkbox-card.admin-checkbox span {
  color: var(--memorial-text) !important;
}
html[data-theme="escuro"] .checkbox-card input,
html[data-theme="escuro"] .checkbox-card.admin-checkbox input {
  accent-color: var(--memorial-gold) !important;
}

/* Memorial da Pessoa — remove mistura cinza/pergaminho dentro do tema escuro */
html[data-theme="escuro"] .person-memorial-modal .modal-content {
  background:
    radial-gradient(circle at 75% -10%, rgba(196,149,58,.13), transparent 28rem),
    linear-gradient(135deg, var(--memorial-bg-2), var(--memorial-bg-1)) !important;
  color: var(--memorial-text) !important;
}
html[data-theme="escuro"] .person-memorial-headline h2,
html[data-theme="escuro"] .memorial-card h3,
html[data-theme="escuro"] .memorial-stat strong,
html[data-theme="escuro"] .profile-tab-panel h3 {
  color: var(--memorial-title) !important;
}
html[data-theme="escuro"] .memorial-kicker,
html[data-theme="escuro"] .memorial-route,
html[data-theme="escuro"] .memorial-quote,
html[data-theme="escuro"] .memorial-stat span {
  color: var(--memorial-muted) !important;
}
html[data-theme="escuro"] .memorial-quote {
  background: rgba(255,255,255,.045) !important;
  border-left-color: rgba(196,149,58,.34) !important;
}
html[data-theme="escuro"] .profile-tab.active,
html[data-theme="escuro"] .profile-tab:hover {
  background: rgba(196,149,58,.22) !important;
  color: var(--memorial-title) !important;
}
html[data-theme="escuro"] .profile-tab {
  color: var(--memorial-muted) !important;
}

/* Ícones SVG definitivos: impede retorno dos símbolos tipo baralho */
.nav-link::before,
.ui-icon,
.icon-button::before,
.photo-icon-edit::before,
.photo-icon-delete::before {
  content: "" !important;
  display: inline-block !important;
  background-color: currentColor !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  font-size: 0 !important;
}
.nav-link::before {
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  color: currentColor !important;
  opacity: .96 !important;
  -webkit-mask-image: var(--nav-icon) !important;
  mask-image: var(--nav-icon) !important;
}
.nav-link[data-view="dashboard"] { --nav-icon: var(--icon-home); }
.nav-link[data-view="people"] { --nav-icon: var(--icon-people); }
.nav-link[data-view="tree"] { --nav-icon: var(--icon-tree); }
.nav-link[data-view="familyCenter"] { --nav-icon: var(--icon-shield); }
.nav-link[data-view="timeline"] { --nav-icon: var(--icon-clock); }
.nav-link[data-view="memoriesWall"] { --nav-icon: var(--icon-book); }
.nav-link[data-view="originsMap"] { --nav-icon: var(--icon-map); }
.nav-link[data-view="requests"] { --nav-icon: var(--icon-mail); }
.nav-link[data-view="approvals"] { --nav-icon: var(--icon-check); }
.nav-link[data-view="administration"] { --nav-icon: var(--icon-gear); }
.nav-link[data-view="licensing"] { --nav-icon: var(--icon-badge); }
.nav-link[data-view="audit"] { --nav-icon: var(--icon-audit); }

.ui-icon,
.dashboard-metric-card > span,
.dashboard-action-button > span,
.dashboard-feed-item > span.ui-icon {
  width: 18px !important;
  height: 18px !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: var(--memorial-gold, #c4953a) !important;
  background-color: currentColor !important;
  -webkit-mask-image: var(--ui-icon) !important;
  mask-image: var(--ui-icon) !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
}
.ui-icon[data-icon="people"], .dashboard-metric-card:nth-child(1) > span { --ui-icon: var(--icon-people); }
.ui-icon[data-icon="tree"], .dashboard-metric-card:nth-child(2) > span { --ui-icon: var(--icon-tree); }
.ui-icon[data-icon="camera"], .dashboard-metric-card:nth-child(3) > span { --ui-icon: var(--icon-camera); }
.ui-icon[data-icon="book"], .dashboard-metric-card:nth-child(4) > span { --ui-icon: var(--icon-book); }
.ui-icon[data-icon="map"], .dashboard-metric-card:nth-child(5) > span { --ui-icon: var(--icon-map); }
.ui-icon[data-icon="calendar"], .dashboard-metric-card:nth-child(6) > span { --ui-icon: var(--icon-calendar); }
.ui-icon[data-icon="user-plus"], .dashboard-action-button:nth-child(1) > span { --ui-icon: var(--icon-user-plus); }
.ui-icon[data-icon="document"], .dashboard-action-button:nth-child(3) > span { --ui-icon: var(--icon-document); }
.ui-icon[data-icon="feather"], .dashboard-action-button:nth-child(5) > span { --ui-icon: var(--icon-feather); }
.ui-icon[data-icon="mail"], .dashboard-action-button:nth-child(6) > span { --ui-icon: var(--icon-mail); }

.icon-button,
.photo-icon-edit,
.photo-icon-delete {
  font-size: 0 !important;
  color: currentColor !important;
}
.icon-button::before,
.photo-icon-edit::before,
.photo-icon-delete::before {
  width: 14px !important;
  height: 14px !important;
}
.edit-person::before,
.photo-icon-edit::before { -webkit-mask-image: var(--icon-pencil) !important; mask-image: var(--icon-pencil) !important; }
.delete-person::before,
.photo-icon-delete::before { -webkit-mask-image: var(--icon-trash) !important; mask-image: var(--icon-trash) !important; }
.photo-icon-delete,
.delete-person { color: #e2a6a0 !important; }

@media (max-width: 980px) {
  html[data-theme="escuro"] #originsSummary.origins-summary {
    grid-template-columns: 1fr !important;
  }
}


/* V16.3.4.4 — Refinamento cuidadoso: Modal Memorial + Quadro da Árvore
   Mantém o que já estava correto e corrige apenas os pontos visuais apontados. */

/* Botão fechar: volta a ser um X premium visível, sem herdar máscara de ícone genérico */
#closeProfileDialog,
#closePersonDialog,
#closeDocumentDialog {
  font-size: 0 !important;
  line-height: 1 !important;
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
}

#closeProfileDialog::before,
#closePersonDialog::before,
#closeDocumentDialog::before {
  content: "×" !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  font-size: 2rem !important;
  line-height: .8 !important;
  font-weight: 300 !important;
  font-family: Georgia, "Times New Roman", serif !important;
}

html[data-theme="escuro"] #closeProfileDialog,
html[data-theme="escuro"] #closePersonDialog,
html[data-theme="escuro"] #closeDocumentDialog {
  width: 3rem !important;
  height: 3rem !important;
  border-radius: 999px !important;
  color: #fff4dc !important;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.10), transparent 36%),
    rgba(6, 17, 25, .92) !important;
  border: 1px solid rgba(224,189,114,.62) !important;
  box-shadow:
    0 12px 30px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 0 1px rgba(196,149,58,.10) !important;
}

html[data-theme="escuro"] #closeProfileDialog:hover,
html[data-theme="escuro"] #closePersonDialog:hover,
html[data-theme="escuro"] #closeDocumentDialog:hover {
  color: #fff8e9 !important;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.16), transparent 38%),
    linear-gradient(135deg, rgba(196,149,58,.36), rgba(6,17,25,.92)) !important;
  transform: translateY(-1px);
}

/* Memorial da Pessoa: acabamento mais próximo do modelo premium aprovado */
html[data-theme="escuro"] .profile-dialog {
  border-radius: 1.65rem !important;
  border: 1px solid rgba(196,149,58,.34) !important;
  background:
    radial-gradient(circle at 78% -8%, rgba(196,149,58,.12), transparent 28rem),
    linear-gradient(145deg, rgba(8,22,32,.98), rgba(4,12,18,.98)) !important;
  box-shadow:
    0 32px 80px rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.035),
    0 0 0 1px rgba(196,149,58,.10) !important;
}

html[data-theme="escuro"] .profile-dialog .dialog-header {
  align-items: center !important;
  padding: .25rem .15rem .55rem !important;
}

html[data-theme="escuro"] .profile-dialog .dialog-header h2 {
  font-family: Georgia, "Times New Roman", serif !important;
  color: #fff4dc !important;
  letter-spacing: .01em !important;
}

/* Cabeçalho do memorial no escuro: mantém premium sem virar pergaminho claro */
html[data-theme="escuro"] .person-memorial-hero {
  background:
    radial-gradient(circle at 20% 8%, rgba(255,255,255,.055), transparent 28%),
    radial-gradient(circle at 86% 10%, rgba(196,149,58,.10), transparent 34%),
    linear-gradient(145deg, rgba(10,27,38,.98), rgba(5,15,22,.98)) !important;
  border: 1px solid rgba(196,149,58,.28) !important;
  box-shadow:
    0 22px 52px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

html[data-theme="escuro"] .person-memorial-photo img,
html[data-theme="escuro"] .person-memorial-photo,
html[data-theme="escuro"] .premium-profile-photo {
  border-color: rgba(255,244,220,.78) !important;
  box-shadow: 0 18px 34px rgba(0,0,0,.30) !important;
}

/* Quadro da Árvore: painel externo premium escuro + área interna clara/pergaminho legível */
html[data-theme="escuro"] #treeView .tree-panel,
html[data-theme="escuro"] #treeView .poster-panel,
html[data-theme="escuro"] .tree-panel.poster-panel {
  background:
    radial-gradient(circle at 78% -10%, rgba(196,149,58,.10), transparent 26rem),
    linear-gradient(145deg, rgba(8,22,32,.98), rgba(4,12,18,.98)) !important;
  border: 1px solid rgba(196,149,58,.30) !important;
  border-radius: 1.45rem !important;
  box-shadow:
    0 26px 62px rgba(0,0,0,.36),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
  padding: 1.15rem !important;
}

html[data-theme="escuro"] #treeView .tree-toolbar,
html[data-theme="escuro"] #treeView .tree-controls,
html[data-theme="escuro"] #treeView .tree-legend {
  color: #f8ead0 !important;
}

html[data-theme="escuro"] #treeView .tree-scroll,
html[data-theme="escuro"] #treeView .poster-scroll,
html[data-theme="escuro"] .tree-scroll.poster-scroll {
  position: relative !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.50), transparent 24%),
    radial-gradient(circle at 72% 72%, rgba(180,134,67,.11), transparent 28%),
    linear-gradient(180deg, #fff4d9 0%, #f6e5bd 54%, #ead39f 100%) !important;
  border: 1px solid rgba(196,149,58,.54) !important;
  border-radius: 1.05rem !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.45),
    inset 0 0 70px rgba(102,63,20,.08),
    0 22px 46px rgba(0,0,0,.30) !important;
  overflow: auto !important;
  scrollbar-color: #d1a34e rgba(6,17,25,.90) !important;
}

html[data-theme="escuro"] #treeView .tree-scroll::-webkit-scrollbar,
html[data-theme="escuro"] #treeView .poster-scroll::-webkit-scrollbar {
  width: 14px;
  height: 14px;
}

html[data-theme="escuro"] #treeView .tree-scroll::-webkit-scrollbar-track,
html[data-theme="escuro"] #treeView .poster-scroll::-webkit-scrollbar-track {
  background: rgba(6,17,25,.92);
  border-radius: 999px;
}

html[data-theme="escuro"] #treeView .tree-scroll::-webkit-scrollbar-thumb,
html[data-theme="escuro"] #treeView .poster-scroll::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #e0bd72, #9a6928);
  border-radius: 999px;
  border: 3px solid rgba(6,17,25,.92);
}

html[data-theme="escuro"] #treeView .tree-scroll::before,
html[data-theme="escuro"] #treeView .poster-scroll::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 18px !important;
  border: 1px solid rgba(153,113,57,.24) !important;
  border-radius: .85rem !important;
  background: none !important;
  opacity: 1 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

html[data-theme="escuro"] #treeView .tree-scroll::after,
html[data-theme="escuro"] #treeView .poster-scroll::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(circle at 72% 44%, rgba(112,83,38,.10), transparent 22%),
    linear-gradient(90deg, rgba(104,72,24,.08), transparent 4%, transparent 96%, rgba(104,72,24,.08)) !important;
  opacity: .72 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

html[data-theme="escuro"] #treeView .poster-canvas,
html[data-theme="escuro"] #treeView .tree-canvas,
html[data-theme="escuro"] #treeView .family-poster,
html[data-theme="escuro"] .tree-canvas .family-poster {
  background: transparent !important;
  border-color: transparent !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Área interna da árvore clara e legível, como o modelo aprovado */
html[data-theme="escuro"] #treeView .family-poster {
  background:
    radial-gradient(circle at 65% 40%, rgba(255,255,255,.34), transparent 22rem),
    linear-gradient(180deg, rgba(255,248,224,.56), rgba(239,214,160,.36)) !important;
  color: #3a2413 !important;
}

html[data-theme="escuro"] #treeView .poster-watermark {
  opacity: .08 !important;
  filter: sepia(.7) grayscale(.15) contrast(.9) !important;
}

/* V22 — textura pergaminho no tema escuro neutralizada (family-card.css governa o visual) */
/* html[data-theme="escuro"] #treeView .family-card { background: pergaminho... } */

/* V22 — cor do nome no escuro controlada por family-card.css */

/* V22 — cores location/generation escuro neutralizadas */

/* V22 — tree-card-generation sem fundo (agora ocupa largura total no layout Opção 3) */
html[data-theme="escuro"] #treeView .family-card .tree-card-generation {
  background: transparent !important;
  border: 0 !important;
  color: #c2d8e8 !important;
}

/* V22 — sem fundo/borda própria em details/dates-row/meta (caixa fantasma) */
html[data-theme="escuro"] #treeView .family-card .tree-card-details,
html[data-theme="escuro"] #treeView .family-card .tree-card-dates-row,
html[data-theme="escuro"] #treeView .family-card .tree-card-dates,
html[data-theme="escuro"] #treeView .family-card .tree-card-meta {
  background: transparent !important;
  border: 0 !important;
}

html[data-theme="escuro"] #treeView .couple-link,
html[data-theme="escuro"] #treeView .descendant-line,
html[data-theme="escuro"] #treeView .children-row::before,
html[data-theme="escuro"] #treeView .child-branch::before {
  background: rgba(89,73,50,.72) !important;
  opacity: .92 !important;
}

html[data-theme="escuro"] #treeView .marriage-label {
  background: rgba(255,249,238,.95) !important;
  border-color: rgba(167,130,77,.28) !important;
  color: #5e4628 !important;
  box-shadow: 0 8px 18px rgba(92,62,24,.14) !important;
}

html[data-theme="escuro"] #treeView .tree-legend span {
  background: rgba(255,255,255,.055) !important;
  border-color: rgba(196,149,58,.22) !important;
  color: #f8ead0 !important;
}

/* Garante que a correção do quadro da árvore vença regras antigas no final do CSS */
html[data-theme="escuro"] body[data-active-view="tree"] .tree-panel,
html[data-theme="escuro"] body[data-active-view="tree"] .poster-panel {
  background:
    radial-gradient(circle at 78% -10%, rgba(196,149,58,.10), transparent 26rem),
    linear-gradient(145deg, rgba(8,22,32,.98), rgba(4,12,18,.98)) !important;
  border-color: rgba(196,149,58,.30) !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] .poster-scroll {
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.50), transparent 24%),
    radial-gradient(circle at 72% 72%, rgba(180,134,67,.11), transparent 28%),
    linear-gradient(180deg, #fff4d9 0%, #f6e5bd 54%, #ead39f 100%) !important;
  border-color: rgba(196,149,58,.54) !important;
}


/* V16.3.5.0 — Árvore organizada por gerações
   Alteração restrita ao modo "Família completa" da tela Árvore.
   Objetivo: acabar com cards cortados, espalhados no topo ou fora da área útil. */

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-family-poster {
  min-width: 1180px !important;
  width: max-content !important;
  max-width: none !important;
  min-height: auto !important;
  padding: 2rem 2.2rem 2.5rem !important;
  text-align: left !important;
  background:
    radial-gradient(circle at 70% 8%, rgba(255,255,255,.48), transparent 19rem),
    radial-gradient(circle at 16% 100%, rgba(177,127,53,.10), transparent 26rem),
    linear-gradient(180deg, rgba(255,246,221,.96), rgba(239,211,154,.92)) !important;
  border: 1px solid rgba(151,112,56,.26) !important;
  border-radius: 1rem !important;
  color: #35200f !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-family-poster > h2 {
  display: none !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-poster-header {
  position: relative !important;
  z-index: 2 !important;
  margin: 0 0 1.55rem !important;
  padding-bottom: 1rem !important;
  border-bottom: 1px solid rgba(151,112,56,.22) !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-poster-header span {
  display: inline-flex !important;
  padding: .35rem .75rem !important;
  border-radius: 999px !important;
  background: rgba(255,249,238,.78) !important;
  border: 1px solid rgba(151,112,56,.18) !important;
  color: #7a572a !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-poster-header h2 {
  margin: .65rem 0 .25rem !important;
  display: block !important;
  color: #2f1d0f !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(1.9rem, 3vw, 3rem) !important;
  line-height: 1 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.36) !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-poster-header p {
  margin: 0 !important;
  color: #6b4e29 !important;
  font-size: .95rem !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-poster-body {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  gap: 1.55rem !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-row {
  display: grid !important;
  grid-template-columns: 118px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 1.35rem !important;
  padding: 1rem !important;
  border-radius: 1rem !important;
  background: rgba(255,249,238,.38) !important;
  border: 1px solid rgba(151,112,56,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35) !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-label {
  position: sticky !important;
  left: 1rem !important;
  display: grid !important;
  place-items: center !important;
  min-height: 96px !important;
  border-radius: .85rem !important;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.60), transparent 32%),
    linear-gradient(180deg, #f3d893, #b98231) !important;
  border: 1px solid rgba(111,72,24,.24) !important;
  box-shadow: 0 14px 28px rgba(92,62,24,.16), inset 0 1px 0 rgba(255,255,255,.52) !important;
  color: #3c250f !important;
  text-align: center !important;
  z-index: 3 !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-label strong {
  display: block !important;
  color: #321f10 !important;
  font-size: 1.55rem !important;
  line-height: 1 !important;
  font-family: Georgia, "Times New Roman", serif !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-label span {
  display: block !important;
  margin-top: .25rem !important;
  color: #6a4519 !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-cards {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  max-width: 1120px !important;
}

/* Cards dentro do novo organograma */
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-cards .family-card,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-cards .placeholder-card.family-card {
  width: 255px !important;
  min-width: 255px !important;
  max-width: 255px !important;
  min-height: 138px !important;
  margin: 0 !important;
  transform: none !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.50), rgba(186,137,67,.08)),
    url('../img/pergaminho-card-textura.png') center/cover no-repeat !important;
  border: 1px solid rgba(151,112,56,.32) !important;
  color: #35200f !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-cards .family-card .tree-card-name {
  font-size: .93rem !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-cards .family-card .tree-card-location {
  font-size: .70rem !important;
}

/* O novo modo não usa linhas antigas do organograma */
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-family-poster .tree-lines-svg,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-family-poster .couple-link,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-family-poster .descendant-line,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-family-poster .children-row::before,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-family-poster .child-branch::before {
  display: none !important;
}

/* Quadro da árvore com altura útil e sem jogar conteúdo para fora */
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .poster-scroll,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .tree-scroll {
  min-height: 620px !important;
  max-height: calc(100vh - 265px) !important;
  padding: 0 !important;
  overflow: auto !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .poster-canvas,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .tree-canvas {
  padding: 1rem !important;
  min-height: auto !important;
}

@media (max-width: 900px) {
  html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-family-poster {
    min-width: 860px !important;
    padding: 1rem !important;
  }

  html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-row {
    grid-template-columns: 90px minmax(0, 1fr) !important;
    gap: .85rem !important;
  }

  html[data-theme="escuro"] body[data-active-view="tree"] #treeView .generation-cards .family-card {
    width: 235px !important;
    min-width: 235px !important;
    max-width: 235px !important;
  }
}

/* V16.3.5.1 — Refino visual da Árvore em modo escuro
   Foco: poster principal da Árvore (layout bridge / linhas / cards) */
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge {
  min-width: 1540px !important;
  padding: 2rem 2rem 2.4rem !important;
  background:
    radial-gradient(circle at 18% 10%, rgba(196,149,58,.08), transparent 22rem),
    radial-gradient(circle at 82% 18%, rgba(255,255,255,.05), transparent 18rem),
    linear-gradient(135deg, rgba(8,18,29,.985), rgba(5,12,20,.995)) !important;
  border: 1px solid rgba(196,149,58,.28) !important;
  border-radius: 1rem !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 24px 50px rgba(0,0,0,.35) !important;
  color: #f5e5c6 !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge > h2 {
  color: #f8e7c4 !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.45) !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .poster-watermark {
  opacity: .06 !important;
  filter: brightness(1.2) sepia(.45) saturate(.9) !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .bridge-layout { gap: 1.5rem !important; }
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .bridge-parents-row {
  display: grid !important;
  grid-template-columns: minmax(460px,1fr) minmax(460px,1fr) !important;
  gap: 5rem !important;
  align-items: end !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .bridge-parent-side,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .parent-only-unit {
  min-width: 0 !important;
  width: 100% !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .bridge-connector {
  width: min(920px, 92%) !important;
  height: 46px !important;
  margin: .1rem auto .15rem !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .bridge-connector::before,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .bridge-connector::after,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-unit .couple-link,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-unit .descendant-line,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-unit .children-row::before,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-unit .child-branch::before {
  background: linear-gradient(180deg, rgba(255,227,166,.96), rgba(184,134,58,.96)) !important;
  box-shadow: 0 0 0 1px rgba(68,46,16,.20), 0 0 10px rgba(214,165,74,.18) !important;
  opacity: 1 !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-unit .couple-link { height: 3px !important; border-radius: 999px !important; }
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-unit .descendant-line { width: 3px !important; border-radius: 999px !important; }
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-unit .children-row::before,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-unit .child-branch::before { height: 3px !important; border-radius: 999px !important; }
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-card,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .placeholder-card.family-card {
  background: radial-gradient(circle at 20% 12%, rgba(255,255,255,.06), transparent 12rem), linear-gradient(180deg, rgba(15,29,44,.98), rgba(8,18,30,.99)) !important;
  color: #f4e5c7 !important;
  border: 1px solid rgba(196,149,58,.30) !important;
  border-radius: 1rem !important;
  box-shadow: 0 18px 30px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .tree-card-name,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-card .family-card-body strong { color: #fff4dc !important; text-shadow: none !important; }
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .tree-card-location,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .tree-card-extra,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .tree-card-profession,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-card .family-card-body span,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .family-card .family-card-body small { color: #d8bc8c !important; }
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .tree-card-generation,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .tree-card-dates,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .tree-card-meta {
  color: #efd29c !important;
}
/* V22 — .tree-card-details/.tree-card-dates-row sem fundo/borda própria (caixa fantasma) */
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .tree-card-details,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .tree-card-dates-row {
  background: transparent !important;
  color: #efd29c !important;
  border: 0 !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge .marriage-label {
  background: linear-gradient(180deg, rgba(255,243,217,.96), rgba(234,208,153,.96)) !important;
  color: #5c401f !important;
  border: 1px solid rgba(189,143,62,.34) !important;
  box-shadow: 0 12px 22px rgba(0,0,0,.16) !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) {
  background: radial-gradient(circle at 18% 10%, rgba(196,149,58,.08), transparent 22rem), radial-gradient(circle at 82% 18%, rgba(255,255,255,.05), transparent 18rem), linear-gradient(135deg, rgba(8,18,29,.985), rgba(5,12,20,.995)) !important;
  color: #f5e5c6 !important;
  border: 1px solid rgba(196,149,58,.28) !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .family-card,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .placeholder-card.family-card {
  background: radial-gradient(circle at 20% 12%, rgba(255,255,255,.06), transparent 12rem), linear-gradient(180deg, rgba(15,29,44,.98), rgba(8,18,30,.99)) !important;
  color: #f4e5c7 !important;
  border: 1px solid rgba(196,149,58,.30) !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .tree-card-name,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .family-card .family-card-body strong { color: #fff4dc !important; }
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .tree-card-location,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .tree-card-extra,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .tree-card-profession,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .family-card .family-card-body span,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .family-card .family-card-body small { color: #d8bc8c !important; }
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .tree-card-generation,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .tree-card-dates,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .tree-card-meta {
  color: #efd29c !important;
}
/* V22 — sem fundo/borda própria (caixa fantasma) */
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .tree-card-details,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .tree-card-dates-row {
  background: transparent !important;
  color: #efd29c !important;
  border: 0 !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .couple-link,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .descendant-line,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .children-row::before,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) .child-branch::before {
  background: linear-gradient(180deg, rgba(255,227,166,.96), rgba(184,134,58,.96)) !important;
  opacity: 1 !important;
  box-shadow: 0 0 0 1px rgba(68,46,16,.20), 0 0 10px rgba(214,165,74,.18) !important;
}

/* V16.3.5.2 — Ajuste fino da Árvore escura
   Remove fundo/quadros claros do viewport e refina contraste interno dos cards */
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .poster-scroll,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .tree-scroll {
  background: linear-gradient(135deg, rgba(6,16,26,.985), rgba(3,10,18,.99)) !important;
  border: 1px solid rgba(196,149,58,.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 18px 34px rgba(0,0,0,.28) !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .poster-scroll::before,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .poster-scroll::after,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .tree-scroll::before,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .tree-scroll::after {
  display: none !important;
  content: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .poster-canvas,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .tree-canvas {
  background: transparent !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster.family-poster-bridge,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster:not(.generation-family-poster):not(.family-poster-bridge) {
  border-color: rgba(196,149,58,.18) !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster .tree-card-generation {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #f0d39b !important;
  text-shadow: none !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster .tree-card-dates,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster .tree-card-meta {
  box-shadow: none !important;
}
/* V22 — sem fundo/borda própria (caixa fantasma) */
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster .tree-card-details,
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster .tree-card-dates-row {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster .tree-card-profession {
  color: #e8d7b2 !important;
  opacity: 1 !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster .tree-card-profession strong {
  color: #d6a44c !important;
  font-weight: 700 !important;
}

html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster .family-card {
  overflow: hidden !important;
}

/* V16.4.0 — Base profissional e segurança: modal interno, feedback e upload */
.button.is-loading,
button.is-loading {
  cursor: progress !important;
  opacity: .78 !important;
  pointer-events: none !important;
}

.app-confirm-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 1.25rem;
  background: rgba(7, 8, 10, .62);
  backdrop-filter: blur(10px);
  animation: appConfirmFadeIn .16s ease-out;
}

.app-confirm-dialog {
  width: min(480px, 100%);
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  padding: 1.35rem;
  border-radius: 1.25rem;
  border: 1px solid rgba(151, 112, 56, .32);
  color: var(--text, #2f1d0f);
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.55), transparent 18rem),
    linear-gradient(180deg, rgba(255,248,232,.98), rgba(245,224,181,.98));
  box-shadow: 0 30px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.7);
}

.app-confirm-copy h2 {
  margin: 0 2rem .35rem 0;
  font-size: 1.25rem;
  color: var(--title, #2f1d0f);
}

.app-confirm-copy p {
  margin: 0;
  color: var(--muted, #6d573d);
  line-height: 1.45;
}

.app-confirm-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  font-weight: 900;
  color: #fff7df;
  background: linear-gradient(180deg, #c7892c, #8b4d19);
  box-shadow: 0 12px 22px rgba(114, 67, 20, .24);
}

.app-confirm-backdrop.tone-danger .app-confirm-icon {
  background: linear-gradient(180deg, #ba3d32, #7e211d);
}

.app-confirm-backdrop.tone-success .app-confirm-icon {
  background: linear-gradient(180deg, #2f8b67, #176046);
}

.app-confirm-close {
  position: absolute;
  top: .85rem;
  right: .85rem;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(151, 112, 56, .28);
  background: rgba(255, 255, 255, .70);
  color: inherit;
  cursor: pointer;
  font-size: 1.25rem;
  line-height: 1;
}

.app-confirm-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: .65rem;
  margin-top: .35rem;
}

@keyframes appConfirmFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

html[data-theme="escuro"] .app-confirm-dialog {
  color: #f5e5c6;
  border-color: rgba(196,149,58,.36);
  background:
    radial-gradient(circle at 18% 0%, rgba(196,149,58,.16), transparent 18rem),
    linear-gradient(180deg, rgba(12,26,39,.98), rgba(5,13,22,.98));
  box-shadow: 0 30px 70px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.05);
}

html[data-theme="escuro"] .app-confirm-copy h2 {
  color: #fff4dc;
}

html[data-theme="escuro"] .app-confirm-copy p {
  color: #d8bc8c;
}

html[data-theme="escuro"] .app-confirm-close {
  background: rgba(255,255,255,.06);
  border-color: rgba(196,149,58,.28);
  color: #f5e5c6;
}


/* V16.4.1 — confirmação sempre acima de qualquer janela/modal */
.app-confirm-backdrop[data-confirm-portal="true"] {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  display: grid !important;
  place-items: center !important;
  isolation: isolate !important;
  pointer-events: auto !important;
}

.app-confirm-backdrop[data-confirm-portal="true"] .app-confirm-dialog {
  position: relative !important;
  z-index: 2147483647 !important;
  max-height: calc(100vh - 2.5rem) !important;
  overflow: auto !important;
  transform: none !important;
}

.profile-modal ~ .app-confirm-backdrop,
.person-memorial-modal ~ .app-confirm-backdrop,
.modal ~ .app-confirm-backdrop {
  z-index: 2147483647 !important;
}


/* V16.4.2 — Confirmação em dialog nativo/top layer
   Corrige confirmação atrás do Memorial/galeria, pois <dialog>.showModal()
   entra na camada superior do navegador acima de outros modais. */
dialog.app-confirm-backdrop[data-confirm-portal="true"] {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  width: 100vw !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 1.25rem !important;
  border: 0 !important;
  background: rgba(7, 8, 10, .70) !important;
  backdrop-filter: blur(12px) !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  overflow: hidden !important;
}

dialog.app-confirm-backdrop[data-confirm-portal="true"]::backdrop {
  background: rgba(7, 8, 10, .70) !important;
  backdrop-filter: blur(12px) !important;
}

dialog.app-confirm-backdrop[data-confirm-portal="true"][open] {
  display: grid !important;
}

dialog.app-confirm-backdrop[data-confirm-portal="true"] .app-confirm-dialog {
  position: relative !important;
  z-index: 1 !important;
  max-height: min(560px, calc(100dvh - 2.5rem)) !important;
  overflow: auto !important;
  transform: translateZ(0) !important;
}

body:has(dialog.app-confirm-backdrop[open]) {
  overflow: hidden !important;
}

/* ============================================================
   V17.0 — MELHORIAS PREMIUM GLOBAIS
   Não altera Firestore, Storage, regras, dados nem lógica.
   ============================================================ */

/* ── ANIMAÇÕES BASE ─────────────────────────────────────────── */
@keyframes v17FadeInUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes v17PulseRing {
  0%, 100% { box-shadow: 0 0 0 0   rgba(14,90,138,.30); }
  50%       { box-shadow: 0 0 0 10px rgba(14,90,138, 0); }
}
@keyframes v17ProgressShine {
  0%   { background-position: -220px 0; }
  100% { background-position:  220px 0; }
}

/* ── VIEW TRANSITION ───────────────────────────────────────── */
.view.active-view {
  animation: v17FadeInUp .22s ease both;
}

/* ── UPLOAD PROGRESS OVERLAY ───────────────────────────────── */
.upload-progress-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: grid;
  place-items: center;
  padding: 1.5rem;
  background: rgba(7,8,10,.65);
  backdrop-filter: blur(10px);
  animation: v17FadeInUp .18s ease;
}
.upload-progress-box {
  width: min(380px, 100%);
  padding: 30px 28px 26px;
  border-radius: 26px;
  background: var(--surface, #fff);
  border: 1px solid var(--line, #d7e4ef);
  box-shadow: 0 32px 80px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.7);
  display: grid;
  gap: 14px;
  text-align: center;
}
.upload-progress-label {
  font-weight: 700;
  font-size: .97rem;
  color: var(--text, #10243d);
}
.upload-progress-pct {
  font-size: 2.4rem;
  font-weight: 900;
  letter-spacing: -.05em;
  line-height: 1;
  color: var(--primary, #0e5a8a);
}
.upload-progress-track {
  height: 8px;
  border-radius: 999px;
  background: var(--primary-soft, #d9eef9);
  overflow: hidden;
}
.upload-progress-bar {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--primary,#0e5a8a) 0%, #18a9d8 50%, var(--primary,#0e5a8a) 100%);
  background-size: 220px 100%;
  animation: v17ProgressShine 1.4s linear infinite;
  transition: width .22s ease;
}
.upload-progress-hint {
  font-size: .82rem;
  color: var(--muted, #5f7288);
}
/* Tema escuro */
html[data-theme="escuro"] .upload-progress-box {
  background: rgba(14,26,42,.98);
  border-color: rgba(178,214,238,.14);
  box-shadow: 0 32px 80px rgba(0,0,0,.42);
}
html[data-theme="escuro"] .upload-progress-pct { color: #35b6e6; }
html[data-theme="escuro"] .upload-progress-track { background: rgba(53,182,230,.15); }
html[data-theme="escuro"] .upload-progress-bar {
  background: linear-gradient(90deg, #35b6e6 0%, #7ad8ff 50%, #35b6e6 100%);
  background-size: 220px 100%;
  animation: v17ProgressShine 1.4s linear infinite;
}
/* Tema pergaminho */
html[data-theme="pergaminho"] .upload-progress-box {
  background: rgba(255,248,237,.98);
  border-color: rgba(215,185,133,.4);
}
html[data-theme="pergaminho"] .upload-progress-pct { color: #76451e; }
html[data-theme="pergaminho"] .upload-progress-track { background: #e8cfa7; }
html[data-theme="pergaminho"] .upload-progress-bar {
  background: linear-gradient(90deg, #76451e 0%, #b08040 50%, #76451e 100%);
  background-size: 220px 100%;
  animation: v17ProgressShine 1.4s linear infinite;
}

/* ── TELA DE LOGIN — REDESIGN PREMIUM ──────────────────────── */
.auth-layout {
  background:
    radial-gradient(ellipse 65% 55% at 12% 12%, rgba(14,90,138,.14) 0%, transparent 100%),
    radial-gradient(ellipse 60% 60% at 88% 88%, rgba(24,169,216,.10) 0%, transparent 100%),
    linear-gradient(155deg, #f0f8ff 0%, #e6f1fb 55%, #f8fbff 100%);
}
.auth-card,
.center-card {
  width: min(100%, 492px);
  padding: 36px 36px 30px;
  border: 1px solid rgba(14,90,138,.12);
  border-radius: 32px;
  background: rgba(255,255,255,.97);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 30px 76px rgba(10,50,100,.13),
    0 6px 20px rgba(14,90,138,.08);
  animation: v17FadeInUp .34s cubic-bezier(.34,1.4,.64,1) both;
}
.auth-brand {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 26px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(14,90,138,.09);
}
.auth-brand .brand-mark {
  flex-shrink: 0;
  width: 70px;
  height: 70px;
  border-radius: 22px;
  box-shadow: 0 12px 32px rgba(14,90,138,.22);
  animation: v17PulseRing 3.5s ease-in-out infinite;
}
.auth-brand h1 {
  font-size: 1.18rem;
  letter-spacing: -.022em;
}
/* Tabs */
.tabs {
  background: var(--primary-soft, #d9eef9);
  border-radius: 20px;
  padding: 5px;
  gap: 6px;
  margin-bottom: 22px;
}
.tab {
  font-size: .88rem;
  border-radius: 14px;
  transition: background .14s, color .14s, box-shadow .14s;
  color: var(--primary-strong, #0a3f63);
}
.tab.active {
  background: #fff;
  color: var(--primary-strong, #0a3f63);
  box-shadow: 0 2px 12px rgba(14,90,138,.13);
}
/* Inputs do login */
.auth-form {
  gap: 16px;
}
.auth-form label {
  font-size: .86rem;
  font-weight: 700;
}
.auth-form input {
  padding: 13px 15px;
  border-radius: 15px;
  background: #f6fafd;
  border-color: rgba(14,90,138,.16);
  transition: border-color .14s, box-shadow .14s, background .14s;
}
.auth-form input:focus {
  background: #fff;
  border-color: var(--primary, #0e5a8a);
  box-shadow: 0 0 0 3px rgba(14,90,138,.11);
}

/* ── BOTÃO PRIMARY — GRADIENTE E SOMBRA ────────────────────── */
.button.primary {
  background: linear-gradient(135deg, var(--primary,#0e5a8a) 0%, #0d7fc4 100%);
  border-color: transparent;
  box-shadow: 0 3px 14px rgba(14,90,138,.26);
  transition: transform .14s ease, box-shadow .14s ease, filter .13s ease;
}
.button.primary:hover {
  filter: brightness(1.07);
  box-shadow: 0 7px 22px rgba(14,90,138,.34);
  transform: translateY(-1px);
}
.button.primary:active {
  transform: translateY(0);
  box-shadow: 0 2px 7px rgba(14,90,138,.20);
  filter: none;
}

/* ── BOTÃO PADRÃO — TRANSIÇÃO ───────────────────────────────── */
.button {
  transition: transform .14s ease, box-shadow .14s ease;
}

/* ── NAV LATERAL — HOVER SUAVE + LABEL ─────────────────────── */
.nav-link {
  display: flex;
  align-items: center;
  gap: 11px;
  font-size: .91rem;
  font-weight: 600;
  letter-spacing: -.01em;
  transition: background .14s, color .14s, padding-left .15s;
  padding: 12px 14px;
}
.nav-link:hover { padding-left: 17px; }
.nav-link.active {
  font-weight: 800;
  box-shadow: 0 2px 14px rgba(14,90,138,.12);
}

/* ── CARDS DE PESSOAS ───────────────────────────────────────── */
.people-list {
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 16px;
}
.people-card {
  grid-template-columns: 70px minmax(0, 1fr);
  gap: 0 15px;
  padding: 18px;
  border-radius: 24px;
  position: relative;
  overflow: hidden;
  transition: transform .17s cubic-bezier(.34,1.56,.64,1), box-shadow .17s ease;
}
.people-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 42px rgba(16,36,61,.14);
}
/* Faixa colorida no topo ao hover */
.people-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, var(--primary,#0e5a8a), rgba(24,169,216,.7));
  border-radius: 24px 24px 0 0;
  opacity: 0;
  transition: opacity .17s;
}
.people-card:hover::before { opacity: 1; }
/* Avatar maior */
.avatar {
  width: 70px;
  height: 70px;
  border-radius: 20px;
  font-size: 1.25rem;
  box-shadow: 0 6px 18px rgba(14,90,138,.20);
}
.people-card h3 {
  font-size: 1.04rem;
  font-weight: 800;
  letter-spacing: -.02em;
  margin: 2px 0 7px;
}

/* ── DASHBOARD METRIC CARDS — HOVER ────────────────────────── */
.dashboard-metric-card {
  transition: transform .17s cubic-bezier(.34,1.56,.64,1), box-shadow .17s ease;
}
.dashboard-metric-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(16,36,61,.12);
}

/* ── FAMILY CARDS (ÁRVORE) — HOVER ─────────────────────────── */
.family-card.clickable-card {
  transition: transform .16s cubic-bezier(.34,1.56,.64,1), box-shadow .16s ease;
}
.family-card.clickable-card:hover {
  transform: translateY(-2px) scale(1.013);
}

/* ── EMPTY STATE — MAIS VISUAL ──────────────────────────────── */
.empty-state {
  padding: 42px 24px;
  border: 2px dashed rgba(14,90,138,.14);
  background: rgba(14,90,138,.025);
  border-radius: 22px;
  color: var(--muted);
  font-size: .93rem;
}

/* ── BUSCA DE PESSOAS — INPUT REFINADO ──────────────────────── */
#peopleSearch {
  padding: 13px 18px;
  border: 1.5px solid rgba(14,90,138,.16);
  border-radius: 16px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 2px 8px rgba(14,90,138,.05);
  transition: border-color .14s, box-shadow .14s;
}
#peopleSearch:focus {
  border-color: var(--primary, #0e5a8a);
  box-shadow: 0 0 0 3px rgba(14,90,138,.10), 0 2px 8px rgba(14,90,138,.07);
  outline: none;
}

/* ── BOTÕES DE FECHAR (×) — CIRCULAR COM ROTAÇÃO ───────────── */
#closePersonDialog,
#closeProfileDialog,
#closeDocumentDialog {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--line, #d7e4ef);
  background: rgba(14,90,138,.06);
  color: var(--text, #10243d);
  font-size: 1.25rem;
  display: grid;
  place-items: center;
  transition: background .14s, transform .14s, color .13s, border-color .13s;
}
#closePersonDialog:hover,
#closeProfileDialog:hover,
#closeDocumentDialog:hover {
  background: var(--primary, #0e5a8a);
  color: #fff;
  border-color: transparent;
  transform: scale(1.08) rotate(90deg);
}

/* ── TOPBAR — TÍTULO MAIS BOLD ───────────────────────────────── */
.topbar h1 {
  letter-spacing: -.022em;
  font-weight: 900;
}

/* ── PANEL — HOVER SOMBRA ───────────────────────────────────── */
.panel {
  transition: box-shadow .18s ease, border-color .18s ease;
}
.panel:hover {
  box-shadow: 0 16px 44px rgba(16,36,61,.12);
}

/* ========= TEMA ESCURO — AJUSTES V17 ======================== */
html[data-theme="escuro"] .auth-layout {
  background:
    radial-gradient(ellipse 65% 55% at 12% 12%, rgba(53,182,230,.18) 0%, transparent 100%),
    radial-gradient(ellipse 60% 60% at 88% 88%, rgba(14,90,138,.14) 0%, transparent 100%),
    linear-gradient(155deg, #07111d 0%, #0b1d2f 55%, #07111d 100%);
}
html[data-theme="escuro"] .auth-card,
html[data-theme="escuro"] .center-card {
  background: rgba(14,26,42,.98);
  border-color: rgba(178,214,238,.14);
  box-shadow: 0 30px 76px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.04);
}
html[data-theme="escuro"] .tabs {
  background: rgba(22,42,64,.7);
}
html[data-theme="escuro"] .tab.active {
  background: rgba(53,182,230,.14);
  color: #35b6e6;
}
html[data-theme="escuro"] .auth-form input {
  background: rgba(22,42,64,.8);
  border-color: rgba(178,214,238,.16);
  color: var(--text);
}
html[data-theme="escuro"] .auth-form input:focus {
  background: rgba(22,42,64,1);
  border-color: #35b6e6;
  box-shadow: 0 0 0 3px rgba(53,182,230,.14);
}
html[data-theme="escuro"] .button.primary {
  /* Mantém o gradiente dourado já existente no tema escuro */
  background: linear-gradient(135deg, rgba(203,154,72,.96) 0%, rgba(120,79,28,.93) 100%);
  border-color: rgba(230,197,127,.38);
  color: #fff6e3;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 4px 16px rgba(0,0,0,.28);
}
html[data-theme="escuro"] .button.primary:hover {
  filter: brightness(1.09);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 8px 24px rgba(0,0,0,.36);
}
html[data-theme="escuro"] #closePersonDialog,
html[data-theme="escuro"] #closeProfileDialog,
html[data-theme="escuro"] #closeDocumentDialog {
  background: rgba(53,182,230,.10);
  border-color: rgba(53,182,230,.20);
  color: #35b6e6;
}
html[data-theme="escuro"] #closePersonDialog:hover,
html[data-theme="escuro"] #closeProfileDialog:hover,
html[data-theme="escuro"] #closeDocumentDialog:hover {
  background: rgba(53,182,230,.82);
  color: #07111d;
  border-color: transparent;
}
html[data-theme="escuro"] #peopleSearch {
  background: rgba(22,42,64,.8);
  border-color: rgba(178,214,238,.16);
}
html[data-theme="escuro"] #peopleSearch:focus {
  background: rgba(22,42,64,1);
  border-color: #35b6e6;
  box-shadow: 0 0 0 3px rgba(53,182,230,.14);
}
html[data-theme="escuro"] .people-card::before {
  background: linear-gradient(90deg, #35b6e6, rgba(122,216,255,.6));
}
html[data-theme="escuro"] .auth-brand .brand-mark {
  animation-name: v17PulseRingDark;
}
@keyframes v17PulseRingDark {
  0%, 100% { box-shadow: 0 0 0 0   rgba(53,182,230,.30); }
  50%       { box-shadow: 0 0 0 10px rgba(53,182,230, 0); }
}

/* ========= TEMA PERGAMINHO — AJUSTES V17 ==================== */
html[data-theme="pergaminho"] .auth-layout {
  background: linear-gradient(155deg, #f7ead0 0%, #ead4ad 55%, #f7ead0 100%);
}
html[data-theme="pergaminho"] .auth-card,
html[data-theme="pergaminho"] .center-card {
  background: rgba(255,246,224,.98);
  border-color: rgba(215,185,133,.36);
  box-shadow: 0 30px 76px rgba(66,38,14,.17);
}
html[data-theme="pergaminho"] .tabs {
  background: rgba(232,207,167,.55);
}
html[data-theme="pergaminho"] .tab.active {
  background: rgba(255,248,237,.95);
}
html[data-theme="pergaminho"] .button.primary:hover {
  box-shadow: 0 7px 22px rgba(66,38,14,.24);
}
html[data-theme="pergaminho"] .people-card::before {
  background: linear-gradient(90deg, #76451e, rgba(176,128,64,.65));
}
html[data-theme="pergaminho"] #closePersonDialog:hover,
html[data-theme="pergaminho"] #closeProfileDialog:hover,
html[data-theme="pergaminho"] #closeDocumentDialog:hover {
  background: var(--primary, #76451e);
}
html[data-theme="pergaminho"] .auth-brand .brand-mark {
  animation-name: v17PulseRingPerg;
}
@keyframes v17PulseRingPerg {
  0%, 100% { box-shadow: 0 0 0 0   rgba(118,69,30,.30); }
  50%       { box-shadow: 0 0 0 10px rgba(118,69,30, 0); }
}

/* ============================================================
   FIM V17.0
   ============================================================ */


/* ==========================================================================\n   V18.0 — Museum Edition Premium\n   Camada visual premium sobre a V17, sem remover telas ou dados existentes.\n   Procure por "v18-" no HTML/CSS/JS para estudar esta atualização.\n   ========================================================================== */
:root {
  --v18-ink: #24180f;
  --v18-gold: #c89b43;
  --v18-gold-soft: rgba(200,155,67,.18);
  --v18-paper: rgba(255,247,226,.86);
  --v18-border: rgba(120,81,32,.22);
  --v18-shadow: 0 28px 80px rgba(59, 39, 15, .20);
}

.v18-museum-opening {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(240px, .65fr);
  gap: clamp(20px, 4vw, 48px);
  align-items: center;
  min-height: clamp(430px, 54vh, 620px);
  padding: clamp(28px, 5vw, 72px);
  border: 1px solid var(--v18-border);
  border-radius: 34px;
  background:
    radial-gradient(circle at 20% 10%, rgba(255, 236, 182, .72), transparent 34%),
    radial-gradient(circle at 80% 15%, rgba(200,155,67,.24), transparent 30%),
    linear-gradient(135deg, rgba(255,251,238,.95), rgba(236,218,178,.74));
  box-shadow: var(--v18-shadow);
  isolation: isolate;
  margin-bottom: 18px;
}

.v18-museum-opening::before,
.v18-museum-opening::after {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(119, 78, 25, .18);
  border-radius: 26px;
  pointer-events: none;
}

.v18-museum-opening::after {
  inset: 28px;
  border-style: dashed;
  opacity: .45;
}

.v18-museum-bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(97, 66, 26, .08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(97, 66, 26, .06) 1px, transparent 1px),
    url('/img/pergaminho-card-textura.png');
  background-size: 58px 58px, 58px 58px, 380px auto;
  opacity: .34;
}

.v18-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 7px 12px;
  border: 1px solid rgba(130, 84, 23, .22);
  border-radius: 999px;
  color: #7b541d;
  background: rgba(255,255,255,.5);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.v18-museum-copy h2 {
  margin: 18px 0 12px;
  color: var(--v18-ink);
  font-size: clamp(3rem, 9vw, 7rem);
  line-height: .86;
  letter-spacing: -.08em;
  text-wrap: balance;
}

.v18-museum-copy p {
  max-width: 760px;
  margin: 0;
  color: rgba(36, 24, 15, .76);
  font-size: clamp(1rem, 2.2vw, 1.28rem);
  line-height: 1.7;
}

.v18-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.v18-museum-crest {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 16px;
  padding: 24px;
  border: 1px solid rgba(108, 73, 27, .20);
  border-radius: 30px;
  background: rgba(255,255,255,.42);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 18px 45px rgba(75, 51, 21, .16);
  text-align: center;
}

.v18-museum-crest img {
  width: min(220px, 42vw);
  height: min(220px, 42vw);
  object-fit: contain;
  filter: drop-shadow(0 18px 28px rgba(74, 50, 22, .30));
  animation: v18FloatCrest 6s ease-in-out infinite;
}

.v18-crest-glow {
  position: absolute;
  width: 78%;
  aspect-ratio: 1;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 218, 117, .5), transparent 66%);
  filter: blur(8px);
  pointer-events: none;
}

.v18-museum-crest small {
  position: relative;
  color: rgba(49, 34, 16, .74);
  font-weight: 800;
}

.v18-legacy-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 18px;
}

.v18-legacy-strip article {
  padding: 18px;
  border: 1px solid rgba(128, 91, 38, .16);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,247,226,.58));
  box-shadow: 0 12px 32px rgba(59, 39, 15, .08);
}

.v18-legacy-strip strong {
  display: block;
  color: var(--v18-ink);
  font-size: clamp(1.7rem, 4vw, 3rem);
  line-height: 1;
  letter-spacing: -.05em;
}

.v18-legacy-strip span {
  display: block;
  margin-top: 8px;
  color: rgba(45, 31, 17, .66);
  font-weight: 800;
}

.v18-origin-story {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 16px;
  align-items: stretch;
  padding: clamp(18px, 3vw, 30px);
  border: 1px solid rgba(128, 91, 38, .16);
  border-radius: 30px;
  background: rgba(255, 251, 239, .68);
  box-shadow: 0 16px 46px rgba(59, 39, 15, .08);
  margin-bottom: 20px;
}

.v18-origin-heading h3 {
  margin: 14px 0 10px;
  color: var(--v18-ink);
  font-size: clamp(1.7rem, 4vw, 3.35rem);
  letter-spacing: -.06em;
  line-height: .96;
}

.v18-origin-heading p {
  margin: 0;
  color: rgba(45, 31, 17, .70);
  line-height: 1.65;
}

.v18-origin-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.v18-origin-card {
  display: grid;
  align-content: start;
  gap: 12px;
  min-height: 210px;
  padding: 18px;
  border: 1px solid rgba(128, 91, 38, .16);
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(255,255,255,.76), rgba(247,232,194,.56));
  color: inherit;
  cursor: pointer;
  text-align: left;
  box-shadow: 0 10px 28px rgba(59, 39, 15, .08);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.v18-origin-card:hover {
  transform: translateY(-3px);
  border-color: rgba(200,155,67,.45);
  box-shadow: 0 18px 42px rgba(59, 39, 15, .14);
}

.v18-origin-card strong {
  color: var(--v18-ink);
  font-size: 1.1rem;
}

.v18-origin-card small {
  color: rgba(45, 31, 17, .67);
  line-height: 1.45;
  font-weight: 700;
}

/* Deixa os blocos já existentes da V17 com aparência mais museu sem mudar a estrutura. */
.memorial-hero-card,
.dashboard-panel,
.origin-card-premium,
.timeline-panel,
.timeline-form-panel {
  border-color: rgba(128, 91, 38, .16) !important;
  box-shadow: 0 18px 55px rgba(59, 39, 15, .10);
}

.family-chapter-card,
.dashboard-metric-card,
.person-card,
.tree-person-card {
  transition: transform .18s ease, box-shadow .18s ease;
}
.family-chapter-card:hover,
.dashboard-metric-card:hover,
.person-card:hover,
.tree-person-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 42px rgba(59, 39, 15, .12);
}

@keyframes v18FloatCrest {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-8px) scale(1.015); }
}

@media (max-width: 980px) {
  .v18-museum-opening,
  .v18-origin-story { grid-template-columns: 1fr; }
  .v18-legacy-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  .v18-museum-opening { padding: 24px; border-radius: 26px; }
  .v18-origin-cards { grid-template-columns: 1fr; }
  .v18-legacy-strip { grid-template-columns: 1fr; }
  .v18-hero-actions .button { width: 100%; }
}

body[data-theme="escuro"] .v18-museum-opening,
body[data-theme="escuro"] .v18-origin-story,
body[data-theme="escuro"] .v18-legacy-strip article,
body[data-theme="escuro"] .v18-origin-card,
body[data-theme="escuro"] .v18-museum-crest {
  background: linear-gradient(145deg, rgba(37,30,23,.96), rgba(84,61,30,.72));
  border-color: rgba(216, 174, 91, .25);
}
body[data-theme="escuro"] .v18-museum-copy h2,
body[data-theme="escuro"] .v18-origin-heading h3,
body[data-theme="escuro"] .v18-legacy-strip strong,
body[data-theme="escuro"] .v18-origin-card strong { color: #ffe8b4; }
body[data-theme="escuro"] .v18-museum-copy p,
body[data-theme="escuro"] .v18-origin-heading p,
body[data-theme="escuro"] .v18-legacy-strip span,
body[data-theme="escuro"] .v18-origin-card small,
body[data-theme="escuro"] .v18-museum-crest small { color: rgba(255, 238, 199, .76); }

/* ==========================================================================
   V19.0 — Melhorias: Zoom da árvore, Empty States emocionais, Checklist
   ========================================================================== */

/* ── Zoom da árvore ─────────────────────────────────────────────────────── */
.tree-zoom-controls {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: 12px;
}

.tree-zoom-label {
  font-size: .82rem;
  font-weight: 600;
  color: var(--muted);
  min-width: 38px;
  text-align: center;
  user-select: none;
}

.tree-zoom-controls .button.mini {
  width: 28px;
  height: 28px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  line-height: 1;
}

#treeCanvas {
  transition: transform .15s ease;
  transform-origin: top left;
}

/* ── Empty states emocionais ─────────────────────────────────────────────── */
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 40px 24px;
  text-align: center;
  color: var(--muted);
  border: 1.5px dashed var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.empty-state-icon {
  font-size: 2.2rem;
  line-height: 1;
  opacity: .6;
}

.empty-state-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
  margin: 0;
}

.empty-state-desc {
  font-size: .9rem;
  color: var(--muted);
  max-width: 320px;
  margin: 0;
  line-height: 1.5;
}

.empty-state .button {
  margin-top: 6px;
}

/* ── Compacto (listas internas do dashboard) ─────────────────────────────── */
.empty-state.compact-empty {
  padding: 18px 16px;
  gap: 6px;
  font-size: .88rem;
}

/* ── Adaptação tema escuro ───────────────────────────────────────────────── */
body[data-theme="escuro"] .empty-state {
  background: rgba(255,255,255,.03);
  border-color: rgba(255,255,255,.1);
}

/* ── Tree controls responsivo ────────────────────────────────────────────── */
.tree-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

@media (max-width: 600px) {
  .tree-zoom-controls { margin-left: 0; }
  .tree-zoom-label { min-width: 32px; font-size: .78rem; }
}

/* ==========================================================================
   V20.0 — Formulário de pessoa em abas, pan da árvore, melhorias gerais
   ========================================================================== */

/* ── Abas do formulário de pessoa ───────────────────────────────────────── */
.person-form-tabs {
  display: flex;
  gap: 4px;
  padding: 12px 20px 0;
  border-bottom: 2px solid var(--line);
  background: var(--surface);
}

.person-tab {
  padding: 8px 18px;
  border: none;
  border-bottom: 3px solid transparent;
  background: transparent;
  color: var(--muted);
  font-size: .9rem;
  font-weight: 500;
  cursor: pointer;
  border-radius: 8px 8px 0 0;
  transition: color .18s, border-color .18s, background .18s;
  margin-bottom: -2px;
}

.person-tab:hover {
  color: var(--text);
  background: var(--surface-2, var(--bg));
}

.person-tab.active {
  color: var(--primary);
  border-bottom-color: var(--primary);
  font-weight: 700;
  background: var(--surface);
}

.person-tab-panel {
  display: none;
  padding: 20px 0 0;
}

.person-tab-panel.active {
  display: block;
}

.person-dialog-v20 {
  max-width: 680px;
  width: 95vw;
}

.person-form-actions {
  gap: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  margin-top: 12px;
}

/* Tema escuro */
body[data-theme="escuro"] .person-form-tabs,
body[data-theme="escuro"] .person-tab.active {
  background: var(--surface);
  border-color: rgba(196,149,58,.3);
}
body[data-theme="escuro"] .person-tab.active {
  color: var(--memorial-gold, #c4953a);
  border-bottom-color: var(--memorial-gold, #c4953a);
}

/* ── Pan da árvore ──────────────────────────────────────────────────────── */
.tree-scroll {
  cursor: grab;
  overflow: auto;
}

.tree-scroll:active {
  cursor: grabbing;
}

/* ── Indicador visual do plano no sidebar ───────────────────────────────── */
.plan-badge {
  display: inline-block;
  font-size: 7px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 2px 6px;
  border-radius: 4px;
  background: var(--memorial-gold, #c4953a);
  color: #0b1520;
  margin-left: 6px;
  vertical-align: middle;
}

/* ── Responsivo para abas em telas pequenas ─────────────────────────────── */
@media (max-width: 480px) {
  .person-tab {
    padding: 8px 10px;
    font-size: .78rem;
  }
  .person-form-tabs {
    gap: 2px;
    padding: 10px 10px 0;
  }
}

/* ==========================================================================
   V20.3 — Dashboard unificado: hero único, stats strip, sem duplicações
   Estes estilos sobrescrevem os conflitos anteriores entre V17/V18/V19
   ========================================================================== */

/* ── Stats strip ─────────────────────────────────────────────────────────── */
.dashboard-stats-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.dashboard-stats-strip article {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 16px 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  text-align: center;
}

.dashboard-stats-strip strong {
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
  color: var(--primary, #0e5a8a);
  letter-spacing: -.04em;
}

.dashboard-stats-strip span {
  font-size: .82rem;
  color: var(--muted);
  font-weight: 500;
}

/* ── Hero unificado — tema claro e pergaminho ───────────────────────────── */
#dashboardHero {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  padding: 36px 40px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: center;
  background:
    radial-gradient(circle at top left, rgba(245,211,139,.35), transparent 40%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(250,240,216,.92));
  border: 1px solid rgba(119,78,38,.18);
  box-shadow: 0 12px 40px rgba(63,42,18,.1);
}

#dashboardHero h2 {
  font-size: clamp(2rem, 4vw, 3.8rem);
  line-height: .95;
  letter-spacing: -.05em;
  margin: 12px 0 8px;
  color: var(--text);
}

#dashboardHero p {
  font-size: 1rem;
  color: var(--muted);
  line-height: 1.6;
  max-width: 600px;
}

#dashboardHero .memorial-crest-box {
  width: 140px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.8);
  border: 1px solid rgba(119,78,38,.15);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
  font-size: .82rem;
  color: var(--muted);
  font-weight: 600;
  flex-shrink: 0;
}

#dashboardHero .memorial-crest-box img {
  width: 90px;
  height: 90px;
  object-fit: contain;
}

/* ── Hero unificado — tema escuro ───────────────────────────────────────── */
html[data-theme="escuro"] #dashboardHero {
  background:
    linear-gradient(135deg, #07111d 0%, #0d1b26 60%, #111a10 100%);
  border: 1px solid rgba(196,149,58,.28);
  box-shadow: 0 20px 60px rgba(0,0,0,.4);
  color: #f8ead0;
}

html[data-theme="escuro"] #dashboardHero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 50%, rgba(196,149,58,.12), transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(196,149,58,.08), transparent 40%);
  pointer-events: none;
}

html[data-theme="escuro"] #dashboardHero h2 {
  color: #f8ead0;
  text-shadow: 0 4px 24px rgba(0,0,0,.5);
  font-size: clamp(2.2rem, 4vw, 4rem);
}

html[data-theme="escuro"] #dashboardHero p {
  color: rgba(248,234,208,.78);
}

html[data-theme="escuro"] #dashboardHero .eyebrow {
  background: rgba(196,149,58,.14) !important;
  border: 1px solid rgba(196,149,58,.3) !important;
  color: #e0bd72 !important;
}

html[data-theme="escuro"] #dashboardHero .memorial-crest-box {
  background: rgba(255,255,255,.05);
  border-color: rgba(196,149,58,.22);
  color: rgba(248,234,208,.7);
}

html[data-theme="escuro"] .dashboard-stats-strip article {
  background: rgba(255,255,255,.04);
  border-color: rgba(196,149,58,.18);
}

html[data-theme="escuro"] .dashboard-stats-strip strong {
  color: #c4953a;
}

html[data-theme="escuro"] .dashboard-stats-strip span {
  color: rgba(248,234,208,.6);
}

/* ── Hero — tema pergaminho ─────────────────────────────────────────────── */
html[data-theme="pergaminho"] #dashboardHero {
  background:
    radial-gradient(circle at top left, rgba(200,160,80,.2), transparent 40%),
    linear-gradient(135deg, #fdf8ef, #f5e8c8);
  border-color: rgba(139,100,40,.25);
}

/* ── Responsivo ─────────────────────────────────────────────────────────── */
@media (max-width: 700px) {
  #dashboardHero {
    grid-template-columns: 1fr;
    padding: 24px 20px;
    gap: 20px;
  }
  #dashboardHero .memorial-crest-box {
    width: 100%;
    flex-direction: row;
    justify-content: center;
    gap: 16px;
  }
  #dashboardHero h2 { font-size: clamp(1.8rem, 8vw, 2.8rem); }
  .dashboard-stats-strip { grid-template-columns: repeat(2, 1fr); }
}

/* ── Ocultar blocos legados que possam ainda existir no DOM ─────────────── */
.v18-museum-opening,
.v18-legacy-strip,
.v18-origin-story,
#museumOpeningSlot:empty {
  display: none !important;
}

/* ==========================================================================
   V20.4 — Correções finais: logo sidebar, espaço em branco, cards e ícones
   ========================================================================== */

/* ── 1. LOGO DO SIDEBAR — reduzir tamanho exagerado no tema escuro ────────── */
html[data-theme="escuro"] body[data-active-view="dashboard"] .brand,
html[data-theme="escuro"] .brand {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 8px !important;
  padding: 4px 0 16px !important;
  text-align: center !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .brand-mark,
html[data-theme="escuro"] .brand-mark {
  width: 72px !important;
  height: 72px !important;
  border-radius: 999px !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.3), 0 0 0 1px rgba(196,149,58,.25) !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .brand strong,
html[data-theme="escuro"] .brand strong {
  font-size: .95rem !important;
  letter-spacing: .04em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .brand span,
html[data-theme="escuro"] .brand span {
  font-size: .66rem !important;
  letter-spacing: .14em !important;
}

/* ── 2. ESPAÇO EM BRANCO — dashboard ocupa largura total ─────────────────── */
.memorial-dashboard {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-dashboard {
  max-width: 100% !important;
  margin: 0 !important;
}

.main {
  padding: 24px 32px !important;
}

/* V20.9.1 — Grid de 2 colunas para todos os temas (igual ao base) */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
.dashboard-premium-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
}

/* ── 3. STATS STRIP ocupa largura total ──────────────────────────────────── */
.dashboard-stats-strip {
  width: 100%;
}

#dashboardHero {
  width: 100%;
}

/* ── Responsivo: empilhar grid em telas médias ───────────────────────────── */
@media (max-width: 1100px) {
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
  .dashboard-premium-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-timeline-panel {
    grid-column: auto !important;
    grid-row: auto !important;
  }
}

@media (max-width: 760px) {
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
  .dashboard-premium-grid {
    grid-template-columns: 1fr !important;
  }
  .main { padding: 16px !important; }
}

/* ── 4. CARDS DE PESSOA — nome não sobrepõe foto ─────────────────────────── */
.people-card {
  grid-template-columns: 84px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 14px !important;
}

.people-card .avatar {
  width: 84px !important;
  height: 84px !important;
  grid-row: 1 / span 2;
}

.people-card h3 {
  font-size: 1.1rem !important;
  word-break: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
}

/* ── 5. BOTÕES EDITAR/LIXEIRA — melhor contraste ─────────────────────────── */
.card-actions .button.icon-action,
.profile-actions .button,
.people-card .card-actions .button {
  min-width: 42px;
  min-height: 42px;
}

/* Botão editar — azul claro visível */
.btn-edit,
.button.edit-action,
[data-action="edit"] {
  background: rgba(14, 90, 138, .12) !important;
  border: 1px solid rgba(14, 90, 138, .35) !important;
  color: #0e5a8a !important;
}

.btn-edit:hover,
.button.edit-action:hover,
[data-action="edit"]:hover {
  background: rgba(14, 90, 138, .2) !important;
}

/* Botão excluir — vermelho visível */
.btn-delete,
.button.delete-action,
[data-action="delete"] {
  background: rgba(156, 47, 37, .12) !important;
  border: 1px solid rgba(156, 47, 37, .4) !important;
  color: #c0392b !important;
}

.btn-delete:hover,
.button.delete-action:hover,
[data-action="delete"]:hover {
  background: rgba(156, 47, 37, .22) !important;
}

/* Tema escuro: botões de ação com contraste adequado */
html[data-theme="escuro"] .btn-edit,
html[data-theme="escuro"] .button.edit-action,
html[data-theme="escuro"] [data-action="edit"] {
  background: rgba(196, 149, 58, .15) !important;
  border-color: rgba(196, 149, 58, .4) !important;
  color: #e0bd72 !important;
}

html[data-theme="escuro"] .btn-delete,
html[data-theme="escuro"] .button.delete-action,
html[data-theme="escuro"] [data-action="delete"] {
  background: rgba(220, 80, 70, .18) !important;
  border-color: rgba(220, 80, 70, .5) !important;
  color: #ff8a7e !important;
}

/* ── V20.4 — Botões editar/excluir nos cards (classes reais do JS) ────────── */
.icon-card-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.button.icon-button.edit-person {
  width: 44px;
  height: 44px;
  min-width: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  border-radius: 12px;
  background: rgba(14, 90, 138, .1) !important;
  border: 1.5px solid rgba(14, 90, 138, .4) !important;
  color: #0e5a8a !important;
  transition: background .15s, transform .1s;
}

.button.icon-button.edit-person:hover {
  background: rgba(14, 90, 138, .2) !important;
  transform: translateY(-1px);
}

.button.icon-button.delete-person,
.button.icon-button.danger {
  width: 44px;
  height: 44px;
  min-width: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  border-radius: 12px;
  background: rgba(192, 57, 43, .1) !important;
  border: 1.5px solid rgba(192, 57, 43, .45) !important;
  color: #c0392b !important;
  transition: background .15s, transform .1s;
}

.button.icon-button.delete-person:hover,
.button.icon-button.danger:hover {
  background: rgba(192, 57, 43, .22) !important;
  transform: translateY(-1px);
}

/* Tema escuro — contraste dourado/vermelho claro */
html[data-theme="escuro"] .button.icon-button.edit-person {
  background: rgba(196, 149, 58, .18) !important;
  border-color: rgba(196, 149, 58, .45) !important;
  color: #e0bd72 !important;
}

html[data-theme="escuro"] .button.icon-button.edit-person:hover {
  background: rgba(196, 149, 58, .3) !important;
}

html[data-theme="escuro"] .button.icon-button.delete-person,
html[data-theme="escuro"] .button.icon-button.danger {
  background: rgba(230, 90, 80, .2) !important;
  border-color: rgba(230, 90, 80, .5) !important;
  color: #ff9a8e !important;
}

html[data-theme="escuro"] .button.icon-button.delete-person:hover,
html[data-theme="escuro"] .button.icon-button.danger:hover {
  background: rgba(230, 90, 80, .32) !important;
}

/* ==========================================================================
   V20.5 — Logo sem corte, foto de capa elegante, barra de ações unificada
   ========================================================================== */

/* ── 1. LOGO SEM CORTE — escudo retangular, não circular ─────────────────── */
html[data-theme="escuro"] body[data-active-view="dashboard"] .brand-mark,
html[data-theme="escuro"] .brand-mark,
.brand-mark {
  width: 76px !important;
  height: 76px !important;
  border-radius: 18px !important;   /* cantos suaves, NÃO círculo */
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;     /* deixa o escudo aparecer inteiro */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html[data-theme="escuro"] .brand-mark img,
.brand-mark img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;   /* mostra o brasão inteiro sem cortar */
  border-radius: 0 !important;
}

/* Logo do brasão dentro do hero (crest box) — também sem corte */
#dashboardHero .memorial-crest-box img {
  object-fit: contain !important;
  border-radius: 0 !important;
}

/* ── 2. FOTO DE CAPA DO HERO — efeito elegante sem círculo estranho ──────── */
html[data-theme="escuro"] #dashboardHero {
  position: relative;
  overflow: hidden;
}

/* Foto de capa: cobre todo o hero com gradiente suave de baixo p/ cima */
#dashboardHero .dashboard-family-cover-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 30% !important;
  opacity: 1 !important;
  filter: none !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

/* Overlay gradiente sobre a foto — escurece para o texto ficar legível */
html[data-theme="escuro"] #dashboardHero::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(90deg, rgba(7,17,29,.96) 0%, rgba(7,17,29,.82) 40%, rgba(7,17,29,.55) 70%, rgba(7,17,29,.35) 100%),
    linear-gradient(0deg, rgba(7,17,29,.7), transparent 60%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* Quando NÃO há foto de capa, usa o gradiente premium padrão */
#dashboardHero .dashboard-family-cover-img[hidden] {
  display: none !important;
}

/* Conteúdo do hero sempre acima da foto e do overlay */
#dashboardHero .memorial-hero-content,
#dashboardHero .memorial-crest-box {
  position: relative !important;
  z-index: 2 !important;
}

/* Remover o ::before antigo que criava o círculo claro estranho */
html[data-theme="escuro"] #dashboardHero::before {
  display: none !important;
}

/* Remover ::after e ::before legados do memorial-hero-card */
#dashboardHero.memorial-hero-card::after,
#dashboardHero.memorial-hero-card::before {
  background: none !important;
}

/* ── 3. BARRA DE AÇÕES RÁPIDAS UNIFICADA ─────────────────────────────────── */
.dashboard-quick-bar {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
  width: 100%;
}

.quick-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 16px 10px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
  color: var(--text);
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  transition: transform .12s, background .15s, border-color .15s;
  text-align: center;
}

.quick-action:hover {
  transform: translateY(-2px);
  background: var(--primary-soft, rgba(14,90,138,.08));
  border-color: var(--primary, #0e5a8a);
}

.quick-icon {
  font-size: 1.5rem;
  line-height: 1;
}

/* Tema escuro */
html[data-theme="escuro"] .quick-action {
  background: rgba(255,255,255,.04);
  border-color: rgba(196,149,58,.22);
  color: #f8ead0;
}

html[data-theme="escuro"] .quick-action:hover {
  background: rgba(196,149,58,.14);
  border-color: rgba(196,149,58,.45);
}

/* ── Responsivo ─────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .dashboard-quick-bar { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 520px) {
  .dashboard-quick-bar { grid-template-columns: repeat(2, 1fr); }
  .quick-action { padding: 14px 8px; font-size: .76rem; }
  .quick-icon { font-size: 1.3rem; }
}

/* ── V20.5 — Hero adapta conforme tem foto de capa ou não ────────────────── */
/* Sem foto: gradiente premium dourado/escuro. Com foto: overlay sobre a imagem */
html[data-theme="escuro"] #dashboardHero:not(.has-cover)::after {
  display: none !important;  /* sem foto, não precisa do overlay escuro */
}

html[data-theme="escuro"] #dashboardHero.has-cover {
  background: #07111d !important;  /* fundo sólido atrás da foto */
}

/* ── V20.6 — Ícones SVG na barra de ações (coerência com o menu) ─────────── */
.quick-action .quick-icon.ui-icon {
  width: 24px !important;
  height: 24px !important;
  font-size: 0 !important;
  color: var(--primary, #0e5a8a);
}

html[data-theme="escuro"] .quick-action .quick-icon.ui-icon {
  color: #c4953a;
}

html[data-theme="pergaminho"] .quick-action .quick-icon.ui-icon,
html[data-theme="claro"] .quick-action .quick-icon.ui-icon {
  color: var(--primary, #0e5a8a);
}

/* ==========================================================================
   V20.6 — CONTRASTE GARANTIDO do hero em todos os temas + com/sem foto
   Resolve: "Honramos nossas raízes" ilegível em alguns temas
   ========================================================================== */

/* Quando há foto de capa, o texto é SEMPRE branco com sombra, em qualquer tema */
#dashboardHero.has-cover .memorial-hero-content h2 {
  color: #ffffff !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.7), 0 1px 3px rgba(0,0,0,.9) !important;
}

#dashboardHero.has-cover .memorial-hero-content p {
  color: rgba(255,255,255,.92) !important;
  text-shadow: 0 1px 8px rgba(0,0,0,.8), 0 1px 2px rgba(0,0,0,.9) !important;
}

#dashboardHero.has-cover .memorial-hero-content .eyebrow {
  background: rgba(0,0,0,.4) !important;
  border: 1px solid rgba(255,255,255,.3) !important;
  color: #ffe8b4 !important;
  backdrop-filter: blur(4px);
}

/* Overlay reforçado para garantir legibilidade com qualquer foto */
#dashboardHero.has-cover::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(90deg, rgba(10,15,25,.92) 0%, rgba(10,15,25,.78) 38%, rgba(10,15,25,.5) 65%, rgba(10,15,25,.3) 100%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* Sem foto — cada tema tem seu contraste correto */
/* Tema CLARO */
html[data-theme="claro"] #dashboardHero:not(.has-cover) h2 { color: #1a2433 !important; text-shadow: none !important; }
html[data-theme="claro"] #dashboardHero:not(.has-cover) p { color: #56657a !important; text-shadow: none !important; }

/* Tema PERGAMINHO */
html[data-theme="pergaminho"] #dashboardHero:not(.has-cover) h2 { color: #3c2515 !important; text-shadow: none !important; }
html[data-theme="pergaminho"] #dashboardHero:not(.has-cover) p { color: #6b5740 !important; text-shadow: none !important; }

/* Tema ESCURO */
html[data-theme="escuro"] #dashboardHero:not(.has-cover) h2 { color: #f8ead0 !important; }
html[data-theme="escuro"] #dashboardHero:not(.has-cover) p { color: rgba(248,234,208,.82) !important; }

/* ── Crest box sempre legível ────────────────────────────────────────────── */
#dashboardHero.has-cover .memorial-crest-box {
  background: rgba(0,0,0,.45) !important;
  border: 1px solid rgba(255,255,255,.25) !important;
  color: rgba(255,255,255,.9) !important;
  backdrop-filter: blur(8px);
}

/* ==========================================================================
   V20.7 — Memorial em Capítulos: CSS BASE para TODOS os temas
   Antes só o tema escuro tinha estilo. Agora claro e pergaminho também.
   ========================================================================== */

/* ── Grid base — funciona em todos os temas ──────────────────────────────── */
.dashboard-chapters-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

/* ── Card base de capítulo — estrutura para todos os temas ───────────────── */
.family-chapter-card {
  position: relative !important;
  min-height: 140px !important;
  padding: 46px 16px 18px !important;
  border-radius: 16px !important;
  text-align: left !important;
  overflow: hidden !important;
  cursor: pointer;
  display: block !important;
  transition: transform .15s, box-shadow .15s, border-color .15s;
}

/* Número em círculo — posicionado no topo do card */
.family-chapter-card span {
  position: absolute !important;
  left: 14px !important;
  top: 12px !important;
  display: grid !important;
  place-items: center !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  font-size: .95rem !important;
}

/* Título e descrição em blocos separados */
.family-chapter-card strong {
  display: block !important;
  font-size: 1rem !important;
  margin-bottom: 6px !important;
  line-height: 1.2 !important;
}

.family-chapter-card small {
  display: block !important;
  font-size: .82rem !important;
  line-height: 1.4 !important;
}

.family-chapter-card:hover {
  transform: translateY(-2px);
}

/* ── TEMA CLARO ──────────────────────────────────────────────────────────── */
html[data-theme="claro"] .family-chapter-card {
  background: linear-gradient(180deg, #ffffff, #f5f9ff) !important;
  border: 1px solid #dce6f0 !important;
  color: #1a2433 !important;
  box-shadow: 0 4px 14px rgba(16,36,61,.06) !important;
}
html[data-theme="claro"] .family-chapter-card span {
  background: linear-gradient(180deg, #1f8fd0, #0e5a8a) !important;
  color: #ffffff !important;
}
html[data-theme="claro"] .family-chapter-card strong { color: #1a2433 !important; }
html[data-theme="claro"] .family-chapter-card small { color: #56657a !important; }
html[data-theme="claro"] .family-chapter-card:hover {
  border-color: #1f8fd0 !important;
  box-shadow: 0 10px 26px rgba(14,90,138,.14) !important;
}

/* ── TEMA PERGAMINHO ─────────────────────────────────────────────────────── */
html[data-theme="pergaminho"] .family-chapter-card {
  background: linear-gradient(180deg, #fdf8ef, #f5e8c8) !important;
  border: 1px solid #d9c9a3 !important;
  color: #3c2515 !important;
  box-shadow: 0 4px 14px rgba(82,58,24,.08) !important;
}
html[data-theme="pergaminho"] .family-chapter-card span {
  background: linear-gradient(180deg, #d4a04a, #9a641f) !important;
  color: #ffffff !important;
}
html[data-theme="pergaminho"] .family-chapter-card strong { color: #3c2515 !important; }
html[data-theme="pergaminho"] .family-chapter-card small { color: #6b5740 !important; }
html[data-theme="pergaminho"] .family-chapter-card:hover {
  border-color: #b8892a !important;
  box-shadow: 0 10px 26px rgba(139,100,40,.18) !important;
}

/* ── TEMA SÉPIA (se existir) ─────────────────────────────────────────────── */
html[data-theme="sepia"] .family-chapter-card {
  background: linear-gradient(180deg, #f4ece0, #e8dcc8) !important;
  border: 1px solid #d0bfa3 !important;
  color: #3a2c1a !important;
}
html[data-theme="sepia"] .family-chapter-card span {
  background: linear-gradient(180deg, #c4953a, #8a641f) !important;
  color: #ffffff !important;
}
html[data-theme="sepia"] .family-chapter-card strong { color: #3a2c1a !important; }
html[data-theme="sepia"] .family-chapter-card small { color: #6a5440 !important; }

/* ── Responsivo: 5 → 3 → 2 colunas ───────────────────────────────────────── */
@media (max-width: 1100px) {
  .dashboard-chapters-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 700px) {
  .dashboard-chapters-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 440px) {
  .dashboard-chapters-grid { grid-template-columns: 1fr !important; }
}

/* ==========================================================================
   V20.8 — REDESIGN DEFINITIVO do dashboard escuro
   Resolve: grid quebrado com buracos, painéis com fundo claro aleatório,
   hierarquia fraca. Baseado nas referências premium 2026 (auditoria).
   ========================================================================== */

/* ── SISTEMA DE SUPERFÍCIES (3 níveis de profundidade) ───────────────────── */
html[data-theme="escuro"] {
  --surf-0: #07111d;   /* fundo da página */
  --surf-1: #0d1b26;   /* card padrão */
  --surf-2: #13242f;   /* card elevado / hover */
  --surf-line: rgba(196,149,58,.20);
  --surf-line-strong: rgba(196,149,58,.40);
  --gold: #c4953a;
  --gold-bright: #e0bd72;
  --txt: #f4ead6;
  --txt-muted: rgba(244,234,214,.66);
}

/* ── GRID SIMPLES E ROBUSTO — 3 colunas, sem spans complexos ─────────────── */
/* V20.9.1 — Tema escuro usa EXATAMENTE o mesmo grid base dos temas claro/pergaminho.
   2 colunas, mapa de origens e capítulos em largura total. Só as cores mudam. */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-content-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 16px !important;
  align-items: stretch !important;
}

/* Reset de TODO posicionamento manual antigo (grid-row/column das versões anteriores) */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid > .dashboard-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-content-grid > .dashboard-panel {
  grid-column: auto !important;
  grid-row: auto !important;
}

/* Mapa das origens e capítulos ocupam largura total — igual aos outros temas */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-wide-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-panel {
  grid-column: 1 / -1 !important;
}

/* ── TODOS os painéis com a MESMA superfície escura (fim dos fundos claros) ─ */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-timeline-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-memories-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-panel {
  background: var(--surf-1) !important;
  border: 1px solid var(--surf-line) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.32) !important;
  color: var(--txt) !important;
  padding: 22px !important;
}

/* Títulos e textos sempre claros */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel h3,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel h3,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel h3,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel h3 {
  color: var(--txt) !important;
  font-size: 1.3rem !important;
  margin-top: 4px !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel .eyebrow {
  color: var(--gold) !important;
  background: rgba(196,149,58,.12) !important;
  border: 1px solid var(--surf-line) !important;
}

/* Botões "ghost" coerentes em todos os painéis */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel .button.ghost,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel .button.ghost,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel .button.ghost,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel .button.ghost {
  color: var(--gold-bright) !important;
  background: rgba(196,149,58,.10) !important;
  border: 1px solid var(--surf-line) !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel .button.ghost:hover {
  background: rgba(196,149,58,.2) !important;
}

/* ── Itens de lista internos (feed, eventos, memórias) coerentes ─────────── */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-event,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-list > * {
  background: var(--surf-2) !important;
  border: 1px solid var(--surf-line) !important;
  color: var(--txt) !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item small,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-list small {
  color: var(--txt-muted) !important;
}

/* ── "Hoje no memorial" — card destaque, mesma superfície ────────────────── */
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card {
  background: var(--surf-2) !important;
  border: 1px solid var(--surf-line) !important;
  color: var(--txt) !important;
  min-height: 0 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card strong {
  color: var(--gold-bright) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card p,
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card small {
  color: var(--txt-muted) !important;
}

/* ── Capítulos no tema escuro — superfície elevada coerente ──────────────── */
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card {
  background: var(--surf-2) !important;
  border: 1px solid var(--surf-line) !important;
  color: var(--txt) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card span {
  background: linear-gradient(180deg, var(--gold-bright), var(--gold)) !important;
  color: #231605 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card strong {
  color: var(--txt) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card small {
  color: var(--txt-muted) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card:hover {
  border-color: var(--surf-line-strong) !important;
  background: #16293553 !important;
}

/* ── Mapa de origens (países) coerente ───────────────────────────────────── */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origin-map,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-country-list {
  background: transparent !important;
}

/* ── Stats strip e quick bar coerentes com as superfícies ────────────────── */
html[data-theme="escuro"] .dashboard-stats-strip article {
  background: var(--surf-1) !important;
  border: 1px solid var(--surf-line) !important;
}
html[data-theme="escuro"] .dashboard-stats-strip strong { color: var(--gold) !important; }

html[data-theme="escuro"] .quick-action {
  background: var(--surf-1) !important;
  border: 1px solid var(--surf-line) !important;
  color: var(--txt) !important;
}
html[data-theme="escuro"] .quick-action:hover {
  background: var(--surf-2) !important;
  border-color: var(--surf-line-strong) !important;
}

/* ── Espaçamento geral do dashboard (8-point grid) ───────────────────────── */
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-dashboard {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

/* ── Responsivo: 12 colunas colapsam ─────────────────────────────────────── */
@media (max-width: 1100px) {
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-timeline-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-memories-panel,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel {
    grid-column: span 6 !important;
  }
}
@media (max-width: 700px) {
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid > .dashboard-panel {
    grid-column: span 12 !important;
  }
}

/* ── V20.8 — Hero escuro coerente (sem foto: gradiente premium suave) ─────── */
html[data-theme="escuro"] #dashboardHero:not(.has-cover) {
  background:
    radial-gradient(circle at 15% 20%, rgba(196,149,58,.14), transparent 45%),
    linear-gradient(135deg, #0d1b26 0%, #0a151f 100%) !important;
  border: 1px solid var(--surf-line) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,.35) !important;
}

html[data-theme="escuro"] #dashboardHero:not(.has-cover) .memorial-crest-box {
  background: var(--surf-2) !important;
  border: 1px solid var(--surf-line) !important;
  color: var(--txt-muted) !important;
}

html[data-theme="escuro"] #dashboardHero:not(.has-cover) .memorial-crest-box img {
  object-fit: contain !important;
}

/* Eyebrow do hero coerente */
html[data-theme="escuro"] #dashboardHero .eyebrow {
  background: rgba(196,149,58,.14) !important;
  border: 1px solid var(--surf-line) !important;
  color: var(--gold-bright) !important;
}

/* ==========================================================================
   V20.9 — Acontecimentos compartilhados: chips e cards
   ========================================================================== */

/* ── Campo de seleção de participantes (chips) ───────────────────────────── */
.memory-people-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.memory-people-label {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.memory-people-label small {
  font-weight: 400;
  font-size: .78rem;
  color: var(--muted);
}

.memory-people-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  max-height: 160px;
  overflow-y: auto;
}

.memory-person-chip {
  padding: 6px 14px;
  border: 1.5px solid var(--line);
  border-radius: 999px;
  background: transparent;
  color: var(--text);
  font-size: .85rem;
  font-weight: 500;
  cursor: pointer;
  transition: all .15s;
}

.memory-person-chip:hover {
  border-color: var(--primary, #0e5a8a);
}

.memory-person-chip.active {
  background: var(--primary, #0e5a8a);
  border-color: var(--primary, #0e5a8a);
  color: #ffffff;
  font-weight: 600;
}

/* Tema escuro */
html[data-theme="escuro"] .memory-people-chips {
  background: rgba(255,255,255,.04);
  border-color: rgba(196,149,58,.22);
}

html[data-theme="escuro"] .memory-person-chip {
  border-color: rgba(196,149,58,.3);
  color: #f4ead6;
}

html[data-theme="escuro"] .memory-person-chip.active {
  background: linear-gradient(180deg, #e0bd72, #c4953a);
  border-color: #c4953a;
  color: #231605;
}

/* ── Cards de acontecimento compartilhado no perfil ──────────────────────── */
.shared-memories-section {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

.shared-memories-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 14px;
  margin-top: 12px;
}

.shared-memory-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  transition: transform .15s, box-shadow .15s;
}

.shared-memory-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.1);
}

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

.shared-memory-head strong {
  font-size: 1rem;
  color: var(--text);
}

.shared-memory-date {
  font-size: .75rem;
  color: var(--muted);
  white-space: nowrap;
}

.shared-memory-text {
  font-size: .88rem;
  line-height: 1.5;
  color: var(--muted);
  margin: 0 0 8px;
}

.shared-memory-people {
  font-size: .8rem;
  color: var(--primary, #0e5a8a);
  margin: 0 0 6px;
  font-weight: 500;
}

.shared-memory-link {
  font-size: .82rem;
  color: var(--primary, #0e5a8a);
  font-weight: 600;
  text-decoration: none;
}

.shared-memory-link:hover { text-decoration: underline; }

/* Tema escuro */
html[data-theme="escuro"] .shared-memory-card {
  background: rgba(255,255,255,.04);
  border-color: rgba(196,149,58,.22);
}
html[data-theme="escuro"] .shared-memory-head strong { color: #f4ead6; }
html[data-theme="escuro"] .shared-memory-people,
html[data-theme="escuro"] .shared-memory-link { color: #e0bd72; }

/* ==========================================================================
   V20.9.1 — Garantia final: tema escuro com layout igual aos outros temas
   Esta é a ÚLTIMA regra do arquivo, então tem prioridade na cascata.
   ========================================================================== */

/* Grid: 2 colunas, igual ao claro/pergaminho */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-content-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 16px !important;
}

/* Mapa de origens e capítulos em largura total */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-wide-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-panel {
  grid-column: 1 / -1 !important;
}

/* Demais painéis: fluxo natural, sem posicionamento manual */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-timeline-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-memories-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel {
  grid-column: auto !important;
  grid-row: auto !important;
}

/* TODOS os painéis com a mesma superfície escura (sem fundos claros) */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-birthday-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-today-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-timeline-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-memories-panel {
  background: #0d1b26 !important;
  border: 1px solid rgba(196,149,58,.20) !important;
  color: #f4ead6 !important;
  min-height: 260px !important;
  padding: 22px !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel h3 {
  color: #f4ead6 !important;
}

/* Responsivo: 1 coluna no mobile */
@media (max-width: 760px) {
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-content-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================
   V20.9.2 — Card de pessoa redesenhado + botões visíveis
   ========================================================================== */

/* ── Card de pessoa: layout limpo (sem pílulas) ──────────────────────────── */
.people-nickname {
  font-size: .9rem;
  color: var(--muted);
  font-style: italic;
  margin: 2px 0 10px;
}

/* Lista de dados em formato definição (rótulo + valor), bem distribuído */
.people-meta-clean {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin: 0;
}

.people-meta-clean .meta-row {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 10px;
  align-items: baseline;
}

.people-meta-clean dt {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
  font-weight: 600;
  margin: 0;
}

.people-meta-clean dd {
  font-size: .9rem;
  color: var(--text);
  margin: 0;
  line-height: 1.35;
}

/* Esconde o estilo antigo de pílulas (caso reste algo) */
.people-card .people-meta { display: none !important; }

/* Tema escuro */
html[data-theme="escuro"] .people-nickname { color: rgba(244,234,214,.6); }
html[data-theme="escuro"] .people-meta-clean dt { color: rgba(244,234,214,.55); }
html[data-theme="escuro"] .people-meta-clean dd { color: #f4ead6; }

/* ── Botões de FOTO (editar/excluir) — agora bem visíveis ────────────────── */
.photo-icon-edit,
.photo-icon-delete {
  position: absolute;
  bottom: 12px;
  width: 38px !important;
  height: 38px !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 1rem !important;
  cursor: pointer;
  z-index: 3;
  transition: transform .12s, background .15s;
}

.photo-icon-edit {
  right: 58px;
  background: rgba(14, 90, 138, .14) !important;
  border: 1.5px solid rgba(14, 90, 138, .5) !important;
  color: #0e5a8a !important;
}

.photo-icon-edit:hover {
  background: rgba(14, 90, 138, .26) !important;
  transform: translateY(-2px);
}

.photo-icon-delete {
  right: 12px;
  background: rgba(192, 57, 43, .14) !important;
  border: 1.5px solid rgba(192, 57, 43, .55) !important;
  color: #c0392b !important;
}

.photo-icon-delete:hover {
  background: rgba(192, 57, 43, .28) !important;
  transform: translateY(-2px);
}

/* Tema escuro — botões de foto com contraste dourado/vermelho claro */
html[data-theme="escuro"] .photo-icon-edit {
  background: rgba(196, 149, 58, .2) !important;
  border-color: rgba(196, 149, 58, .55) !important;
  color: #e0bd72 !important;
}
html[data-theme="escuro"] .photo-icon-edit:hover {
  background: rgba(196, 149, 58, .34) !important;
}
html[data-theme="escuro"] .photo-icon-delete {
  background: rgba(230, 90, 80, .24) !important;
  border-color: rgba(230, 90, 80, .6) !important;
  color: #ff9a8e !important;
}
html[data-theme="escuro"] .photo-icon-delete:hover {
  background: rgba(230, 90, 80, .38) !important;
}

/* Garante que o card de foto seja referência para o posicionamento absoluto */
.profile-photo-card.premium-photo-card {
  position: relative;
}

/* ── V20.9.2 — Selo de foto compartilhada ────────────────────────────────── */
.photo-shared-badge {
  display: inline-block;
  margin-top: 4px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 600;
  background: rgba(14, 90, 138, .12);
  color: #0e5a8a;
  border: 1px solid rgba(14, 90, 138, .3);
}

.profile-photo-card.is-shared {
  border-color: rgba(14, 90, 138, .35) !important;
}

html[data-theme="escuro"] .photo-shared-badge {
  background: rgba(196, 149, 58, .16);
  color: #e0bd72;
  border-color: rgba(196, 149, 58, .4);
}

html[data-theme="escuro"] .profile-photo-card.is-shared {
  border-color: rgba(196, 149, 58, .35) !important;
}

/* Campo de pessoas no formulário de foto */
.doc-people-field {
  margin: 4px 0 8px;
}

/* ========================================================================== 
   V20.10 — Auditoria de fluidez: Home unificada + cards de pessoas sem cortes
   Objetivo: manter a MESMA arquitetura visual nos temas Claro, Escuro e Pergaminho.
   ========================================================================== */

/* ---------- Home: mesma malha, espaçamentos e hierarquia nos 3 temas ---------- */
body[data-active-view="dashboard"] .memorial-dashboard {
  width: 100% !important;
  max-width: 1800px !important;
  margin: 0 auto !important;
  display: grid !important;
  gap: 18px !important;
}

@media (min-width: 981px) {
  body[data-active-view="dashboard"] .app-shell {
    grid-template-columns: 290px minmax(0, 1fr) !important;
  }

  body[data-active-view="dashboard"] .main {
    padding: 28px !important;
  }
}

body[data-active-view="dashboard"] .topbar {
  min-height: auto !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 16px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body[data-active-view="dashboard"] .topbar > div {
  display: block !important;
}

body[data-active-view="dashboard"] .topbar::before,
body[data-active-view="dashboard"] .topbar::after {
  content: none !important;
  display: none !important;
}

body[data-active-view="dashboard"] .sidebar {
  gap: 28px !important;
}

body[data-active-view="dashboard"] .brand {
  display: flex !important;
  align-items: center !important;
  justify-items: initial !important;
  gap: 14px !important;
  padding: 0 !important;
  border-bottom: 0 !important;
  text-align: left !important;
}

body[data-active-view="dashboard"] .brand-mark {
  width: 58px !important;
  height: 58px !important;
  border-radius: 18px !important;
}

body[data-active-view="dashboard"] .brand strong {
  font-size: 1rem !important;
  line-height: 1.15 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

body[data-active-view="dashboard"] .brand span {
  font-size: .82rem !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

body[data-active-view="dashboard"] .memorial-hero-card {
  min-height: 220px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 220px !important;
  align-items: center !important;
  gap: 24px !important;
  margin-top: 0 !important;
  padding: 30px !important;
  border-radius: 28px !important;
  overflow: hidden !important;
}

body[data-active-view="dashboard"] .memorial-hero-card::before {
  content: none !important;
}

body[data-active-view="dashboard"] .memorial-hero-card::after {
  content: '' !important;
  position: absolute !important;
  inset: auto -50px -90px auto !important;
  width: 220px !important;
  height: 220px !important;
  border-radius: 999px !important;
  background: rgba(150, 98, 44, .08) !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

body[data-active-view="dashboard"] .dashboard-family-cover-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: .22 !important;
  filter: none !important;
  z-index: 0 !important;
}

body[data-active-view="dashboard"] .memorial-hero-content,
body[data-active-view="dashboard"] .memorial-crest-box {
  position: relative !important;
  z-index: 2 !important;
}

body[data-active-view="dashboard"] .memorial-hero-card h2 {
  margin: 16px 0 8px !important;
  font-size: clamp(2.25rem, 5vw, 4.8rem) !important;
  line-height: .96 !important;
  letter-spacing: -.07em !important;
}

body[data-active-view="dashboard"] .memorial-hero-card p {
  max-width: 760px !important;
  font-size: 1.08rem !important;
  line-height: 1.65 !important;
}

body[data-active-view="dashboard"] .memorial-crest-box {
  align-self: center !important;
  display: grid !important;
  place-items: center !important;
  gap: 10px !important;
  padding: 18px !important;
  border-radius: 24px !important;
  text-align: center !important;
}

body[data-active-view="dashboard"] .memorial-crest-box img {
  width: 128px !important;
  height: 128px !important;
  object-fit: contain !important;
}

body[data-active-view="dashboard"] .dashboard-stats-strip {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

body[data-active-view="dashboard"] .dashboard-quick-bar {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

body[data-active-view="dashboard"] .dashboard-premium-grid,
body[data-active-view="dashboard"] .dashboard-content-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 16px !important;
}

body[data-active-view="dashboard"] .dashboard-origins-panel,
body[data-active-view="dashboard"] .dashboard-wide-panel,
body[data-active-view="dashboard"] .dashboard-chapters-panel {
  grid-column: 1 / -1 !important;
}

body[data-active-view="dashboard"] .dashboard-timeline-panel,
body[data-active-view="dashboard"] .dashboard-memories-panel,
body[data-active-view="dashboard"] .dashboard-birthday-panel,
body[data-active-view="dashboard"] .dashboard-today-panel {
  grid-column: auto !important;
  grid-row: auto !important;
}

body[data-active-view="dashboard"] .dashboard-panel {
  min-height: 260px !important;
  padding: 22px !important;
  display: flex !important;
  flex-direction: column !important;
}

body[data-active-view="dashboard"] .dashboard-origin-map,
body[data-active-view="dashboard"] .dashboard-route-summary {
  min-height: 0 !important;
}

body[data-active-view="dashboard"] .dashboard-chapters-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

body[data-active-view="dashboard"] .family-chapter-card {
  min-height: 116px !important;
  display: grid !important;
  align-content: start !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip article,
html[data-theme="escuro"] body[data-active-view="dashboard"] .quick-action,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-mini-event,
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card,
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-country-chip,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box {
  border-color: rgba(196,149,58,.24) !important;
}

@media (max-width: 1200px) {
  body[data-active-view="dashboard"] .dashboard-quick-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body[data-active-view="dashboard"] .dashboard-chapters-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 820px) {
  body[data-active-view="dashboard"] .memorial-hero-card,
  body[data-active-view="dashboard"] .dashboard-premium-grid,
  body[data-active-view="dashboard"] .dashboard-content-grid {
    grid-template-columns: 1fr !important;
  }

  body[data-active-view="dashboard"] .dashboard-stats-strip,
  body[data-active-view="dashboard"] .dashboard-quick-bar,
  body[data-active-view="dashboard"] .dashboard-chapters-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body[data-active-view="dashboard"] .memorial-crest-box {
    justify-self: stretch !important;
  }
}

@media (max-width: 560px) {
  body[data-active-view="dashboard"] .dashboard-stats-strip,
  body[data-active-view="dashboard"] .dashboard-quick-bar,
  body[data-active-view="dashboard"] .dashboard-chapters-grid {
    grid-template-columns: 1fr !important;
  }

  body[data-active-view="dashboard"] .memorial-hero-card {
    padding: 22px !important;
  }
}

/* ---------- Pessoas: cards sem cortes, sem pílulas e com leitura fluida ---------- */
.people-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)) !important;
  align-items: stretch !important;
  gap: 18px !important;
}

.people-card.clickable-person-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 92px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 16px !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 18px !important;
  padding-bottom: 18px !important;
  overflow: hidden !important;
}

.people-card .avatar {
  width: 92px !important;
  height: 92px !important;
  grid-row: auto !important;
  border-radius: 24px !important;
}

.people-card-body {
  min-width: 0 !important;
  width: 100% !important;
}

.people-card h3 {
  margin: 2px 0 6px !important;
  max-width: 100% !important;
  font-size: clamp(1.05rem, 1.9vw, 1.24rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -.025em !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  hyphens: auto !important;
}

.people-nickname {
  margin: 0 0 12px !important;
  font-size: .92rem !important;
  line-height: 1.35 !important;
}

.people-meta-clean {
  display: grid !important;
  gap: 8px !important;
  margin: 0 !important;
}

.people-meta-clean .meta-row {
  display: grid !important;
  grid-template-columns: 116px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
  min-width: 0 !important;
}

.people-meta-clean dt {
  margin: .18rem 0 0 !important;
  color: var(--muted) !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
}

.people-meta-clean dd {
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--text) !important;
  font-size: .93rem !important;
  line-height: 1.38 !important;
  overflow-wrap: anywhere !important;
}

.meta-value-line {
  display: block !important;
}

.meta-value-line strong {
  font-size: .78em !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  opacity: .76 !important;
}

.meta-value-muted {
  color: var(--muted) !important;
}

.people-card .people-meta,
.people-card .people-meta span {
  display: none !important;
}

.people-card .icon-card-actions {
  position: static !important;
  grid-column: 1 / -1 !important;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px solid var(--line) !important;
}

.people-card .icon-button,
.people-card .icon-button.edit-person,
.people-card .icon-button.delete-person {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border-radius: 13px !important;
}

html[data-theme="escuro"] .people-meta-clean dt,
html[data-theme="escuro"] .meta-value-muted {
  color: rgba(248,234,208,.64) !important;
}

html[data-theme="escuro"] .people-meta-clean dd {
  color: var(--premium-text, #f8ead0) !important;
}

html[data-theme="escuro"] .people-card .icon-card-actions {
  border-top-color: rgba(196,149,58,.22) !important;
}

@media (max-width: 520px) {
  .people-card.clickable-person-card {
    grid-template-columns: 74px minmax(0, 1fr) !important;
    gap: 14px !important;
    padding: 16px !important;
  }

  .people-card .avatar {
    width: 74px !important;
    height: 74px !important;
    border-radius: 20px !important;
  }

  .people-meta-clean .meta-row {
    grid-template-columns: 1fr !important;
    gap: 3px !important;
  }

  .people-meta-clean dt {
    margin-top: 0 !important;
  }
}


/* ========================================================================== 
   V20.11 — Correção solicitada: dashboard igual ao pergaminho em todos os temas
   + formulário de pessoa com abas funcionais e ícones do padrão visual
   ========================================================================== */
html[data-theme="claro"] body[data-active-view="dashboard"],
html[data-theme="escuro"] body[data-active-view="dashboard"],
html[data-theme="pergaminho"] body[data-active-view="dashboard"] {
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* V22.7 — regra restrita ao desktop: no mobile a sidebar é drawer e o main ocupa 100% */
@media (min-width: 981px) {
  html[data-theme="claro"] body[data-active-view="dashboard"] .app-shell,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .app-shell,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .app-shell {
    grid-template-columns: 286px minmax(0, 1fr) !important;
  }
}

html[data-theme="claro"] body[data-active-view="dashboard"] .main,
html[data-theme="escuro"] body[data-active-view="dashboard"] .main,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .main {
  padding: 0 32px 32px !important;
  background: var(--bg) !important;
}

html[data-theme="claro"] body[data-active-view="dashboard"] .topbar,
html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .topbar {
  min-height: 72px !important;
  margin: 0 -32px 0 !important;
  padding: 14px 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  border-bottom: 1px solid var(--line) !important;
  background: var(--surface) !important;
  backdrop-filter: none !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar > div { display: block !important; }
html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar::before,
html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar::after { content: none !important; display: none !important; }

html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-dashboard,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-dashboard,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-dashboard {
  width: 100% !important;
  max-width: 1440px !important;
  margin: 0 auto !important;
  display: grid !important;
  gap: 16px !important;
}

html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-card,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card,
#dashboardHero {
  position: relative !important;
  overflow: hidden !important;
  min-height: 250px !important;
  border-radius: 0 0 28px 28px !important;
  padding: 34px 42px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 180px !important;
  align-items: center !important;
  gap: 28px !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.72) 44%, rgba(255,255,255,.36) 100%),
    var(--premium-hero-image, linear-gradient(135deg, #fdf8ef, #f5e8c8)) !important;
  border: 1px solid rgba(139,100,40,.22) !important;
  box-shadow: 0 16px 44px rgba(63,42,18,.12) !important;
  color: var(--text) !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card,
html[data-theme="escuro"] #dashboardHero {
  background:
    linear-gradient(90deg, rgba(6,15,22,.92) 0%, rgba(6,15,22,.66) 46%, rgba(6,15,22,.28) 100%),
    var(--premium-hero-image, linear-gradient(135deg, #07111d, #111a10)) !important;
  color: #f8ead0 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card::before,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card::after,
html[data-theme="escuro"] #dashboardHero::before,
html[data-theme="escuro"] #dashboardHero::after { content: none !important; display: none !important; }

html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-family-cover-img,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-family-cover-img,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-family-cover-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  opacity: .42 !important;
  filter: saturate(.9) contrast(.95) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-family-cover-img { opacity: .30 !important; filter: sepia(.36) saturate(.82) brightness(.86) !important; }

html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-content,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-content,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-content,
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box { position: relative !important; z-index: 2 !important; }

html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-card h2,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card h2,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card h2,
#dashboardHero h2 {
  font-size: clamp(2.15rem, 4vw, 4.1rem) !important;
  line-height: .96 !important;
  margin: 12px 0 8px !important;
  letter-spacing: -.05em !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card h2 { color: #f8ead0 !important; }

html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box,
#dashboardHero .memorial-crest-box {
  width: 150px !important;
  padding: 14px !important;
  border-radius: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-crest-box img,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box img,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box img,
#dashboardHero .memorial-crest-box img { width: 96px !important; height: 96px !important; object-fit: contain !important; }

html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-stats-strip,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-stats-strip article,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip article,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip article {
  min-height: 86px !important;
  border-radius: 16px !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip strong { color: #c4953a !important; }

html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-quick-bar {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .quick-action,
html[data-theme="escuro"] body[data-active-view="dashboard"] .quick-action,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .quick-action {
  min-height: 74px !important;
  border-radius: 16px !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
}

html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-premium-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 16px !important;
  width: 100% !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-panel {
  min-height: 260px !important;
  border-radius: 22px !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  box-shadow: var(--shadow) !important;
}

.person-form-tabs {
  align-items: center !important;
  gap: 8px !important;
}
.person-tab {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  border: 1px solid transparent !important;
}
.person-tab .tab-icon { width: 17px !important; height: 17px !important; }
.person-tab.active {
  border-color: var(--line) !important;
  border-bottom-color: var(--primary) !important;
}
.person-tab-panel { display: none !important; }
.person-tab-panel.active { display: block !important; }

@media (max-width: 1100px) {
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-quick-bar { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 760px) {
  html[data-theme="claro"] body[data-active-view="dashboard"] .main,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .main,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .main { padding: 0 16px 20px !important; }
  html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-card,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card { grid-template-columns: 1fr !important; padding: 24px 20px !important; border-radius: 0 0 22px 22px !important; }
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-stats-strip,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-premium-grid { grid-template-columns: 1fr !important; }
}

/* ========================================================================== 
   V20.12 — Home única nos 3 temas
   Objetivo: todos os temas usam EXATAMENTE o mesmo layout estrutural do pergaminho.
   Apenas cores/variáveis do tema mudam. Não altera login, Firebase nem salvamento.
   ========================================================================== */
body[data-active-view="dashboard"] .main {
  padding: 0 32px 32px !important;
}

html[data-theme="claro"] body[data-active-view="dashboard"] .main,
html[data-theme="escuro"] body[data-active-view="dashboard"] .main,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .main {
  background: var(--bg) !important;
}

body[data-active-view="dashboard"] .memorial-dashboard {
  width: 100% !important;
  max-width: 1440px !important;
  margin: 0 auto !important;
  display: grid !important;
  gap: 16px !important;
}

/* Hero igual ao pergaminho: mesma altura, mesmo grid e mesma proporção */
body[data-active-view="dashboard"] #dashboardHero,
body[data-active-view="dashboard"] .memorial-hero-card {
  position: relative !important;
  overflow: hidden !important;
  min-height: 250px !important;
  border-radius: 0 0 28px 28px !important;
  padding: 34px 42px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 180px !important;
  align-items: center !important;
  gap: 28px !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
}

body[data-active-view="dashboard"] #dashboardHero::before,
body[data-active-view="dashboard"] #dashboardHero::after,
body[data-active-view="dashboard"] .memorial-hero-card::before,
body[data-active-view="dashboard"] .memorial-hero-card::after {
  content: none !important;
  display: none !important;
}

html[data-theme="claro"] body[data-active-view="dashboard"] #dashboardHero,
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-card,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] #dashboardHero,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card {
  background:
    linear-gradient(90deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.72) 44%, rgba(255,255,255,.36) 100%),
    var(--premium-hero-image, linear-gradient(135deg, #fdf8ef, #f5e8c8)) !important;
  color: var(--text) !important;
}

html[data-theme="escuro"] body[data-active-view="dashboard"] #dashboardHero,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card {
  background:
    linear-gradient(90deg, rgba(6,15,22,.92) 0%, rgba(6,15,22,.66) 46%, rgba(6,15,22,.28) 100%),
    var(--premium-hero-image, linear-gradient(135deg, #07111d, #111a10)) !important;
  color: #f8ead0 !important;
}

body[data-active-view="dashboard"] .dashboard-family-cover-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  opacity: .42 !important;
  filter: saturate(.9) contrast(.95) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-family-cover-img {
  opacity: .30 !important;
  filter: sepia(.36) saturate(.82) brightness(.86) !important;
}

body[data-active-view="dashboard"] .memorial-hero-content,
body[data-active-view="dashboard"] .memorial-crest-box {
  position: relative !important;
  z-index: 2 !important;
}

body[data-active-view="dashboard"] .memorial-hero-card h2 {
  font-size: clamp(2.15rem, 4vw, 4.1rem) !important;
  line-height: .96 !important;
  margin: 12px 0 8px !important;
  letter-spacing: -.05em !important;
}

body[data-active-view="dashboard"] .memorial-crest-box {
  width: 150px !important;
  min-height: 150px !important;
  padding: 14px !important;
  border-radius: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  justify-self: end !important;
}
body[data-active-view="dashboard"] .memorial-crest-box img {
  width: 96px !important;
  height: 96px !important;
  object-fit: contain !important;
}

/* Estatísticas: 4 cards iguais em todos os temas */
body[data-active-view="dashboard"] .dashboard-stats-strip {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
}
body[data-active-view="dashboard"] .dashboard-stats-strip article {
  min-height: 86px !important;
  border-radius: 16px !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  box-shadow: var(--shadow-soft, none) !important;
}
body[data-active-view="dashboard"] .dashboard-stats-strip strong {
  font-size: 1.85rem !important;
  line-height: 1 !important;
}

/* Ações rápidas: 6 botões em linha, igual ao pergaminho */
body[data-active-view="dashboard"] .dashboard-quick-bar {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
}
body[data-active-view="dashboard"] .quick-action {
  min-height: 74px !important;
  border-radius: 16px !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-shadow: var(--shadow-soft, none) !important;
}

/* Grid principal: Mapa ocupa largura toda; abaixo dois cards por linha */
body[data-active-view="dashboard"] .dashboard-content-grid,
body[data-active-view="dashboard"] .dashboard-premium-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 16px !important;
  width: 100% !important;
}
body[data-active-view="dashboard"] .dashboard-origins-panel,
body[data-active-view="dashboard"] .dashboard-wide-panel,
body[data-active-view="dashboard"] .dashboard-chapters-panel {
  grid-column: 1 / -1 !important;
}
body[data-active-view="dashboard"] .dashboard-timeline-panel,
body[data-active-view="dashboard"] .dashboard-memories-panel,
body[data-active-view="dashboard"] .dashboard-birthday-panel,
body[data-active-view="dashboard"] .dashboard-today-panel {
  grid-column: auto !important;
  grid-row: auto !important;
}
body[data-active-view="dashboard"] .dashboard-panel {
  min-height: 260px !important;
  padding: 22px !important;
  border-radius: 22px !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  box-shadow: var(--shadow) !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Mapa das origens: força modelo horizontal do pergaminho também no claro/escuro */
body[data-active-view="dashboard"] .dashboard-origin-map,
body[data-active-view="dashboard"] .dashboard-route-summary {
  width: 100% !important;
  min-height: 0 !important;
}
body[data-active-view="dashboard"] .dashboard-route-summary {
  display: grid !important;
  gap: 16px !important;
  padding: 20px !important;
  border-radius: 22px !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(135deg, rgba(255,248,232,.80), rgba(255,255,255,.38)) !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.32) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-route-summary {
  background: linear-gradient(135deg, rgba(12,31,42,.94), rgba(8,20,29,.90)) !important;
}
body[data-active-view="dashboard"] .route-summary-header {
  display: flex !important;
  align-items: start !important;
  justify-content: space-between !important;
  gap: 18px !important;
}
body[data-active-view="dashboard"] .route-path-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr) 44px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 18px !important;
  border-radius: 20px !important;
  border: 1px solid var(--line) !important;
  background: rgba(255,255,255,.36) !important;
  box-shadow: none !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-path-card {
  background: rgba(255,255,255,.045) !important;
}
body[data-active-view="dashboard"] .route-country-node {
  min-height: 92px !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 74px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 16px !important;
  border-radius: 18px !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  text-align: left !important;
}
body[data-active-view="dashboard"] .route-arrow {
  width: 40px !important;
  height: 40px !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  justify-self: center !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--primary) !important;
}
body[data-active-view="dashboard"] .route-mini-legend {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
body[data-active-view="dashboard"] .route-story-note {
  border-radius: 16px !important;
  border: 1px solid var(--line) !important;
  background: rgba(255,255,255,.42) !important;
  padding: 12px 14px !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .route-story-note {
  background: rgba(255,255,255,.04) !important;
}

body[data-active-view="dashboard"] .dashboard-chapters-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
body[data-active-view="dashboard"] .family-chapter-card {
  min-height: 116px !important;
  border-radius: 18px !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  display: grid !important;
  align-content: start !important;
  gap: 6px !important;
}

@media (max-width: 1200px) {
  body[data-active-view="dashboard"] .dashboard-quick-bar { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 900px) {
  body[data-active-view="dashboard"] .route-path-card {
    grid-template-columns: 1fr !important;
  }
  body[data-active-view="dashboard"] .route-arrow {
    transform: rotate(90deg) !important;
  }
}
@media (max-width: 820px) {
  body[data-active-view="dashboard"] .main { padding: 0 16px 20px !important; }
  body[data-active-view="dashboard"] #dashboardHero,
  body[data-active-view="dashboard"] .memorial-hero-card,
  body[data-active-view="dashboard"] .dashboard-content-grid,
  body[data-active-view="dashboard"] .dashboard-premium-grid { grid-template-columns: 1fr !important; }
  body[data-active-view="dashboard"] .dashboard-stats-strip,
  body[data-active-view="dashboard"] .dashboard-quick-bar,
  body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[data-active-view="dashboard"] .memorial-crest-box { justify-self: stretch !important; width: auto !important; }
}
@media (max-width: 560px) {
  body[data-active-view="dashboard"] .dashboard-stats-strip,
  body[data-active-view="dashboard"] .dashboard-quick-bar,
  body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: 1fr !important; }
}

/* V20.5 — Mapa Mundi da Família inspirado no layout de referência */
.family-world-map {
  margin: 18px 0 20px;
  border: 1px solid rgba(190, 142, 61, 0.34);
  border-radius: 28px;
  padding: 22px;
  background:
    radial-gradient(circle at 18% 20%, rgba(72, 148, 190, 0.18), transparent 26%),
    radial-gradient(circle at 50% 28%, rgba(212, 153, 50, 0.20), transparent 25%),
    radial-gradient(circle at 75% 42%, rgba(126, 96, 176, 0.16), transparent 26%),
    linear-gradient(135deg, rgba(255, 253, 246, 0.94), rgba(246, 229, 190, 0.62));
  box-shadow: 0 22px 70px rgba(31, 23, 11, 0.14);
  overflow: hidden;
  position: relative;
}

[data-theme="escuro"] .family-world-map {
  background:
    radial-gradient(circle at 18% 20%, rgba(67, 156, 213, 0.22), transparent 26%),
    radial-gradient(circle at 50% 28%, rgba(212, 153, 50, 0.20), transparent 25%),
    radial-gradient(circle at 75% 42%, rgba(143, 112, 190, 0.18), transparent 26%),
    linear-gradient(135deg, rgba(8, 24, 35, 0.96), rgba(21, 36, 43, 0.90));
  border-color: rgba(205, 157, 71, 0.42);
}

.family-world-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 14px;
}

.family-world-head h3 {
  margin: 3px 0 4px;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.8rem, 3vw, 3.2rem);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.family-world-head p {
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}

.family-world-counts {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.family-world-counts span {
  display: grid;
  min-width: 88px;
  padding: 10px 14px;
  border-radius: 18px;
  border: 1px solid rgba(190, 142, 61, 0.30);
  background: rgba(255, 255, 255, 0.58);
  text-align: center;
  font-weight: 800;
  color: var(--text);
}

[data-theme="escuro"] .family-world-counts span { background: rgba(12, 31, 44, 0.78); }
.family-world-counts strong { color: var(--primary); font-size: 1.35rem; }

.family-world-stage {
  min-height: 470px;
  border-radius: 24px;
  position: relative;
  overflow: hidden;
  border: 1px dashed rgba(149, 114, 64, 0.25);
  background:
    linear-gradient(90deg, rgba(58, 139, 181, .10) 0 30%, rgba(231, 159, 46, .11) 31% 50%, rgba(129, 93, 175, .10) 51% 78%, rgba(226, 126, 72, .10) 79% 100%);
}

.family-world-dots {
  position: absolute;
  inset: 5% 3%;
  opacity: .58;
  background-image: radial-gradient(currentColor 1.5px, transparent 1.8px);
  background-size: 7px 7px;
  color: rgba(68, 111, 143, .64);
  mask-image: radial-gradient(ellipse at 18% 30%, #000 0 18%, transparent 19%),
    radial-gradient(ellipse at 34% 70%, #000 0 13%, transparent 14%),
    radial-gradient(ellipse at 49% 36%, #000 0 16%, transparent 17%),
    radial-gradient(ellipse at 63% 43%, #000 0 24%, transparent 25%),
    radial-gradient(ellipse at 84% 48%, #000 0 12%, transparent 13%),
    radial-gradient(ellipse at 78% 79%, #000 0 9%, transparent 10%);
  -webkit-mask-image: radial-gradient(ellipse at 18% 30%, #000 0 18%, transparent 19%),
    radial-gradient(ellipse at 34% 70%, #000 0 13%, transparent 14%),
    radial-gradient(ellipse at 49% 36%, #000 0 16%, transparent 17%),
    radial-gradient(ellipse at 63% 43%, #000 0 24%, transparent 25%),
    radial-gradient(ellipse at 84% 48%, #000 0 12%, transparent 13%),
    radial-gradient(ellipse at 78% 79%, #000 0 9%, transparent 10%);
}

.family-world-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.family-world-route {
  fill: none;
  stroke-width: .55;
  stroke-linecap: round;
  stroke-dasharray: 2 1.4;
  filter: drop-shadow(0 3px 5px rgba(101, 68, 12, .20));
}
.family-world-route.route-0 { stroke: #c98d21; }
.family-world-route.route-1 { stroke: #3f947a; }
.family-world-route.route-2 { stroke: #8b5fb8; }
.family-world-route.route-3 { stroke: #c65f48; }
.family-world-route.route-4 { stroke: #4f92bd; }

.family-world-pin {
  position: absolute;
  transform: translate(-50%, -50%);
  border: 0;
  background: transparent;
  cursor: pointer;
  z-index: 5;
}

.pin-dot {
  width: 20px;
  height: 20px;
  display: block;
  border-radius: 50%;
  border: 3px solid rgba(255,255,255,.9);
  background: var(--primary);
  box-shadow: 0 5px 15px rgba(0,0,0,.22);
}

.family-world-card {
  position: absolute;
  left: 18px;
  top: -20px;
  width: 220px;
  text-align: left;
  padding: 12px 13px;
  border-radius: 16px;
  border: 1px solid rgba(190, 142, 61, 0.42);
  background: rgba(255, 253, 247, 0.92);
  color: #14243b;
  box-shadow: 0 12px 32px rgba(50, 31, 7, .16);
  backdrop-filter: blur(8px);
}

[data-theme="escuro"] .family-world-card {
  background: rgba(14, 33, 46, .94);
  color: #f7efe1;
}

.family-world-pin:nth-of-type(odd) .family-world-card { top: 18px; }
.family-world-pin:nth-of-type(3n) .family-world-card { left: auto; right: 18px; }
.world-card-title { display: flex; align-items: center; gap: 8px; font-size: .95rem; }
.family-world-card em { display: block; margin-top: 4px; font-style: normal; font-weight: 800; color: var(--muted); }
.family-world-card small { display: block; margin-top: 8px; font-weight: 900; color: var(--primary); }

.family-world-feature-card {
  position: absolute;
  left: 24px;
  bottom: 24px;
  max-width: 420px;
  padding: 16px 18px;
  border-radius: 22px;
  border: 1px solid rgba(190, 142, 61, 0.34);
  background: rgba(255,255,255,.74);
  box-shadow: 0 16px 40px rgba(43, 29, 8, .14);
}
[data-theme="escuro"] .family-world-feature-card { background: rgba(10, 28, 40, .82); }
.family-world-feature-card span { color: var(--primary); font-weight: 1000; text-transform: uppercase; letter-spacing: .06em; font-size: .78rem; }
.family-world-feature-card strong { display:block; margin: 5px 0; font-size: 1.12rem; }
.family-world-feature-card em { font-style: normal; color: var(--muted); font-weight: 800; }

.family-world-timeline {
  display: flex;
  gap: 0;
  margin-top: 16px;
  padding: 14px 10px;
  border-radius: 20px;
  background: rgba(255,255,255,.56);
  border: 1px solid rgba(190,142,61,.22);
  overflow-x: auto;
}
[data-theme="escuro"] .family-world-timeline { background: rgba(8, 24, 35, .7); }
.family-world-timeline span {
  min-width: 150px;
  position: relative;
  padding: 18px 16px 0;
  text-align: center;
  font-weight: 800;
}
.family-world-timeline span::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #d39c32, #c45d4d, #3f947a, #4f92bd);
}
.family-world-timeline span::after {
  content: '';
  position: absolute;
  top: -2px;
  left: 50%;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  transform: translateX(-50%);
  background: var(--surface);
  border: 3px solid var(--primary);
}
.family-world-timeline strong { display:block; color: var(--primary); }
.family-world-timeline em { display:block; font-style: normal; color: var(--muted); font-size: .8rem; margin-top: 3px; }
.family-map-empty { padding: 32px; display: grid; gap: 8px; text-align: center; color: var(--muted); font-weight: 800; }

@media (max-width: 900px) {
  .family-world-head { flex-direction: column; }
  .family-world-counts { justify-content: flex-start; }
  .family-world-stage { min-height: 620px; }
  .family-world-card { width: 175px; font-size: .85rem; }
  .family-world-feature-card { left: 14px; right: 14px; max-width: none; }
}


/* ==========================================================================
   V21.1 — CORREÇÃO DEFINITIVA: um único bloco, sem conflito, alta precedência
   
   PROBLEMAS IDENTIFICADOS NAS IMAGENS:
   1. Tema CLARO: hero ocupa largura toda (sem grid lateral) → correto
      Tema ESCURO: hero em 2 colunas (com linha do tempo ao lado) → errado
      Causa: variáveis --surf-1/--surf-2/--txt/--gold não definidas no escuro
      + blocos antigos com grid de 2 colunas diferentes para claro e escuro
      
   2. Mapa mundi: cards sobrepostos uns nos outros
      Causa: CSS antigo (linha ~17370) define .family-world-card com
      position:absolute left:18px top:-20px (relativo ao pin-dot)
      O novo CSS usa flexbox (card acima, dot abaixo) mas o antigo vence
      
   3. Tema ESCURO na tela inicial: layout de 2 colunas para mapa+timeline
      enquanto claro usa 1 coluna para mapa (wide) + 2 colunas abaixo
   ========================================================================== */

/* ── 0. Reset de variáveis para o escuro no dashboard ──────────────────────── */
html[data-theme="escuro"] body[data-active-view="dashboard"] {
  --surf-1: rgba(11, 24, 34, .92);
  --surf-2: rgba(7, 18, 26, .80);
  --surf-line: rgba(196,149,58,.22);
  --txt: #f8ead0;
  --gold: #c4953a;
  --gold-bright: #e0bd72;
}

/* ── 1. APP SHELL idêntico nos 3 temas (V22.7: apenas desktop) ─────────────── */
@media (min-width: 981px) {
  html[data-theme="claro"]      body[data-active-view="dashboard"] .app-shell,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .app-shell,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .app-shell {
    grid-template-columns: 290px minmax(0,1fr) !important;
  }
}

/* ── 2. SIDEBAR idêntica nos 3 temas (layout horizontal, logo à esquerda) ──── */
html[data-theme="claro"]      body[data-active-view="dashboard"] .sidebar,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .sidebar,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .sidebar {
  display: flex !important;
  flex-direction: column !important;
  gap: 28px !important;
  padding: 24px !important;
  height: 100vh !important;
  position: sticky !important;
  top: 0 !important;
  overflow-y: auto !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .brand,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .brand,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .brand {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  text-align: left !important;
  justify-items: unset !important;
  gap: 14px !important;
  padding: 0 !important;
  border-bottom: none !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .brand-mark,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .brand-mark,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .brand-mark {
  width: 56px !important; height: 56px !important;
  border-radius: 16px !important; flex-shrink: 0 !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .brand strong,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .brand strong {
  font-size: 1rem !important; color: var(--text) !important;
  text-transform: none !important; letter-spacing: normal !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .brand strong {
  font-size: 1rem !important; color: #f8ead0 !important;
  text-transform: none !important; letter-spacing: normal !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .brand span,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .brand span {
  color: var(--muted) !important; font-size: .82rem !important;
  text-transform: none !important; letter-spacing: normal !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .brand span {
  color: rgba(248,234,208,.70) !important; font-size: .82rem !important;
  text-transform: none !important; letter-spacing: normal !important;
}

/* ── 3. TOPBAR: remove conteúdo fake, mostra título real ───────────────────── */
html[data-theme="claro"]      body[data-active-view="dashboard"] .topbar::before,
html[data-theme="claro"]      body[data-active-view="dashboard"] .topbar::after,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .topbar::before,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .topbar::after,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .topbar::before,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .topbar::after {
  content: none !important; display: none !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .topbar > div,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .topbar > div,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .topbar > div {
  display: block !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .topbar,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .topbar,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .topbar {
  min-height: 66px !important;
  margin: 0 -32px 0 !important;
  padding: 14px 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  backdrop-filter: none !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar {
  background: rgba(5,14,20,.96) !important;
  border-bottom-color: rgba(196,149,58,.20) !important;
  color: #f8ead0 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar h1,
html[data-theme="escuro"] body[data-active-view="dashboard"] .topbar p { color: #f8ead0 !important; }

/* ── 4. FUNDO E MAIN ────────────────────────────────────────────────────────── */
html[data-theme="claro"]      body[data-active-view="dashboard"],
html[data-theme="escuro"]     body[data-active-view="dashboard"],
html[data-theme="pergaminho"] body[data-active-view="dashboard"] { background: var(--bg) !important; }
html[data-theme="claro"]      body[data-active-view="dashboard"] .main,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .main,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .main {
  padding: 0 32px 32px !important;
  background: var(--bg) !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-dashboard,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-dashboard,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-dashboard {
  width: 100% !important; max-width: 1440px !important;
  margin: 0 auto !important; display: grid !important; gap: 16px !important;
}

/* ── 5. HERO: MESMAS dimensões e grid nos 3 temas ──────────────────────────── */
html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-hero-card,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-hero-card,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card {
  position: relative !important; overflow: hidden !important;
  min-height: 260px !important;
  border-radius: 0 0 26px 26px !important;
  padding: 34px 42px !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 190px !important;
  align-items: center !important; gap: 28px !important;
  margin-top: 0 !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-hero-card::before,
html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-hero-card::after,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-hero-card::before,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-hero-card::after,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card::before,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card::after {
  content: none !important; display: none !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-card {
  background:
    linear-gradient(90deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.72) 42%,rgba(255,255,255,.36) 100%),
    var(--premium-hero-image, linear-gradient(135deg,#f0f7ff,#dbeeff)) !important;
  border: 1px solid var(--line) !important; color: var(--text) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card {
  background:
    linear-gradient(90deg,rgba(6,15,22,.96) 0%,rgba(6,15,22,.72) 46%,rgba(6,15,22,.28) 100%),
    var(--premium-hero-image, linear-gradient(135deg,#07111d,#111a10)) !important;
  border: 1px solid rgba(196,149,58,.24) !important;
  box-shadow: 0 22px 60px rgba(0,0,0,.30) !important;
  color: #f8ead0 !important;
}
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card {
  background:
    linear-gradient(90deg,rgba(255,248,230,.96) 0%,rgba(255,248,230,.76) 44%,rgba(255,248,230,.42) 100%),
    var(--premium-hero-image, linear-gradient(135deg,#fdf3dc,#f0d88a)) !important;
  border: 1px solid rgba(139,94,40,.28) !important; color: #321f10 !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-family-cover-img,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-family-cover-img,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-family-cover-img {
  position: absolute !important; inset: 0 !important;
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; opacity: .42 !important; z-index: 0 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-family-cover-img {
  opacity: .28 !important; filter: sepia(.36) saturate(.82) brightness(.84) !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-hero-content,
html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-hero-content,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-content,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box {
  position: relative !important; z-index: 2 !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-hero-card h2,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-hero-card h2,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card h2 {
  font-size: clamp(2.2rem, 4.2vw, 4.4rem) !important;
  line-height: .96 !important; margin: 12px 0 8px !important;
  letter-spacing: -.05em !important;
}
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-hero-card h2 { color: #f8ead0 !important; }
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card h2 { color: #321f10 !important; }
html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box {
  width: 160px !important; min-height: 160px !important;
  padding: 14px !important; border-radius: 22px !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important;
  gap: 8px !important; justify-self: end !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-crest-box img,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-crest-box img,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box img {
  width: 100px !important; height: 100px !important; object-fit: contain !important;
}

/* ── 6. STATS STRIP: 4 colunas iguais ─────────────────────────────────────── */
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-stats-strip,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-stats-strip,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip {
  display: grid !important;
  grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 12px !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-stats-strip article,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-stats-strip article,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip article {
  min-height: 84px !important; border-radius: 16px !important;
  border: 1px solid var(--line) !important; background: var(--surface) !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important; gap: 4px !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip article {
  background: rgba(8,22,32,.84) !important; border-color: rgba(196,149,58,.22) !important; color: #f8ead0 !important;
}
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-stats-strip strong { color: #c4953a !important; }
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip strong { color: #8B5E1A !important; }

/* ── 7. AÇÕES RÁPIDAS: 6 colunas iguais ──────────────────────────────────── */
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-quick-bar,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-quick-bar,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-quick-bar {
  display: grid !important;
  grid-template-columns: repeat(6,minmax(0,1fr)) !important; gap: 12px !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .quick-action,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .quick-action,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .quick-action {
  min-height: 72px !important; border-radius: 15px !important;
  border: 1px solid var(--line) !important; background: var(--surface) !important;
  color: var(--text) !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important; gap: 6px !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .quick-action {
  background: rgba(8,22,32,.84) !important;
  border-color: rgba(196,149,58,.20) !important; color: #f8ead0 !important;
}

/* ── 8. GRID DE PAINÉIS: IDÊNTICO nos 3 temas ─────────────────────────────── */
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-content-grid,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-content-grid,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-content-grid,
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-premium-grid,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-premium-grid,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-premium-grid {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  grid-auto-flow: row !important; gap: 16px !important;
}
/* Painel do mapa: ocupa a LINHA TODA (antes da timeline e memórias) */
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-wide-panel,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-wide-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-wide-panel,
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-chapters-panel,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-chapters-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-chapters-panel {
  grid-column: 1 / -1 !important; grid-row: auto !important;
}
/* Painéis de 2 colunas: ficam lado a lado */
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-timeline-panel,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-timeline-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-timeline-panel,
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-memories-panel,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-memories-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-memories-panel,
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-birthday-panel,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-birthday-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-birthday-panel,
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-today-panel,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-today-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-today-panel {
  grid-column: auto !important; grid-row: auto !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-panel {
  min-height: 255px !important; padding: 22px !important;
  border-radius: 22px !important; border: 1px solid var(--line) !important;
  background: var(--surface) !important; color: var(--text) !important;
  box-shadow: var(--shadow) !important;
  display: flex !important; flex-direction: column !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel {
  background: rgba(8,22,32,.86) !important;
  border-color: rgba(196,149,58,.22) !important;
  color: #f8ead0 !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.34) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel h3 { color: #f8ead0 !important; }
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel .eyebrow { color: #c4953a !important; background: rgba(196,149,58,.12) !important; border-color: rgba(196,149,58,.26) !important; }
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel .button.ghost { color: #c4953a !important; border-color: rgba(196,149,58,.28) !important; background: rgba(196,149,58,.08) !important; }
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-panel .eyebrow { color: #76451e !important; background: rgba(139,94,40,.10) !important; border-color: rgba(139,94,40,.24) !important; }

/* ── 9. CAPÍTULOS: cores vivas nos 3 temas ─────────────────────────────────── */
html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-chapters-grid,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-chapters-grid,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-chapters-grid {
  display: grid !important;
  grid-template-columns: repeat(5,minmax(0,1fr)) !important; gap: 12px !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .family-chapter-card,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .family-chapter-card,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card {
  min-height: 110px !important; border-radius: 18px !important;
  padding: 16px 12px !important; display: grid !important;
  align-content: start !important; gap: 6px !important;
  border: none !important; cursor: pointer !important;
  transition: transform .18s, box-shadow .18s !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .family-chapter-card:hover,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .family-chapter-card:hover,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card:hover {
  transform: translateY(-3px) !important; box-shadow: 0 10px 24px rgba(0,0,0,.20) !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(1),
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(1),
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(1) { background:#8B2020 !important; color:#fff !important; }
html[data-theme="claro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(2),
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(2),
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(2) { background:#8B5E1A !important; color:#fff !important; }
html[data-theme="claro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(3),
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(3),
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(3) { background:#2D5A27 !important; color:#fff !important; }
html[data-theme="claro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(4),
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(4),
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(4) { background:#1A5C52 !important; color:#fff !important; }
html[data-theme="claro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(5),
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(5),
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card:nth-child(5) { background:#4a2a12 !important; color:#fff !important; }
html[data-theme="claro"]      body[data-active-view="dashboard"] .family-chapter-card strong,
html[data-theme="claro"]      body[data-active-view="dashboard"] .family-chapter-card small,
html[data-theme="claro"]      body[data-active-view="dashboard"] .family-chapter-card span,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .family-chapter-card strong,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .family-chapter-card small,
html[data-theme="escuro"]     body[data-active-view="dashboard"] .family-chapter-card span,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card strong,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card small,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card span { color:#fff !important; }

/* ── 10. FEED ITEMS e TODAY por tema ───────────────────────────────────────── */
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item {
  background: rgba(8,22,32,.80) !important; border-color: rgba(196,149,58,.18) !important; color: #f8ead0 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-feed-item:hover { background: rgba(14,34,48,.92) !important; }
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-feed-item {
  background: rgba(255,248,229,.90) !important; border-color: rgba(139,94,40,.18) !important; color: #321f10 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card {
  background: rgba(8,22,32,.80) !important; border-color: rgba(196,149,58,.22) !important; color: #f8ead0 !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .today-history-card small { color: #c4953a !important; }
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .today-history-card {
  background: rgba(255,248,229,.94) !important; border-color: rgba(139,94,40,.20) !important;
}

/* ── 11. NAV-LINKS uniformes ───────────────────────────────────────────────── */
html[data-theme="claro"]      body[data-active-view="dashboard"] .nav-link,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .nav-link {
  color: var(--text) !important; background: none !important; border: 1px solid transparent !important;
}
html[data-theme="claro"]      body[data-active-view="dashboard"] .nav-link.active,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .nav-link.active {
  background: var(--primary-soft) !important; color: var(--primary) !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .nav-link {
  color: rgba(248,234,208,.84) !important; border: 1px solid transparent !important; background: transparent !important;
}
html[data-theme="escuro"] body[data-active-view="dashboard"] .nav-link.active,
html[data-theme="escuro"] body[data-active-view="dashboard"] .nav-link:hover {
  color: #fff4dc !important; background: rgba(196,149,58,.22) !important; border-color: rgba(196,149,58,.28) !important;
}

/* ── 12. MAPA MUNDI: RESET COMPLETO dos conflitos de posicionamento ────────── */

/* Reset do CSS antigo que causa sobreposição */
.family-world-pin { transform: translate(-50%, -50%) !important; }
.family-world-card {
  position: static !important;
  left: auto !important; right: auto !important;
  top: auto !important; bottom: auto !important;
  width: auto !important; min-width: 140px !important; max-width: 190px !important;
}
/* Desfaz o posicionamento odd/3n que causava sobreposição */
.family-world-pin:nth-of-type(odd) .family-world-card { top: auto !important; }
.family-world-pin:nth-of-type(3n) .family-world-card { left: auto !important; right: auto !important; }

/* Novo layout: pin = flex coluna (card em cima, dot embaixo) */
.family-world-pin {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
  transform: translate(-50%, -100%) !important;
  z-index: 10 !important;
  transition: transform .18s ease !important;
}
.family-world-pin:hover { transform: translate(-50%, -100%) scale(1.06) !important; z-index: 20 !important; }

/* Pin dot: pequeno ponto colorido (embaixo do card) */
.family-world-pin .pin-dot {
  display: block !important; flex-shrink: 0 !important;
  width: 11px !important; height: 11px !important;
  border-radius: 50% !important;
  background: var(--primary) !important;
  border: 2.5px solid #fff !important;
  box-shadow: 0 0 0 2.5px rgba(14,90,138,.35), 0 3px 10px rgba(0,0,0,.24) !important;
  margin-top: 3px !important;
  position: relative !important; z-index: 1 !important;
}

/* Cores dos dots por pin */
.family-world-pin.pin-0 .pin-dot { background:#c0392b !important; box-shadow:0 0 0 2.5px rgba(192,57,43,.35),0 3px 10px rgba(0,0,0,.22) !important; }
.family-world-pin.pin-1 .pin-dot { background:#27ae60 !important; box-shadow:0 0 0 2.5px rgba(39,174,96,.35),0 3px 10px rgba(0,0,0,.22) !important; }
.family-world-pin.pin-2 .pin-dot { background:#e74c3c !important; box-shadow:0 0 0 2.5px rgba(231,76,60,.35),0 3px 10px rgba(0,0,0,.22) !important; }
.family-world-pin.pin-3 .pin-dot { background:#2c3e50 !important; box-shadow:0 0 0 2.5px rgba(44,62,80,.35),0 3px 10px rgba(0,0,0,.22) !important; }
.family-world-pin.pin-4 .pin-dot { background:#8e44ad !important; box-shadow:0 0 0 2.5px rgba(142,68,173,.35),0 3px 10px rgba(0,0,0,.22) !important; }
.family-world-pin.pin-5 .pin-dot { background:#c4953a !important; box-shadow:0 0 0 2.5px rgba(196,149,58,.35),0 3px 10px rgba(0,0,0,.22) !important; }

/* Card do país: aparece ACIMA do dot */
.family-world-card {
  display: grid !important; gap: 2px !important;
  padding: 9px 11px !important; border-radius: 13px !important;
  background: rgba(255,252,244,.97) !important;
  border: 1px solid rgba(139,94,40,.18) !important;
  box-shadow: 0 10px 26px rgba(55,34,18,.18) !important;
  text-align: left !important; color: #321f10 !important;
  position: relative !important;
  transition: box-shadow .18s !important;
  backdrop-filter: none !important;
}
/* Seta apontando para baixo (para o dot) */
.family-world-card::after {
  content: '' !important; position: absolute !important;
  bottom: -7px !important; left: 16px !important;
  width: 12px !important; height: 12px !important;
  background: rgba(255,252,244,.97) !important;
  border-right: 1px solid rgba(139,94,40,.18) !important;
  border-bottom: 1px solid rgba(139,94,40,.18) !important;
  transform: rotate(45deg) !important;
}
.family-world-card .world-card-title {
  display: flex !important; align-items: center !important;
  gap: 6px !important; font-size: .82rem !important;
  font-weight: 800 !important; color: #10243d !important; margin-bottom: 2px !important;
}
.family-world-card em {
  display: block !important; font-style: normal !important;
  font-size: .74rem !important; font-weight: 700 !important; color: #0e5a8a !important;
}
.family-world-card small {
  display: block !important; font-size: .70rem !important;
  font-weight: 600 !important; color: #7a6346 !important;
}

/* Cores das cidades por cor do pin */
.family-world-pin.pin-0 .family-world-card em { color:#c0392b !important; }
.family-world-pin.pin-1 .family-world-card em { color:#27ae60 !important; }
.family-world-pin.pin-2 .family-world-card em { color:#e74c3c !important; }
.family-world-pin.pin-3 .family-world-card em { color:#2c3e50 !important; }
.family-world-pin.pin-4 .family-world-card em { color:#8e44ad !important; }
.family-world-pin.pin-5 .family-world-card em { color:#c4953a !important; }

/* Stage do mapa */
.family-world-stage {
  position: relative !important; min-height: 400px !important;
  border-radius: 18px !important; overflow: visible !important;
  background:
    radial-gradient(ellipse at 20% 32%, rgba(180,220,240,.50),transparent 42%),
    radial-gradient(ellipse at 75% 60%, rgba(200,230,215,.42),transparent 36%),
    linear-gradient(160deg,#daeef5 0%,#c8e4ee 45%,#d5e8e0 100%) !important;
  border: 1px solid rgba(119,78,38,.14) !important;
  box-shadow: 0 14px 36px rgba(55,34,18,.10) !important;
}
/* Dots pattern */
.family-world-stage::before {
  content: '' !important; position: absolute !important; inset: 0 !important;
  background-image: radial-gradient(circle,rgba(100,140,160,.26) 1px,transparent 1px) !important;
  background-size: 13px 13px !important; opacity: .65 !important;
  z-index: 0 !important; pointer-events: none !important;
  border-radius: 18px !important;
}
/* SVG das rotas */
.family-world-svg {
  position: absolute !important; inset: 0 !important;
  width: 100% !important; height: 100% !important;
  z-index: 2 !important; pointer-events: none !important; overflow: visible !important;
}
/* Feature card: canto inferior esquerdo DENTRO do stage */
.family-world-feature-card {
  position: absolute !important; left: 16px !important; bottom: 16px !important;
  z-index: 12 !important; min-width: 185px !important; max-width: 265px !important;
  padding: 11px 13px !important; border-radius: 15px !important;
  background: rgba(255,252,244,.97) !important;
  border: 1px solid rgba(139,94,40,.20) !important;
  box-shadow: 0 10px 28px rgba(55,34,18,.16) !important;
  display: grid !important; gap: 3px !important; color: #321f10 !important;
}
.family-world-feature-card span {
  font-size: .68rem !important; font-weight: 900 !important;
  letter-spacing: .1em !important; text-transform: uppercase !important; color: #0e5a8a !important;
}
.family-world-feature-card strong {
  font-size: .94rem !important; font-weight: 800 !important; color: #10243d !important; display: block !important;
}
.family-world-feature-card em { font-style: normal !important; font-size: .78rem !important; color: #5f7288 !important; display: block !important; }

/* Head e contadores */
.family-world-head {
  display: flex !important; justify-content: space-between !important;
  align-items: flex-start !important; gap: 16px !important; margin-bottom: 14px !important;
}
.family-world-head h3 { font-size: 1.9rem !important; font-weight: 900 !important; letter-spacing: -.04em !important; margin: 4px 0 6px !important; }
.family-world-head p { font-size: .85rem !important; color: var(--muted) !important; max-width: 460px !important; line-height: 1.5 !important; }
.family-world-counts { display: flex !important; flex-direction: column !important; align-items: flex-end !important; gap: 5px !important; flex-shrink: 0 !important; }
.family-world-counts span {
  display: flex !important; align-items: baseline !important; gap: 5px !important;
  font-size: .78rem !important; color: var(--muted) !important; font-weight: 700 !important;
  padding: 4px 12px !important; border-radius: 999px !important;
  border: 1px solid var(--line) !important; background: var(--surface) !important;
  white-space: nowrap !important;
}
.family-world-counts strong { font-size: 1.3rem !important; font-weight: 900 !important; color: var(--text) !important; line-height: 1 !important; }

/* Linha do tempo */
.family-world-timeline {
  margin-top: 14px !important; padding: 14px 16px !important;
  border-radius: 15px !important; border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  display: flex !important; align-items: flex-start !important;
  gap: 0 !important; overflow-x: auto !important; position: relative !important;
}
.family-world-timeline::before {
  content: '' !important; position: absolute !important;
  left: 20px !important; right: 20px !important; top: 22px !important;
  height: 3px !important;
  background: linear-gradient(to right,#c0392b,#c4953a,#27ae60,#1a5c52,#6b2d8b) !important;
  border-radius: 2px !important; opacity: .5 !important; pointer-events: none !important;
}
.family-world-timeline span {
  display: flex !important; flex-direction: column !important;
  align-items: center !important; gap: 4px !important;
  flex: 1 !important; min-width: 85px !important;
  text-align: center !important; position: relative !important;
  z-index: 1 !important; cursor: pointer !important; padding: 4px 3px !important;
}
.family-world-timeline span::before {
  content: '' !important; width: 10px !important; height: 10px !important;
  border-radius: 50% !important; background: var(--surface) !important;
  border: 2px solid #c4953a !important; display: block !important;
  margin-bottom: 5px !important; flex-shrink: 0 !important;
  box-shadow: 0 0 0 2px rgba(196,149,58,.18) !important;
}
.family-world-timeline strong { font-size: .82rem !important; font-weight: 800 !important; color: var(--text) !important; display: block !important; }
.family-world-timeline em { font-style: normal !important; font-size: .70rem !important; color: var(--muted) !important; display: block !important; line-height: 1.3 !important; }

/* Temas escuro e pergaminho para o mapa */
html[data-theme="escuro"] .family-world-stage {
  background: linear-gradient(160deg,#0c1f2c 0%,#091720 55%,#0d1e19 100%) !important;
  border-color: rgba(196,149,58,.20) !important;
}
html[data-theme="escuro"] .family-world-stage::before { background-image: radial-gradient(circle,rgba(196,149,58,.20) 1px,transparent 1px) !important; }
html[data-theme="escuro"] .family-world-card, html[data-theme="escuro"] .family-world-feature-card {
  background: rgba(7,18,26,.97) !important; border-color: rgba(196,149,58,.26) !important; color: #f8ead0 !important;
}
html[data-theme="escuro"] .family-world-card::after, html[data-theme="escuro"] .family-world-feature-card::after { background: rgba(7,18,26,.97) !important; }
html[data-theme="escuro"] .family-world-card .world-card-title { color: #f8ead0 !important; }
html[data-theme="escuro"] .family-world-card small { color: rgba(248,234,208,.72) !important; }
html[data-theme="escuro"] .family-world-feature-card strong { color: #f8ead0 !important; }
html[data-theme="escuro"] .family-world-feature-card em { color: rgba(248,234,208,.72) !important; }
html[data-theme="escuro"] .family-world-timeline { background: rgba(7,18,26,.80) !important; border-color: rgba(196,149,58,.20) !important; }
html[data-theme="escuro"] .family-world-timeline strong { color: #f8ead0 !important; }
html[data-theme="escuro"] .family-world-timeline em { color: rgba(248,234,208,.72) !important; }
html[data-theme="escuro"] .family-world-timeline span::before { background: rgba(7,18,26,.95) !important; }
html[data-theme="escuro"] .family-world-counts span { background: rgba(7,18,26,.80) !important; border-color: rgba(196,149,58,.22) !important; }
html[data-theme="escuro"] .family-world-counts strong { color: #f8ead0 !important; }
html[data-theme="escuro"] .family-world-head h3 { color: #f8ead0 !important; }
html[data-theme="pergaminho"] .family-world-stage {
  background: radial-gradient(ellipse at 20% 32%,rgba(220,200,155,.42),transparent 40%), linear-gradient(160deg,#ddd0b0 0%,#cfc0a0 55%,#d8c8a8 100%) !important;
  border-color: rgba(139,94,40,.22) !important;
}
html[data-theme="pergaminho"] .family-world-stage::before { background-image: radial-gradient(circle,rgba(100,70,30,.22) 1px,transparent 1px) !important; }
html[data-theme="pergaminho"] .family-world-card, html[data-theme="pergaminho"] .family-world-feature-card { background: rgba(255,248,229,.97) !important; border-color: rgba(139,94,40,.22) !important; }
html[data-theme="pergaminho"] .family-world-card::after, html[data-theme="pergaminho"] .family-world-feature-card::after { background: rgba(255,248,229,.97) !important; }
html[data-theme="pergaminho"] .family-world-timeline { background: rgba(255,248,229,.90) !important; border-color: rgba(139,94,40,.18) !important; }

/* ── 13. RESPONSIVE ─────────────────────────────────────────────────────────── */
@media (max-width: 1200px) {
  html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-quick-bar { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
  html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-chapters-grid,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-chapters-grid,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width: 820px) {
  html[data-theme="claro"]      body[data-active-view="dashboard"] .main,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .main,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .main { padding: 0 16px 20px !important; }
  html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-hero-card,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-hero-card,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card,
  html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-content-grid,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-content-grid,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-content-grid,
  html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-premium-grid,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-premium-grid,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-premium-grid { grid-template-columns: 1fr !important; }
  html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-stats-strip,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-stats-strip,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip,
  html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="claro"]      body[data-active-view="dashboard"] .dashboard-chapters-grid,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .dashboard-chapters-grid,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  html[data-theme="claro"]      body[data-active-view="dashboard"] .memorial-crest-box,
  html[data-theme="escuro"]     body[data-active-view="dashboard"] .memorial-crest-box,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box { justify-self: stretch !important; width: auto !important; }
  .family-world-stage { min-height: 300px !important; }
  .family-world-card { min-width: 100px !important; max-width: 148px !important; padding: 7px 8px !important; }
  .family-world-card .world-card-title { font-size: .74rem !important; }
  .family-world-card small { display: none !important; }
  .family-world-feature-card { display: none !important; }
}

/* ==========================================================================
   V20.6.1 — Correção definitiva: Home igual nos 3 temas + mapa mundi real
   ========================================================================== */
html body[data-active-view="dashboard"] .dashboard-premium-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: stretch !important;
}
html body[data-active-view="dashboard"] .dashboard-origins-panel,
html body[data-active-view="dashboard"] .dashboard-chapters-panel {
  grid-column: 1 / -1 !important;
}
html body[data-active-view="dashboard"] .dashboard-panel {
  min-height: 0 !important;
  border-radius: 24px !important;
  padding: 22px !important;
  overflow: hidden !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-panel {
  box-shadow: 0 18px 42px rgba(32,22,8,.08) !important;
}
html body[data-active-view="dashboard"] .panel-heading-row.compact-heading {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
}
html body[data-active-view="dashboard"] .panel-heading-row.compact-heading h3 {
  margin: 6px 0 0 !important;
  line-height: 1.1 !important;
}
html body[data-active-view="dashboard"] .dashboard-list,
html body[data-active-view="dashboard"] .today-history-card {
  min-height: 190px !important;
}

.memorial-world-map {
  --map-ink: #13233a;
  --map-muted: #5f6f83;
  --map-paper: rgba(255, 250, 238, .94);
  --map-line: rgba(178, 137, 67, .28);
  position: relative !important;
  display: grid !important;
  gap: 14px !important;
  width: 100% !important;
  color: var(--map-ink) !important;
}
.memorial-world-header {
  display: flex !important;
  justify-content: space-between !important;
  gap: 18px !important;
  align-items: flex-start !important;
}
.memorial-world-header h3 {
  margin: 6px 0 4px !important;
  font-size: clamp(1.55rem, 2.2vw, 2.45rem) !important;
  letter-spacing: .02em !important;
  color: var(--map-ink) !important;
}
.memorial-world-header p {
  margin: 0 !important;
  color: var(--map-muted) !important;
  font-weight: 750 !important;
}
.memorial-world-kpis {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
}
.memorial-world-kpis span {
  display: grid !important;
  min-width: 86px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--map-line) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.62) !important;
  text-align: center !important;
  color: var(--map-muted) !important;
  font-size: .74rem !important;
  font-weight: 850 !important;
}
.memorial-world-kpis strong {
  display: block !important;
  font-size: 1.25rem !important;
  color: #b5832f !important;
  line-height: 1 !important;
}
.memorial-world-stage {
  position: relative !important;
  min-height: 455px !important;
  border: 1px solid var(--map-line) !important;
  border-radius: 26px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 18% 20%, rgba(255,255,255,.84), transparent 25%),
    radial-gradient(circle at 78% 70%, rgba(226,196,127,.32), transparent 28%),
    linear-gradient(135deg, #fdf8ea 0%, #f3ead4 54%, #fffaf0 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.48), 0 18px 44px rgba(49,32,12,.08) !important;
}
.memorial-world-stage::after {
  content: '' !important;
  position: absolute !important;
  inset: 16px !important;
  border: 1px dashed rgba(167, 108, 36, .18) !important;
  border-radius: 22px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}
.memorial-world-shapes,
.memorial-world-routes {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
}
.memorial-world-shapes { z-index: 1 !important; }
.memorial-world-routes { z-index: 3 !important; }
.memorial-world-shapes .world-grid path {
  stroke: rgba(110, 91, 54, .09) !important;
  stroke-width: 1 !important;
  fill: none !important;
}
.memorial-world-shapes .world-land path {
  fill: rgba(123, 159, 124, .40) !important;
  stroke: rgba(80, 104, 78, .28) !important;
  stroke-width: 2 !important;
  filter: drop-shadow(0 4px 8px rgba(80,54,16,.08)) !important;
}
.memorial-world-shapes .world-labels text {
  fill: rgba(42, 34, 22, .45) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
}
.memorial-route-line {
  fill: none !important;
  stroke: #b9842b !important;
  stroke-width: 3.2 !important;
  stroke-linecap: round !important;
  stroke-dasharray: 9 7 !important;
  filter: drop-shadow(0 2px 2px rgba(255,255,255,.75)) !important;
}
.memorial-route-line.route-1 { stroke: #277d5e !important; }
.memorial-route-line.route-2 { stroke: #8c5fb1 !important; }
.memorial-route-line.route-3 { stroke: #c05a42 !important; }
.memorial-route-line.route-4 { stroke: #427fa8 !important; }
.memorial-map-pin {
  position: absolute !important;
  z-index: 6 !important;
  transform: translate(-50%, -50%) !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
  cursor: pointer !important;
}
.memorial-map-pin .pin-dot {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 999px !important;
  background: #c4953a !important;
  border: 3px solid rgba(255,255,255,.92) !important;
  box-shadow: 0 0 0 4px rgba(196,149,58,.25), 0 8px 18px rgba(40,24,8,.22) !important;
}
.memorial-map-pin .pin-card {
  position: absolute !important;
  left: 24px !important;
  top: -44px !important;
  display: grid !important;
  gap: 4px !important;
  width: 190px !important;
  min-height: 84px !important;
  padding: 13px 14px !important;
  border: 1px solid rgba(176, 126, 45, .30) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.88) !important;
  color: var(--map-ink) !important;
  box-shadow: 0 14px 34px rgba(42,28,10,.14) !important;
  text-align: left !important;
}
.memorial-map-pin:nth-of-type(2n) .pin-card { left: auto !important; right: 24px !important; }
.memorial-map-pin:nth-of-type(3n) .pin-card { top: 22px !important; }
.memorial-map-pin .pin-title {
  display: flex !important;
  gap: 7px !important;
  align-items: center !important;
  font-weight: 950 !important;
  font-size: .98rem !important;
  color: var(--map-ink) !important;
}
.memorial-map-pin small,
.memorial-map-pin em {
  display: block !important;
  font-style: normal !important;
  line-height: 1.25 !important;
  color: var(--map-muted) !important;
  font-weight: 800 !important;
}
.memorial-map-pin small { font-size: .76rem !important; color: #9a6b1f !important; }
.memorial-route-feature {
  position: absolute !important;
  left: 24px !important;
  bottom: 22px !important;
  z-index: 5 !important;
  max-width: 390px !important;
  padding: 15px 18px !important;
  border: 1px solid rgba(176, 126, 45, .26) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.78) !important;
  box-shadow: 0 12px 30px rgba(42,28,10,.10) !important;
}
.memorial-route-feature span,
.memorial-route-feature strong,
.memorial-route-feature em { display: block !important; }
.memorial-route-feature span { color: #9a6b1f !important; text-transform: uppercase !important; letter-spacing: .08em !important; font-size: .72rem !important; font-weight: 950 !important; }
.memorial-route-feature strong { color: var(--map-ink) !important; font-size: 1rem !important; margin: 3px 0 !important; }
.memorial-route-feature em { color: var(--map-muted) !important; font-style: normal !important; font-weight: 800 !important; }
.memorial-world-timeline {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 16px 18px !important;
  border: 1px solid var(--map-line) !important;
  border-radius: 20px !important;
  background: rgba(255,255,255,.58) !important;
  overflow-x: auto !important;
}
.memorial-world-timeline span {
  position: relative !important;
  display: grid !important;
  gap: 4px !important;
  min-width: 120px !important;
  text-align: center !important;
  color: var(--map-muted) !important;
  font-weight: 800 !important;
}
.memorial-world-timeline span::before {
  content: '' !important;
  width: 12px !important;
  height: 12px !important;
  margin: 0 auto 3px !important;
  border-radius: 999px !important;
  background: #fff !important;
  border: 3px solid #c4953a !important;
  box-shadow: 0 0 0 3px rgba(196,149,58,.18) !important;
}
.memorial-world-timeline strong { color: #9a6b1f !important; font-size: .86rem !important; }
.memorial-world-timeline em { color: var(--map-muted) !important; font-style: normal !important; font-size: .76rem !important; }

/* Dashboard compacto: mantém mapa reconhecível sem virar bloquinho de rota */
body[data-active-view="dashboard"] .memorial-world-map.compact .memorial-world-header { display: none !important; }
body[data-active-view="dashboard"] .memorial-world-map.compact .memorial-world-stage { min-height: 395px !important; }
body[data-active-view="dashboard"] .memorial-world-map.compact .memorial-route-feature { display: none !important; }
body[data-active-view="dashboard"] .memorial-world-map.compact .memorial-world-timeline { margin-top: 0 !important; }
body[data-active-view="dashboard"] .dashboard-country-list-under-map { margin-top: 12px !important; }

/* Capítulos: remove bolinha/numero em cima do texto e cria hierarquia limpa */
html body[data-active-view="dashboard"] .dashboard-chapters-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
html body[data-active-view="dashboard"] .family-chapter-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  column-gap: 10px !important;
  row-gap: 4px !important;
  align-items: start !important;
  min-height: 116px !important;
  padding: 18px !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  text-align: left !important;
}
html body[data-active-view="dashboard"] .family-chapter-card span {
  position: static !important;
  grid-row: 1 / 3 !important;
  display: grid !important;
  place-items: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.82) !important;
  color: #8a5a20 !important;
  font-weight: 950 !important;
  box-shadow: inset 0 0 0 1px rgba(120,72,20,.18) !important;
}
html body[data-active-view="dashboard"] .family-chapter-card strong {
  position: static !important;
  display: block !important;
  min-width: 0 !important;
  color: #fffaf0 !important;
  font-size: 1rem !important;
  line-height: 1.12 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  margin: 0 !important;
}
html body[data-active-view="dashboard"] .family-chapter-card small {
  position: static !important;
  display: block !important;
  color: rgba(255,250,240,.86) !important;
  font-size: .82rem !important;
  line-height: 1.3 !important;
  margin: 0 !important;
}

/* Apenas paleta muda; layout fica igual ao pergaminho */
html[data-theme="escuro"] .memorial-world-map { --map-ink: #f8ead0; --map-muted: rgba(248,234,208,.72); --map-paper: rgba(7,18,26,.88); --map-line: rgba(196,149,58,.26); }
html[data-theme="escuro"] .memorial-world-stage {
  background:
    radial-gradient(circle at 18% 20%, rgba(196,149,58,.13), transparent 25%),
    radial-gradient(circle at 78% 70%, rgba(54,119,112,.12), transparent 30%),
    linear-gradient(135deg, #081720 0%, #0b1f2b 54%, #07131b 100%) !important;
}
html[data-theme="escuro"] .memorial-world-shapes .world-land path { fill: rgba(92,139,117,.34) !important; stroke: rgba(196,149,58,.22) !important; }
html[data-theme="escuro"] .memorial-world-shapes .world-grid path { stroke: rgba(196,149,58,.07) !important; }
html[data-theme="escuro"] .memorial-world-shapes .world-labels text { fill: rgba(248,234,208,.32) !important; }
html[data-theme="escuro"] .memorial-map-pin .pin-card,
html[data-theme="escuro"] .memorial-route-feature,
html[data-theme="escuro"] .memorial-world-kpis span,
html[data-theme="escuro"] .memorial-world-timeline {
  background: rgba(7,18,26,.88) !important;
  border-color: rgba(196,149,58,.28) !important;
}
html[data-theme="escuro"] .memorial-world-timeline span::before { background: #081720 !important; }
html[data-theme="escuro"] .memorial-map-pin small,
html[data-theme="escuro"] .memorial-world-timeline strong,
html[data-theme="escuro"] .memorial-route-feature span { color: #d9ab52 !important; }

html[data-theme="pergaminho"] .memorial-world-map { --map-ink: #2C1F0E; --map-muted: #765b35; --map-paper: rgba(255,248,229,.96); --map-line: rgba(139,94,40,.24); }
html[data-theme="pergaminho"] .memorial-world-stage {
  background:
    radial-gradient(circle at 20% 25%, rgba(255,255,255,.55), transparent 26%),
    radial-gradient(circle at 80% 72%, rgba(196,149,58,.22), transparent 30%),
    linear-gradient(135deg, #f7edd3 0%, #e7d4aa 55%, #fff4d7 100%) !important;
}

@media (max-width: 1100px) {
  html body[data-active-view="dashboard"] .dashboard-premium-grid { grid-template-columns: 1fr !important; }
  html body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .memorial-world-header { flex-direction: column !important; }
  .memorial-world-kpis { justify-content: flex-start !important; }
  .memorial-world-stage { min-height: 520px !important; }
}
@media (max-width: 720px) {
  .memorial-map-pin .pin-card { display: none !important; }
  .memorial-world-stage { min-height: 320px !important; }
  .memorial-route-feature { left: 14px !important; right: 14px !important; max-width: none !important; }
  html body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: 1fr !important; }
}


/* ======================================================================
   V21.3 — AUDITORIA DEFINITIVA HOME + MAPA
   Causa corrigida: existiam blocos antigos por tema mudando grid, altura,
   espaçamento e posição. Daqui para baixo, a HOME usa UMA estrutura única.
   Os temas só mudam paleta/textura; não mudam layout.
   ====================================================================== */

/* Paleta sem mexer em estrutura */
html[data-theme="claro"] body[data-active-view="dashboard"] {
  --home-bg: #f7fbff;
  --home-panel: rgba(255,255,255,.92);
  --home-panel-soft: rgba(247,252,255,.86);
  --home-text: #10233f;
  --home-muted: #5b6e87;
  --home-line: rgba(74,128,172,.22);
  --home-accent: #0e5a8a;
  --home-gold: #c79a42;
  --home-shadow: 0 22px 52px rgba(32,62,94,.10);
}
html[data-theme="escuro"] body[data-active-view="dashboard"] {
  --home-bg: #07131b;
  --home-panel: rgba(9,27,39,.88);
  --home-panel-soft: rgba(14,39,54,.82);
  --home-text: #f8ead0;
  --home-muted: rgba(248,234,208,.72);
  --home-line: rgba(196,149,58,.28);
  --home-accent: #8fd6ff;
  --home-gold: #d7a33a;
  --home-shadow: 0 24px 56px rgba(0,0,0,.30);
}
html[data-theme="pergaminho"] body[data-active-view="dashboard"] {
  --home-bg: #efe0bf;
  --home-panel: rgba(255,248,229,.92);
  --home-panel-soft: rgba(255,244,211,.86);
  --home-text: #2C1F0E;
  --home-muted: #725636;
  --home-line: rgba(139,94,40,.26);
  --home-accent: #6c3f17;
  --home-gold: #b98027;
  --home-shadow: 0 22px 54px rgba(90,60,20,.15);
}

html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-dashboard,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-dashboard,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-dashboard {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 16px !important;
  width: min(100%, 1560px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  color: var(--home-text) !important;
}

/* HERO — sempre mesma grade do pergaminho */
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-card,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 22px !important;
  min-height: 184px !important;
  padding: 28px !important;
  border: 1px solid var(--home-line) !important;
  border-radius: 26px !important;
  background: var(--home-panel) !important;
  box-shadow: var(--home-shadow) !important;
  overflow: hidden !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-content,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-content,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-content {
  position: relative !important;
  z-index: 2 !important;
  max-width: 780px !important;
  display: grid !important;
  gap: 8px !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-card h2,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card h2,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card h2 {
  margin: 0 !important;
  color: var(--home-text) !important;
  font-size: clamp(2rem, 4.2vw, 4.25rem) !important;
  line-height: .94 !important;
  letter-spacing: -.045em !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-card p,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card p,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card p {
  margin: 0 !important;
  color: var(--home-muted) !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box {
  position: relative !important;
  z-index: 2 !important;
  width: 148px !important;
  min-height: 148px !important;
  display: grid !important;
  place-items: center !important;
  gap: 8px !important;
  padding: 16px !important;
  border-radius: 24px !important;
  border: 1px solid var(--home-line) !important;
  background: var(--home-panel-soft) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12) !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-crest-box img,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box img,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box img {
  width: 82px !important;
  height: 82px !important;
  object-fit: contain !important;
  border-radius: 18px !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-crest-box span,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box span,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box span {
  color: var(--home-muted) !important;
  font-weight: 900 !important;
  font-size: .78rem !important;
  text-align: center !important;
}

/* Estatísticas e atalhos — mesma quantidade de colunas nos três temas */
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-stats-strip,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-stats-strip article,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip article,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip article,
html[data-theme="claro"] body[data-active-view="dashboard"] .quick-action,
html[data-theme="escuro"] body[data-active-view="dashboard"] .quick-action,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .quick-action {
  min-height: 74px !important;
  border: 1px solid var(--home-line) !important;
  border-radius: 18px !important;
  background: var(--home-panel-soft) !important;
  color: var(--home-text) !important;
  box-shadow: none !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-stats-strip strong,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip strong,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip strong {
  color: var(--home-gold) !important;
  font-size: 2.2rem !important;
  line-height: 1 !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-quick-bar {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .quick-action,
html[data-theme="escuro"] body[data-active-view="dashboard"] .quick-action,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .quick-action {
  display: grid !important;
  place-items: center !important;
  gap: 6px !important;
  padding: 14px 12px !important;
  font-weight: 900 !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .quick-action .ui-icon,
html[data-theme="escuro"] body[data-active-view="dashboard"] .quick-action .ui-icon,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .quick-action .ui-icon { color: var(--home-gold) !important; }

/* GRID PRINCIPAL — origens e capítulos ocupam a linha inteira; pares mantêm duas colunas */
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-premium-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: start !important;
  grid-auto-flow: row !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-panel {
  min-height: 0 !important;
  height: auto !important;
  padding: 24px !important;
  border: 1px solid var(--home-line) !important;
  border-radius: 24px !important;
  background: var(--home-panel) !important;
  color: var(--home-text) !important;
  box-shadow: var(--home-shadow) !important;
  overflow: hidden !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-origins-panel,
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-chapters-panel,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-panel,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-chapters-panel {
  grid-column: 1 / -1 !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .panel-heading-row,
html[data-theme="escuro"] body[data-active-view="dashboard"] .panel-heading-row,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .panel-heading-row {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-panel h3,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-panel h3,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-panel h3 {
  margin: 4px 0 0 !important;
  color: var(--home-text) !important;
  font-size: 1.35rem !important;
  line-height: 1.15 !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .eyebrow,
html[data-theme="escuro"] body[data-active-view="dashboard"] .eyebrow,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 6px 12px !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--home-gold) 18%, transparent) !important;
  color: var(--home-gold) !important;
  font-size: .76rem !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .button.ghost,
html[data-theme="escuro"] body[data-active-view="dashboard"] .button.ghost,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .button.ghost {
  border: 1px solid var(--home-line) !important;
  background: var(--home-panel-soft) !important;
  color: var(--home-text) !important;
  border-radius: 14px !important;
  min-height: 44px !important;
  padding: 0 16px !important;
}

/* Mapa Mundi — visual cartográfico real no dashboard e na tela Mapa das Origens */
.memorial-world-map {
  --map-ink: var(--home-text, #2C1F0E);
  --map-muted: var(--home-muted, #765b35);
  --map-paper: var(--home-panel, rgba(255,248,229,.94));
  --map-line: var(--home-line, rgba(139,94,40,.24));
  display: grid !important;
  gap: 14px !important;
  width: 100% !important;
}
.memorial-world-stage {
  position: relative !important;
  isolation: isolate !important;
  min-height: 520px !important;
  border: 1px solid var(--map-line) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 20% 22%, rgba(255,255,255,.58), transparent 26%),
    radial-gradient(circle at 82% 72%, rgba(196,149,58,.18), transparent 32%),
    linear-gradient(135deg, #f9f0d6 0%, #e8d3a9 55%, #fff7df 100%) !important;
  overflow: hidden !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35), 0 18px 44px rgba(70,42,12,.10) !important;
}
.memorial-world-shapes,
.memorial-world-routes {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
}
.memorial-world-shapes { z-index: 1 !important; }
.memorial-world-routes { z-index: 4 !important; }
.memorial-world-shapes .world-grid path {
  fill: none !important;
  stroke: rgba(111,83,45,.11) !important;
  stroke-width: 1 !important;
}
.memorial-world-shapes .world-land-fill path {
  fill: rgba(119,151,126,.34) !important;
  stroke: rgba(100,72,33,.26) !important;
  stroke-width: 1.15 !important;
}
.memorial-world-shapes .world-land-dots path {
  fill: url(#memorialMapDots) !important;
  opacity: .55 !important;
}
.memorial-world-shapes #memorialMapDots circle { fill: rgba(84,103,92,.58) !important; }
.memorial-world-shapes .world-labels text {
  fill: rgba(42,34,22,.36) !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
}
.memorial-route-line {
  fill: none !important;
  stroke: #b9842b !important;
  stroke-width: 3.6 !important;
  stroke-linecap: round !important;
  stroke-dasharray: 10 7 !important;
  filter: drop-shadow(0 2px 2px rgba(255,255,255,.78)) !important;
}
.memorial-route-line.route-1 { stroke: #267d5f !important; }
.memorial-route-line.route-2 { stroke: #7f62b0 !important; }
.memorial-route-line.route-3 { stroke: #c45b42 !important; }
.memorial-route-line.route-4 { stroke: #3f83ad !important; }
.memorial-map-pin {
  position: absolute !important;
  z-index: 7 !important;
  transform: translate(-50%, -50%) !important;
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
  overflow: visible !important;
}
.memorial-map-pin .pin-dot {
  position: absolute !important;
  inset: 0 !important;
  border-radius: 999px !important;
  background: var(--home-gold, #c4953a) !important;
  border: 3px solid rgba(255,255,255,.92) !important;
  box-shadow: 0 0 0 4px rgba(196,149,58,.24), 0 7px 18px rgba(45,25,8,.24) !important;
}
.memorial-map-pin .pin-card {
  position: absolute !important;
  left: 26px !important;
  top: -48px !important;
  z-index: 8 !important;
  width: 198px !important;
  min-height: 88px !important;
  display: grid !important;
  gap: 4px !important;
  padding: 14px 15px !important;
  border: 1px solid rgba(176,126,45,.30) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.90) !important;
  color: var(--map-ink) !important;
  text-align: left !important;
  box-shadow: 0 14px 34px rgba(42,28,10,.15) !important;
  backdrop-filter: blur(8px) !important;
}
.memorial-map-pin:nth-of-type(2n) .pin-card { left: auto !important; right: 26px !important; }
.memorial-map-pin:nth-of-type(3n) .pin-card { top: 24px !important; }
.memorial-map-pin .pin-title { display:flex !important; align-items:center !important; gap:7px !important; font-size: .98rem !important; color: var(--map-ink) !important; }
.memorial-map-pin small,
.memorial-map-pin em { display:block !important; font-style:normal !important; color: var(--map-muted) !important; line-height:1.25 !important; font-weight: 800 !important; }
.memorial-map-pin small { color: var(--home-gold, #9a6b1f) !important; font-size:.76rem !important; }
.memorial-route-feature {
  position: absolute !important;
  left: 24px !important;
  bottom: 22px !important;
  z-index: 6 !important;
  max-width: 420px !important;
  padding: 15px 18px !important;
  border: 1px solid rgba(176,126,45,.26) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.80) !important;
  box-shadow: 0 12px 30px rgba(42,28,10,.11) !important;
}
.memorial-route-feature span,
.memorial-route-feature strong,
.memorial-route-feature em { display:block !important; }
.memorial-route-feature span { color: var(--home-gold, #9a6b1f) !important; text-transform:uppercase !important; letter-spacing:.08em !important; font-size:.72rem !important; font-weight:950 !important; }
.memorial-route-feature strong { color: var(--map-ink) !important; font-size: 1rem !important; margin: 3px 0 !important; }
.memorial-route-feature em { color: var(--map-muted) !important; font-style:normal !important; font-weight:800 !important; }
body[data-active-view="dashboard"] .memorial-world-map.compact .memorial-world-stage {
  min-height: 430px !important;
}
body[data-active-view="dashboard"] .memorial-world-map.compact .memorial-route-feature {
  display: none !important;
}
/* V22 — pin-card sempre visível (não apenas no hover) */
body[data-active-view="dashboard"] .memorial-world-map.compact .memorial-map-pin .pin-card {
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
  pointer-events: auto !important;
  transition: .18s ease !important;
}
.memorial-world-timeline {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 16px 18px !important;
  border: 1px solid var(--map-line) !important;
  border-radius: 20px !important;
  background: color-mix(in srgb, var(--map-paper) 82%, transparent) !important;
  overflow-x: auto !important;
}
.memorial-world-timeline span { min-width: 120px !important; text-align:center !important; display:grid !important; gap:4px !important; color:var(--map-muted) !important; font-weight:800 !important; }
.memorial-world-timeline span::before { content:'' !important; width:12px !important; height:12px !important; margin:0 auto 3px !important; border-radius:999px !important; background:var(--map-paper) !important; border:3px solid var(--home-gold,#c4953a) !important; box-shadow:0 0 0 3px rgba(196,149,58,.18) !important; }
.memorial-world-timeline strong { color: var(--home-gold, #9a6b1f) !important; font-size:.86rem !important; }
.memorial-world-timeline em { color: var(--map-muted) !important; font-style:normal !important; font-size:.76rem !important; }
html[data-theme="escuro"] .memorial-world-stage {
  background:
    radial-gradient(circle at 18% 20%, rgba(196,149,58,.13), transparent 25%),
    radial-gradient(circle at 78% 70%, rgba(54,119,112,.12), transparent 30%),
    linear-gradient(135deg, #081720 0%, #0b1f2b 54%, #07131b 100%) !important;
}
html[data-theme="escuro"] .memorial-world-shapes .world-land-fill path { fill: rgba(92,139,117,.34) !important; stroke: rgba(196,149,58,.24) !important; }
html[data-theme="escuro"] .memorial-world-shapes .world-land-dots path { opacity: .42 !important; }
html[data-theme="escuro"] .memorial-world-shapes #memorialMapDots circle { fill: rgba(196,149,58,.50) !important; }
html[data-theme="escuro"] .memorial-world-shapes .world-labels text { fill: rgba(248,234,208,.30) !important; }
html[data-theme="escuro"] .memorial-map-pin .pin-card,
html[data-theme="escuro"] .memorial-route-feature,
html[data-theme="escuro"] .memorial-world-timeline { background: rgba(7,18,26,.88) !important; border-color: rgba(196,149,58,.28) !important; }

/* Capítulos — badge separado, nunca sobreposto ao texto */
html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-chapters-grid,
html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-grid,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-chapters-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .family-chapter-card,
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  column-gap: 12px !important;
  row-gap: 5px !important;
  align-items: start !important;
  min-height: 118px !important;
  padding: 18px !important;
  border: 0 !important;
  border-radius: 18px !important;
  text-align: left !important;
  overflow: hidden !important;
  color: #fffaf0 !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .family-chapter-card span,
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card span,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card span {
  position: static !important;
  grid-row: 1 / 3 !important;
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.86) !important;
  color: #87571c !important;
  font-size: .95rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  box-shadow: inset 0 0 0 1px rgba(120,72,20,.16) !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .family-chapter-card strong,
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card strong,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card strong {
  position: static !important;
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: #fffaf0 !important;
  font-size: 1rem !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
html[data-theme="claro"] body[data-active-view="dashboard"] .family-chapter-card small,
html[data-theme="escuro"] body[data-active-view="dashboard"] .family-chapter-card small,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .family-chapter-card small {
  position: static !important;
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: rgba(255,250,240,.86) !important;
  font-size: .82rem !important;
  line-height: 1.32 !important;
}

/* Fallback visual sem emoji para país desconhecido */
.flag-icon.flag-xx::before,
.flag-wave.flag-world::before {
  content: '' !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: radial-gradient(circle at 35% 35%, currentColor 0 16%, transparent 17%), linear-gradient(135deg, currentColor 0 35%, transparent 36% 64%, currentColor 65%) !important;
  opacity: .72 !important;
}

@media (max-width: 1180px) {
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-premium-grid,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-premium-grid { grid-template-columns: 1fr !important; }
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-quick-bar { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-chapters-grid,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-grid,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .memorial-world-stage { min-height: 480px !important; }
}
@media (max-width: 760px) {
  html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-hero-card,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-hero-card,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-hero-card { grid-template-columns: 1fr !important; padding: 22px !important; }
  html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-crest-box,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box { width: 100% !important; min-height: 118px !important; }
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-stats-strip,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-stats-strip,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-stats-strip { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-quick-bar,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-quick-bar { grid-template-columns: 1fr 1fr !important; }
  html[data-theme="claro"] body[data-active-view="dashboard"] .dashboard-chapters-grid,
  html[data-theme="escuro"] body[data-active-view="dashboard"] .dashboard-chapters-grid,
  html[data-theme="pergaminho"] body[data-active-view="dashboard"] .dashboard-chapters-grid { grid-template-columns: 1fr !important; }
  .memorial-map-pin .pin-card { display: none !important; }
  .memorial-world-stage, body[data-active-view="dashboard"] .memorial-world-map.compact .memorial-world-stage { min-height: 330px !important; }
  .memorial-world-shapes .world-labels { display: none !important; }
}

/* =============================================================================
   V22.7 — MOBILE FIXES
   1. Sidebar com scroll: em telas baixas o rodapé (tema + Sair) ficava cortado
   ============================================================================= */
.sidebar {
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
}
.sidebar .nav {
  flex-shrink: 0;
}
.sidebar-footer {
  margin-top: auto;
  flex-shrink: 0;
  padding-bottom: max(12px, env(safe-area-inset-bottom));
}

/* V22.12 — Painel Cabalo Systems: clientes e planos */
.platform-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin: 1rem 0 1.25rem;
}

.platform-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border, rgba(201, 162, 39, .35));
  border-radius: 18px;
  background: rgba(255, 255, 255, .03);
}

.platform-clients-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 920px;
}

.platform-clients-table th,
.platform-clients-table td {
  padding: .9rem 1rem;
  border-bottom: 1px solid var(--border, rgba(201, 162, 39, .22));
  text-align: left;
  vertical-align: top;
}

.platform-clients-table th {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--muted, #9b8b70);
}

.platform-clients-table tr:last-child td {
  border-bottom: 0;
}

.platform-client-name strong,
.platform-plan strong,
.platform-usage strong {
  display: block;
}

.platform-client-name small,
.platform-plan small,
.platform-usage small,
.platform-status small {
  display: block;
  color: var(--muted, #9b8b70);
  margin-top: .2rem;
}

.platform-status-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: .25rem .65rem;
  font-weight: 800;
  font-size: .78rem;
  border: 1px solid rgba(201, 162, 39, .4);
}

.platform-status-badge.active {
  color: #2f7d42;
  background: rgba(47, 125, 66, .12);
}

.platform-status-badge.pending,
.platform-status-badge.overdue {
  color: #9a6500;
  background: rgba(154, 101, 0, .12);
}

.platform-status-badge.suspended,
.platform-status-badge.cancelled {
  color: #a43434;
  background: rgba(164, 52, 52, .12);
}

@media (max-width: 900px) {
  .platform-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* =============================================================================
   V22.15 — Brasões premium responsivos por tema
   Objetivo: deixar o brasão bonito no menu lateral, Central da Família e Home,
   sem depender de fundo preto ou branco gravado na imagem.
   ============================================================================= */

:root {
  --crest-gold: #c99a43;
  --crest-gold-soft: rgba(201, 154, 67, .44);
  --crest-silver: rgba(235, 229, 215, .82);
  --crest-shadow: 0 22px 46px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255,255,255,.10);
  --crest-image-shadow: drop-shadow(0 14px 22px rgba(0,0,0,.34)) drop-shadow(0 1px 0 rgba(255,255,255,.18));
}

html[data-theme="escuro"] {
  --crest-frame-bg: radial-gradient(circle at 50% 30%, rgba(27, 59, 72, .88), rgba(4, 12, 17, .96) 70%);
  --crest-frame-ring: rgba(201, 154, 67, .46);
  --crest-frame-line: rgba(255, 236, 190, .18);
}

html[data-theme="claro"] {
  --crest-frame-bg: radial-gradient(circle at 50% 25%, rgba(255, 255, 255, .98), rgba(221, 231, 236, .94) 72%);
  --crest-frame-ring: rgba(154, 112, 40, .34);
  --crest-frame-line: rgba(88, 65, 28, .14);
}

html[data-theme="pergaminho"] {
  --crest-frame-bg: radial-gradient(circle at 50% 25%, rgba(255, 246, 221, .98), rgba(217, 193, 144, .92) 75%);
  --crest-frame-ring: rgba(128, 82, 28, .42);
  --crest-frame-line: rgba(84, 52, 22, .18);
}

/* Menu lateral: transforma o brasão em uma peça de identidade premium. */
.sidebar .brand {
  display: grid !important;
  justify-items: center !important;
  align-items: center !important;
  text-align: center !important;
  gap: 12px !important;
  padding: 10px 4px 22px !important;
  margin-bottom: 4px !important;
  border-bottom: 1px solid rgba(201, 154, 67, .20) !important;
}

.sidebar .brand > div:last-child {
  min-width: 0 !important;
}

.sidebar .brand strong {
  max-width: 210px !important;
  margin: 0 auto !important;
  font-size: 1.02rem !important;
  line-height: 1.15 !important;
  letter-spacing: .01em !important;
  text-transform: uppercase !important;
}

.sidebar .brand span {
  display: block !important;
  margin-top: 7px !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  letter-spacing: .22em !important;
  color: rgba(201, 154, 67, .92) !important;
}

.sidebar .brand-mark,
html[data-theme="claro"] .sidebar .brand-mark,
html[data-theme="escuro"] .sidebar .brand-mark,
html[data-theme="pergaminho"] .sidebar .brand-mark {
  position: relative !important;
  width: 112px !important;
  height: 112px !important;
  padding: 10px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  background: var(--crest-frame-bg) !important;
  border: 1px solid var(--crest-frame-ring) !important;
  box-shadow: var(--crest-shadow) !important;
  isolation: isolate !important;
}

.sidebar .brand-mark::before {
  content: '';
  position: absolute;
  inset: 7px;
  border-radius: 19px;
  border: 1px solid var(--crest-frame-line);
  background:
    radial-gradient(circle at 50% 14%, rgba(255,255,255,.16), transparent 38%),
    linear-gradient(135deg, rgba(255,255,255,.07), transparent 45%, rgba(0,0,0,.10));
  z-index: 0;
  pointer-events: none;
}

.sidebar .brand-mark::after {
  content: '';
  position: absolute;
  inset: auto 22px 9px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201,154,67,.56), transparent);
  z-index: 0;
}

.sidebar .brand-mark img,
html[data-theme="claro"] .sidebar .brand-mark img,
html[data-theme="escuro"] .sidebar .brand-mark img,
html[data-theme="pergaminho"] .sidebar .brand-mark img {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 94px !important;
  max-height: 94px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  filter: var(--crest-image-shadow) !important;
  mix-blend-mode: normal !important;
}

html[data-family-crest="custom"] .sidebar .brand-mark img {
  transform: scale(1.05);
}

/* Central da Família: brasão maior, elegante e coerente nos três temas. */
.family-center-hero {
  grid-template-columns: 148px minmax(0, 1fr) !important;
  gap: 24px !important;
  align-items: center !important;
  padding: 22px !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 12% 35%, rgba(201,154,67,.12), transparent 26%),
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.015)) !important;
}

.family-crest-preview,
html[data-theme="claro"] .family-crest-preview,
html[data-theme="escuro"] .family-crest-preview,
html[data-theme="pergaminho"] .family-crest-preview {
  position: relative !important;
  width: 136px !important;
  height: 136px !important;
  padding: 12px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 30px !important;
  overflow: hidden !important;
  background: var(--crest-frame-bg) !important;
  border: 1px solid var(--crest-frame-ring) !important;
  box-shadow: var(--crest-shadow) !important;
  isolation: isolate !important;
}

.family-crest-preview::before {
  content: '';
  position: absolute;
  inset: 8px;
  border-radius: 23px;
  border: 1px solid var(--crest-frame-line);
  background: radial-gradient(circle at 50% 16%, rgba(255,255,255,.15), transparent 45%);
  z-index: 0;
}

.family-crest-preview img,
html[data-theme="claro"] .family-crest-preview img,
html[data-theme="escuro"] .family-crest-preview img,
html[data-theme="pergaminho"] .family-crest-preview img {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 112px !important;
  max-height: 112px !important;
  padding: 0 !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  filter: var(--crest-image-shadow) !important;
}

.family-center-hero .eyebrow {
  border-color: rgba(201,154,67,.38) !important;
}

.family-center-hero h3 {
  letter-spacing: -.02em !important;
}

/* Home/dashboard: preserva o brasão inteiro sem corte e sem bolha branca. */
#dashboardHero .memorial-crest-box,
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box {
  background: var(--crest-frame-bg) !important;
  border: 1px solid var(--crest-frame-ring) !important;
  border-radius: 28px !important;
  box-shadow: var(--crest-shadow) !important;
  overflow: hidden !important;
}

#dashboardHero .memorial-crest-box img,
html[data-theme="claro"] body[data-active-view="dashboard"] .memorial-crest-box img,
html[data-theme="escuro"] body[data-active-view="dashboard"] .memorial-crest-box img,
html[data-theme="pergaminho"] body[data-active-view="dashboard"] .memorial-crest-box img {
  width: 112px !important;
  height: 112px !important;
  object-fit: contain !important;
  padding: 4px !important;
  border-radius: 0 !important;
  filter: var(--crest-image-shadow) !important;
}

/* Quando não existir brasão da família, o fallback da plataforma fica mais discreto. */
html[data-family-crest="default"] .sidebar .brand-mark img,
html[data-family-crest="default"] .family-crest-preview img,
html[data-family-crest="default"] #dashboardHero .memorial-crest-box img {
  transform: scale(.88);
  opacity: .92;
}

@media (max-width: 980px) {
  .sidebar .brand-mark,
  html[data-theme="claro"] .sidebar .brand-mark,
  html[data-theme="escuro"] .sidebar .brand-mark,
  html[data-theme="pergaminho"] .sidebar .brand-mark {
    width: 96px !important;
    height: 96px !important;
  }

  .sidebar .brand-mark img,
  html[data-theme="claro"] .sidebar .brand-mark img,
  html[data-theme="escuro"] .sidebar .brand-mark img,
  html[data-theme="pergaminho"] .sidebar .brand-mark img {
    max-width: 80px !important;
    max-height: 80px !important;
  }

  .family-center-hero {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    text-align: center !important;
  }
}

/* V22.17 — Cabalo Platform: menu limpo + cadastro de nova família */
.platform-header-actions {
  display: flex;
  gap: .75rem;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.platform-family-dialog .dialog-card {
  width: min(920px, calc(100vw - 2rem));
}
.platform-family-dialog .form-grid.two-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.platform-family-dialog input,
.platform-family-dialog select,
.platform-family-dialog textarea {
  width: 100%;
}
.platform-family-preview {
  margin-top: 1rem;
  padding: .85rem 1rem;
  border: 1px solid var(--border-color, rgba(198,161,91,.35));
  border-radius: 14px;
  background: rgba(198,161,91,.08);
  font-weight: 700;
  word-break: break-word;
}
.platform-actions-cell {
  display: flex;
  gap: .4rem;
  flex-wrap: wrap;
  min-width: 220px;
}
.button.compact {
  padding: .45rem .65rem;
  font-size: .8rem;
  border-radius: 10px;
}
body[data-active-view="clients"] .platform-clients-panel {
  max-width: 100%;
}
@media (max-width: 760px) {
  .platform-family-dialog .form-grid.two-columns {
    grid-template-columns: 1fr;
  }
  .platform-header-actions {
    justify-content: flex-start;
  }
}


/* V22.17.2 — Cabalo Platform: modal Nova Família amplo, centralizado e sem cortes */
#newFamilyDialog.platform-family-dialog,
dialog#newFamilyDialog.platform-family-dialog {
  position: fixed !important;
  inset: 50% auto auto 50% !important;
  transform: translate(-50%, -50%) !important;
  width: min(1120px, 94vw) !important;
  max-width: 1120px !important;
  height: auto !important;
  max-height: 92vh !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 28px !important;
  background: transparent !important;
  color: var(--text-color, #f7f0df) !important;
  overflow: visible !important;
  box-shadow: none !important;
}

#newFamilyDialog.platform-family-dialog::backdrop {
  background: rgba(0, 0, 0, .72) !important;
  backdrop-filter: blur(10px);
}

#newFamilyDialog .dialog-card {
  width: 100% !important;
  max-width: none !important;
  max-height: 92vh !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border-radius: 28px !important;
  background:
    linear-gradient(135deg, rgba(19, 37, 54, .98), rgba(8, 18, 27, .98)) !important;
  border: 1px solid rgba(198, 161, 91, .35) !important;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .55) !important;
}

#newFamilyDialog .dialog-header {
  flex: 0 0 auto !important;
  padding: 28px 32px 18px !important;
  border-bottom: 1px solid rgba(198, 161, 91, .22) !important;
}

#newFamilyDialog .dialog-header h2 {
  margin: 0 0 8px !important;
  font-size: clamp(1.45rem, 2vw, 2rem) !important;
}

#newFamilyDialog .form-grid.two-columns {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: calc(92vh - 230px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(280px, 1fr)) !important;
  gap: 18px 24px !important;
  padding: 24px 32px 10px !important;
}

#newFamilyDialog .form-grid.two-columns label {
  min-width: 0 !important;
}

#newFamilyDialog input,
#newFamilyDialog select,
#newFamilyDialog textarea {
  width: 100% !important;
  min-height: 52px !important;
  font-size: 1rem !important;
}

#newFamilyDialog .platform-family-preview {
  flex: 0 0 auto !important;
  margin: 12px 32px 0 !important;
}

#newFamilyDialog .dialog-actions {
  flex: 0 0 auto !important;
  position: sticky !important;
  bottom: 0 !important;
  z-index: 2 !important;
  padding: 20px 32px 28px !important;
  border-top: 1px solid rgba(198, 161, 91, .24) !important;
  background: linear-gradient(180deg, rgba(9, 19, 29, .92), rgba(8, 17, 25, .98)) !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

#newFamilyDialog .dialog-close {
  min-width: 44px !important;
  min-height: 44px !important;
}

@media (max-width: 860px) {
  #newFamilyDialog.platform-family-dialog,
  dialog#newFamilyDialog.platform-family-dialog {
    width: 96vw !important;
    max-height: 96vh !important;
    border-radius: 22px !important;
  }

  #newFamilyDialog .dialog-card {
    max-height: 96vh !important;
    border-radius: 22px !important;
  }

  #newFamilyDialog .form-grid.two-columns {
    grid-template-columns: 1fr !important;
    max-height: calc(96vh - 230px) !important;
    padding: 20px !important;
  }

  #newFamilyDialog .dialog-header,
  #newFamilyDialog .dialog-actions {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  #newFamilyDialog .platform-family-preview {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
}


/* V22.17.2 — Plataforma: botões do modal com contraste alto */
#newFamilyDialog .dialog-actions .button,
.new-family-dialog .dialog-actions .button {
  color: #fff !important;
  font-weight: 800 !important;
  opacity: 1 !important;
}
#newFamilyDialog .dialog-actions .button.primary,
.new-family-dialog .dialog-actions .button.primary {
  background: linear-gradient(135deg, #0f7fc5, #0b6aa8) !important;
  border-color: rgba(255,255,255,.2) !important;
  color: #fff !important;
}
#newFamilyDialog .dialog-actions .button.ghost,
.new-family-dialog .dialog-actions .button.ghost {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.55) !important;
  color: #fff !important;
}
#closeNewFamilyDialog {
  color: #0e1c2d !important;
  font-weight: 900 !important;
  opacity: 1 !important;
}
html[data-theme="claro"] #newFamilyDialog .dialog-actions .button.ghost,
html[data-theme="claro"] .new-family-dialog .dialog-actions .button.ghost {
  background: #102033 !important;
  border-color: #102033 !important;
  color: #fff !important;
}

/* =============================================================================
   V23.2 — Cabalo Platform Enterprise Dashboard
   ============================================================================= */
.platform-enterprise-panel {
  padding: clamp(18px, 2.2vw, 30px) !important;
}
.platform-executive-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: clamp(18px, 2vw, 28px);
  margin-bottom: 18px;
  border: 1px solid rgba(26, 84, 132, .18);
  border-radius: 24px;
  background:
    radial-gradient(circle at 14% 0%, rgba(15, 127, 197, .16), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.84), rgba(239,247,253,.72));
  box-shadow: 0 18px 52px rgba(13, 39, 68, .08);
}
.platform-executive-hero h2 {
  margin: 4px 0 6px;
  font-size: clamp(1.55rem, 2.2vw, 2.35rem);
}
.platform-eyebrow {
  display: inline-flex;
  color: #0b6aa8;
  font-weight: 900;
  letter-spacing: .11em;
  text-transform: uppercase;
  font-size: .72rem;
}
.platform-summary-premium {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.platform-summary-premium .platform-kpi {
  position: relative;
  overflow: hidden;
  min-height: 104px;
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(255,255,255,.92), rgba(242,248,252,.78));
  box-shadow: 0 14px 34px rgba(13, 39, 68, .06);
}
.platform-summary-premium .platform-kpi::after {
  content: '';
  position: absolute;
  right: -24px;
  top: -24px;
  width: 80px;
  height: 80px;
  border-radius: 999px;
  background: rgba(15, 127, 197, .11);
}
.platform-summary-premium .platform-kpi small {
  display: block;
  margin-top: 8px;
  color: var(--muted, #66768a);
  font-weight: 600;
}
.platform-insights-grid {
  display: grid;
  grid-template-columns: 1.15fr 1.15fr .9fr;
  gap: 16px;
  margin: 18px 0 22px;
}
.platform-insight-card,
.platform-client-card {
  border: 1px solid rgba(26, 84, 132, .16);
  border-radius: 22px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 14px 36px rgba(13, 39, 68, .055);
}
.platform-insight-card {
  padding: 18px;
}
.platform-card-title {
  margin-bottom: 14px;
  font-weight: 900;
  color: var(--text, #10223a);
}
.platform-mini-chart {
  display: grid;
  gap: 11px;
}
.platform-bar-row {
  display: grid;
  grid-template-columns: 92px 1fr 44px;
  align-items: center;
  gap: 10px;
  font-size: .9rem;
}
.platform-bar-row > div {
  height: 10px;
  border-radius: 999px;
  background: rgba(15, 127, 197, .11);
  overflow: hidden;
}
.platform-bar-row i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0b6aa8, #c79a3a);
}
.platform-health-list {
  display: grid;
  gap: 10px;
}
.platform-health-list div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(26, 84, 132, .12);
}
.platform-health-list div:last-child { border-bottom: 0; }
.platform-health-list strong { color: #2f7d42; }
.platform-section-title-row {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  margin: 12px 0 14px;
}
.platform-section-title-row h3 { margin: 0 0 4px; }
.platform-client-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}
.platform-client-card {
  padding: 18px;
}
.platform-client-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.platform-client-card h3 {
  margin: 3px 0 3px;
  font-size: 1.18rem;
}
.platform-client-card p {
  margin: 0;
  color: var(--muted, #66768a);
  font-size: .88rem;
}
.platform-client-slug {
  color: #0b6aa8;
  font-weight: 900;
  font-size: .72rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.platform-client-card-plan {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin: 14px 0;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(15, 127, 197, .08);
}
.platform-client-card-plan small { color: var(--muted, #66768a); }
.platform-client-card-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.platform-client-card-metrics span {
  padding: 10px;
  border-radius: 14px;
  background: rgba(247, 250, 253, .9);
  color: var(--muted, #66768a);
  font-size: .82rem;
}
.platform-client-card-metrics b {
  display: block;
  color: var(--text, #10223a);
  font-size: 1.05rem;
}
.platform-storage-line {
  margin: 15px 0;
}
.platform-storage-line div {
  height: 10px;
  border-radius: 999px;
  background: rgba(15, 127, 197, .11);
  overflow: hidden;
}
.platform-storage-line span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0b6aa8, #c79a3a);
}
.platform-storage-line small {
  display: block;
  margin-top: 7px;
  color: var(--muted, #66768a);
}
.platform-client-card-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.platform-legacy-table-details {
  margin-top: 14px;
}
.platform-legacy-table-details summary {
  cursor: pointer;
  font-weight: 900;
  margin-bottom: 10px;
}
html[data-theme="escuro"] .platform-executive-hero {
  background:
    radial-gradient(circle at 14% 0%, rgba(198, 161, 91, .18), transparent 34%),
    linear-gradient(135deg, rgba(11, 27, 38, .95), rgba(5, 13, 18, .92));
  border-color: rgba(198, 161, 91, .24);
}
html[data-theme="escuro"] .platform-insight-card,
html[data-theme="escuro"] .platform-client-card,
html[data-theme="escuro"] .platform-summary-premium .platform-kpi {
  background: rgba(9, 20, 31, .78);
  border-color: rgba(198, 161, 91, .22);
}
html[data-theme="escuro"] .platform-client-card-metrics span,
html[data-theme="escuro"] .platform-client-card-plan {
  background: rgba(255,255,255,.055);
}
@media (max-width: 1100px) {
  .platform-insights-grid,
  .platform-client-cards { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .platform-executive-hero { flex-direction: column; }
  .platform-summary-premium { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .platform-client-card-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* V24.1 RC-4.1 — Portugal com bandeira estável no Edge/Windows */
.flag-icon.flag-pt,
.flag-wave.flag-pt {
  background: linear-gradient(90deg, #006600 0 42%, #ff0000 42% 100%) !important;
}
.flag-icon.flag-pt::after,
.flag-wave.flag-pt::after {
  content: '' !important;
  position: absolute !important;
  left: 34% !important;
  top: 50% !important;
  width: 18% !important;
  height: 36% !important;
  border-radius: 50% !important;
  transform: translate(-50%, -50%) !important;
  background: #ffd100 !important;
  box-shadow: 0 0 0 1px rgba(80, 40, 0, .25) !important;
}


/* V23.3 — GeoEngine flags locais e fallback sem imagem quebrada */
.flag-icon,
.flag-wave {
  background-size: cover;
  background-position: center;
}
.flag-icon.flag-world,
.flag-wave.flag-world,
.flag-icon.flag-xx,
.flag-wave.flag-xx {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(220,230,238,.75)) !important;
  color: #345;
}
.flag-icon.flag-world::before,
.flag-wave.flag-world::before,
.flag-icon.flag-xx::before,
.flag-wave.flag-xx::before {
  content: '🌍' !important;
  position: static !important;
  inset: auto !important;
  background: transparent !important;
  mix-blend-mode: normal !important;
  font-size: .85em;
}
.flag-icon.flag-pt,
.flag-wave.flag-pt {
  background: linear-gradient(90deg, #006600 0 42%, #ff0000 42% 100%) !important;
}
.flag-icon.flag-pt::before,
.flag-wave.flag-pt::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(90deg, rgba(255,255,255,.26), transparent 22%, rgba(0,0,0,.10) 48%, transparent 75%) !important;
  mix-blend-mode: overlay !important;
}
.flag-icon.flag-pt::after,
.flag-wave.flag-pt::after {
  content: '' !important;
  position: absolute !important;
  left: 42% !important;
  top: 50% !important;
  width: 18% !important;
  height: 36% !important;
  border-radius: 50% !important;
  transform: translate(-50%, -50%) !important;
  background: #ffd100 !important;
  box-shadow: 0 0 0 1px rgba(80, 40, 0, .25) !important;
}
.flag-icon.flag-ca,
.flag-wave.flag-ca { background: linear-gradient(90deg, #d80621 0 25%, #fff 25% 75%, #d80621 75% 100%) !important; }
.flag-icon.flag-br,
.flag-wave.flag-br { background: linear-gradient(135deg, transparent 33%, #ffdf00 33% 67%, transparent 67%), #009b3a !important; }
.flag-icon.flag-es,
.flag-wave.flag-es { background: linear-gradient(180deg, #c60b1e 0 25%, #ffc400 25% 75%, #c60b1e 75% 100%) !important; }
.flag-icon.flag-it,
.flag-wave.flag-it { background: linear-gradient(90deg, #009246 0 33%, #fff 33% 66%, #ce2b37 66% 100%) !important; }
.flag-icon.flag-jp,
.flag-wave.flag-jp { background: radial-gradient(circle at 50% 50%, #bc002d 0 28%, transparent 29%), #fff !important; }
.flag-icon.flag-de,
.flag-wave.flag-de { background: linear-gradient(180deg, #000 0 33%, #dd0000 33% 66%, #ffce00 66% 100%) !important; }
.flag-icon.flag-fr,
.flag-wave.flag-fr { background: linear-gradient(90deg, #0055a4 0 33%, #fff 33% 66%, #ef4135 66% 100%) !important; }
.flag-icon.flag-us,
.flag-wave.flag-us { background: repeating-linear-gradient(180deg, #b22234 0 7.7%, #fff 7.7% 15.4%) !important; }
.flag-icon.flag-us::after,
.flag-wave.flag-us::after { content: ''; position: absolute; left: 0; top: 0; width: 45%; height: 54%; background: #3c3b6e; }
.flag-icon.flag-gb,
.flag-wave.flag-gb { background: linear-gradient(135deg, transparent 0 42%, #fff 42% 47%, #c8102e 47% 53%, #fff 53% 58%, transparent 58%), linear-gradient(45deg, transparent 0 42%, #fff 42% 47%, #c8102e 47% 53%, #fff 53% 58%, transparent 58%), linear-gradient(90deg, transparent 0 42%, #fff 42% 47%, #c8102e 47% 53%, #fff 53% 58%, transparent 58%), linear-gradient(180deg, transparent 0 38%, #fff 38% 45%, #c8102e 45% 55%, #fff 55% 62%, transparent 62%), #012169 !important; }
.flag-icon.flag-ar,
.flag-wave.flag-ar { background: linear-gradient(180deg, #74acdf 0 33%, #fff 33% 66%, #74acdf 66% 100%) !important; }
.flag-icon.flag-py,
.flag-wave.flag-py { background: linear-gradient(180deg, #d52b1e 0 33%, #fff 33% 66%, #0038a8 66% 100%) !important; }
.flag-icon.flag-uy,
.flag-wave.flag-uy { background: repeating-linear-gradient(180deg, #fff 0 12%, #0038a8 12% 24%) !important; }

/* ============================================================
   V23.3.1 — Mapa das Origens Premium + bandeiras emoji reais
   Objetivo: aproximar o visual do mapa ao padrão SaaS premium.
   ============================================================ */
.flag-emoji {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 24px;
  min-width: 34px;
  border-radius: 7px;
  font-size: 22px;
  line-height: 1;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 8px 18px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.12);
  overflow: hidden;
  vertical-align: middle;
}
.flag-emoji-tiny { width: 30px; height: 22px; min-width: 30px; font-size: 20px; border-radius: 6px; }
.flag-emoji-sm { width: 34px; height: 24px; min-width: 34px; font-size: 22px; }
.flag-emoji-lg { width: 46px; height: 32px; min-width: 46px; font-size: 29px; border-radius: 9px; }
.flag-emoji-fallback { font-size: 18px; }
.country-badge .flag-emoji,
.world-card-title .flag-emoji,
#originsSummary .flag-emoji { margin-right: .38rem; }

/* Desativa as bandeiras CSS antigas dentro do mapa premium, sem quebrar outras telas */
.family-world-card .flag-wave,
.family-world-card .flag-icon,
.family-world-card .flag-emoji,
.country-badge .flag-emoji {
  background-image: none !important;
}

/* Card do mapa na home */
.dashboard-origin-map,
#familyWorldMap,
.family-world-map {
  position: relative;
}
#familyWorldMap {
  border-radius: 26px !important;
  padding: 0 !important;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 10%, rgba(201,151,59,.16), transparent 30%),
    linear-gradient(135deg, #031723 0%, #061e2d 42%, #020b12 100%) !important;
  border: 1px solid rgba(201,151,59,.30) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);
}
#familyWorldMap .family-world-head {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: flex-start;
  padding: 28px 30px 18px !important;
  color: #f8ead0;
}
#familyWorldMap .family-world-head .eyebrow {
  display: none !important;
}
#familyWorldMap .family-world-head h3 {
  margin: 0 0 8px !important;
  font-size: clamp(1.8rem, 2.5vw, 2.65rem) !important;
  line-height: 1.05 !important;
  color: #fff4dc !important;
  letter-spacing: -.04em;
}
#familyWorldMap .family-world-head p {
  margin: 0 !important;
  color: rgba(255,244,220,.78) !important;
  font-size: 1.02rem;
}
#familyWorldMap .family-world-counts {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
#familyWorldMap .family-world-counts span {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  padding: 10px 13px;
  border-radius: 999px;
  color: #f7dfb2 !important;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(201,151,59,.25);
}
#familyWorldMap .family-world-counts strong { color: #f4b647; font-size: 1.25rem; }

#familyWorldMap .family-world-stage {
  position: relative;
  min-height: clamp(390px, 48vw, 620px) !important;
  margin: 0 24px 24px !important;
  border-radius: 22px !important;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 44%, rgba(28,83,112,.22), transparent 38%),
    linear-gradient(180deg, rgba(4,22,35,.96), rgba(1,10,16,.98)) !important;
  border: 1px solid rgba(201,151,59,.22) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03), inset 0 -80px 120px rgba(0,0,0,.42);
}
#familyWorldMap .memorial-world-base {
  filter: saturate(.85) brightness(.67) contrast(1.18) drop-shadow(0 18px 40px rgba(0,0,0,.35));
  opacity: .82 !important;
  transform: scale(1.04);
}
#familyWorldMap .family-world-stage::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    radial-gradient(circle at 52% 52%, transparent 0 42%, rgba(0,0,0,.27) 73%, rgba(0,0,0,.55) 100%),
    linear-gradient(90deg, rgba(2,12,20,.28), transparent 22%, transparent 74%, rgba(2,12,20,.30));
}
#familyWorldMap .family-world-svg {
  position: absolute;
  inset: 0;
  z-index: 4 !important;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
#familyWorldMap .family-world-route {
  fill: none;
  stroke: #f2aa2f !important;
  stroke-width: .52 !important;
  stroke-linecap: round;
  stroke-dasharray: 2.4 2.4;
  opacity: .95;
  filter: drop-shadow(0 0 5px rgba(245,174,57,.90));
  animation: familyRouteFlow 2.8s linear infinite;
}
@keyframes familyRouteFlow { to { stroke-dashoffset: -24; } }

#familyWorldMap .family-world-pin {
  position: absolute;
  z-index: 8 !important;
  transform: translate(-50%, -50%);
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  color: #fff4dc;
}
#familyWorldMap .pin-dot {
  display: block !important;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background: radial-gradient(circle, #fff4c8 0 25%, #f1aa2d 27% 53%, rgba(241,170,45,.16) 54% 100%);
  border: 2px solid rgba(255,246,213,.95);
  box-shadow: 0 0 0 8px rgba(241,170,45,.16), 0 0 28px rgba(241,170,45,.85);
}
#familyWorldMap .family-world-card {
  position: absolute;
  left: 18px;
  top: -66px;
  min-width: 178px;
  padding: 13px 15px 12px !important;
  border-radius: 16px !important;
  text-align: left;
  color: #fff4dc;
  background: rgba(3,15,23,.93) !important;
  border: 1px solid rgba(241,170,45,.65) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.40), 0 0 20px rgba(241,170,45,.12), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(10px);
}
#familyWorldMap .world-card-title {
  display: flex !important;
  align-items: center;
  gap: 9px;
  font-size: 1rem;
  line-height: 1.1;
}
#familyWorldMap .world-card-title strong { color: #fff7df; font-size: 1.12rem; }
#familyWorldMap .family-world-card em {
  display: block;
  margin-top: 4px;
  font-style: normal;
  color: rgba(255,244,220,.74) !important;
  font-weight: 650;
}
#familyWorldMap .family-world-card small { display: none !important; }
#familyWorldMap .family-world-feature-card {
  position: absolute;
  left: 22px;
  bottom: 22px;
  z-index: 9;
  width: min(285px, calc(100% - 44px));
  padding: 16px 18px !important;
  border-radius: 18px !important;
  background: rgba(3,15,23,.90) !important;
  border: 1px solid rgba(241,170,45,.38) !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.28);
  color: #fff4dc;
}
#familyWorldMap .family-world-feature-card span {
  display: inline-flex;
  margin-bottom: 7px;
  color: #f0b248;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .75rem;
  font-weight: 900;
}
#familyWorldMap .family-world-feature-card strong { display: block; color: #fff7df; font-size: 1.02rem; }
#familyWorldMap .family-world-feature-card em { display: block; margin-top: 5px; color: rgba(255,244,220,.74); font-style: normal; }

#familyWorldMap .family-world-timeline {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 0;
  margin: -8px 24px 24px !important;
  border-radius: 18px;
  overflow: hidden;
  background: rgba(4,19,29,.78);
  border: 1px solid rgba(201,151,59,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
#familyWorldMap .family-world-timeline span {
  min-height: 74px;
  padding: 15px 18px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border-right: 1px solid rgba(255,255,255,.06);
  color: rgba(255,244,220,.78);
}
#familyWorldMap .family-world-timeline span:last-child { border-right: 0; }
#familyWorldMap .family-world-timeline strong { color: #f5b648; font-size: 1.5rem; line-height: 1; }
#familyWorldMap .family-world-timeline em { margin-top: 5px; color: rgba(255,244,220,.72); font-style: normal; text-align: center; }

html[data-theme="claro"] #familyWorldMap,
html[data-theme="sepia"] #familyWorldMap {
  background: linear-gradient(135deg, #061b29, #07101a 60%, #03070c) !important;
}

@media (max-width: 900px) {
  #familyWorldMap .family-world-head { flex-direction: column; padding: 22px 20px 14px !important; }
  #familyWorldMap .family-world-stage { margin: 0 14px 16px !important; min-height: 360px !important; }
  #familyWorldMap .family-world-card { min-width: 145px; padding: 11px 12px !important; }
  #familyWorldMap .world-card-title strong { font-size: .95rem; }
  #familyWorldMap .family-world-timeline { grid-template-columns: repeat(2, 1fr); margin: -4px 14px 16px !important; }
}


/* ========================================================================== 
   V23.3.2 — Mapa Premium Real: bandeiras emoji reais, mapa amplo e rota dourada
   ========================================================================== */
.flag-emoji-real {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 22px !important;
  min-width: 28px !important;
  border-radius: 6px !important;
  font-size: 20px !important;
  line-height: 1 !important;
  background: rgba(255,255,255,.10) !important;
  box-shadow: 0 5px 14px rgba(0,0,0,.28) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  overflow: hidden !important;
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif !important;
}
.flag-emoji-real.flag-emoji-tiny { width: 32px !important; height: 24px !important; min-width: 32px !important; font-size: 22px !important; }
.flag-emoji-real.flag-emoji-sm { width: 34px !important; height: 26px !important; min-width: 34px !important; font-size: 23px !important; }
.flag-emoji-real.flag-emoji-fallback { font-size: 18px !important; background: rgba(196,149,58,.18) !important; }

body[data-active-view="dashboard"] .dashboard-map-card,
body[data-active-view="origins"] .family-world-map,
.family-world-map {
  background:
    radial-gradient(circle at 20% 12%, rgba(34,114,160,.22), transparent 32%),
    radial-gradient(circle at 62% 24%, rgba(196,149,58,.20), transparent 28%),
    linear-gradient(145deg, rgba(6,20,31,.96), rgba(5,15,23,.98)) !important;
  border: 1px solid rgba(196,149,58,.35) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.family-world-head h3 {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(1.65rem, 2.4vw, 2.45rem) !important;
  text-transform: none !important;
  letter-spacing: -.045em !important;
  color: #fff3d7 !important;
}
.family-world-head p { color: rgba(248,234,208,.78) !important; font-weight: 700 !important; }
.family-world-counts { flex-direction: row !important; align-items: center !important; }
.family-world-counts span {
  background: rgba(7,18,26,.72) !important;
  border-color: rgba(196,149,58,.22) !important;
  color: rgba(248,234,208,.76) !important;
  border-radius: 999px !important;
  padding: 8px 14px !important;
}
.family-world-counts strong { color: #ffba43 !important; }

.family-world-stage {
  min-height: 520px !important;
  width: 100% !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 47% 47%, rgba(72,154,209,.16), transparent 24%),
    radial-gradient(circle at 33% 58%, rgba(255,181,57,.10), transparent 18%),
    linear-gradient(180deg, rgba(9,30,45,.90), rgba(5,16,25,.96)) !important;
  border: 1px solid rgba(196,149,58,.24) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 22px 60px rgba(0,0,0,.22) !important;
}
.family-world-stage::before {
  opacity: .26 !important;
  background-image: radial-gradient(circle, rgba(196,149,58,.25) 1px, transparent 1px) !important;
  background-size: 14px 14px !important;
  z-index: 1 !important;
}
.memorial-world-base,
.memorial-world-base-premium {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  z-index: 1 !important;
  pointer-events: none !important;
  opacity: .58 !important;
  filter: saturate(.8) contrast(1.18) brightness(.82) sepia(.12) !important;
}
.family-world-svg { z-index: 4 !important; }
.family-world-route {
  stroke: #ffb638 !important;
  stroke-width: .65 !important;
  stroke-linecap: round !important;
  stroke-dasharray: 2.2 1.7 !important;
  filter: drop-shadow(0 0 5px rgba(255,182,56,.65)) drop-shadow(0 8px 18px rgba(0,0,0,.40)) !important;
  animation: premiumRouteDash 4.5s linear infinite !important;
}
@keyframes premiumRouteDash { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -18; } }

.family-world-pin {
  z-index: 7 !important;
  transform: translate(-50%, -50%) !important;
}
.family-world-pin:hover { z-index: 18 !important; transform: translate(-50%, -50%) scale(1.03) !important; }
.family-world-pin .pin-dot,
.pin-dot {
  width: 24px !important;
  height: 24px !important;
  border: 3px solid rgba(255,244,219,.98) !important;
  background: radial-gradient(circle, #ffd36d 0 35%, #b87916 66%, #603a07 100%) !important;
  box-shadow: 0 0 0 5px rgba(255,181,57,.20), 0 0 22px rgba(255,181,57,.65), 0 8px 20px rgba(0,0,0,.45) !important;
}
.family-world-pin .pin-dot::after {
  content: '' !important;
  position: absolute !important;
  inset: -9px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255,181,57,.32) !important;
  animation: premiumPinPulse 2.7s ease-out infinite !important;
}
@keyframes premiumPinPulse { 0% { transform: scale(.72); opacity:.7; } 100% { transform: scale(1.45); opacity:0; } }

.family-world-card {
  min-width: 190px !important;
  max-width: 240px !important;
  padding: 12px 14px !important;
  border-radius: 17px !important;
  background: rgba(5,14,20,.94) !important;
  color: #fff3d7 !important;
  border: 1px solid rgba(255,181,57,.55) !important;
  box-shadow: 0 16px 36px rgba(0,0,0,.48), 0 0 0 1px rgba(255,255,255,.035) inset !important;
  backdrop-filter: blur(10px) !important;
  transform: translateY(-12px) !important;
}
.family-world-card::after {
  background: rgba(5,14,20,.94) !important;
  border-right-color: rgba(255,181,57,.48) !important;
  border-bottom-color: rgba(255,181,57,.48) !important;
}
.family-world-card .world-card-title {
  color: #fff3d7 !important;
  gap: 10px !important;
  font-size: 1rem !important;
  font-weight: 950 !important;
  letter-spacing: -.02em !important;
}
.family-world-card em {
  color: rgba(248,234,208,.78) !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
  margin-left: 42px !important;
}
.family-world-card small { display: none !important; }

.family-world-feature-card {
  left: 22px !important;
  bottom: 20px !important;
  background: rgba(5,14,20,.88) !important;
  color: #fff3d7 !important;
  border-color: rgba(255,181,57,.34) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.42) !important;
}
.family-world-feature-card span { color: #ffba43 !important; }
.family-world-feature-card strong { color: #fff3d7 !important; }
.family-world-feature-card em { color: rgba(248,234,208,.74) !important; }

.family-world-timeline {
  margin-top: 16px !important;
  background: rgba(5,14,20,.55) !important;
  border-color: rgba(196,149,58,.20) !important;
  min-height: 76px !important;
}
.family-world-timeline::before { background: linear-gradient(90deg, #ffb638, #d38d22, #47b884) !important; opacity: .75 !important; }
.family-world-timeline strong { color: #ffba43 !important; }
.family-world-timeline em { color: rgba(248,234,208,.76) !important; }

.country-badge .flag-emoji-real,
.origin-big-flag .flag-emoji-real { margin-right: 6px !important; }
.country-badge {
  background: rgba(7,18,26,.72) !important;
  color: #fff3d7 !important;
  border-color: rgba(255,181,57,.28) !important;
}

@media (max-width: 900px) {
  .family-world-stage { min-height: 430px !important; }
  .family-world-card { min-width: 155px !important; max-width: 180px !important; font-size: .86rem !important; }
  .flag-emoji-real.flag-emoji-tiny { width: 28px !important; height: 22px !important; font-size: 20px !important; }
}

/* ========================================================================== 
   V23.3.3 — Bandeiras Definitivas: SVG local, sem emoji quebrado/siglas BR/PT
   ========================================================================== */
.flag-svg-real {
  display: inline-block !important;
  width: 32px !important;
  height: 23px !important;
  min-width: 32px !important;
  object-fit: cover !important;
  border-radius: 5px !important;
  vertical-align: -5px !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  box-shadow: 0 6px 16px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.08) !important;
}
.flag-svg-tiny { width: 34px !important; height: 24px !important; min-width: 34px !important; }
.flag-svg-sm { width: 36px !important; height: 26px !important; min-width: 36px !important; }
.flag-svg-lg { width: 48px !important; height: 34px !important; min-width: 48px !important; border-radius: 8px !important; }
.flag-svg-fallback {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  line-height: 1 !important;
  color: #fff3d7 !important;
  background: rgba(196,149,58,.20) !important;
}
.world-card-title .flag-svg-real,
.country-badge .flag-svg-real,
#originsSummary .flag-svg-real,
.dashboard-country-chip .flag-svg-real {
  margin-right: .42rem !important;
}
.family-world-card .world-card-title {
  gap: 8px !important;
}
.family-world-card .world-card-title .flag-svg-real {
  flex: 0 0 auto !important;
  margin-right: 0 !important;
}
.country-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}
.country-badge .flag-svg-real { margin-right: 0 !important; }
.origin-big-flag .flag-svg-real {
  width: 54px !important;
  height: 38px !important;
  min-width: 54px !important;
  border-radius: 9px !important;
}
/* Oculta versões antigas de bandeira por CSS quando coexistirem */
.flag-wave:not(img), .flag-icon:not(img), .flag-emoji-real:not(img) {
  font-family: system-ui, sans-serif !important;
}

/* V24.1 RC-1 — Administração e Segurança */
.platform-actions-cell {
  gap: .45rem;
  flex-wrap: wrap;
}
.platform-actions-cell .button.compact {
  min-height: 32px;
  padding: .45rem .65rem;
  font-size: .78rem;
  line-height: 1;
}
.platform-actions-cell .button.danger.compact,
.button.danger.compact.platform-delete-family {
  background: linear-gradient(135deg, rgba(160, 44, 44, .22), rgba(95, 24, 24, .9));
  border: 1px solid rgba(255, 120, 120, .45);
  color: #ffe1e1;
}
.platform-status-badge.inactive,
.platform-status-badge.suspended,
.platform-status-badge.archived,
.platform-status-badge.deleted,
.platform-status-badge.cancelled {
  background: rgba(180, 95, 95, .16);
  border-color: rgba(255, 150, 150, .35);
  color: #ffd7d7;
}
.platform-status-badge.archived {
  background: rgba(186, 145, 65, .16);
  border-color: rgba(225, 186, 95, .38);
  color: #ffe5a8;
}
.platform-status-badge.active {
  background: rgba(73, 168, 112, .16);
  border-color: rgba(111, 220, 157, .35);
  color: #c9ffdc;
}

/* V24.1 RC-3 — auditoria de acesso de suporte */
.support-access-banner {
  position: sticky;
  top: 0;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem 1rem;
  border: 1px solid rgba(198, 161, 91, .38);
  border-radius: 0 0 18px 18px;
  background: linear-gradient(135deg, rgba(24, 34, 48, .98), rgba(52, 35, 18, .96));
  color: #f6ead3;
  box-shadow: 0 18px 40px rgba(0,0,0,.22);
  backdrop-filter: blur(12px);
}
.support-access-banner strong {
  display: block;
  font-size: .9rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #f6d28a;
}
.support-access-banner span {
  display: block;
  margin-top: .15rem;
  font-size: .86rem;
  color: rgba(246, 234, 211, .82);
}
.support-access-banner .button {
  white-space: nowrap;
  border-color: rgba(246, 210, 138, .42);
  color: #f6d28a;
}
@media (max-width: 760px) {
  .support-access-banner {
    align-items: stretch;
    flex-direction: column;
    border-radius: 0 0 14px 14px;
  }
  .support-access-banner .button { width: 100%; }
}


/* V24.1 RC-6 — Branding e identidade Cabalo Systems */
.auth-powered-cabalo {
  margin: 18px 0 0;
  text-align: center;
  font-size: .78rem;
  letter-spacing: .03em;
  color: var(--muted, #8ea0b5);
}
.auth-powered-cabalo strong {
  color: var(--accent, #c6a15b);
  font-weight: 800;
}
.app-legal-footer {
  position: fixed;
  right: 18px;
  bottom: 10px;
  z-index: 20;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  max-width: calc(100vw - 340px);
  font-size: .72rem;
  color: color-mix(in srgb, var(--muted, #8ea0b5) 82%, transparent);
  pointer-events: none;
}
.app-legal-footer span {
  padding: 4px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--panel, #101b2a) 76%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent, #c6a15b) 18%, transparent);
  backdrop-filter: blur(8px);
}
.about-system-dialog .dialog-card {
  width: min(520px, 94vw);
}
.about-system-body {
  display: grid;
  gap: 10px;
  padding: 18px 0 4px;
}
.about-system-body p {
  margin: 0;
}
@media (max-width: 980px) {
  .app-legal-footer {
    position: static;
    max-width: none;
    padding: 12px 14px 18px;
    justify-content: center;
    pointer-events: auto;
  }
}


/* V24.1 RC-6.2 — Modal Sobre o Sistema */
.about-system-dialog::backdrop {
  background: rgba(3, 7, 18, .68);
  backdrop-filter: blur(8px);
}

.about-system-dialog .about-system-card {
  width: min(560px, 92vw);
}

.about-system-content {
  display: grid;
  grid-template-columns: 82px 1fr;
  gap: 1.25rem;
  align-items: center;
  padding: 1.25rem 0 .75rem;
}

.about-system-logo {
  width: 76px;
  height: 76px;
  border-radius: 24px;
  display: grid;
  place-items: center;
  font-weight: 900;
  letter-spacing: .08em;
  color: #111827;
  background: linear-gradient(135deg, #f5d27b, #c6a15b);
  box-shadow: 0 18px 45px rgba(198, 161, 91, .28);
}

.about-system-content p {
  margin: .25rem 0;
}

@media (max-width: 620px) {
  .about-system-content {
    grid-template-columns: 1fr;
    text-align: left;
  }
}

/* V24.1 RC-6.2 — Modal Sobre centralizado e responsivo */
dialog#aboutSystemDialog.about-system-dialog,
#aboutSystemDialog.about-system-dialog {
  position: fixed !important;
  inset: 50% auto auto 50% !important;
  transform: translate(-50%, -50%) !important;
  width: min(560px, calc(100vw - 32px)) !important;
  max-width: 560px !important;
  max-height: min(88vh, 620px) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 28px !important;
  background: transparent !important;
  color: var(--text-color, #f7f0df) !important;
  overflow: visible !important;
  box-shadow: none !important;
}

#aboutSystemDialog.about-system-dialog::backdrop {
  background: rgba(3, 7, 18, .72) !important;
  backdrop-filter: blur(10px) !important;
}

#aboutSystemDialog .about-system-card {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 28px !important;
  background: linear-gradient(135deg, rgba(19, 37, 54, .98), rgba(8, 18, 27, .98)) !important;
  border: 1px solid rgba(198, 161, 91, .32) !important;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .56) !important;
}

#aboutSystemDialog .dialog-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin: 0 !important;
  padding: 26px 28px 16px !important;
  border-bottom: 1px solid rgba(198, 161, 91, .18) !important;
}

#aboutSystemDialog .dialog-header h2 {
  margin: 0 0 8px !important;
  line-height: 1.12 !important;
  font-size: clamp(1.35rem, 3vw, 1.75rem) !important;
}

#aboutSystemDialog .dialog-header .muted,
#aboutSystemDialog .dialog-header p {
  margin: 0 !important;
  line-height: 1.45 !important;
}

#aboutSystemDialog .dialog-close {
  flex: 0 0 auto !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 10px !important;
  margin: 0 !important;
}

#aboutSystemDialog .about-system-content {
  display: grid !important;
  grid-template-columns: 84px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 22px !important;
  padding: 26px 28px 14px !important;
}

#aboutSystemDialog .about-system-logo {
  width: 74px !important;
  height: 74px !important;
  border-radius: 24px !important;
  justify-self: center !important;
}

#aboutSystemDialog .about-system-content p {
  margin: 6px 0 !important;
  line-height: 1.35 !important;
}

#aboutSystemDialog .dialog-actions {
  margin: 0 !important;
  padding: 18px 28px 28px !important;
  display: flex !important;
  justify-content: center !important;
}

#aboutSystemDialog .dialog-actions .button {
  min-width: 132px !important;
}

@media (max-width: 620px) {
  dialog#aboutSystemDialog.about-system-dialog,
  #aboutSystemDialog.about-system-dialog {
    width: min(94vw, 440px) !important;
    max-height: 90vh !important;
  }

  #aboutSystemDialog .about-system-card {
    border-radius: 22px !important;
  }

  #aboutSystemDialog .dialog-header {
    padding: 22px 22px 14px !important;
  }

  #aboutSystemDialog .about-system-content {
    grid-template-columns: 1fr !important;
    text-align: center !important;
    gap: 14px !important;
    padding: 22px 22px 12px !important;
  }

  #aboutSystemDialog .dialog-actions {
    padding: 14px 22px 24px !important;
  }
}

/* V24.1 RC-6.5 — Árvore conectada no modo Família completa */
.family-poster-connected {
  min-width: 1180px;
  padding: 2rem;
}
.family-poster-connected > h2 {
  position: relative;
  z-index: 1;
  margin: 0 0 .35rem;
}
.connected-tree-subtitle {
  position: relative;
  z-index: 1;
  margin: 0 0 1.5rem;
  color: var(--muted);
  font-weight: 700;
}
.poster-forest-connected {
  width: max-content;
  min-width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 4.5rem;
  padding: 1rem 1rem 2rem;
}
.poster-forest-connected > .family-unit {
  margin: 0 auto;
}
.orphan-people-section {
  position: relative;
  z-index: 1;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(198,161,91,.24);
}
.orphan-people-section h3 {
  margin: 0 0 .9rem;
  font-size: 1rem;
  color: var(--text);
}
.orphan-people-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.orphan-person-branch {
  display: inline-flex;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster-connected {
  background: radial-gradient(circle at 18% 10%, rgba(196,149,58,.08), transparent 22rem), radial-gradient(circle at 82% 18%, rgba(255,255,255,.05), transparent 18rem), linear-gradient(135deg, rgba(8,18,29,.985), rgba(5,12,20,.995)) !important;
  border: 1px solid rgba(196,149,58,.28) !important;
  color: #f5e5c6 !important;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster-connected .tree-lines-svg {
  color: #d8a64a;
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster-connected .tree-svg-line {
  fill: none;
  stroke: url(#treeLineGradient);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 5px rgba(214,165,74,.18));
}
html[data-theme="escuro"] body[data-active-view="tree"] #treeView .family-poster-connected .poster-watermark {
  opacity: .055 !important;
  filter: brightness(1.2) sepia(.45) saturate(.9) !important;
}
@media (max-width: 900px) {
  .family-poster-connected { min-width: 960px; padding: 1.25rem; }
  .poster-forest-connected { gap: 2.5rem; padding: .75rem .5rem 1.5rem; }
}


/* V24.1 RC-6.6 — Contraste dos temas claro/sépia/pergaminho
   Ajuste visual seguro: não altera Firebase, login, regras, dados ou auditoria. */
html[data-theme="claro"] {
  --rc66-footer-bg: rgba(248, 251, 255, .98);
  --rc66-footer-border: rgba(15, 38, 64, .18);
  --rc66-footer-pill-bg: #ffffff;
  --rc66-footer-pill-text: #1b2f46;
  --rc66-footer-pill-border: rgba(15, 38, 64, .22);
  --rc66-chip-bg: #fff6df;
  --rc66-chip-text: #5e3b0f;
  --rc66-chip-border: rgba(115, 75, 22, .28);
  --rc66-card-text: #15283d;
  --rc66-card-muted: #425b72;
  --rc66-card-bg: linear-gradient(135deg, rgba(255,255,255,.99), rgba(242,247,252,.96));
  --rc66-card-border: rgba(16, 48, 80, .18);
}

html[data-theme="sepia"],
html[data-theme="pergaminho"] {
  --rc66-footer-bg: rgba(246, 232, 203, .98);
  --rc66-footer-border: rgba(110, 72, 30, .24);
  --rc66-footer-pill-bg: #fff3d8;
  --rc66-footer-pill-text: #4f3413;
  --rc66-footer-pill-border: rgba(110, 72, 30, .30);
  --rc66-chip-bg: #fff0cc;
  --rc66-chip-text: #5a350e;
  --rc66-chip-border: rgba(112, 70, 20, .32);
  --rc66-card-text: #2b1b0b;
  --rc66-card-muted: #604829;
  --rc66-card-bg: linear-gradient(135deg, rgba(255, 248, 230, .99), rgba(238, 220, 182, .95));
  --rc66-card-border: rgba(112, 70, 20, .24);
}

/* Rodapé legal: legível em todos os temas claros */
html[data-theme="claro"] .app-legal-footer,
html[data-theme="sepia"] .app-legal-footer,
html[data-theme="pergaminho"] .app-legal-footer {
  color: var(--rc66-footer-pill-text) !important;
  text-shadow: none !important;
}

html[data-theme="claro"] .app-legal-footer span,
html[data-theme="sepia"] .app-legal-footer span,
html[data-theme="pergaminho"] .app-legal-footer span {
  background: var(--rc66-footer-pill-bg) !important;
  color: var(--rc66-footer-pill-text) !important;
  border: 1px solid var(--rc66-footer-pill-border) !important;
  box-shadow: 0 2px 10px rgba(45, 34, 18, .10) !important;
  backdrop-filter: none !important;
  opacity: 1 !important;
}

/* Chips/pílulas de data e metadados nos temas claros */
html[data-theme="claro"] .timeline-date-seal,
html[data-theme="claro"] .date-badge,
html[data-theme="claro"] .date-chip,
html[data-theme="claro"] .person-date-chip,
html[data-theme="claro"] .tree-card-dates,
html[data-theme="claro"] .tree-card-meta,
html[data-theme="claro"] .dashboard-mini-year,
html[data-theme="claro"] .timeline-year,
html[data-theme="sepia"] .timeline-date-seal,
html[data-theme="sepia"] .date-badge,
html[data-theme="sepia"] .date-chip,
html[data-theme="sepia"] .person-date-chip,
html[data-theme="sepia"] .tree-card-dates,
html[data-theme="sepia"] .tree-card-meta,
html[data-theme="sepia"] .dashboard-mini-year,
html[data-theme="sepia"] .timeline-year,
html[data-theme="pergaminho"] .timeline-date-seal,
html[data-theme="pergaminho"] .date-badge,
html[data-theme="pergaminho"] .date-chip,
html[data-theme="pergaminho"] .person-date-chip,
html[data-theme="pergaminho"] .tree-card-dates,
html[data-theme="pergaminho"] .tree-card-meta,
html[data-theme="pergaminho"] .dashboard-mini-year,
html[data-theme="pergaminho"] .timeline-year {
  background: var(--rc66-chip-bg) !important;
  color: var(--rc66-chip-text) !important;
  border-color: var(--rc66-chip-border) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

/* Cards de linha do tempo, árvore, memórias e painel: contraste forte nos temas claros */
html[data-theme="claro"] .timeline-event-body,
html[data-theme="claro"] .family-card,
html[data-theme="claro"] .placeholder-card.family-card,
html[data-theme="claro"] .dashboard-list > *,
html[data-theme="claro"] .today-history-card,
html[data-theme="claro"] .memory-card,
html[data-theme="claro"] .memorial-card,
html[data-theme="claro"] .profile-section,
html[data-theme="sepia"] .timeline-event-body,
html[data-theme="sepia"] .family-card,
html[data-theme="sepia"] .placeholder-card.family-card,
html[data-theme="sepia"] .dashboard-list > *,
html[data-theme="sepia"] .today-history-card,
html[data-theme="sepia"] .memory-card,
html[data-theme="sepia"] .memorial-card,
html[data-theme="sepia"] .profile-section,
html[data-theme="pergaminho"] .timeline-event-body,
html[data-theme="pergaminho"] .family-card,
html[data-theme="pergaminho"] .placeholder-card.family-card,
html[data-theme="pergaminho"] .dashboard-list > *,
html[data-theme="pergaminho"] .today-history-card,
html[data-theme="pergaminho"] .memory-card,
html[data-theme="pergaminho"] .memorial-card,
html[data-theme="pergaminho"] .profile-section {
  background: var(--rc66-card-bg) !important;
  color: var(--rc66-card-text) !important;
  border-color: var(--rc66-card-border) !important;
  text-shadow: none !important;
}

html[data-theme="claro"] .timeline-event-body p,
html[data-theme="claro"] .timeline-event-body small,
html[data-theme="claro"] .family-card .tree-card-location,
html[data-theme="claro"] .family-card .tree-card-generation,
html[data-theme="claro"] .family-card .tree-card-line,
html[data-theme="claro"] .family-card .tree-card-dates-row,
html[data-theme="claro"] .family-card .tree-card-profession,
html[data-theme="claro"] .family-card .family-card-body span,
html[data-theme="claro"] .family-card .family-card-body small,
html[data-theme="claro"] .dashboard-list small,
html[data-theme="claro"] .dashboard-list em,
html[data-theme="claro"] .today-history-card p,
html[data-theme="sepia"] .timeline-event-body p,
html[data-theme="sepia"] .timeline-event-body small,
html[data-theme="sepia"] .family-card .tree-card-location,
html[data-theme="sepia"] .family-card .tree-card-generation,
html[data-theme="sepia"] .family-card .tree-card-line,
html[data-theme="sepia"] .family-card .tree-card-dates-row,
html[data-theme="sepia"] .family-card .tree-card-profession,
html[data-theme="sepia"] .family-card .family-card-body span,
html[data-theme="sepia"] .family-card .family-card-body small,
html[data-theme="sepia"] .dashboard-list small,
html[data-theme="sepia"] .dashboard-list em,
html[data-theme="sepia"] .today-history-card p,
html[data-theme="pergaminho"] .timeline-event-body p,
html[data-theme="pergaminho"] .timeline-event-body small,
html[data-theme="pergaminho"] .family-card .tree-card-location,
html[data-theme="pergaminho"] .family-card .tree-card-generation,
html[data-theme="pergaminho"] .family-card .tree-card-line,
html[data-theme="pergaminho"] .family-card .tree-card-dates-row,
html[data-theme="pergaminho"] .family-card .tree-card-profession,
html[data-theme="pergaminho"] .family-card .family-card-body span,
html[data-theme="pergaminho"] .family-card .family-card-body small,
html[data-theme="pergaminho"] .dashboard-list small,
html[data-theme="pergaminho"] .dashboard-list em,
html[data-theme="pergaminho"] .today-history-card p {
  color: var(--rc66-card-muted) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

html[data-theme="claro"] .timeline-event-top strong,
html[data-theme="claro"] .timeline-title-block strong,
html[data-theme="claro"] .family-card .tree-card-name,
html[data-theme="claro"] .family-card .family-card-body strong,
html[data-theme="claro"] .dashboard-list strong,
html[data-theme="claro"] .today-history-card strong,
html[data-theme="sepia"] .timeline-event-top strong,
html[data-theme="sepia"] .timeline-title-block strong,
html[data-theme="sepia"] .family-card .tree-card-name,
html[data-theme="sepia"] .family-card .family-card-body strong,
html[data-theme="sepia"] .dashboard-list strong,
html[data-theme="sepia"] .today-history-card strong,
html[data-theme="pergaminho"] .timeline-event-top strong,
html[data-theme="pergaminho"] .timeline-title-block strong,
html[data-theme="pergaminho"] .family-card .tree-card-name,
html[data-theme="pergaminho"] .family-card .family-card-body strong,
html[data-theme="pergaminho"] .dashboard-list strong,
html[data-theme="pergaminho"] .today-history-card strong {
  color: var(--rc66-card-text) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

/* Modo árvore: impedir fundo escuro sobrando nos temas claros */
html[data-theme="claro"] body[data-active-view="tree"] #treeView .family-poster,
html[data-theme="claro"] body[data-active-view="tree"] #treeView .family-poster-connected,
html[data-theme="sepia"] body[data-active-view="tree"] #treeView .family-poster,
html[data-theme="sepia"] body[data-active-view="tree"] #treeView .family-poster-connected,
html[data-theme="pergaminho"] body[data-active-view="tree"] #treeView .family-poster,
html[data-theme="pergaminho"] body[data-active-view="tree"] #treeView .family-poster-connected {
  color: var(--rc66-card-text) !important;
  background: linear-gradient(135deg, rgba(255, 249, 232, .96), rgba(236, 219, 182, .86)) !important;
  border-color: var(--rc66-card-border) !important;
}

html[data-theme="claro"] body[data-active-view="tree"] #treeView .tree-svg-line,
html[data-theme="sepia"] body[data-active-view="tree"] #treeView .tree-svg-line,
html[data-theme="pergaminho"] body[data-active-view="tree"] #treeView .tree-svg-line {
  stroke: #8a5d21 !important;
  opacity: .78 !important;
  filter: none !important;
}